From af9eb0cb065fee3952dd2d8acf58ef89cc8fe4a6 Mon Sep 17 00:00:00 2001
From: hooray <304327508@qq.com>
Date: Fri, 4 Feb 2022 03:08:35 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96menu=E5=85=A8=E5=B1=80?=
 =?UTF-8?q?=E7=8A=B6=E6=80=81=EF=BC=8C=E5=90=88=E5=B9=B6setHeaderActived?=
 =?UTF-8?q?=E5=92=8CswitchHeaderActived=E4=B8=A4=E4=B8=AAaction?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layout/components/AppSetting/index.vue  |  4 +--
 src/layout/components/Header/index.vue      |  2 +-
 src/layout/components/MainSidebar/index.vue |  2 +-
 src/layout/index.vue                        |  2 +-
 src/router/index.js                         |  2 +-
 src/store/modules/menu.js                   | 37 +++++++++++----------
 src/store/modules/user.js                   |  2 +-
 7 files changed, 26 insertions(+), 25 deletions(-)

diff --git a/src/layout/components/AppSetting/index.vue b/src/layout/components/AppSetting/index.vue
index 438a5be0..611fad5a 100644
--- a/src/layout/components/AppSetting/index.vue
+++ b/src/layout/components/AppSetting/index.vue
@@ -179,8 +179,8 @@ const settings = ref(globalSettings)
 
 watch(() => settings, () => {
     settingsStore.updateThemeSetting(settings.value)
-    menuStore.switchHeaderActived(0)
-    settings.value.menu.menuMode !== 'single' && menuStore.setHeaderActived(route.fullPath)
+    menuStore.setActived(0)
+    settings.value.menu.menuMode !== 'single' && menuStore.setActived(route.fullPath)
 }, {
     deep: true
 })
diff --git a/src/layout/components/Header/index.vue b/src/layout/components/Header/index.vue
index 3561a502..6b869b9a 100644
--- a/src/layout/components/Header/index.vue
+++ b/src/layout/components/Header/index.vue
@@ -7,7 +7,7 @@
                     <!-- 顶部模式 -->
                     <div class="nav">
                         <template v-for="(item, index) in menuStore.allMenus">
-                            <div v-if="item.children && item.children.length !== 0" :key="index" class="item" :class="{'active': index == menuStore.headerActived}" @click="switchMenu(index)">
+                            <div v-if="item.children && item.children.length !== 0" :key="index" class="item" :class="{'active': index == menuStore.actived}" @click="switchMenu(index)">
                                 <svg-icon v-if="item.meta.icon" :name="item.meta.icon" />
                                 <span v-if="item.meta.title">{{ item.meta.title }}</span>
                             </div>
diff --git a/src/layout/components/MainSidebar/index.vue b/src/layout/components/MainSidebar/index.vue
index 5b772410..a7d8478f 100644
--- a/src/layout/components/MainSidebar/index.vue
+++ b/src/layout/components/MainSidebar/index.vue
@@ -8,7 +8,7 @@
                     <div
                         v-if="item.children && item.children.length !== 0" :key="index" :class="{
                             'item': true,
-                            'active': index === menuStore.headerActived
+                            'active': index === menuStore.actived
                         }" :title="item.meta.title" @click="switchMenu(index)"
                     >
                         <svg-icon v-if="item.meta.icon" :name="item.meta.icon" />
diff --git a/src/layout/index.vue b/src/layout/index.vue
index 308d2d91..7ef9fb93 100644
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@@ -90,7 +90,7 @@ function reload() {
 
 provide('switchMenu', switchMenu)
 function switchMenu(index) {
-    menuStore.switchHeaderActived(index)
+    menuStore.setActived(index)
     if (settingsStore.menu.switchMainMenuAndPageJump) {
         if (isExternalLink(menuStore.sidebarMenusFirstDeepestPath)) {
             window.open(menuStore.sidebarMenusFirstDeepestPath, '_blank')
diff --git a/src/router/index.js b/src/router/index.js
index 15351bb4..769c9695 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -152,7 +152,7 @@ router.beforeEach(async(to, from, next) => {
         // 是否已根据权限动态生成并挂载路由
         if (routeOutsideStore.isGenerate) {
             // 导航栏如果不是 single 模式，则需要根据 path 定位主导航的选中状态
-            settingsOutsideStore.menu.menuMode !== 'single' && menuOutsideStore.setHeaderActived(to.path)
+            settingsOutsideStore.menu.menuMode !== 'single' && menuOutsideStore.setActived(to.path)
             if (to.name) {
                 if (to.matched.length !== 0) {
                     // 如果已登录状态下，进入登录页会强制跳转到控制台页面
diff --git a/src/store/modules/menu.js b/src/store/modules/menu.js
index 56c3c779..090b61bf 100644
--- a/src/store/modules/menu.js
+++ b/src/store/modules/menu.js
@@ -34,7 +34,7 @@ export const useMenuStore = defineStore(
     'menu',
     {
         state: () => ({
-            headerActived: 0
+            actived: 0
         }),
         getters: {
             // 完整导航数据
@@ -54,7 +54,7 @@ export const useMenuStore = defineStore(
             },
             // 次导航数据
             sidebarMenus() {
-                return this.allMenus.length > 0 ? this.allMenus[this.headerActived].children : []
+                return this.allMenus.length > 0 ? this.allMenus[this.actived].children : []
             },
             // 次导航里第一个导航的路径
             sidebarMenusFirstDeepestPath() {
@@ -73,22 +73,23 @@ export const useMenuStore = defineStore(
             }
         },
         actions: {
-            // 根据路由判断属于哪个头部导航
-            setHeaderActived(path) {
-                const routeStore = useRouteStore()
-                routeStore.routes.map((item, index) => {
-                    if (
-                        item.children.some(r => {
-                            return path.indexOf(r.path + '/') === 0 || path == r.path
-                        })
-                    ) {
-                        this.headerActived = index
-                    }
-                })
-            },
-            // 切换头部导航
-            switchHeaderActived(index) {
-                this.headerActived = index
+            // 切换主导航
+            setActived(data) {
+                if (typeof data === 'number') {
+                    // 如果是 number 类型，则认为是主导航的索引
+                    this.actived = data
+                } else {
+                    // 如果是 string 类型，则认为是路由，需要查找对应的主导航索引
+                    this.allMenus.map((item, index) => {
+                        if (
+                            item.children.some(r => {
+                                return data.indexOf(r.path + '/') === 0 || data == r.path
+                            })
+                        ) {
+                            this.actived = index
+                        }
+                    })
+                }
             }
         }
     }
diff --git a/src/store/modules/user.js b/src/store/modules/user.js
index e98dba07..32a3d585 100644
--- a/src/store/modules/user.js
+++ b/src/store/modules/user.js
@@ -56,7 +56,7 @@ export const useUserStore = defineStore(
                     this.token = ''
                     this.failure_time = ''
                     routeStore.removeRoutes()
-                    menuStore.switchHeaderActived(0)
+                    menuStore.setActived(0)
                     resolve()
                 })
             },