From 6b5c3a7f2a94ea90cdccdaff5a4603dc1c5a7f2a Mon Sep 17 00:00:00 2001
From: hxr <1490493387@qq.com>
Date: Sat, 10 Feb 2024 09:33:57 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E5=B8=83=E5=B1=80=E4=BB=A3?=
 =?UTF-8?q?=E7=A0=81=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Sidebar/components/SidebarMixTopMenu.vue         | 12 ++++++------
 src/layout/index.vue                                 | 10 +++++-----
 src/store/modules/permission.ts                      |  8 ++------
 3 files changed, 13 insertions(+), 17 deletions(-)

diff --git a/src/layout/components/Sidebar/components/SidebarMixTopMenu.vue b/src/layout/components/Sidebar/components/SidebarMixTopMenu.vue
index 3642add4..8a03e7d8 100644
--- a/src/layout/components/Sidebar/components/SidebarMixTopMenu.vue
+++ b/src/layout/components/Sidebar/components/SidebarMixTopMenu.vue
@@ -32,16 +32,16 @@
 </template>
 
 <script lang="ts" setup>
-import { RouteRecordRaw } from "vue-router";
 import { usePermissionStore, useAppStore } from "@/store";
 import { translateRouteTitle } from "@/utils/i18n";
 import variables from "@/styles/variables.module.scss";
+import { RouteRecordRaw } from "vue-router";
 
 const appStore = useAppStore();
 const permissionStore = usePermissionStore();
 const router = useRouter();
 
-const activePath = computed(() => appStore.activeTopMenu);
+const activePath = computed(() => appStore.activeTopMenuPath);
 
 // 顶部菜单集合
 const mixTopMenus = ref<RouteRecordRaw[]>([]);
@@ -49,10 +49,10 @@ const mixTopMenus = ref<RouteRecordRaw[]>([]);
 /**
  * 菜单选择事件
  */
-const handleMenuSelect = (selectedRoutePath: string) => {
-  appStore.activeTopMenu(selectedRoutePath);
-  permissionStore.setMixLeftMenus(selectedRoutePath);
-  // 获取左侧菜单集合，并跳转到第一个菜单
+const handleMenuSelect = (routePath: string) => {
+  appStore.activeTopMenu(routePath);
+  permissionStore.setMixLeftMenus(routePath);
+  // 获取左侧菜单集合，默认跳转到第一个菜单
   const mixLeftMenus = permissionStore.mixLeftMenus;
   goToFirstMenu(mixLeftMenus);
 };
diff --git a/src/layout/index.vue b/src/layout/index.vue
index 19613417..eefa07a3 100644
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@@ -12,7 +12,7 @@
     <!-- 混合布局 -->
     <div v-if="layout === 'mix'" class="mix-container">
       <div class="mix-container__left">
-        <SidebarMenu :menu-list="mixLeftMenus" :base-path="activeTopMenu" />
+        <SidebarMenu :menu-list="mixLeftMenus" :base-path="activeTopMenuPath" />
         <div class="sidebar-toggle">
           <hamburger
             :is-active="appStore.sidebar.opened"
@@ -35,7 +35,7 @@
     <!-- 左侧布局|| 顶部布局 -->
     <div v-else :class="{ hasTagsView: showTagsView }" class="main-container">
       <div :class="{ 'fixed-header': fixedHeader }">
-        <Navbar v-if="layout === 'left'" />
+        <NavBar v-if="layout === 'left'" />
         <TagsView v-if="showTagsView" />
       </div>
       <AppMain />
@@ -61,8 +61,8 @@ const showTagsView = computed(() => settingsStore.tagsView);
 const showSettings = computed(() => settingsStore.showSettings);
 const layout = computed(() => settingsStore.layout);
 
-const activeTopMenu = computed(() => {
-  return appStore.activeTopMenu;
+const activeTopMenuPath = computed(() => {
+  return appStore.activeTopMenuPath;
 });
 // 混合模式左侧菜单
 const mixLeftMenus = computed(() => {
@@ -70,7 +70,7 @@ const mixLeftMenus = computed(() => {
 });
 
 watch(
-  () => activeTopMenu.value,
+  () => activeTopMenuPath.value,
   (newVal) => {
     if (layout.value !== "mix") return;
     permissionStore.setMixLeftMenus(newVal);
diff --git a/src/store/modules/permission.ts b/src/store/modules/permission.ts
index a435d6b0..175d07cc 100644
--- a/src/store/modules/permission.ts
+++ b/src/store/modules/permission.ts
@@ -1,5 +1,4 @@
 import { RouteRecordRaw } from "vue-router";
-import { defineStore } from "pinia";
 import { constantRoutes } from "@/router";
 import { store } from "@/store";
 import { listRoutes } from "@/api/menu";
@@ -98,15 +97,12 @@ export const usePermissionStore = defineStore("permission", () => {
         });
     });
   }
-
   /**
    * 获取与激活的顶部菜单项相关的混合模式左侧菜单集合
    */
   const mixLeftMenus = ref<RouteRecordRaw[]>([]);
-  function setMixLeftMenus(activeTopMenu: string) {
-    const matchedItem = routes.value.find(
-      (item) => item.path === activeTopMenu
-    );
+  function setMixLeftMenus(topMenuPath: string) {
+    const matchedItem = routes.value.find((item) => item.path === topMenuPath);
     if (matchedItem && matchedItem.children) {
       mixLeftMenus.value = matchedItem.children;
     }