菜单路由处理

src/layout/index.vue

@@ -11,7 +11,7 @@
                     <MenuBar :cur="menuBarKey" :datas="menuBarData" @change="menuBarChange" />
                 </div>
                 <div class="hc-layout-aside-user">
-                    <UserInfoBar @load="userInfoLoad" />
+                    <UserInfoBar />
                 </div>
             </hc-body>
         </el-aside>
@@ -25,7 +25,6 @@
 
 <script setup>
 import { onMounted, ref } from 'vue'
-import { useAppStore } from '~src/store'
 import { useRoute, useRouter } from 'vue-router'
 import { getMenuData } from '~src/router/routers'
 import { initButtons } from '~store/app'
@@ -36,33 +35,31 @@ import logoPng from '~src/assets/logo/logo.png'
 //初始组合式
 const router = useRouter()
 const useRoutes = useRoute()
-const store = useAppStore()
 
 //子组件
 import MenuBar from './modules/MenuBar.vue'
 import UserInfoBar from './modules/UserInfoBar.vue'
 
 //菜单数据
-const menuBarKey = ref(useRoutes?.meta?.parent || useRoutes.name)
-const menuBarData = ref(store.menus)
-// const menuBarData = ref([])
+const menuBarKey = ref(useRoutes.name)
+const menuBarData = ref([])
 
 //渲染完成
