This commit is contained in:
2026-06-26 17:51:11 +08:00
parent ab02f7ef34
commit 6c8543a5f6
3 changed files with 7 additions and 24 deletions
File diff suppressed because one or more lines are too long
+1 -1
View File
@@ -28,7 +28,7 @@
} }
})(); })();
</script> </script>
<script type="module" crossorigin src="/assets/index-B2jd4dmR.js"></script> <script type="module" crossorigin src="/assets/index-Cp_h_kxu.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-xCZbcxht.css"> <link rel="stylesheet" crossorigin href="/assets/index-xCZbcxht.css">
</head> </head>
<body> <body>
@@ -299,8 +299,6 @@ const AppLayout: React.FC = () => {
}); });
}); });
const [collapsedGroups, setCollapsedGroups] = useState<Record<string, boolean>>({});
const handleMobileMenuClick = (item: MenuConfig) => { const handleMobileMenuClick = (item: MenuConfig) => {
const menuType = item.menu_type ?? item.menuType; const menuType = item.menu_type ?? item.menuType;
const hasChildren = childMap[item.id] && childMap[item.id].length > 0; const hasChildren = childMap[item.id] && childMap[item.id].length > 0;
@@ -444,18 +442,12 @@ const AppLayout: React.FC = () => {
const hasChildren = childMap[item.id] && childMap[item.id].length > 0; const hasChildren = childMap[item.id] && childMap[item.id].length > 0;
const menuType = item.menu_type ?? item.menuType; const menuType = item.menu_type ?? item.menuType;
const isGroup = menuType === 'group'; const isGroup = menuType === 'group';
const isExpanded = collapsedGroups[item.id] !== true;
return ( return (
<div key={item.id}> <div key={item.id}>
<div <div
onClick={() => { onClick={() => {
if (isGroup || hasChildren) { if (!(isGroup || hasChildren) && item.path) {
setCollapsedGroups(prev => ({
...prev,
[item.id]: !prev[item.id]
}));
} else if (item.path) {
navigate(item.path); navigate(item.path);
} }
}} }}
@@ -464,14 +456,15 @@ const AppLayout: React.FC = () => {
justifyContent: 'flex-start', justifyContent: 'flex-start',
gap: 10, gap: 10,
padding: depth > 0 ? '6px 12px 6px 32px' : '6px 14px', padding: depth > 0 ? '6px 12px 6px 32px' : '6px 14px',
borderRadius: 12, margin: '1px 4px', cursor: 'pointer', borderRadius: 12, margin: '1px 4px',
cursor: isGroup || hasChildren ? 'default' : 'pointer',
fontSize: depth > 0 ? 13 : 14, fontWeight: isActive ? 600 : 400, fontSize: depth > 0 ? 13 : 14, fontWeight: isActive ? 600 : 400,
color: isActive ? '#4f46e5' : (isGroup ? '#94a3b8' : '#475569'), color: isActive ? '#4f46e5' : (isGroup ? '#94a3b8' : '#475569'),
background: isActive ? 'linear-gradient(135deg, rgba(99, 102, 241, 0.1) 0%, rgba(139, 92, 246, 0.08) 100%)' : 'transparent', background: isActive ? 'linear-gradient(135deg, rgba(99, 102, 241, 0.1) 0%, rgba(139, 92, 246, 0.08) 100%)' : 'transparent',
transition: 'all 0.2s ease', transition: 'all 0.2s ease',
}} }}
onMouseEnter={(e) => { onMouseEnter={(e) => {
if (!isGroup && !isActive) { if (!isGroup && !isActive && !(isGroup || hasChildren)) {
e.currentTarget.style.background = 'rgba(99, 102, 241, 0.05)'; e.currentTarget.style.background = 'rgba(99, 102, 241, 0.05)';
} }
}} }}
@@ -491,19 +484,9 @@ const AppLayout: React.FC = () => {
<span style={{ whiteSpace: 'nowrap', flex: 1, textAlign: 'left', fontWeight: isGroup ? 600 : (isActive ? 600 : 400), fontSize: isGroup ? 12 : (depth > 0 ? 13 : 14), textTransform: isGroup ? 'uppercase' : 'none', letterSpacing: isGroup ? 0.5 : 0 }}> <span style={{ whiteSpace: 'nowrap', flex: 1, textAlign: 'left', fontWeight: isGroup ? 600 : (isActive ? 600 : 400), fontSize: isGroup ? 12 : (depth > 0 ? 13 : 14), textTransform: isGroup ? 'uppercase' : 'none', letterSpacing: isGroup ? 0.5 : 0 }}>
{item.label} {item.label}
</span> </span>
{(isGroup || hasChildren) && (
<span style={{
fontSize: isGroup ? 12 : 14,
color: '#cbd5e1',
transition: 'transform 0.2s ease',
transform: isExpanded ? 'rotate(90deg)' : 'rotate(0deg)',
}}>
<RightOutlined />
</span>
)}
</div> </div>
{(isGroup || hasChildren) && isExpanded && ( {(isGroup || hasChildren) && (
<div style={{ overflow: 'hidden' }}> <div style={{ overflow: 'hidden' }}>
{(childMap[item.id] || []).map(c => renderMenuItem(c, depth + 1))} {(childMap[item.id] || []).map(c => renderMenuItem(c, depth + 1))}
</div> </div>