From 9930d77f482e4930d521a6506c60715bad5aacef Mon Sep 17 00:00:00 2001
From: huazhongmin <peanut_hzm@163.com>
Date: Thu, 30 Oct 2025 11:03:57 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=EF=BC=9A=E8=A7=A3=E5=86=B3we?=
 =?UTF-8?q?b-admin=E5=B7=A6=E4=BE=A7=E8=8F=9C=E5=8D=95=E9=87=8D=E5=A4=8D?=
 =?UTF-8?q?=E6=98=BE=E7=A4=BA=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 创建独立的菜单配置文件 menu.ts
- 修改Layout.vue使用静态菜单配置而不是动态路由生成
- 移除子路由中重复的图标配置
- 优化菜单渲染逻辑，避免重复显示

修复内容：
1. 菜单配置独立化：避免从路由动态生成导致的重复
2. 简化菜单结构：只显示必要的顶级菜单项
3. 图标去重：移除子路由中重复的图标定义
---
 web-admin/src/config/menu.ts     | 25 +++++++++++++++++++++++
 web-admin/src/layouts/Layout.vue | 35 ++++++++++++++++----------------
 web-admin/src/router/index.ts    |  4 ++--
 3 files changed, 45 insertions(+), 19 deletions(-)
 create mode 100644 web-admin/src/config/menu.ts

diff --git a/web-admin/src/config/menu.ts b/web-admin/src/config/menu.ts
new file mode 100644
index 0000000..fa49d08
--- /dev/null
+++ b/web-admin/src/config/menu.ts
@@ -0,0 +1,25 @@
+export interface MenuItem {
+  path: string
+  title: string
+  icon?: string
+  children?: MenuItem[]
+  hidden?: boolean
+}
+
+export const menuConfig: MenuItem[] = [
+  {
+    path: '/',
+    title: '仪表盘',
+    icon: 'DataLine'
+  },
+  {
+    path: '/admin',
+    title: '管理员管理',
+    icon: 'User'
+  },
+  {
+    path: '/user',
+    title: '用户管理',
+    icon: 'UserFilled'
+  }
+]
\ No newline at end of file
diff --git a/web-admin/src/layouts/Layout.vue b/web-admin/src/layouts/Layout.vue
index 1e8ea73..91642cc 100644
--- a/web-admin/src/layouts/Layout.vue
+++ b/web-admin/src/layouts/Layout.vue
@@ -11,30 +11,32 @@
         :unique-opened="true"
         router
       >
-        <template v-for="route in menuRoutes" :key="route.path">
-          <el-sub-menu v-if="route.children && route.children.length > 1" :index="route.path">
+        <template v-for="item in menuRoutes" :key="item.path">
+          <!-- 如果有子菜单，显示为子菜单 -->
+          <el-sub-menu v-if="item.children && item.children.length > 0" :index="item.path">
             <template #title>
-              <el-icon v-if="route.meta?.icon">
-                <component :is="route.meta.icon" />
+              <el-icon v-if="item.icon">
+                <component :is="item.icon" />
               </el-icon>
-              <span>{{ route.meta?.title }}</span>
+              <span>{{ item.title }}</span>
             </template>
             <el-menu-item
-              v-for="child in route.children"
+              v-for="child in item.children"
               :key="child.path"
-              :index="route.path + '/' + child.path"
+              :index="child.path"
             >
-              <el-icon v-if="child.meta?.icon">
-                <component :is="child.meta.icon" />
+              <el-icon v-if="child.icon">
+                <component :is="child.icon" />
               </el-icon>
-              <span>{{ child.meta?.title }}</span>
+              <span>{{ child.title }}</span>
             </el-menu-item>
           </el-sub-menu>
-          <el-menu-item v-else :index="route.redirect || route.path">
-            <el-icon v-if="route.meta?.icon">
-              <component :is="route.meta.icon" />
+          <!-- 没有子菜单，直接显示为菜单项 -->
+          <el-menu-item v-else :index="item.path">
+            <el-icon v-if="item.icon">
+              <component :is="item.icon" />
             </el-icon>
-            <span>{{ route.meta?.title }}</span>
+            <span>{{ item.title }}</span>
           </el-menu-item>
         </template>
       </el-menu>
@@ -78,6 +80,7 @@ import { ref, computed, onMounted } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { useAdminStore } from '@/stores/admin'
 import { Fold, Expand } from '@element-plus/icons-vue'
+import { menuConfig } from '@/config/menu'
 
 const route = useRoute()
 const router = useRouter()
@@ -89,9 +92,7 @@ const adminInfo = computed(() => adminStore.adminInfo)
 const activeMenu = computed(() => route.path)
 
 const menuRoutes = computed(() => {
-  return router.getRoutes().filter(r => 
-    r.path === '/' || (r.path.startsWith('/') && !r.meta?.hidden && r.component?.name !== 'Layout')
-  )
+  return menuConfig.filter(item => !item.hidden)
 })
 
 const toggleCollapse = () => {
diff --git a/web-admin/src/router/index.ts b/web-admin/src/router/index.ts
index 7be8f82..0c55a51 100644
--- a/web-admin/src/router/index.ts
+++ b/web-admin/src/router/index.ts
@@ -31,7 +31,7 @@ const routes: RouteRecordRaw[] = [
         path: 'list',
         name: 'AdminList',
         component: () => import('@/views/admin/AdminList.vue'),
-        meta: { title: '管理员列表', icon: 'User' }
+        meta: { title: '管理员列表' }
       }
     ]
   },
@@ -45,7 +45,7 @@ const routes: RouteRecordRaw[] = [
         path: 'list',
         name: 'UserList',
         component: () => import('@/views/user/UserList.vue'),
-        meta: { title: '用户列表', icon: 'UserFilled' }
+        meta: { title: '用户列表' }
       }
     ]
   },