LumenX · DialogueWorkbench

配音工作台 · DialogueWorkbenchModal

三步流程:① 对白文本 → ② 情绪与生成(TTS) → ③ 覆盖到视频(dub)。源组件 storyboard-r2v/DialogueAudioRow.tsx(含触发行 + 模态两个导出)。下图展示「Step 3 预览版」态。

触发行 DialogueAudioRow

点击触发行打开右侧模态。徽章随状态变化:
就绪 音频已生成 · 已覆盖 · 预览中 · 失败

⚠ 与现状的差异 & 交互风险(落地前必读)

本补稿严格还原 DialogueWorkbenchModal,仅做主题化换肤。重点提示文案硬编码与三态显隐逻辑。

维度现状(真实组件)本补稿处理风险
三步结构① 对白文本 ② 情绪与生成 ③ 覆盖到视频;副标题硬编码「编辑对白 → 生成语音 → 覆盖到视频」1:1 还原三段 + 副标题原文一致
视频源三态显示优先级 previewVideoUrl > dubbedVideoUrl > videoUrl;浮标「预览版/配音版」随之变展示「预览版」态(amber 浮标 + 预听/应用覆盖);表下方列出另两态按钮组合
Step 3 显隐仅当 canDub(audio+video+taskId+onPreviewDub 全有)才渲染;否则整段隐藏默认展示完整 Step 3;落地须保留 canDub 门控,缺一即隐藏需确认
offset 标记「标记起始点」读取 video.currentTime;±50ms 步进 + 数字框 + range,clamp [0, 时长]完整还原标记/步进/滑块;演示值 1200ms一致
音色绑定警告无 voiceId 时 Step1 出 amber「需先在「角色」中绑定音色」,生成按钮禁用本图为已绑定态(无警告);落地须保留未绑定分支需确认
TTS 预听用独立 new Audio(),非视频元素;instructions = 「情绪chip; 自由文本」试听TTS 按钮还原;逻辑说明见此
i18n 混杂标题/「已覆盖」「预览中」「试听TTS」等多处硬编码中文,与 i18n 键混用补稿内联原文仅为视觉保真;落地 MUST 抽取为 i18n 键(next-intl)并补 CN/EN,硬编码中文属待修复缺陷落地须 i18n 化
按钮组合idle=仅预听;preview=预听+应用覆盖+hint;applied=预听+撤销覆盖展示 preview 组合;其余两组在落地按 state 切换
布局变化结构、层级、控件顺序 1:1,仅颜色 token 化。无布局重构一致