Jelajahi Sumber

修改顶部菜单中通知管理和消息管理标题白色字。

wyn 5 bulan lalu
induk
melakukan
7190c289e2
1 mengubah file dengan 71 tambahan dan 7 penghapusan
  1. 71 7
      src/Dashboard.tsx

+ 71 - 7
src/Dashboard.tsx

@@ -1,5 +1,5 @@
-import React, { useState, useMemo } from 'react';
-import { useNavigate } from 'react-router-dom';
+import React, { useState, useMemo, useEffect } from 'react';
+import { useNavigate, useLocation } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';
 import { Shield, Settings, Users, Cpu, MapPin, Layers, Bell, User, LogOut, ChevronDown, Activity, Radio, Lock, AlertCircle, CheckCircle, Clock, Menu, Building2, UserCog, BookOpen, Server, Globe, Gauge, Briefcase, MessageSquare, FileText, FolderTree, KeyRound, HardDrive, Database, Network, Workflow, ClipboardList, Wrench, Archive, Package, Box, Grid3x3, List, LayoutGrid, FolderOpen, FileCheck, FileEdit, FileSearch } from 'lucide-react';
 import SystemConfig from './components/SystemConfig';
@@ -16,6 +16,7 @@ import { getMenus, hasMenuPathPermission, mapMenuPathToKey, getPermissionUser }
 
 export default function Dashboard() {
   const navigate = useNavigate();
+  const location = useLocation();
   const { t, i18n } = useTranslation();
   const [activeMenu, setActiveMenu] = useState('dashboard');
   const [activeSubMenu, setActiveSubMenu] = useState('menuManagement');
@@ -355,8 +356,23 @@ export default function Dashboard() {
             }
             let childKey: string = mapBackendPathToFrontendKey(child.path) || '';
             if (!childKey) {
-              // 如果无法映射,使用path作为key
-              childKey = child.path.replace(/[^a-zA-Z0-9]/g, '_') || `child_${child.id}`;
+              // 如果无法映射,尝试根据路径推断
+              if (child.path.includes('/dept')) {
+                childKey = 'departmentManagement';
+              } else if (child.path.includes('/menu')) {
+                childKey = 'menuManagement';
+              } else if (child.path.includes('/post') || child.path.includes('/marsdept')) {
+                childKey = 'positionManagement';
+              } else if (child.path.includes('/role')) {
+                childKey = 'roleManagement';
+              } else if (child.path.includes('/dict')) {
+                childKey = 'dictionaryManagement';
+              } else if (child.path.includes('/cabinet')) {
+                childKey = 'cabinetManagement';
+              } else {
+                // 如果无法推断,使用path作为key(去除特殊字符)
+                childKey = child.path.replace(/[^a-zA-Z0-9]/g, '_') || `child_${child.id}`;
+              }
             }
             
             // 检查是否已经添加过(去重)
@@ -495,6 +511,53 @@ export default function Dashboard() {
   // 过滤后的二级菜单配置(已经根据后端菜单过滤了,包含通知管理)
   const filteredSubMenuConfig = enhancedSubMenuConfig;
 
+  // 根据URL路径初始化菜单状态(仅在首次加载时执行)
+  useEffect(() => {
+    // 只在路径不是 /dashboard 时才根据路径初始化(因为应用使用状态管理而非路由)
+    // 如果路径是 /dashboard,则使用默认状态
+    if (location.pathname === '/dashboard') {
+      return; // 使用默认状态
+    }
+    
+    const path = location.pathname;
+    const menuKey = mapBackendPathToFrontendKey(path);
+    
+    if (menuKey) {
+      console.log('根据路径初始化菜单:', { path, menuKey });
+      
+      // 如果是系统配置的子菜单,需要设置对应的子菜单key
+      if (menuKey === 'systemConfig' || menuKey === 'departmentManagement' || menuKey === 'menuManagement' || 
+          menuKey === 'positionManagement' || menuKey === 'roleManagement' || menuKey === 'dictionaryManagement' || 
+          menuKey === 'cabinetManagement') {
+        // 确定是哪个子菜单
+        let subMenuKey = 'menuManagement'; // 默认值
+        
+        if (path.includes('/dept') || menuKey === 'departmentManagement') {
+          subMenuKey = 'departmentManagement';
+        } else if (path.includes('/menu') || menuKey === 'menuManagement') {
+          subMenuKey = 'menuManagement';
+        } else if (path.includes('/post') || menuKey === 'positionManagement') {
+          subMenuKey = 'positionManagement';
+        } else if (path.includes('/role') || menuKey === 'roleManagement') {
+          subMenuKey = 'roleManagement';
+        } else if (path.includes('/dict') || menuKey === 'dictionaryManagement') {
+          subMenuKey = 'dictionaryManagement';
+        } else if (path.includes('/cabinet') || menuKey === 'cabinetManagement') {
+          subMenuKey = 'cabinetManagement';
+        }
+        
+        console.log('设置系统配置子菜单:', { menuKey: 'systemConfig', subMenuKey });
+        setActiveMenu('systemConfig');
+        setActiveSubMenu(subMenuKey);
+      } else if (filteredSubMenuConfig[menuKey] && filteredSubMenuConfig[menuKey].length > 0) {
+        // 其他菜单,设置第一个子菜单
+        setActiveMenu(menuKey);
+        setActiveSubMenu(filteredSubMenuConfig[menuKey][0].key);
+      }
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []); // 只在组件挂载时执行一次
+
   return (
     <div className="min-h-screen bg-gradient-to-br from-gray-50 via-blue-50/30 to-gray-50">
       {/* 顶部导航栏 */}
@@ -561,6 +624,7 @@ export default function Dashboard() {
                                   <button
                                     key={subItem.key}
                                     onClick={() => {
+                                      console.log('点击子菜单:', { menuKey: item.key, subMenuKey: subItem.key });
                                       setActiveMenu(item.key);
                                       setActiveSubMenu(subItem.key);
                                       setShowDropdownMenu(null);
@@ -631,7 +695,7 @@ export default function Dashboard() {
                 </button>
                 {/* Tooltip */}
                 <div className="absolute right-0 top-full mt-2 px-3 py-1.5 bg-gray-900 text-white text-xs rounded-lg opacity-0 group-hover:opacity-100 transition-opacity pointer-events-none whitespace-nowrap z-50">
-                  消息通知
+                  {/* 消息通知 */}
                 </div>
               </div>
 
@@ -641,6 +705,7 @@ export default function Dashboard() {
                   <button 
                     className="relative p-2.5 hover:bg-gray-100 rounded-xl transition-colors"
                     title={notificationMenu.name ? notificationMenu.name.replace(/^客户端[-_]\s*/i, '') : '通知管理'}
+                    // title=""
                     onClick={() => {
                       const firstSubMenu = filteredSubMenuConfig['notificationManagement']?.[0]?.key || '';
                       setActiveMenu('notificationManagement');
@@ -649,10 +714,9 @@ export default function Dashboard() {
                   >
                     <MessageSquare className="w-5 h-5 text-gray-600" />
                   </button>
-                  
                   {/* Tooltip - 显示菜单名称 */}
                   <div className="absolute right-0 top-full mt-2 px-3 py-1.5 bg-gray-900 text-white text-xs rounded-lg opacity-0 group-hover:opacity-100 transition-opacity pointer-events-none whitespace-nowrap z-50">
-                    {notificationMenu.name ? notificationMenu.name.replace(/^客户端[-_]\s*/i, '') : '通知管理'}
+   
                   </div>
                 </div>
               )}