-onMounted(async () => {
+onMounted(() => {
+    getMenuBarData()
     initButtons()
-    menuBarData.value = await getMenuData()
 })
 
+//获取菜单数据
+const getMenuBarData = async () => {
+    menuBarData.value = await getMenuData()
+}
+
 //菜单被点击
 const menuBarChange = ({ code }) => {
     menuBarKey.value = code
     router.push({ name: code })
 }
-
-//用户信息
-const userInfoLoad = (data) => {
-    //console.log('用户信息', data)
-}
 </script>
 
 <style lang="scss">

src/router/index.js

@@ -7,8 +7,9 @@ import baseData from './modules/base'
 import { getRouterData } from './routers'
 
 //其它工具
-import { getToken } from 'hc-vue3-ui'
+import { getStore } from '~src/utils/storage'
 import config from '~src/config/index'
+import { isNullES } from 'js-fast-way'
 
 //设置路由数据
 const router = vueRouter.createRouter({
@@ -19,20 +20,16 @@ const router = vueRouter.createRouter({
 //路由拦截
 router.beforeResolve(async (to) => {
     NProgress.start()
-    /*const token = getToken(), auth = ['/login']
+    const token = getStore('access-token'), auth = ['/login']
     if (auth.indexOf(to.path) !== -1) {
         return true
-    } else if (!token) {
+    } else if (isNullES(token)) {
         return '/login'
     } else {
         const res = await getRouterData(to.name)
-        if (res) {
-            return true
-        } else {
-            return '/login'
-        }
-    }*/
-    return true
+        if (res) return true
+        return '/login'
+    }
 })
 
 router.afterEach((to) => {

src/router/modules/base.js

@@ -15,16 +15,16 @@ export default [
         component: () => import('~src/views/login/index.vue'),
     },
     {
-        path: '/anomaly',
-        name: 'anomaly',
-        redirect: '/anomaly/invest',
-        meta: { title: '异常管理' },
+        path: '/other',
+        name: 'other',
+        redirect: '/anomaly',
+        meta: { title: '其它页面' },
         component: Layout,
         children: [
             {
-                path: '/anomaly/invest',
-                name: 'anomaly-invest',
-                meta: { title: '项目异常管理' },
+                path: '/anomaly',
+                name: 'anomaly',
+                meta: { title: '异常管理' },
                 component: () => import('~src/views/anomaly/index.vue'),
             },
         ],

src/router/modules/menu.js

@@ -1,80 +0,0 @@
-export default [
-    {
-        source: 'menu',
-        name: '数据看板',
-        code: 'index',
-    },
-    {
-        source: 'menu',
-        name: '异常管理',
-        code: 'anomaly-invest',
-    },
-    {
-        source: 'menu',
-        name: '项目管理',
-        code: 'project',
-        children: [
-            {
-                name: '项目资料收集',
-                code: 'project-collect',
-                children: [
-                    {
-                        name: '项目管理',
-                        code: 'project-collect-admin',
-                        children: [
-                            {
-                                name: '创建项目',
-                                code: 'project-collect-admin-create',
-                            },
-                            {
-                                name: '项目列表',
-                                code: 'project-collect-admin-list',
-                            },
-                        ],
-                    },
-                    {
-                        name: '工作要点管理',
-                        code: 'project-collect-gist',
-                        children: [
-                            {
-                                name: '创建工作要点',
-                                code: 'project-collect-gist-create',
-                            },
-                            {
-                                name: '工作要点列表',
-                                code: 'project-collect-gist-list',
-                            },
-                        ],
-                    },
-                ],
-            },
-            {
-                name: '项目台账',
-                code: 'project-ledger',
-            },
-        ],
-    },
-    {
-        source: 'menu',
-        name: '系统设置',
-        code: 'system',
-        children: [
-            {
-                name: '用户管理',
-                code: 'system-user',
-            },
-            {
-                name: '角色管理',
-                code: 'system-role',
-            },
-            {
-                name: '菜单管理',
-                code: 'system-menu',
-            },
-            {
-                name: '系统设置',
-                code: 'system-set',
-            },
-        ],
-    },
-]

src/router/modules/token.js

@@ -1,2 +1,2 @@
 //内置路由需要验证的
-export default ['index']
+export default []

src/router/routers.js

@@ -1,7 +1,5 @@
-//import { getStore, setStore } from 'hc-vue3-ui'
 import { getStore, setStore } from '~src/utils/storage'
 import { deepClone, getArrValue, isNullES } from 'js-fast-way'
-//import testMenu from './modules/menu'
 
 //获取路由菜单
 export const getRouterData = async (toName) => {

src/store/index.js

@@ -7,14 +7,14 @@ export const useAppStore = defineStore('main', {
         //用户信息
         userInfo: getStore('userInfo') || {},
         //菜单信息
-        menus: getStore('menus') || [],
-        home: getStore('home') || 'anomaly-invest',
+        home: getStore('home') || 'index',
+        page: getStore('page') || 'anomaly',
         buttons: getStore('buttons') || {},
     }),
     getters: {
         getUserInfo: state => state.userInfo,
-        getMenus: state => state.menus,
         getHome: state => state.home,
+        getPage: state => state.page,
         getButtons: state => state.buttons,
     },
     actions: {
@@ -24,10 +24,6 @@ export const useAppStore = defineStore('main', {
             setStore('userInfo', value)
         },
         //菜单信息
-        setMenus(value) {
-            this.menus = value
-            setStore('menus', value)
-        },
         setButtons(value) {
             this.buttons = value
             setStore('buttons', value)
@@ -36,13 +32,18 @@ export const useAppStore = defineStore('main', {
             this.home = value
             setStore('home', value)
         },
+        setPage(value) {
+            this.page = value
+            setStore('page', value)
+        },
         getButtonsVal(value) {
             return this.buttons[value] || false
         },
         //清除缓存和token
         clearStoreData() {
             this.userInfo = null
-            this.menus = null
+            this.home = 'index'
+            this.page = 'anomaly'
             this.buttons = null
             //清除缓存
             clearStoreAll()

src/store/modules/user.js

@@ -1,10 +1,11 @@
 import pinia from '~src/store/init'
 import { useAppStore } from '~src/store'
 import { getRoutes } from '~api/menu'
-import { getRefreshToken, setRefreshToken, setStore, setToken } from 'hc-vue3-ui'
+import { getRefreshToken, setRefreshToken, setToken } from 'hc-vue3-ui'
 import tokenData from '~src/router/modules/token'
-import { ArrToOneObj, getArrValue } from 'js-fast-way'
+import { ArrToOneObj, getArrValue, isNullES } from 'js-fast-way'
 import { logout, refreshToken, userLogin } from '~api/user'
+import { getStore, setStore } from '~src/utils/storage'
 
 //初始变量
 const store = useAppStore(pinia)
@@ -21,6 +22,7 @@ export const useAppLogin = async (form) => {
         if (routerRes.length <= 0) {
             return { error: true, msg: '路由异常' }
         }
+        await getHomeRouter()
         return { error, code, res }
     } else {
         return { error, code, res }
@@ -39,12 +41,40 @@ export const setRouterData = async () => {
     await ArrToOneObj(resData, 'code', routesObj, routesArr)
     const routes = [...tokenData, ...routesArr] //合并
     //数据缓存
-    store.setMenus(resData)
+    setStore('menus', resData)
     setStore('route', routesObj)
     setStore('routes', routes)
     return resData
 }
 
+//获取路由菜单的主入口路径
+const getHomeRouter = async () => {
+    const menus = getArrValue(getStore('menus'))
+    //没有菜单路由数据
+    if (menus.length <= 0) {
+        store.setHomePage('index')
+        store.setPage('anomaly')
+    } else {
+        const code = await getRoutesHomeUrl(menus, 0)
+        store.setHomePage(code)
+        store.setPage(code)
+        if (code === 'index') {
+            const pageCode = await getRoutesHomeUrl(menus, 1)
+            store.setPage(pageCode)
+        }
+    }
+}
+
+//递归获取最子级的菜单
+const getRoutesHomeUrl = async (arr, index = 0) => {
+    const item = arr[index]
+    if (!isNullES(item.children) && item.children.length > 0) {
+        return await getRoutesHomeUrl(item.children, index)
+    } else {
+        return item.code
+    }
+}
+
 //刷新token
 export const RefreshToken = async () => {
     try {

src/views/home/datav.vue

@@ -459,7 +459,7 @@ const workData = ref([
 
 //跳转到首页
 const toHomePage = () => {
-    router.push({ name: store.home })
+    router.push({ name: store.page })
 }
 
 //监听浏览器窗口变化

src/views/login/index.vue

@@ -95,7 +95,7 @@ const formValidateClick = async () => {
     window?.$message?.success('登录成功')
     setTimeout(() => {
         loading.value = false
-        router.push({ name: 'index' })
+        router.push({ name: store.home })
     }, 1500)
 }
 </script>