From f82c93db848a77cfc84fc7ecadf459ea16995b35 Mon Sep 17 00:00:00 2001
From: xiaoxia <xiaoxia@xiaoxiajianji.com>
Date: Fri, 28 Aug 2026 22:58:57 +0800
Subject: [PATCH] =?UTF-8?q?feat(generate):=20=E8=B0=83=E6=8D=A2=E7=A1=AE?=
 =?UTF-8?q?=E8=AE=A4=E7=94=9F=E6=88=90=E4=B8=8E=E9=80=89=E6=8B=A9=E5=B0=81?=
 =?UTF-8?q?=E9=9D=A2=E9=A1=BA=E5=BA=8F=EF=BC=8C=E5=B0=81=E9=9D=A2=E4=BB=8E?=
 =?UTF-8?q?=E6=9C=80=E7=BB=88=E6=88=90=E7=89=87=E9=80=89=E5=B8=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 步骤顺序调整为：模板→素材→配音→标题→确认生成→选择封面
- 确认生成完成后点"下一步"进入选择封面（不自动跳转）
- 封面源从预览片段改为确认生成任务产出的最终视频
  - generateCover API 传 generated_video_id + video_url
  - 移除 createPreview 预览创建兜底逻辑（不再需要预览视频）
  - MediaKit 选帧算法/降级逻辑由后端保持不变
- 步骤5(确认生成)右侧内联播放最终视频，含下载/分享/成片库入口
- 步骤6(选择封面)展示最终成片名称提示，自动生成封面按钮无视频时禁用
- 步骤导航增加 generated 校验：未生成视频不能进入封面步骤
- 步骤4右侧仍为 FrontendPreviewPlayer 实时预览
---
 apps/web/src/api/generation/cover.ts          |  11 +-
 apps/web/src/pages/generate/GeneratePage.tsx  |  51 +++--
 .../components/GenerateStepContent.tsx        |  50 ++--
 .../components/Step6CoverSettings.tsx         |  59 +++--
 apps/web/src/pages/generate/constants.ts      |   4 +-
 .../src/pages/generate/hooks/useStep6Cover.ts | 215 ++----------------
 .../pages/generate/hooks/useStepNavigation.ts |  15 +-
 7 files changed, 110 insertions(+), 295 deletions(-)

diff --git a/apps/web/src/api/generation/cover.ts b/apps/web/src/api/generation/cover.ts
index 3a230220d..8bf308d1e 100644
--- a/apps/web/src/api/generation/cover.ts
+++ b/apps/web/src/api/generation/cover.ts
@@ -12,7 +12,14 @@ export interface GenerateCoverTitleConfig {
 }
 
 export interface GenerateCoverRequest {
-  asset_ids: string[]
+  /**
+   * 封面源视频标识（二选一）：
+   * - generated_video_id：确认生成任务产出的最终视频 ID
+   * - video_url：最终视频 URL（兜底）
+   * 后端根据此标识定位最终成片文件并抽帧，MediaKit 选帧逻辑不变
+   */
+  generated_video_id?: string
+  video_url?: string
   cover_type?: "ai_frame" | "manual" | "upload" | "ai_regenerate"
   frame_time?: number
   /** 标题样式，用于在封面上叠加标题文字 */
@@ -31,7 +38,7 @@ export interface GenerateCoverResponse {
   }
 }
 
-/** AI 生成封面 — 从预览视频中抽帧 */
+/** AI 生成封面 — 从最终成片中抽帧（MediaKit 选帧） */
 export async function generateCover(
   templateId: string,
   data: GenerateCoverRequest,
diff --git a/apps/web/src/pages/generate/GeneratePage.tsx b/apps/web/src/pages/generate/GeneratePage.tsx
index f27a2a8fd..8d47b17e5 100644
--- a/apps/web/src/pages/generate/GeneratePage.tsx
+++ b/apps/web/src/pages/generate/GeneratePage.tsx
@@ -1,11 +1,11 @@
 /**
  * 智能剪辑页面 — 前端实时预览架构
- * 6 步向导：选择模板 → 素材 → 配音 → 标题(含预览) → 封面 → 确认生成
- * 左右布局：左侧 generate-form + 右侧 generate-preview
+ * 6 步向导：选择模板 → 素材 → 配音 → 标题(含预览) → 确认生成 → 选择封面
  *
  * 架构：
- * - 步骤 4-5 右侧显示 FrontendPreviewPlayer 实时预览
- * - 步骤 6 右侧内联播放生成的最终视频
+ * - 步骤 4 右侧显示 FrontendPreviewPlayer 实时预览
+ * - 步骤 5 右侧内联播放生成中的/最终视频
+ * - 步骤 6 封面从最终成片中智能选帧（MediaKit）
  * - 点"确认生成"时调用 createGenerationTask 创建一次服务器渲染任务
  */
 import React, { useMemo, useState, useEffect, useRef } from "react"
@@ -181,18 +181,6 @@ const GeneratePage: React.FC = () => {
     return estimateTotalVideoDuration(currentTemplate ?? undefined)
   }, [previewAssets, currentTemplate])
 
