-
0 ? '8px 12px 8px 32px' : '8px 14px',
- borderRadius: 12, margin: '2px 4px', cursor: 'pointer',
- fontSize: depth > 0 ? 13 : 14, fontWeight: isActive ? 600 : 400,
- color: isActive ? '#4f46e5' : '#475569',
- 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',
- }}
- onMouseEnter={(e) => {
- e.currentTarget.style.background = 'rgba(99, 102, 241, 0.05)';
- }}
- onMouseLeave={(e) => {
- if (!isActive) {
- e.currentTarget.style.background = 'transparent';
- }
- }}
- >
- 0 ? 14 : 16,
- flexShrink: 0,
- color: isActive ? '#6366f1' : '#64748b',
- }}>{menuIcon}
- {item.label}
- {hasChildren && (
-
-
-
- )}
-
-
- {hasChildren && isExpanded && (
-
- {(childMap[item.id] || []).sort((a, b) => {
- const orderA = typeof a.sortOrder === 'number' ? a.sortOrder : Infinity;
- const orderB = typeof b.sortOrder === 'number' ? b.sortOrder : Infinity;
- return orderA - orderB;
- }).map(c => renderMenuItem(c, depth + 1))}
-
- )}
+
item.path && navigate(item.path)} style={{
+ display: 'flex', alignItems: 'center',
+ justifyContent: 'flex-start',
+ gap: 10,
+ padding: depth > 0 ? '6px 12px 6px 32px' : '6px 14px',
+ borderRadius: 12, margin: '1px 4px', cursor: 'pointer',
+ fontSize: depth > 0 ? 13 : 14, fontWeight: isActive ? 600 : 400,
+ color: isActive ? '#4f46e5' : '#475569',
+ 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',
+ }}>
+ 0 ? 14 : 16,
+ flexShrink: 0,
+ color: isActive ? '#6366f1' : '#64748b',
+ }}>{menuIcon}
+ {item.label}
);
};
+ // Render top-level items and their children in order
topLevelItems.forEach(item => {
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') {
+ // Render group with its children
+ const children = (childMap[item.id] || []).sort((a, b) => {
+ const orderA = typeof a.sortOrder === 'number' ? a.sortOrder : Infinity;
+ const orderB = typeof b.sortOrder === 'number' ? b.sortOrder : Infinity;
+ return orderA - orderB;
+ });
items.push(
-
{
- setCollapsedGroups(prev => ({
- ...prev,
- [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',
- }}
- >
- {item.label}
-
-
-
-
- {isExpanded && (
-
- {(childMap[item.id] || []).sort((a, b) => {
- const orderA = typeof a.sortOrder === 'number' ? a.sortOrder : Infinity;
- const orderB = typeof b.sortOrder === 'number' ? b.sortOrder : Infinity;
- return orderA - orderB;
- }).map(c => renderMenuItem(c, 1))}
-
- )}
+
+ {item.label}
+
+ {children.map(c => renderMenuItem(c, 1))}
);
- } else if (hasChildren) {
- items.push(renderMenuItem(item));
} else {
+ // Render standalone page
items.push(renderMenuItem(item));
}
});
diff --git a/video-gen-app/src/pages/LoginPage.tsx b/video-gen-app/src/pages/LoginPage.tsx
index d478f0b2..c143a2d5 100644
--- a/video-gen-app/src/pages/LoginPage.tsx
+++ b/video-gen-app/src/pages/LoginPage.tsx
@@ -280,7 +280,9 @@ const LoginPage: React.FC = () => {
};
return (
-
{
}} />
{/* Left side - features */}
-
-
+
+
-
+
{siteLogo ? (
-

+

) : (
-
+
)}
-
+
{siteName}
-
+
AI赋能创意,素材触手可及
-
- 专业的 AI 素材生成平台,通过智能提示词优化,让您的创意快速转化为精美视频、图片
+
+ 专业的 AI 素材生成平台,通过智能提示词优化,
让您的创意快速转化为精美视频、图片
-
+
{features.map((f, i) => (
{
{/* Right side - login/register form */}
-
+
+ }} styles={{ body: { padding: '36px 28px' } }}>
{mode === 'register' ? '创建账号' : '欢迎回来'}