OmniAI/omniai-ds-code-package
3
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

fix: align hot video preview header

Browse Source
This commit is contained in:
Codex
2026-06-11 23:56:27 +08:00
parent 13a7c3ba5a
commit 9ff3a6880b
2 changed files with 67 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/features/ecommerce/EcommerceVideoWorkspace.tsx
+10 -12
View File
@@ -622,7 +622,6 @@ export default function EcommerceVideoWorkspace({
const imagedScenes = scenes.filter((s) => s.imageUrl);
const primaryVideo = completedScenes[0]?.resultUrl;
const sourceImage = sourceImageUrls[0] || planResult?.imageUrls[0] || productImageDataUrls[0] || "";
const flowHasStarted = stage !== "idle" || completedSteps.length > 0;
const flowMeta = `${platform} / ${aspectRatio} / ${durationSeconds}s / ${resolution}`;
const hasImaging = stage === "imaging" || stage === "imaged" || stage === "rendering" || stage === "completed" || stage === "partial_failed";
const hasRendering = stage === "rendering" || stage === "completed" || stage === "partial_failed";
@@ -630,11 +629,16 @@ export default function EcommerceVideoWorkspace({
return (
<div className="ecom-video-workspace" data-stage={stage}>
{/* ── Flow bar ──────────────────────────────────── */}
<header className="ecom-video-flowbar">
<div className="ecom-video-flowbar__title" aria-label={`短视频分镜流，${flowMeta}`} title={flowMeta}>
<span className={`ecom-video-flowbar__pulse${flowHasStarted ? " is-active" : ""}`} aria-hidden="true" />
<span className="ecom-video-flowbar__wave" aria-hidden="true"><i /><i /><i /></span>
{/* ── Preview header ─────────────────────────────── */}
<header className="ecom-video-flowbar ecom-video-preview-head" title={flowMeta}>
<div className="ecom-video-preview-copy">
<h1>预览</h1>
<p>上传商品图，AI 即刻生成 <span>符合多电商平台规范</span> 的高转化率短视频素材。</p>
<div className="ecom-video-flowbar__zoom">
<button type="button" onClick={() => setFlowZoom((z) => Math.max(0.25, z - 0.1))} disabled={flowZoom <= 0.25} aria-label="缩小">−</button>
<span>{Math.round(flowZoom * 100)}%</span>
<button type="button" onClick={() => setFlowZoom((z) => Math.min(2, z + 0.1))} disabled={flowZoom >= 2} aria-label="放大">+</button>
</div>
</div>
<div className="ecom-video-step-dots" aria-label="策划进度">
@@ -645,12 +649,6 @@ export default function EcommerceVideoWorkspace({
})}
</div>
<div className="ecom-video-flowbar__zoom">
<button type="button" onClick={() => setFlowZoom((z) => Math.max(0.25, z - 0.1))} disabled={flowZoom <= 0.25} aria-label="缩小">−</button>
<span>{Math.round(flowZoom * 100)}%</span>
<button type="button" onClick={() => setFlowZoom((z) => Math.min(2, z + 0.1))} disabled={flowZoom >= 2} aria-label="放大">+</button>
</div>
<div className="ecom-video-flowbar__actions">
{onOpenHistory ? (
<button type="button" className="ecom-video-flow-action ecom-video-flow-action--ghost" onClick={onOpenHistory} title="生成记录">