fix(custom): 修复瑕疵、模板完善

Author: gitboyzcf

src/pages/contact/index.vue

@@ -1,34 +1,8 @@
 <script setup>
   import wechatImage from '@/static/images/contact/image-wechat.png?url'
 
-  const userStore = useUserStore()
+  const userStore = useOutsideUserStore()
   const userInfo = computed(() => userStore.userInfo)
-  const router = useRouter()
-
-  // 添加中间件拦截 (只有路由对象中 携带test的路由会走此部分)
-  // /src/router/helper.js
-  // defineMiddleware(
-  //   'test',
-  //   function (router) {
-  //     router.beforeEach((to, from, next) => {
-  //       uni.showModal({
-  //         title: '提示',
-  //         content: '触发了路由中间件，是否允许通过?',
-  //         success: (res) => {
-  //           if (res.cancel) {
-  //             next(false)
-  //           } else {
-  //             next()
-  //           }
-  //         }
-  //       })
-  //     })
-
-  //     router.afterEach(() => {})
-  //   },
-  //   { router }
-  // )
-
   // 复制文本到剪贴板
   function handleCopy(text) {
     uni.setClipboardData({
@@ -51,7 +25,6 @@
 
   // 预览图片
   function previewImage(url) {
-    console.log('previewImage', url)
     uni.previewImage({
       urls: [url],
       current: url

src/pages/index/user/index.vue

@@ -1,6 +1,6 @@
 <script setup>
   const version = '1.0.0'
-  const userStore = useUserStore()
+  const userStore = useOutsideUserStore()
   const router = useRouter()
 
   const isLogin = computed(() => !!userStore.token)
@@ -20,6 +20,10 @@
   ])
 
   function handleMenuItemClick(item) {
+    if (item.path === '/settings') {
+      uni.showToast({ title: '系统设置功能暂未开放', icon: 'none' })
+      return
+    }
     router.push({
       path: item.path,
       query: item.query || {}
@@ -59,7 +63,7 @@
           })
           setTimeout(() => {
             router.replace({
-              name: '/user'
+              path: '/user'
             })
           }, 500)
         } else if (res.cancel) {
@@ -114,8 +118,8 @@
       <view
         v-for="(item, index) of systemItems"
         :key="index"
-        class="flex items-center bg-white px-5 py-4 transition-colors duration-200 active:bg-gray-50"
         :class="[index !== systemItems.length - 1 ? 'border-b border-gray-100' : '']"
+        class="flex items-center bg-white px-5 py-4 transition-colors duration-200 active:bg-gray-50"
         hover-class="bg-gray-50"
         @click="handleMenuItemClick(item)"
       >

src/pages/login/index.vue

@@ -2,7 +2,7 @@
   // import { description, version } from '@root/package.json'
   import Agreement from './components/agreement.vue'
   import { useMessage } from 'wot-design-uni'
-  const userStore = useUserStore()
+  const userStore = useOutsideUserStore()
   const router = useRouter()
   const message = useMessage('wd-message-box-slot')
 
@@ -51,8 +51,6 @@
 
   function onAgreementClick() {
     agreementVisible.value = true
-    console.log(message)
-
     message.alert({
       title: '《产品服务协议》'
     })

src/pages/personal/index.vue

@@ -1,8 +1,7 @@
 <script setup>
   // const router = useRouter()
 
-  const userStore = useUserStore()
-
+  const userStore = useOutsideUserStore()
   const userInfo = computed(() => userStore.userInfo)
 
   const genderText = computed(() => {

src/router/helper.js

@@ -12,7 +12,7 @@ export function addRouterMethodAlias(router) {
   Object.assign(router, {
     push: (...args) => router.navigate(...args),
     pushTab: (...args) => router.switchTab(...args),
-    replace: (...args) => router.redirect(...args),
+    replace: (...args) => router.redirectTo(...args),
     replaceAll: (...args) => router.reLaunch(...args),
     back: (options) => {
       router.navigateBack({ ...(options || {}), delta: options?.delta || options })

src/router/index.js

@@ -1,9 +1,8 @@
 import { createRouter } from './helper'
+import { testMiddleware } from './middleware'
 
 import routes from 'uni-router-routes'
 
-// import permission from '@/permission/index.js'
-
 const router = createRouter({
   routes: [
     ...routes
@@ -19,7 +18,8 @@ const router = createRouter({
   ]
 })
 
-// permission(router)
+// 路由守卫中页面跳转不支持路径别名，请使用实际路径，避免使用别名
+testMiddleware(router)
 
 async function setupRouter(app) {
   app.use(router)

src/router/middleware.js

@@ -0,0 +1,30 @@
+// 添加中间件单页面路由拦截
+export function testMiddleware(router) {
+  const userStore = useOutsideUserStore()
+  // 只有路由对象meta中 携带test的路由会走此部分
+  // /src/router/helper.js
+  defineMiddleware(
+    'test',
+    function (router) {
+      router.beforeEach((to, from, next) => {
+        if (userStore.token) {
+          // 如果有token，直接跳转到目标路由
+          next()
+        } else {
+          uni.showModal({
+            title: '提示',
+            content: '请先登录',
+            success: (res) => {
+              if (res.confirm) {
+                next({ name: 'login' })
+              }
+            }
+          })
+        }
+      })
+
+      router.afterEach(() => {})
+    },
+    { router }
+  )
+}

src/store/modules/user/index.js

@@ -9,6 +9,7 @@ export const useUserStore = defineStore('user', {
       return new Promise((resolve) => {
         // 模拟异步请求服务器获取 token
         setTimeout(() => {
+          this.getUserInfo()
           this.token = '123456789'
           resolve()
         }, 2000)