- {MENU_GROUPS.map((group) => (
+ {NAV_GROUPS.map((group) => (
{!collapsed && (
{group.title}
diff --git a/apps/web/src/config/navigation.ts b/apps/web/src/config/navigation.ts
new file mode 100644
index 000000000..3fdab37c4
--- /dev/null
+++ b/apps/web/src/config/navigation.ts
@@ -0,0 +1,189 @@
+/**
+ * 统一导航配置
+ * Header 和 Sidebar 共用此数据源
+ */
+import React from "react";
+import {
+ DashboardOutlined,
+ VideoCameraOutlined,
+ FileOutlined,
+ AudioOutlined,
+ FileTextOutlined,
+ TrophyOutlined,
+ AppstoreOutlined,
+ HistoryOutlined,
+ ControlOutlined,
+ CrownOutlined,
+ ScanOutlined,
+ EditOutlined,
+ FolderOutlined,
+} from "@ant-design/icons";
+
+/** 导航项定义 */
+export interface NavItem {
+ key: string;
+ label: string;
+ path: string;
+ icon: React.ReactNode;
+}
+
+/** 导航分组定义 */
+export interface NavGroup {
+ title: string;
+ items: NavItem[];
+}
+
+/**
+ * 扁平导航列表(Header 使用)
+ */
+export const NAV_ITEMS: NavItem[] = [
+ {
+ key: "dashboard",
+ label: "概览",
+ path: "/dashboard",
+ icon:
,
+ },
+ { key: "assets", label: "素材库", path: "/assets", icon:
},
+ {
+ key: "titles",
+ label: "标题库",
+ path: "/titles",
+ icon:
,
+ },
+ { key: "voices", label: "配音库", path: "/voices", icon:
},
+ {
+ key: "voice-clone",
+ label: "我的音色",
+ path: "/voice-clone",
+ icon:
,
+ },
+ {
+ key: "templates",
+ label: "模板库",
+ path: "/templates",
+ icon:
,
+ },
+ {
+ key: "editing-planner",
+ label: "剪辑编辑器",
+ path: "/editing-planner",
+ icon:
,
+ },
+ {
+ key: "my-templates",
+ label: "我的模板",
+ path: "/my-templates",
+ icon:
,
+ },
+ {
+ key: "generate",
+ label: "一键生成",
+ path: "/generate",
+ icon:
,
+ },
+ {
+ key: "history",
+ label: "任务历史",
+ path: "/history",
+ icon:
,
+ },
+ {
+ key: "products",
+ label: "成品库",
+ path: "/products",
+ icon:
,
+ },
+ {
+ key: "duplication",
+ label: "查重",
+ path: "/duplication",
+ icon:
,
+ },
+];
+
+/**
+ * 分组导航列表(Sidebar 使用)
+ */
+export const NAV_GROUPS: NavGroup[] = [
+ {
+ title: "创作工具",
+ items: [
+ {
+ key: "dashboard",
+ label: "首页",
+ path: "/dashboard",
+ icon:
,
+ },
+ {
+ key: "generate",
+ label: "一键生成",
+ path: "/generate",
+ icon:
,
+ },
+ ],
+ },
+ {
+ title: "资源管理",
+ items: [
+ {
+ key: "assets",
+ label: "素材库",
+ path: "/assets",
+ icon:
,
+ },
+ {
+ key: "voices",
+ label: "配音库",
+ path: "/voices",
+ icon:
,
+ },
+ {
+ key: "voice-clone",
+ label: "我的音色",
+ path: "/voice-clone",
+ icon:
,
+ },
+ {
+ key: "titles",
+ label: "标题库",
+ path: "/titles",
+ icon:
,
+ },
+ {
+ key: "products",
+ label: "成片库",
+ path: "/products",
+ icon:
,
+ },
+ {
+ key: "templates",
+ label: "模板库",
+ path: "/templates",
+ icon:
,
+ },
+ ],
+ },
+ {
+ title: "系统",
+ items: [
+ {
+ key: "history",
+ label: "任务历史",
+ path: "/history",
+ icon:
,
+ },
+ {
+ key: "admin",
+ label: "控制台",
+ path: "/admin",
+ icon:
,
+ },
+ {
+ key: "subscription",
+ label: "订阅管理",
+ path: "/subscription",
+ icon:
,
+ },
+ ],
+ },
+];
diff --git a/apps/web/src/pages/editing-planner/EditingPlanner.css b/apps/web/src/pages/editing-planner/EditingPlanner.css
index 4caffd290..f1487f681 100644
--- a/apps/web/src/pages/editing-planner/EditingPlanner.css
+++ b/apps/web/src/pages/editing-planner/EditingPlanner.css
@@ -651,3 +651,40 @@
justify-content: center;
}
}
+
+@media (max-width: 768px) {
+ .ep-left,
+ .ep-right {
+ max-height: 180px;
+ }
+
+ .ep-preview-frame {
+ width: 120px;
+ height: 213px;
+ }
+
+ .ep-timeline {
+ padding: var(--space-sm) var(--space-md);
+ }
+}
+
+@media (max-width: 480px) {
+ .ep-toolbar {
+ padding: var(--space-sm) var(--space-md);
+ }
+
+ .ep-mode-btn {
+ padding: 4px 12px;
+ font-size: var(--font-size-xs);
+ }
+
+ .ep-preview-frame {
+ width: 100px;
+ height: 178px;
+ }
+
+ .ep-segment-card {
+ padding: 8px 10px;
+ gap: var(--space-sm);
+ }
+}
diff --git a/apps/web/src/pages/generate/GeneratePage.tsx b/apps/web/src/pages/generate/GeneratePage.tsx
index 15c257568..99e503ff7 100644
--- a/apps/web/src/pages/generate/GeneratePage.tsx
+++ b/apps/web/src/pages/generate/GeneratePage.tsx
@@ -934,7 +934,7 @@ const GeneratePage: React.FC = () => {
-
+
预览视频
diff --git a/apps/web/src/pages/history/history.css b/apps/web/src/pages/history/history.css
index 9ce91f19a..f0024f625 100644
--- a/apps/web/src/pages/history/history.css
+++ b/apps/web/src/pages/history/history.css
@@ -207,7 +207,7 @@
.xx-history-page-btn.active {
background: var(--gradient-primary);
border-color: transparent;
- color: #fff;
+ color: var(--text-inverse);
font-weight: 600;
}
@@ -256,6 +256,21 @@
/* ============================================================
响应式
============================================================ */
+@media (max-width: 1024px) {
+ .xx-history-page {
+ padding: var(--space-lg);
+ }
+
+ .xx-history-task-item {
+ grid-template-columns: 1fr auto auto;
+ gap: 12px;
+ }
+
+ .xx-history-task-time {
+ min-width: 80px;
+ }
+}
+
@media (max-width: 768px) {
.xx-history-page {
padding: var(--space-md);
@@ -274,3 +289,47 @@
text-align: left;
}
}
+
+@media (max-width: 480px) {
+ .xx-history-page {
+ padding: var(--space-sm);
+ }
+
+ .xx-history-header h2 {
+ font-size: var(--font-size-lg);
+ }
+
+ .xx-history-tabs {
+ gap: 4px;
+ padding-bottom: 8px;
+ overflow-x: auto;
+ flex-wrap: nowrap;
+ -webkit-overflow-scrolling: touch;
+ }
+
+ .xx-history-tab {
+ padding: 6px 14px;
+ font-size: var(--font-size-xs);
+ flex-shrink: 0;
+ }
+
+ .xx-history-task-item {
+ padding: 12px;
+ gap: 8px;
+ }
+
+ .xx-history-task-info h4 {
+ font-size: 13px;
+ }
+
+ .xx-history-status {
+ font-size: 11px;
+ padding: 2px 10px;
+ }
+
+ .xx-history-page-btn {
+ min-width: 32px;
+ height: 32px;
+ font-size: 12px;
+ }
+}