This commit is contained in:
2026-06-26 15:57:46 +08:00
parent d82c7a1490
commit 0903543994
5 changed files with 67 additions and 20 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-BNvl4Dex.js"></script> <script type="module" crossorigin src="/assets/index-4U-_hqyL.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-eLRg4pQk.css"> <link rel="stylesheet" crossorigin href="/assets/index-eLRg4pQk.css">
</head> </head>
<body> <body>
+13 -2
View File
@@ -202,7 +202,7 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
padding: 40px 24px; padding: 32px 16px;
z-index: 1; z-index: 1;
} }
@@ -230,7 +230,7 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
z-index: 1; z-index: 1;
padding: 20px 24px 40px; padding: 16px 16px 32px;
} }
@media (min-width: 900px) { @media (min-width: 900px) {
@@ -238,3 +238,14 @@
padding: 40px 24px; padding: 40px 24px;
} }
} }
@media (max-width: 480px) {
.login-left-section {
padding: 24px 12px;
text-align: center;
}
.login-right-section {
padding: 12px 12px 24px;
}
}
@@ -505,13 +505,21 @@ const AppLayout: React.FC = () => {
display: 'flex', alignItems: 'center', display: 'flex', alignItems: 'center',
justifyContent: 'flex-start', justifyContent: 'flex-start',
gap: 10, gap: 10,
padding: depth > 0 ? '6px 12px 6px 32px' : '6px 14px', padding: depth > 0 ? '8px 12px 8px 32px' : '8px 14px',
borderRadius: 12, margin: '1px 4px', cursor: 'pointer', borderRadius: 12, margin: '2px 4px', cursor: 'pointer',
fontSize: depth > 0 ? 13 : 14, fontWeight: isActive ? 600 : 400, fontSize: depth > 0 ? 13 : 14, fontWeight: isActive ? 600 : 400,
color: isActive ? '#4f46e5' : '#475569', color: isActive ? '#4f46e5' : '#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) => {
e.currentTarget.style.background = 'rgba(99, 102, 241, 0.05)';
}}
onMouseLeave={(e) => {
if (!isActive) {
e.currentTarget.style.background = 'transparent';
}
}}
> >
<span style={{ <span style={{
fontSize: depth > 0 ? 14 : 16, fontSize: depth > 0 ? 14 : 16,
@@ -546,23 +554,51 @@ const AppLayout: React.FC = () => {
topLevelItems.forEach(item => { topLevelItems.forEach(item => {
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 isExpanded = collapsedGroups[item.id] !== true;
if (menuType === 'group') { if (menuType === 'group') {
items.push( items.push(
<div key={item.id}> <div key={item.id}>
<div style={{ <div
color: '#94a3b8', fontSize: 12, fontWeight: 600, onClick={() => {
padding: '10px 14px 4px', letterSpacing: 0.5, textTransform: 'uppercase', setCollapsedGroups(prev => ({
}}> ...prev,
{item.label} [item.id]: !prev[item.id]
}));
}}
style={{
display: 'flex',
alignItems: 'center',
justifyContent: 'space-between',
color: '#94a3b8', fontSize: 12, fontWeight: 600,
padding: '10px 14px 4px', letterSpacing: 0.5, textTransform: 'uppercase',
cursor: 'pointer',
}}
>
<span>{item.label}</span>
<span style={{
fontSize: 12,
color: '#cbd5e1',
transition: 'transform 0.2s ease',
transform: isExpanded ? 'rotate(90deg)' : 'rotate(0deg)',
}}>
<RightOutlined />
</span>
</div> </div>
{(childMap[item.id] || []).sort((a, b) => { {isExpanded && (
const orderA = typeof a.sortOrder === 'number' ? a.sortOrder : Infinity; <div style={{ overflow: 'hidden' }}>
const orderB = typeof b.sortOrder === 'number' ? b.sortOrder : Infinity; {(childMap[item.id] || []).sort((a, b) => {
return orderA - orderB; const orderA = typeof a.sortOrder === 'number' ? a.sortOrder : Infinity;
}).map(c => renderMenuItem(c, 1))} const orderB = typeof b.sortOrder === 'number' ? b.sortOrder : Infinity;
return orderA - orderB;
}).map(c => renderMenuItem(c, 1))}
</div>
)}
</div> </div>
); );
} else if (hasChildren) {
items.push(renderMenuItem(item));
} else { } else {
items.push(renderMenuItem(item)); items.push(renderMenuItem(item));
} }
+3 -3
View File
@@ -372,10 +372,10 @@ const LoginPage: React.FC = () => {
{/* Right side - login/register form */} {/* Right side - login/register form */}
<div className="login-right-section"> <div className="login-right-section">
<Card style={{ <Card style={{
width: '100%', maxWidth: 440, borderRadius: 20, width: '100%', maxWidth: 400, borderRadius: 16,
boxShadow: '0 20px 60px rgba(0,0,0,0.08)', boxShadow: '0 12px 40px rgba(0,0,0,0.08)',
border: '1px solid #e2e8f0', background: '#fff', border: '1px solid #e2e8f0', background: '#fff',
}} styles={{ body: { padding: '28px 24px' } }}> }} styles={{ body: { padding: '24px 20px' } }}>
<Typography.Title level={3} style={{ textAlign: 'center', marginBottom: 6, color: '#1e293b', fontWeight: 700 }}> <Typography.Title level={3} style={{ textAlign: 'center', marginBottom: 6, color: '#1e293b', fontWeight: 700 }}>
{mode === 'register' ? '创建账号' : '欢迎回来'} {mode === 'register' ? '创建账号' : '欢迎回来'}
</Typography.Title> </Typography.Title>