diff --git a/apps/web/src/pages/editing-planner/EditingPlanner.css b/apps/web/src/pages/editing-planner/EditingPlanner.css index 08f81184a..9042b4ae4 100644 --- a/apps/web/src/pages/editing-planner/EditingPlanner.css +++ b/apps/web/src/pages/editing-planner/EditingPlanner.css @@ -1011,6 +1011,50 @@ box-shadow: 0 2px 8px rgba(99, 102, 241, 0.3); } +/* 轨道末尾 "+" 添加卡片 — 对齐 V21 原型虚线 "+" 卡 */ +.ep-track-add-card-wrapper { + position: relative; + flex-shrink: 0; +} + +.ep-track-add-card { + min-width: 60px; + height: 96px; + border: 2px dashed var(--line, #e2e8f0); + border-radius: 12px; + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; + font-size: 24px; + color: #94a3b8; + transition: all 0.2s ease; + user-select: none; +} + +.ep-track-add-card:hover { + border-color: var(--primary, #6366f1); + color: var(--primary, #6366f1); + background: var(--primary-soft, #eef2ff); +} + +.ep-track-add-card.locked { + cursor: not-allowed; + opacity: 0.5; + font-size: 18px; +} + +.ep-track-add-card.locked:hover { + border-color: var(--line, #e2e8f0); + color: #94a3b8; + background: none; +} + +.ep-track-add-card-wrapper > .ep-add-clip-picker { + top: calc(100% + 6px); + right: 0; +} + /* 添加片段按钮 + 选择器 */ .ep-add-clip-wrapper { position: relative; diff --git a/apps/web/src/pages/editing-planner/components/TimelinePanel.tsx b/apps/web/src/pages/editing-planner/components/TimelinePanel.tsx index 4236150e5..d440f82e3 100755 --- a/apps/web/src/pages/editing-planner/components/TimelinePanel.tsx +++ b/apps/web/src/pages/editing-planner/components/TimelinePanel.tsx @@ -35,7 +35,6 @@ const ASSET_TYPE_ICONS: Record = { video: "🎬", image: "🖼️", audio: "🎵", - voiceover: "🎙️", }; const MATERIAL_ICONS: Record = { @@ -168,46 +167,6 @@ const TimelinePanel: React.FC = ({
- {/* 添加片段按钮 */} -
- - {showAddPicker && ( -
-
选择素材添加为片段
- {mediaAssets.length === 0 ? ( -
- 暂无可用素材,请先在左侧素材面板上传 -
- ) : ( -
- {mediaAssets.map((asset) => ( - - ))} -
- )} -
- )} -
+
点击右侧 + 添加片段,或拖入素材
) : ( clips.map((clip, idx) => ( @@ -311,6 +262,53 @@ const TimelinePanel: React.FC = ({ )) )} + + {/* ── 轨道末尾 "+" 添加卡片(对齐 V21 原型 epAddSegment) ── */} +
+
{ + if (currentMode !== "one_take") setShowAddPicker((v) => !v); + }} + title={currentMode === "one_take" ? "一镜到底模式下不可添加" : "添加片段"} + > + {currentMode === "one_take" ? "🔒" : "+"} +
+ + {/* 素材选择面板 */} + {showAddPicker && ( +
+
选择素材添加为片段
+ {mediaAssets.length === 0 ? ( +
+ 暂无可用素材,请先在左侧素材库导入 +
+ ) : ( +
+ {mediaAssets.map((asset) => ( + + ))} +
+ )} +
+ )} +
);