-  /* ── 步骤导航 ── */
-  const { goNext, goPrev } = useStepNavigation({
-    currentStep,
-    setCurrentStep,
-    selectedTemplate,
-    materialMode,
-    selectedMaterials,
-    smartSelectedIds,
-    titleSettings,
-    previewReady,
-  })
-
   /* ── 视频生成核心逻辑 ── */
   const {
     generating,
@@ -229,6 +217,22 @@ const GeneratePage: React.FC = () => {
     },
   })
 
+  /* ── 步骤导航 ── */
+  const { goNext, goPrev } = useStepNavigation({
+    currentStep,
+    setCurrentStep,
+    selectedTemplate,
+    materialMode,
+    selectedMaterials,
+    smartSelectedIds,
+    titleSettings,
+    previewReady,
+    generated,
+  })
+
+  /* ── 最终成片（步骤5/6 右侧播放） ── */
+  const finalVideo = generatedVideos[0]
+
   /* ================================================================
      渲染
      ================================================================ */
@@ -265,13 +269,10 @@ const GeneratePage: React.FC = () => {
             onApplyPreset={styleUpdaters.applyPreset}
             activePreset={styleUpdaters.activePreset}
             titlePresets={styleUpdaters.titlePresets}
-            onPreviewTaskCreated={setPreviewTaskId}
-            onSourceEditPlanIdExtracted={setStoredSourceEditPlanId}
             bgm={bgm}
             bgmConfig={bgmConfig}
             coverSettings={coverSettings}
             onCoverSettingsChange={setCoverSettings}
-            duration={duration}
             selectedVoice={selectedVoice}
             onSelectedVoiceChange={setSelectedVoice}
             totalVideoDuration={totalVideoDuration}
@@ -306,9 +307,9 @@ const GeneratePage: React.FC = () => {
           />
         </div>
 
-        {/* ════ 右侧：步骤 4-5 实时预览，步骤 6 最终视频 ════ */}
+        {/* ════ 右侧：步骤4实时预览，步骤5/6最终视频 ════ */}
         <div className="xx-generate-right-col">
-          {currentStep >= 4 && currentStep <= 5 && !!currentTemplate && (
+          {currentStep === 4 && !!currentTemplate && (
             <FrontendPreviewPlayer
               assets={previewAssets}
               template={currentTemplate}
@@ -329,14 +330,14 @@ const GeneratePage: React.FC = () => {
               }}
             />
           )}
-          {currentStep === 6 && generated && generatedVideos.length > 0 && (
+          {currentStep >= 5 && generated && finalVideo && (
             <div className="xx-inline-video-player">
               <video
-                src={generatedVideos[0].download_url || generatedVideos[0].file_url}
+                src={finalVideo.download_url || finalVideo.file_url}
                 controls
-                autoPlay
+                autoPlay={currentStep === 5}
                 style={{ width: "100%", maxHeight: "70vh", objectFit: "contain", borderRadius: 12 }}
-                poster={generatedVideos[0].thumbnail_url || undefined}
+                poster={finalVideo.thumbnail_url || undefined}
               />
               <div style={{ display: "flex", gap: 8, marginTop: 12, justifyContent: "center" }}>
                 <button className="xx-btn xx-btn-ghost xx-btn-sm" onClick={handleDownload}>
diff --git a/apps/web/src/pages/generate/components/GenerateStepContent.tsx b/apps/web/src/pages/generate/components/GenerateStepContent.tsx
index d49af050b..b4799ee33 100644
--- a/apps/web/src/pages/generate/components/GenerateStepContent.tsx
+++ b/apps/web/src/pages/generate/components/GenerateStepContent.tsx
@@ -1,9 +1,6 @@
 /**
  * GeneratePage 步骤内容渲染
- * 根据当前步骤渲染对应的 Step 组件
- * 步骤顺序（6步）：模板(1) → 素材(2) → 配音(3) → 标题(4) → 封面(5) → 确认(6)
- *
- * 原 Step4(标题) + Step5(预览样式) 已合并为 Step4
+ * 步骤顺序（6步）：模板(1) → 素材(2) → 配音(3) → 标题(4) → 确认生成(5) → 封面(6)
  */
 import React from "react"
 import type { EditingTemplate } from "@/api/editing-planner"
@@ -16,8 +13,8 @@ import Step1TemplateSelect from "../components/Step1TemplateSelect"
 import Step2MaterialSelect from "../components/Step2MaterialSelect"
 import Step3VoiceSelect from "../components/Step5VoiceSelect"
 import Step4TitleSettings from "../components/Step4TitleSettings"
-import Step5CoverSettings from "../components/Step6CoverSettings"
-import Step6ConfirmGenerate from "../components/Step7ConfirmGenerate"
+import Step5ConfirmGenerate from "../components/Step7ConfirmGenerate"
+import Step6CoverSettings from "../components/Step6CoverSettings"
 import type { GeneratedVideo } from "@/api/template-editor"
 
 export interface GenerateStepContentProps {
@@ -36,7 +33,6 @@ export interface GenerateStepContentProps {
   /* 标题 */
   titleSettings: TitleSettings
   onTitleSettingsChange: (settings: TitleSettings) => void
-  /* 标题样式回调 — Step4 合并后直接使用 */
   onUpdatePosition: (position: string) => void
   onUpdateFont: (font: string) => void
   onUpdateSize: (size: number) => void
@@ -50,7 +46,6 @@ export interface GenerateStepContentProps {
   /* 封面 */
   coverSettings: CoverConfig
   onCoverSettingsChange: (settings: CoverConfig) => void
-  duration: number
   /* 配音 */
   selectedVoice: string
   onSelectedVoiceChange: (id: string) => void
@@ -75,10 +70,6 @@ export interface GenerateStepContentProps {
   onDismissError: () => void
   /* 其他 */
   presetVoices: PresetVoiceItem[]
-  /** 预览任务创建回调——传递给封面步骤 */
-  onPreviewTaskCreated?: (taskId: string) => void
-  /** 从预览响应中提取到 source_edit_plan_id 时的回调 */
-  onSourceEditPlanIdExtracted?: (planId: string) => void
   /** BGM 开关 */
   bgm: boolean
   /** BGM 配置（来自模板） */
@@ -111,7 +102,6 @@ export const GenerateStepContent: React.FC<GenerateStepContentProps> = (props) =
     titlePresets,
     coverSettings,
     onCoverSettingsChange,
-    duration,
     selectedVoice,
     onSelectedVoiceChange,
     totalVideoDuration,
@@ -127,10 +117,6 @@ export const GenerateStepContent: React.FC<GenerateStepContentProps> = (props) =
     onRetry,
     onDismissError,
     presetVoices,
-    onPreviewTaskCreated,
-    onSourceEditPlanIdExtracted,
-    bgm,
-    bgmConfig,
   } = props
 
   /* 当前模板的 segments，传给 Step2 构建 clips */
@@ -188,25 +174,7 @@ export const GenerateStepContent: React.FC<GenerateStepContentProps> = (props) =
       )
     case 5:
       return (
-        <Step5CoverSettings
-          coverSettings={coverSettings}
-          onCoverSettingsChange={onCoverSettingsChange}
-          duration={duration}
-          assetIds={materialMode === "auto" ? smartSelectedIds : selectedMaterials}
-          selectedTemplate={selectedTemplate}
-          titleSettings={titleSettings}
-          onPreviewTaskCreated={onPreviewTaskCreated}
-          onSourceEditPlanIdExtracted={onSourceEditPlanIdExtracted}
-          voiceMode={voiceMode}
-          selectedVoice={selectedVoice}
-          selectedClonedVoice={selectedClonedVoice}
-          bgm={bgm}
-          bgmConfig={bgmConfig}
-        />
-      )
-    case 6:
-      return (
-        <Step6ConfirmGenerate
+        <Step5ConfirmGenerate
           templates={userTemplates}
           selectedTemplate={selectedTemplate}
           materialMode={materialMode}
@@ -228,6 +196,16 @@ export const GenerateStepContent: React.FC<GenerateStepContentProps> = (props) =
           onDismissError={onDismissError}
         />
       )
+    case 6:
+      return (
+        <Step6CoverSettings
+          coverSettings={coverSettings}
+          onCoverSettingsChange={onCoverSettingsChange}
+          selectedTemplate={selectedTemplate}
+          titleSettings={titleSettings}
+          generatedVideos={generatedVideos}
+        />
+      )
     default:
       return null
   }
diff --git a/apps/web/src/pages/generate/components/Step6CoverSettings.tsx b/apps/web/src/pages/generate/components/Step6CoverSettings.tsx
index 1fc6f0572..d394a5f9a 100755
--- a/apps/web/src/pages/generate/components/Step6CoverSettings.tsx
+++ b/apps/web/src/pages/generate/components/Step6CoverSettings.tsx
@@ -1,6 +1,8 @@
 import React from "react"
 import { Modal, Spin } from "antd"
 import type { CoverConfig } from "../types/cover"
+import type { GeneratedVideo } from "@/api/template-editor"
+import type { TitleSettings } from "../types"
 import { useStep6Cover } from "../hooks/useStep6Cover"
 import Button from "@/components/ui/Button"
 import CoverSettingsModal from "./cover-settings/CoverSettingsModal"
@@ -9,27 +11,12 @@ import CoverEditorModal from "./cover-settings/CoverEditorModal"
 interface Step6CoverSettingsProps {
   coverSettings: CoverConfig
   onCoverSettingsChange: (settings: CoverConfig) => void
-  duration: number
-  /** 当前素材 ID 列表，用于智能封面生成 */
-  assetIds?: string[]
   /** 当前选中的模板 ID */
   selectedTemplate?: string
-  /** Step4 标题设置，用于预览视频烧录标题 & 封面叠加标题 */
-  titleSettings?: import("../types").TitleSettings
-  /** 预览任务创建回调——将 task_id 暴露给父组件供 confirmGeneration 复用 */
-  onPreviewTaskCreated?: (taskId: string) => void
-  /** 从预览响应中提取到 source_edit_plan_id 时的回调 */
-  onSourceEditPlanIdExtracted?: (planId: string) => void
-  /** 配音模式 */
-  voiceMode?: "preset" | "custom" | "clone"
-  /** 选中的配音素材 ID */
-  selectedVoice?: string
-  /** 选中的克隆音色 ID */
-  selectedClonedVoice?: string
-  /** BGM 开关 */
-  bgm?: boolean
-  /** BGM 配置 */
-  bgmConfig?: { enabled: boolean; music_id?: string }
+  /** Step4 标题设置，用于封面叠加标题 */
+  titleSettings?: TitleSettings
+  /** 确认生成步骤产出的最终视频列表 */
+  generatedVideos: GeneratedVideo[]
 }
 
 const Step6CoverSettings: React.FC<Step6CoverSettingsProps> = (props) => {
@@ -37,6 +24,7 @@ const Step6CoverSettings: React.FC<Step6CoverSettingsProps> = (props) => {
     coverSettings,
     generating,
     generateAutoCover,
+    finalVideo,
     showCoverSettings,
     setShowCoverSettings,
     showCoverEditor,
@@ -53,17 +41,9 @@ const Step6CoverSettings: React.FC<Step6CoverSettingsProps> = (props) => {
   } = useStep6Cover({
     coverSettings: props.coverSettings,
     onCoverSettingsChange: props.onCoverSettingsChange,
-    duration: props.duration,
-    assetIds: props.assetIds,
     selectedTemplate: props.selectedTemplate,
     titleSettings: props.titleSettings,
-    onPreviewTaskCreated: props.onPreviewTaskCreated,
-    onSourceEditPlanIdExtracted: props.onSourceEditPlanIdExtracted,
-    voiceMode: props.voiceMode,
-    selectedVoice: props.selectedVoice,
-    selectedClonedVoice: props.selectedClonedVoice,
-    bgm: props.bgm,
-    bgmConfig: props.bgmConfig,
+    generatedVideos: props.generatedVideos,
   })
 
   const handleAutoGenerate = () => {
@@ -77,8 +57,25 @@ const Step6CoverSettings: React.FC<Step6CoverSettingsProps> = (props) => {
     <div className="xx-form-section">
       <h3>🖼️ 选择封面</h3>
 
+      {/* 最终成片信息 */}
+      {finalVideo && (
+        <div
+          style={{
+            padding: "10px 14px",
+            background: "rgba(16, 185, 129, 0.08)",
+            borderRadius: 8,
+            marginBottom: 16,
+            border: "1px solid rgba(16, 185, 129, 0.15)",
+            fontSize: 13,
+            color: "var(--text-secondary, #666)",
+          }}
+        >
+          🎬 封面将从最终成片「{finalVideo.name}」中智能选帧
+        </div>
+      )}
+
       <div className="xx-cover-actions">
-        <Button buttonType="primary" onClick={handleAutoGenerate}>
+        <Button buttonType="primary" onClick={handleAutoGenerate} disabled={!finalVideo}>
           ✨ 自动生成封面
         </Button>
         <Button buttonType="ghost" onClick={() => setShowCoverSettings(true)}>
@@ -126,7 +123,9 @@ const Step6CoverSettings: React.FC<Step6CoverSettingsProps> = (props) => {
       <Modal open={generating} closable={false} footer={null} centered>
         <div style={{ textAlign: "center", padding: "24px 0" }}>
           <Spin size="large" />
-          <p style={{ marginTop: 16, fontSize: 14, color: "#666" }}>AI 正在生成封面，请稍候...</p>
+          <p style={{ marginTop: 16, fontSize: 14, color: "#666" }}>
+            AI 正在从最终成片选帧，请稍候...
+          </p>
         </div>
       </Modal>
     </div>
diff --git a/apps/web/src/pages/generate/constants.ts b/apps/web/src/pages/generate/constants.ts
index c6a9bf764..e13061fdd 100644
--- a/apps/web/src/pages/generate/constants.ts
+++ b/apps/web/src/pages/generate/constants.ts
@@ -33,8 +33,8 @@ export const STEPS = [
   { key: 2, label: "选择素材" },
   { key: 3, label: "选择配音" },
   { key: 4, label: "选择标题" },
-  { key: 5, label: "选择封面" },
-  { key: 6, label: "确认生成" },
+  { key: 5, label: "确认生成" },
+  { key: 6, label: "选择封面" },
 ]
 
 /* ── 标题位置选项 ── */
diff --git a/apps/web/src/pages/generate/hooks/useStep6Cover.ts b/apps/web/src/pages/generate/hooks/useStep6Cover.ts
index 79fba4fc9..cf3bda235 100644
--- a/apps/web/src/pages/generate/hooks/useStep6Cover.ts
+++ b/apps/web/src/pages/generate/hooks/useStep6Cover.ts
@@ -1,13 +1,13 @@
 /**
  * Step 6 封面设置 Hook
- * 封装封面设置的交互逻辑，对接后端封面模板 CRUD API
+ * 封面候选帧从确认生成的最终视频中获取（MediaKit 选帧）
+ * 不再从预览片段创建预览视频
  */
-import { useCallback, useEffect, useRef, useState } from "react"
+import { useCallback, useEffect, useState } from "react"
 import { message } from "antd"
 import type { CoverConfig, CoverTemplate } from "../types/cover"
 import { generateCover } from "@/api/generation"
-import { createPreview, getPreviewStatus } from "@/api/generation/preview"
-import { updateEditPlan } from "@/api/template-editor"
+import type { GeneratedVideo } from "@/api/template-editor"
 import type { TitleSettings } from "../types"
 import {
   fetchCoverTemplates,
@@ -19,47 +19,22 @@ import {
 interface UseStep6CoverProps {
   coverSettings: CoverConfig
   onCoverSettingsChange: (settings: CoverConfig) => void
-  duration: number
-  /** 当前素材 ID 列表，用于智能封面生成 */
-  assetIds?: string[]
   /** 当前选中的模板 ID */
   selectedTemplate?: string
-  /** Step4 标题设置，用于预览视频烧录标题 & 封面叠加标题 */
+  /** Step4 标题设置，用于封面叠加标题 */
   titleSettings?: TitleSettings
-  /** 预览任务创建回调——将 task_id 暴露给父组件供 confirmGeneration 复用 */
-  onPreviewTaskCreated?: (taskId: string) => void
-  /** 从预览响应中提取到 source_edit_plan_id 时的回调 */
-  onSourceEditPlanIdExtracted?: (planId: string) => void
-  /** 配音模式 */
-  voiceMode?: "preset" | "custom" | "clone"
-  /** 选中的配音素材 ID（配音素材库 asset ID） */
-  selectedVoice?: string
-  /** 选中的克隆音色 ID */
-  selectedClonedVoice?: string
-  /** BGM 开关 */
-  bgm?: boolean
-  /** BGM 配置（来自模板） */
-  bgmConfig?: { enabled: boolean; music_id?: string }
+  /** 确认生成步骤产出的最终视频列表 */
+  generatedVideos: GeneratedVideo[]
 }
 
 export function useStep6Cover({
   coverSettings,
   onCoverSettingsChange,
-  duration,
-  assetIds = [],
   selectedTemplate = "",
   titleSettings,
-  onPreviewTaskCreated,
-  onSourceEditPlanIdExtracted,
-  voiceMode,
-  selectedVoice,
-  selectedClonedVoice,
-  bgm,
-  bgmConfig,
+  generatedVideos,
 }: UseStep6CoverProps) {
   const [generating, setGenerating] = useState(false)
-  // 防竞态：记录当前预览生成的参数指纹，任务完成时校验一致性
-  const previewParamsRef = useRef<string>("")
 
   // ── 封面设置弹窗状态 ──
   const [showCoverSettings, setShowCoverSettings] = useState(false)
@@ -72,6 +47,9 @@ export function useStep6Cover({
   const [templatesLoading, setTemplatesLoading] = useState(false)
   const [templatesError, setTemplatesError] = useState<string | null>(null)
 
+  /** 最终成片：取第一个已完成视频 */
+  const finalVideo = generatedVideos.find((v) => v.status === "completed") || generatedVideos[0]
+
   /** 从后端加载封面模板列表 */
   const loadTemplates = useCallback(async () => {
     setTemplatesLoading(true)
@@ -94,7 +72,7 @@ export function useStep6Cover({
     }
   }, [showCoverSettings, loadTemplates])
 
-  /** 调用后端智能封面 API，生成封面并更新预览 */
+  /** 调用后端智能封面 API，从最终成片中抽帧 */
   const generateAutoCover = useCallback(async () => {
     if (generating) {
       message.warning("封面正在生成中，请稍候...")
@@ -106,19 +84,20 @@ export function useStep6Cover({
       return
     }
 
-    if (assetIds.length === 0) {
-      message.error("请先选择素材")
+    if (!finalVideo) {
+      message.error("请先生成视频再选择封面")
       return
     }
 
     setGenerating(true)
-    // 超时保护：300 秒后强制重置，防止 state 卡死导致按钮永久失效
     const timeoutId = setTimeout(() => {
       setGenerating(false)
     }, 300000)
+
     try {
       const response = await generateCover(selectedTemplate, {
-        asset_ids: assetIds,
+        generated_video_id: finalVideo.id,
+        video_url: finalVideo.file_url || finalVideo.download_url || "",
         cover_type: "ai_frame",
         ...(titleSettings?.title
           ? {
@@ -151,151 +130,9 @@ export function useStep6Cover({
       clearTimeout(timeoutId)
       console.error("[Step6] 智能封面生成失败:", err)
 
-      // 提取详细错误信息
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
       const anyErr = err as any
-      const statusCode = anyErr?.response?.status
-
-      // 400 错误：精确判断是否为"预览缺失"，避免误判其他 400 错误
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const errCode = anyErr?.response?.data?.code as string | undefined
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      const errMsg = (anyErr?.response?.data?.message ||
-        anyErr?.response?.data?.detail ||
-        "") as string
-      const isPreviewMissing =
-        statusCode === 400 &&
-        (errCode?.includes("PREVIEW") ||
-          /预览.*(?:缺失|不存在|未找到)|(?:missing|not found|does not exist).*preview/i.test(
-            errMsg,
-          ))
-
-      if (isPreviewMissing) {
-        console.log("[Step6] 检测到预览缺失，尝试自动创建预览渲染任务...")
-        message.info("正在准备预览视频，请稍候...")
-        try {
-          // 记录当前参数指纹，用于任务完成时校验一致性（防竞态）
-          previewParamsRef.current = JSON.stringify({ selectedTemplate, assetIds, titleSettings })
-          // 解析配音参数：voiceMode=clone 时用 selectedClonedVoice，否则用 selectedVoice
-          const previewVoiceLibraryId =
-            voiceMode === "clone" ? selectedClonedVoice || selectedVoice || "" : selectedVoice || ""
-          const previewResp = await createPreview({
-            template_id: selectedTemplate,
-            asset_ids: assetIds,
-            duration: duration || 30,
-            // 配音：始终传递 voice_library_id，确保后端能正确接收
-            voice_library_id: previewVoiceLibraryId,
-            // 兜底：如果 voice_library_id 为空但 selectedVoice 有值，也传 voice_ids
-            ...(selectedVoice && !previewVoiceLibraryId ? { voice_ids: [selectedVoice] } : {}),
-            // BGM 配置：受 bgm 开关控制
-            bgm_config: {
-              enabled: bgm !== false,
-              ...(bgmConfig?.music_id ? { preset_id: bgmConfig.music_id } : {}),
-            },
-            ...(titleSettings?.title
-              ? {
-                  title_config: {
-                    text: titleSettings.title,
-                    font: titleSettings.font,
-                    font_size: titleSettings.size,
-                    font_color: titleSettings.color,
-                    position: titleSettings.position,
-                    bold: titleSettings.bold,
-                    stroke: titleSettings.stroke,
-                    shadow: titleSettings.shadow,
-                  },
-                }
-              : {}),
-          })
-          // 将预览任务 ID 暴露给父组件，供 Step7 确认生成时复用（confirmGeneration）
-          const currentFingerprint = JSON.stringify({ selectedTemplate, assetIds, titleSettings })
-          if (previewResp.task_id && previewParamsRef.current === currentFingerprint) {
-            onPreviewTaskCreated?.(previewResp.task_id)
-            // 提取后端自动关联的 source_edit_plan_id，供 fallback 路径使用
-            if (previewResp.source_edit_plan_id) {
-              onSourceEditPlanIdExtracted?.(previewResp.source_edit_plan_id)
-            }
-          }
-          // 轮询等待预览渲染完成：递归 setTimeout 避免请求重叠 + 120s 超时兜底
-          await new Promise<void>((resolve, reject) => {
-            let finished = false
-            const done = (fn: () => void) => {
-              if (finished) return
-              finished = true
-              clearTimeout(timeoutId)
-              fn()
-            }
-            const timeoutId = setTimeout(() => {
-              done(() => reject(new Error("预览生成超时，请稍后重试")))
-            }, 120_000)
-            const poll = async () => {
-              if (finished) return
-              try {
-                const status = await getPreviewStatus(previewResp.task_id)
-                if (status.status === "completed") {
-                  // 保存预览视频地址到 plan.config.rendered_storage_key，
-                  // 供封面 API 的 E1 兜底路径定位渲染后的视频（含标题烧录）。
-                  // video_url 可能是完整 http(s) URL 或 OSS storage_key，两种格式后端都能处理。
-                  if (status.video_url) {
-                    try {
-                      await updateEditPlan(selectedTemplate, {
-                        config: { rendered_storage_key: status.video_url },
-                      })
-                    } catch (saveErr) {
-                      console.warn(
-                        "[Step6] 保存 rendered_storage_key 失败（不阻塞封面重试）:",
-                        saveErr,
-                      )
-                    }
-                  }
-                  done(() => resolve())
-                } else if (status.status === "failed") {
-                  done(() => reject(new Error(status.error_message || "预览渲染失败")))
-                } else {
-                  setTimeout(poll, 2000)
-                }
-              } catch (e) {
-                done(() => reject(e))
-              }
-            }
-            poll()
-          })
-          message.success("预览视频就绪，重新生成封面...")
-          // 重试封面生成
-          const retryResp = await generateCover(selectedTemplate, {
-            asset_ids: assetIds,
-            cover_type: "ai_frame",
-            ...(titleSettings?.title
-              ? {
-                  title_config: {
-                    text: titleSettings.title,
-                    font: titleSettings.font,
-                    font_size: titleSettings.size,
-                    font_color: titleSettings.color,
-                    position: titleSettings.position,
-                    bold: titleSettings.bold,
-                    stroke: titleSettings.stroke,
-                    shadow: titleSettings.shadow,
-                  },
-                }
-              : {}),
-          })
-          const retryUrl = retryResp.cover?.image_url || ""
-          if (retryUrl) {
-            onCoverSettingsChange({
-              ...coverSettings,
-              thumbnail_url: retryUrl,
-              ai_suggested_time: retryResp.cover?.frame_time ?? null,
-            })
-            message.success("封面生成成功")
-          } else {
-            message.warning("封面生成未返回图片，请重试")
-          }
-        } catch (retryErr) {
-          console.error("[Step6] 自动创建预览后重试失败:", retryErr)
-          message.error("预览视频创建失败，请稍后重试")
-        }
-      } else if (anyErr?.__msgShown) {
+      if (anyErr?.__msgShown) {
         // 拦截器已处理，不再重复弹出
       } else {
         let errorMsg = "封面生成失败"
@@ -310,31 +147,21 @@ export function useStep6Cover({
           console.error("[Step6] 后端返回:", e.response.data)
         } else if (e.request) {
           errorMsg = "服务器无响应，请检查网络连接"
-          console.error("[Step6] 请求无响应:", e.request)
         } else if (e.message) {
           errorMsg = e.message
         }
         message.error(errorMsg)
       }
     } finally {
-      clearTimeout(timeoutId)
       setGenerating(false)
     }
   }, [
     selectedTemplate,
-    assetIds,
+    finalVideo,
     coverSettings,
     onCoverSettingsChange,
     generating,
-    duration,
     titleSettings,
-    onPreviewTaskCreated,
-    onSourceEditPlanIdExtracted,
-    voiceMode,
-    selectedVoice,
-    selectedClonedVoice,
-    bgm,
-    bgmConfig,
   ])
 
   // ── 模板操作方法 ──
@@ -391,13 +218,11 @@ export function useStep6Cover({
   const selectedTemplateName =
     coverTemplates.find((t) => t.id === selectedTemplateId)?.name || "默认"
 
-  const totalDuration = duration || 30
-
   return {
     coverSettings,
     generating,
     generateAutoCover,
-    totalDuration,
+    finalVideo,
     showCoverSettings,
     setShowCoverSettings,
     showCoverEditor,
diff --git a/apps/web/src/pages/generate/hooks/useStepNavigation.ts b/apps/web/src/pages/generate/hooks/useStepNavigation.ts
index 02c46a14b..adc757144 100644
--- a/apps/web/src/pages/generate/hooks/useStepNavigation.ts
+++ b/apps/web/src/pages/generate/hooks/useStepNavigation.ts
@@ -1,9 +1,6 @@
 /**
  * GeneratePage 步骤导航
- * 管理步骤切换与各步骤的前置校验
- * 步骤顺序（6步）：模板(1) → 素材(2) → 配音(3) → 标题(4) → 封面(5) → 确认(6)
- *
- * 原 Step4(标题) + Step5(预览) 已合并为 Step4
+ * 步骤顺序（6步）：模板(1) → 素材(2) → 配音(3) → 标题(4) → 确认生成(5) → 封面(6)
  */
 import { message } from "antd"
 import type { TitleSettings } from "../types"
@@ -18,6 +15,8 @@ export interface UseStepNavigationOptions {
   titleSettings: TitleSettings
   /** 预览是否已就绪（素材已加载，可播放） */
   previewReady: boolean
+  /** 是否已完成视频生成（步骤5确认生成后才能进入封面） */
+  generated: boolean
 }
 
 export interface UseStepNavigationReturn {
@@ -35,6 +34,7 @@ export const useStepNavigation = (options: UseStepNavigationOptions): UseStepNav
     smartSelectedIds,
     titleSettings,
     previewReady,
+    generated,
   } = options
 
   const goNext = () => {
@@ -50,7 +50,7 @@ export const useStepNavigation = (options: UseStepNavigationOptions): UseStepNav
       message.warning("请先进行智能匹配并选择素材")
       return
     }
-    // Step4（合并后的标题+预览）：标题必填 + 预览必须已生成
+    // Step4（标题+预览）：标题必填 + 预览必须已加载
     if (currentStep === 4) {
       if (!titleSettings.title.trim()) {
         message.warning("请选择或输入标题")
@@ -61,6 +61,11 @@ export const useStepNavigation = (options: UseStepNavigationOptions): UseStepNav
         return
       }
     }
+    // Step5（确认生成）：必须已完成生成才能进入封面
+    if (currentStep === 5 && !generated) {
+      message.warning("请先生成视频")
+      return
+    }
     if (currentStep < 6) {
       setCurrentStep((s) => s + 1)
     }
-- 
2.54.0