feat(mobile/router): 新增：促销移动端菜单也是动态创建的

src/permission.js

@@ -10,6 +10,7 @@ import useUserStore from '@/store/modules/user'
 import useSettingsStore from '@/store/modules/settings'
 import usePermissionStore from '@/store/modules/permission'
 import useVersionStore from '@/store/modules/version'
+import useAppStore from '@/store/modules/app'
 
 NProgress.configure({ showSpinner: false })
 
@@ -41,7 +42,7 @@ router.beforeEach((to, from, next) => {
             useVersionStore().getVersion().then((res) => {
               // 生成可访问路由表
               accessRoutes.forEach(route => {
-                if (!isHttp(route.path)) {
+                if (!isHttp(route.path) ) {
                   router.addRoute(route)
                 }
               })

src/store/modules/app.js

 import Cookies from 'js-cookie'
+import { set } from 'nprogress';
 
 const useAppStore = defineStore(
   'app',
@@ -10,7 +11,8 @@ const useAppStore = defineStore(
         hide: false
       },
       device: 'desktop',
-      size: Cookies.get('size') || 'default'
+      size: Cookies.get('size') || 'default',
+      belongSys: Cookies.get('belongSys') || '链路中心',
     }),
     actions: {
       toggleSideBar(withoutAnimation) {
@@ -39,6 +41,10 @@ const useAppStore = defineStore(
       },
       toggleSideBarHide(status) {
         this.sidebar.hide = status
+      },
+      setBelongSys(belongSys) {
+        this.belongSys = belongSys
+        Cookies.set('belongSys', belongSys)
       }
     }
   })

src/store/modules/permission.js

@@ -5,6 +5,7 @@ import Layout from '@/layout/index'
 import ParentView from '@/components/ParentView'
 import InnerLink from '@/layout/components/InnerLink'
 import useUserStore from '@/store/modules/user'
+import useAppStore from '@/store/modules/app'
 
 // 匹配views里面所有的.vue文件
 const modules = import.meta.glob('./../../views/**/*.vue')
@@ -37,6 +38,14 @@ const usePermissionStore = defineStore(
         return new Promise(resolve => {
           // 向后端请求路由数据
           getRouters().then(res => {
+            // 判断链路中心0，还是勤策1 的路由表
+            if (useAppStore().belongSys == 0) {
+              // 链路中心
+              res.data = res.data.filter(item => item.belongSys == 0)
+            } else {
+              // 勤策
+              res.data = res.data.filter(item => item.belongSys == 1)
+            }
             const sdata = JSON.parse(JSON.stringify(res.data))
             const rdata = JSON.parse(JSON.stringify(res.data))
             const defaultData = JSON.parse(JSON.stringify(res.data))

src/store/modules/user.js

 import { login, fsLogin, getInfo, qcLogin, refreshTokenAPI } from '@/api'
 import { getToken, setToken, removeToken, getRefreshToken, setRefreshToken, removeRefreshToken } from '@/utils/auth'
-
+import useAppStore from '@/store/modules/app'
 import { isHttp, isEmpty } from "@/utils/validate"
 import defAva from '@/assets/images/profile.jpg'
 
@@ -32,6 +32,7 @@ export default defineStore(
               // this.refreshToken = res.data.refresh_token
               setToken(res.data.access_token)
               // setRefreshToken(res.data.refresh_token)
+              useAppStore().setBelongSys('0') // 0 链路中心
               resolve()
             }).catch(error => {
               reject(error)
@@ -41,6 +42,7 @@ export default defineStore(
             fsLogin({ code }).then(res => {
               setToken(res.access_token)
               this.token = res.access_token
+              useAppStore().setBelongSys('0') // 0 链路中心
               resolve()
             }).catch(error => {
               reject(error)
@@ -51,6 +53,7 @@ export default defineStore(
             qcLogin({ code }).then(res => {
               setToken(res.access_token)
               this.token = res.access_token
+              useAppStore().setBelongSys('1') // 1 勤策
               resolve()
             }).catch(error => {
               reject(error)

src/views/mobile/views/menu/index.vue

@@ -11,7 +11,7 @@
           @click="handleIconClick(icon)">
           <div class="function-icon-wrap"
             :style="{ backgroundColor: icon.iconColor }">
-            <van-icon :name="icon.iconName" />
+            <svg-icon :icon-class="icon.iconName" />
           </div>
           <p>{{ icon.name }}</p>
         </div>
@@ -21,21 +21,63 @@
 </template>
 
 <script setup>
+import usePermissionStore from '@/store/modules/permission';
+
 const router = useRouter();
-const modules = [
-  {
-    title: 'CP 活动',
-    icons: [
-      { name: '促销计划', iconName: 'shop-o', iconColor: '#5aaeec', to: '/m/promotion_plan' }
-    ]
+const permissionStore = usePermissionStore();
+const modules = ref([]); // 替换原有的静态modules
+// const modules = [
+//   {
+//     title: 'CP 活动',
+//     icons: [
+//       { name: '促销计划', iconName: 'shop-o', iconColor: '#5aaeec', to: '/m/promotion_plan' }
+//     ]
+//   },
+//   {
+//     title: '稽核活动',
+//     icons: [
+//       { name: '售点稽查', iconName: 'manager-o', iconColor: '#feb73b', to: '/m/promotion_plan' }
+//     ]
+//   }
+// ]
+// 观察路由挂载后事件
+// 格式化路由为菜单所需结构
+const formatRoutesToModules = (routes) => {
+  // 根据实际路由结构转换，这里假设需要提取一级路由作为模块
+  modules.value = routes[0].children.map(o => {
+    return {
+      title: o.meta.title,
+      icons: o.children?.map(child => ({
+        name: child.meta.title,
+        iconName: child.meta.icon || 'default',
+        iconColor: child.meta.color || '#5aaeec',
+        to: child.path
+      })) || []
+    }
+  })
+    // .map(route => ({
+    //   title: route.meta.title,
+    //   icons: route.children?.map(child => ({
+    //     name: child.meta.title,
+    //     iconName: child.meta.icon || 'default',
+    //     iconColor: child.meta.color || '#5aaeec',
+    //     to: child.path
+    //   })) || []
+    // }))
+}
+// 监听路由变化
+watch(
+  () => permissionStore.sidebarRouters,
+  (newRoutes) => {
+    if (newRoutes.length > 0) {
+      // 路由加载完成后转换格式
+      // 把 hidden: true 的筛选掉
+      const filterRoutes = newRoutes.filter(route => !route?.hidden);
+      formatRoutesToModules(filterRoutes);
+    }
   },
-  {
-    title: '稽核活动',
-    icons: [
-      { name: '售点稽查', iconName: 'manager-o', iconColor: '#feb73b', to: '/m/promotion_plan' }
-    ]
-  }
-]
+  { immediate: true, deep: true }
+);
 
 const handleIconClick = (icon) => {
   router.push(icon.to)
@@ -95,9 +137,9 @@ const handleIconClick = (icon) => {
             border-radius: 50%;
             box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
 
-            .van-icon {
+            .svg-icon {
               color: white;
-              font-size: 22px;
+              font-size: 16px;
             }
           }
         }