App.vue 7.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287
  1. <script setup>
  2. import { ref, onMounted, nextTick, watch, onBeforeUnmount, getCurrentInstance } from 'vue';
  3. import { useI18n } from "vue-i18n";
  4. const { locale } = useI18n();
  5. import {
  6. onLoad,
  7. onShow,
  8. onLaunch
  9. } from '@dcloudio/uni-app'
  10. import {
  11. updateRoute
  12. } from "@/hooks/useRoute";
  13. import useGlobalStore from "@/stores/use-global-store";
  14. // import { useAppUpdate } from '@/hooks/useAppUpdate'
  15. // const { checkUpdate } = useAppUpdate()
  16. const globalStore = useGlobalStore()
  17. onLoad((options) => {
  18. updateRoute();
  19. // checkUpdate()
  20. })
  21. onShow((options) => {
  22. updateRoute();
  23. // checkUpdate()
  24. })
  25. // App.vue 或你的初始化文件中
  26. function initTheme() {
  27. // #ifdef H5
  28. // H5 端:使用 matchMedia 主动获取当前系统主题
  29. const isDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches
  30. const theme = isDarkMode ? 'dark' : 'light'
  31. globalStore.setGlobalTheme(theme)
  32. // 监听变化(你的 onThemeChange 已经能工作,但可以再加一层保险)
  33. const darkModeQuery = window.matchMedia('(prefers-color-scheme: dark)')
  34. const handleChange = (e) => {
  35. const newTheme = e.matches ? 'dark' : 'light'
  36. globalStore.setGlobalTheme(newTheme)
  37. }
  38. // 兼容旧版浏览器
  39. if (darkModeQuery.addEventListener) {
  40. darkModeQuery.addEventListener('change', handleChange)
  41. } else {
  42. darkModeQuery.addListener(handleChange)
  43. }
  44. // 设置 data-bs-theme 属性到 html 标签
  45. document.documentElement.setAttribute('data-bs-theme', theme);
  46. document.documentElement.setAttribute('data-color-theme', 'blue');
  47. // 同时设置到 body 标签
  48. document.body.setAttribute('data-bs-theme', theme);
  49. document.body.setAttribute('data-color-theme', 'blue');
  50. // #endif
  51. // #ifdef APP-PLUS
  52. // App 端:使用原生 API
  53. uni.getSystemInfo({
  54. success: (res) => {
  55. let theme = res.osTheme || 'light'
  56. globalStore.setGlobalTheme(theme)
  57. }
  58. })
  59. uni.onThemeChange((res) => {
  60. globalStore.setGlobalTheme(res.theme)
  61. })
  62. // #endif
  63. }
  64. onLaunch((options) => {
  65. // updateRoute();
  66. // checkUpdate()
  67. // 调用初始化
  68. // initTheme()
  69. // 处理 signup 路径
  70. handleSignupRoute(options)
  71. })
  72. // 解析 URL 参数
  73. const parseUrlParams = () => {
  74. const params = {}
  75. // #ifdef H5
  76. // H5 端:直接从浏览器 URL 解析
  77. if (typeof window !== 'undefined' && window.location) {
  78. const href = window.location.href
  79. // 解析 hash 部分
  80. const hashIndex = href.indexOf('#')
  81. if (hashIndex !== -1) {
  82. const hash = href.substring(hashIndex + 1)
  83. // 解析路径
  84. const pathMatch = hash.match(/^\/([^/?]+)/)
  85. if (pathMatch) {
  86. params.path = pathMatch[1]
  87. }
  88. // 解析路径参数 signup/19628/RHOP4WVa/B0
  89. const pathParams = hash.match(/^\/signup\/([^/]+)\/?([^/]+)?\/?([^/]+)?/)
  90. if (pathParams) {
  91. params.path = 'signup'
  92. params.p1 = pathParams[1]
  93. params.p2 = pathParams[2]
  94. params.p3 = pathParams[3]
  95. }
  96. // 解析 query 参数
  97. const queryIndex = hash.indexOf('?')
  98. if (queryIndex !== -1) {
  99. const queryStr = hash.substring(queryIndex + 1)
  100. const pairs = queryStr.split('&')
  101. pairs.forEach(pair => {
  102. const [key, value] = pair.split('=')
  103. if (key && value) {
  104. params[key] = decodeURIComponent(value)
  105. }
  106. })
  107. }
  108. }
  109. }
  110. // #endif
  111. // #ifndef H5
  112. // App 端:从 options 参数获取
  113. if (typeof options === 'object' && options !== null) {
  114. Object.assign(params, options)
  115. }
  116. // #endif
  117. return params
  118. }
  119. // 处理 signup 路径(仅 H5 端)
  120. const handleSignupRoute = (options) => {
  121. // #ifdef H5
  122. // 解析 URL 参数(从浏览器 URL 解析)
  123. const query = parseUrlParams()
  124. console.log('解析到的参数:', query);
  125. // 判断是否是 signup 路径
  126. const isSignup = query.path === 'signup' || query.s || query.signup || query.activeTab === '2'
  127. if (!isSignup) return
  128. // 获取参数
  129. const id = query.id || query.agentId || query.p1 || ''
  130. const subId = query.subId || query.w || query.p2 || ''
  131. const code = query.code || query.oc || query.p3 || ''
  132. // 构建登录页面 URL
  133. let loginUrl = '/pages/login/index?activeTab=2'
  134. // 携带参数
  135. if (id) loginUrl += `&id=${id}`
  136. if (subId) loginUrl += `&subId=${subId}`
  137. if (code) loginUrl += `&code=${code}`
  138. console.log('跳转到:', loginUrl);
  139. // 跳转到注册页面
  140. uni.reLaunch({
  141. url: loginUrl,
  142. success: () => {
  143. console.log('跳转成功');
  144. },
  145. fail: (err) => {
  146. console.error('跳转失败:', err);
  147. }
  148. })
  149. // #endif
  150. }
  151. watch(locale, () => {
  152. // const currentPath = route.path;
  153. // menu.value.forEach((item, index) => {
  154. // if (item.children) {
  155. // const isActive = item.children.some(child => child.path.includes(currentPath));
  156. // menu.value[index].isOpenMenu = isActive;
  157. // if (isActive) {
  158. // nextTick(() => {
  159. // updateSubmenuHeight(index);
  160. // });
  161. // }
  162. // }
  163. // });
  164. }, { immediate: true })
  165. onMounted(() => {
  166. const sysInfo = uni.getSystemInfoSync();
  167. globalStore.setBarHeight(sysInfo.statusBarHeight || 60);
  168. // ---------- 新增 H5 端专属初始化 ----------
  169. // 仅在 H5 端执行(通过环境判断)
  170. // #ifdef H5
  171. if (typeof window !== 'undefined') {
  172. const instance = getCurrentInstance()
  173. if (instance) {
  174. window.vm = instance.proxy
  175. }
  176. }
  177. // #endif
  178. });
  179. </script>
  180. <style>
  181. /*每个页面公共css */
  182. </style>
  183. <style lang="scss">
  184. /* 注意要写在第一行,同时给style标签加入lang="scss"属性 */
  185. @import "uview-plus/index.scss";
  186. @import "@/static/scss/global/global.scss";
  187. @import "@/static/scss/global/vu.css";
  188. @import "/static/scss/style.scss";
  189. @font-face {
  190. font-family: 'Google Sans';
  191. src: url('/static/Google_Sans/GoogleSans-VariableFont_GRAD,opsz,wght.ttf') format('truetype-variations');
  192. font-weight: 100 900;
  193. font-style: normal;
  194. font-display: swap;
  195. }
  196. /* 全局字体,不破坏 uni-icons 图标 */
  197. view,
  198. text,
  199. button,
  200. input,
  201. textarea,
  202. label {
  203. font-family: 'Google Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  204. font-weight: 400;
  205. }
  206. /* 专门保护 uni-icons 不被覆盖 */
  207. .uni-icon,
  208. [class*="uni-icons-"],
  209. .uni-icons {
  210. font-family: uniicons !important;
  211. }
  212. /* 让整个项目文字都能选中 */
  213. * {
  214. -webkit-user-select: text !important;
  215. user-select: text !important;
  216. }
  217. /* 修复滚动层无法选中 */
  218. view,
  219. text,
  220. div,
  221. span {
  222. -webkit-user-select: text !important;
  223. user-select: text !important;
  224. }
  225. /* 强制修复 uni-datetime-picker 重复渲染双日历 */
  226. // .uni-calendar+.uni-calendar {
  227. // display: none !important;
  228. // }
  229. :deep(.u-toolbar__wrapper__confirm) {
  230. font-size: 20px !important;
  231. }
  232. :deep(.u-toolbar__wrapper__cancel) {
  233. font-size: 20px !important;
  234. }
  235. .page {
  236. /* padding: 31px 31px 110px 31px; */
  237. box-sizing: border-box;
  238. /* background: var(--main-bg); */
  239. }
  240. html {
  241. --bs-bg-opacity: 1;
  242. background-color: rgba(var(--bs-body-bg-rgb), var(--bs-bg-opacity)) !important;
  243. font-size: 16px !important;
  244. }
  245. uni-page-body {
  246. height: 100%;
  247. }
  248. page {
  249. --bs-bg-opacity: 1;
  250. background-color: rgba(var(--bs-body-bg-rgb), var(--bs-bg-opacity)) !important;
  251. }
  252. </style>