批量推送

ry-vue3/src/layout/AdminLayout.vue

@@ -6,10 +6,24 @@
         <div class="logo-sub">BAHIM 工作台</div>
       </div>
       <el-menu :default-active="route.path" router class="aside-menu">
-        <el-menu-item v-for="m in menu" :key="m.path" :index="m.path">
-          <el-icon><component :is="m.icon" /></el-icon>
-          <span>{{ m.title }}</span>
-        </el-menu-item>
+        <template v-for="m in menu" :key="m.path">
+          <!-- 二级菜单: 含 children 的用 el-sub-menu -->
+          <el-sub-menu v-if="m.children" :index="m.path">
+            <template #title>
+              <el-icon><component :is="m.icon" /></el-icon>
+              <span>{{ m.title }}</span>
+            </template>
+            <el-menu-item v-for="c in m.children" :key="c.path" :index="c.path">
+              <el-icon><component :is="c.icon" /></el-icon>
+              <span>{{ c.title }}</span>
+            </el-menu-item>
+          </el-sub-menu>
+          <!-- 一级菜单 -->
+          <el-menu-item v-else :index="m.path">
+            <el-icon><component :is="m.icon" /></el-icon>
+            <span>{{ m.title }}</span>
+          </el-menu-item>
+        </template>
       </el-menu>
     </el-aside>
     <el-container>
@@ -41,7 +55,7 @@ import { computed } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { useUserStore } from '@/store/user'
 import { logout as logoutApi } from '@/api/auth'
-import { House, Document, Calendar, User, List, OfficeBuilding, Setting, Bell, EditPen, DataAnalysis, Tickets, CaretBottom, Folder, Medal, UserFilled, Connection } from '@element-plus/icons-vue'
+import { House, Document, Calendar, User, List, OfficeBuilding, Setting, Bell, EditPen, DataAnalysis, Tickets, CaretBottom, Folder, Medal, UserFilled, Connection, Box, Star, Grid, Files, Compass } from '@element-plus/icons-vue'
 
 const route = useRoute()
 const router = useRouter()
@@ -58,11 +72,17 @@ const MENU = {
     { path: '/admin/roles', title: '角色管理', icon: Setting },
     { path: '/admin/projects', title: '项目全览', icon: Document },
     { path: '/admin/meetings', title: '会议全览', icon: Calendar },
-    { path: '/admin/department', title: '科室管理', icon: Folder },
-    { path: '/admin/title', title: '职称管理', icon: Medal },
-    { path: '/admin/experts', title: '专家管理', icon: UserFilled },
-    { path: '/admin/sponsor-orgs', title: '支持单位管理', icon: Connection },
-    { path: '/admin/executor-orgs', title: '服务机构管理', icon: OfficeBuilding },
+    { path: '/admin/library', title: '资料库管理', icon: Box, children: [
+      { path: '/admin/experts', title: '专家管理', icon: UserFilled },
+      { path: '/admin/sponsor-orgs', title: '支持单位管理', icon: Star },
+      { path: '/admin/executor-orgs', title: '服务机构管理', icon: OfficeBuilding },
+      { path: '/admin/department', title: '科室管理', icon: Grid },
+      { path: '/admin/title', title: '职称管理', icon: Medal }
+    ]},
+    { path: '/admin/manage', title: '网站管理', icon: Setting, children: [
+      { path: '/admin/article', title: '协议管理', icon: Files },
+      { path: '/admin/special-plan', title: '七大专项计划', icon: Compass }
+    ]},
     { path: '/admin/account', title: '账号信息', icon: User }
   ],
   leader: [
@@ -124,8 +144,38 @@ const onCommand = (cmd) => { if (cmd === 'logout') logout() }
 .logo-text { color: #fff; font-size: 16px; font-weight: 600; }
 .logo-sub { color: #8a99b3; font-size: 12px; }
 .aside-menu { background: #001529; border: none; }
-:deep(.el-menu-item) { color: #c0c4cc; }
-:deep(.el-menu-item.is-active) { background: #1890ff; color: #fff; }
+
+/* 一级菜单 + 二级父标题: 统一默认/hover/active 样式 */
+:deep(.el-menu-item),
+:deep(.el-sub-menu__title) {
+  color: #c0c4cc;
+}
+:deep(.el-menu-item:hover),
+:deep(.el-sub-menu__title:hover) {
+  background-color: #1f3a5f;
+  color: #fff;
+}
+/* 子项激活: 蓝底白字 */
+:deep(.el-menu-item.is-active) {
+  background: #1890ff;
+  color: #fff;
+}
+/* 父标题在子项激活时高亮 (Element Plus 自动给 el-sub-menu 加 is-active) */
+:deep(.el-sub-menu.is-active > .el-sub-menu__title) {
+  color: #fff;
+}
+
+/* 二级菜单容器: 跟随侧边栏深蓝底, 不要 Element Plus 默认白底 */
+:deep(.el-menu--inline),
+:deep(.el-menu--inline .el-menu-item) {
+  background-color: #001529;
+}
+:deep(.el-menu--inline .el-menu-item:hover) {
+  background-color: #1f3a5f;
+}
+:deep(.el-menu--inline .el-menu-item.is-active) {
+  background: #1890ff;
+}
 .topbar { background: #fff; display: flex; align-items: center; justify-content: space-between; padding: 0 24px; border-bottom: 1px solid #ebeef5; }
 .topbar-left { display: flex; align-items: center; }
 .page-title { font-size: 16px; font-weight: 600; }