App.vue
3.38 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
<!--
* @Date: 2023-06-13 13:26:46
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2026-01-22 15:06:58
* @FilePath: /xysBooking/src/App.vue
* @Description: 启动页
-->
<template>
<router-view></router-view>
</template>
<script setup>
import { mainStore, useTitle } from '@/utils/generatePackage'
import { computed, watchEffect, onMounted } from 'vue';
import { useRoute, useRouter } from 'vue-router'
import { setToastDefaultOptions } from 'vant';
// 会根据配置判断是否显示调试控件
// eslint-disable-next-line no-unused-vars
// import vConsole from '@/utils/vconsole'
// 初始化WX环境
import wx from 'weixin-js-sdk'
import { wxJsAPI } from '@/api/wx/config'
import { apiList } from '@/api/wx/jsApiList.js'
import { Updater } from '@/utils/versionUpdater'
import { showConfirmDialog } from 'vant';
// 使用 include + pinia 状态管理动态缓存页面
const store = mainStore()
const keepPages = computed(() => store.getKeepPages)
// TAG: 全局设置页面标题
const $route = useRoute();
const $router = useRouter();
watchEffect(
() => useTitle($route.meta.title)
)
// TAG: 全局配置Toast
setToastDefaultOptions({
duration: 2000,
className: 'zIndex'
});
/**
* 初始化微信 JSSDK(全局只执行一次)
* - 拉取后端签名参数
* - 调用 wx.config 并等待 wx.ready
* @returns {Promise<boolean>} 是否初始化成功
*/
const init_wx_global = async () => {
try {
const cfg_res = await wxJsAPI()
if (!cfg_res || !cfg_res?.data) return false
const cfg = { ...cfg_res.data, jsApiList: apiList }
return new Promise((resolve) => {
wx.config(cfg)
wx.ready(() => {
wx.showAllNonBaseMenuItem()
resolve(true)
})
wx.error((err) => {
console.warn(err)
resolve(false)
})
})
} catch (err) {
console.warn(err)
return false
}
}
onMounted(async () => {
// 避免重复初始化:把初始化 Promise 挂在 window 上复用
if (!window.__wx_ready_promise) {
window.__wx_ready_promise = init_wx_global()
}
await window.__wx_ready_promise
// 正式环境
// TAG:检查是否更新
if (import.meta.env.PROD) {
const upDater = new Updater({
time: 30000
})
upDater.on('no-update', () => {
// console.log('还没更新')
})
upDater.on('update', () => {
// console.log('已经更新了,请刷新页面')
showConfirmDialog({
title: '温馨提示',
message: '检测到新版本,是否刷新?',
confirmButtonColor: '#A67939',
width: '80vw'
})
.then(() => {
// on confirm
window.location.reload();
})
.catch(() => {
// on cancel
});
})
}
});
</script>
<style lang="less">
@prefix: ~'@{namespace}-x';
html,
body {
width: 100%;
// height: 100%;
}
body {
position: relative;
// --van-white: #fff;
// --van-blue: #1989fa;
// --van-button-primary-color: var(--van-white);
// --van-button-primary-background: var(--van-primary-color);
/* 全局修改主色调 */
// --van-blue: #F9D95C;
background-color: #F3F3F3;
p {
margin: 0;
padding: 0;
}
}
.@{prefix} {
color: red;
}
.global-center {
position: relative;
top: 50%;
transform: translateY(-50%);
}
.zIndex {
z-index: 4500 !important;
}
input::placeholder,
textarea::placeholder {
color: #9C9A9A; /* 设置占位符的颜色 */
}
</style>