xiaoxia/xiaoxia-saas
1
0
Fork 0
Code Issues 16 Pull Requests 9 Actions 34.2k Packages Projects Releases 7 Wiki Activity

feat(viral-video): #2041 三步骤独立交互——分析图片/生成文案/生成视频拆分 #2116

Merged
auto-approve-bot merged 1 commits from feat/2041-three-step-independent-flow into develop 2026-10-01 11:14:28 +08:00
Conversation 4 Commits 1 Files Changed 4
+772 -416
xiaoxia commented 2026-10-01 11:02:18 +08:00
Owner
Copy Link
Copy Source

背景

用户要求三步完全独立：先分析图片→看到识别结果→再生成文案（可编辑）→确认后再生成视频。原来 POST /generate 一口气跑到 wait_user_confirm 导致用户看不到图片分析结果、黄卡文案为空。

主要改动

交互流程重设计

  • STEP 1 上传素材并分析图片
    • 按钮改为「🔍 分析图片」，点击后只跑图片 VLM 分析（当前用前端 mock mockImageAnalysis 占位，后端上线 analyze-only 端点后替换为真实 API，request 已加 step:"analyze" 字段预留）
    • 完成后展示「识别描述汇览」：商品/规格/品牌/视觉特征/品牌标签文字
    • 已分析后按钮变为「🔄 重新分析图片」
  • STEP 2 文案配置并生成文案
    • 表单：行业/目标人群/语言/时长/叙事结构/营销目的/BGM/三档融合（AI全写/AI润色/按我的话来）
    • 「✍️ 生成文案」按钮：点击才调文案生成（当前用 mockGenerateCopy 占位，返回完整营销文案文本，不是 meta 标签）
    • 生成中显示 loading；完成后在可编辑 textarea 展示完整文案正文
    • 文案下方显示「🎬 确认文案并生成视频」按钮，点击后解锁 STEP 3
  • STEP 3 视频设置并生成视频
    • 视频比例 / 生成模型 / 预计消耗积分
    • 「🎬 开始生成视频」按钮：点击后才真正调 POST /viral-video/generate 跑完 TTS→Seedance→ffmpeg→上传
    • 生成中显示 spinner+"AI 正在生成视频中…"+后端 progress_message
    • 完成后显示视频预览+下载+「再生成一个」

UI 细节

  • 删除原「⚡ 开始分析」合并按钮，删除原黄卡中的「确认文案并生成视频」合并按钮
  • 每一步有自己独立的紫色主按钮
  • STEP2/STEP3 在前置步骤未完成时整体置灰（opacity 0.55 + pointer-events:none）+右上角锁徽标「请先完成 STEP X」
  • 重置按钮回到 step1_upload
  • 清空图片/删除到0张时，状态回到 step1_upload
  • 失败可在当前步重试

工程

  • 新增 uiStep 状态机（9 个状态）替代原来 analyzing/generating 两个布尔
  • 类型扩展：ViralVideoStatus 预留 image_analyzed/copy_generated；GenerateViralVideoRequest 新增 step 字段；新增 CopyResult 接口；ImageProductAnalysis 新增 brand/label_text
  • 新增前端 mock：mockImageAnalysis / mockGenerateCopy（后端新端点上线后替换为真实 API）
  • API 层保留原 generateViralVideo/confirmViralVideoIntent/retryViralVideo 向后兼容
  • 后端 _to_response 未返回 image_analysis 的问题不阻塞前端（mock 数据先走通流程，后端补字段后可直接对接）

验证

  • tsc --noEmit ✅ 无错
  • eslint --max-warnings 0 ✅
  • prettier --write ✅
  • vite build ✅（ViralVideoPage chunk 35.57KB / gzip 11.92KB）

待后端配合

  1. 新增 analyze-only 端点（或 POST /generate 支持 step:"analyze" 只跑到 image_analysis/video_analysis 即暂停返回），替换前端 mockImageAnalysis
  2. 新增 generate-copy 端点（跑到 copy_fusion/storyboard/review 即返回文案），替换前端 mockGenerateCopy
  3. _to_response 返回 image_analysis 字段（字段名已对齐）
  4. confirm-intent 拆分：confirm 文案仅锁定文案不跑视频；新端点 trigger-video-render 触发视频生成
## 背景 用户要求三步完全独立：先分析图片→看到识别结果→再生成文案（可编辑）→确认后再生成视频。原来 `POST /generate` 一口气跑到 wait_user_confirm 导致用户看不到图片分析结果、黄卡文案为空。 ## 主要改动 ### 交互流程重设计 - **STEP 1 上传素材并分析图片** - 按钮改为「🔍 分析图片」，点击后**只跑**图片 VLM 分析（当前用前端 mock `mockImageAnalysis` 占位，后端上线 analyze-only 端点后替换为真实 API，request 已加 `step:"analyze"` 字段预留） - 完成后展示「识别描述汇览」：商品/规格/品牌/视觉特征/品牌标签文字 - 已分析后按钮变为「🔄 重新分析图片」 - **STEP 2 文案配置并生成文案** - 表单：行业/目标人群/语言/时长/叙事结构/营销目的/BGM/三档融合（AI全写/AI润色/按我的话来） - 「✍️ 生成文案」按钮：点击才调文案生成（当前用 `mockGenerateCopy` 占位，返回完整营销文案文本，不是 meta 标签） - 生成中显示 loading；完成后在可编辑 textarea 展示完整文案正文 - 文案下方显示「🎬 确认文案并生成视频」按钮，点击后解锁 STEP 3 - **STEP 3 视频设置并生成视频** - 视频比例 / 生成模型 / 预计消耗积分 - 「🎬 开始生成视频」按钮：点击后才真正调 `POST /viral-video/generate` 跑完 TTS→Seedance→ffmpeg→上传 - 生成中显示 spinner+"AI 正在生成视频中…"+后端 progress_message - 完成后显示视频预览+下载+「再生成一个」 ### UI 细节 - 删除原「⚡ 开始分析」合并按钮，删除原黄卡中的「确认文案并生成视频」合并按钮 - 每一步有自己独立的紫色主按钮 - STEP2/STEP3 在前置步骤未完成时整体置灰（opacity 0.55 + pointer-events:none）+右上角锁徽标「请先完成 STEP X」 - 重置按钮回到 step1_upload - 清空图片/删除到0张时，状态回到 step1_upload - 失败可在当前步重试 ### 工程 - 新增 `uiStep` 状态机（9 个状态）替代原来 analyzing/generating 两个布尔 - 类型扩展：`ViralVideoStatus` 预留 `image_analyzed/copy_generated`；`GenerateViralVideoRequest` 新增 `step` 字段；新增 `CopyResult` 接口；`ImageProductAnalysis` 新增 `brand/label_text` - 新增前端 mock：`mockImageAnalysis` / `mockGenerateCopy`（后端新端点上线后替换为真实 API） - API 层保留原 `generateViralVideo/confirmViralVideoIntent/retryViralVideo` 向后兼容 - 后端 `_to_response` 未返回 `image_analysis` 的问题不阻塞前端（mock 数据先走通流程，后端补字段后可直接对接） ### 验证 - tsc --noEmit ✅ 无错 - eslint --max-warnings 0 ✅ - prettier --write ✅ - vite build ✅（ViralVideoPage chunk 35.57KB / gzip 11.92KB） ### 待后端配合 1. 新增 analyze-only 端点（或 `POST /generate` 支持 `step:"analyze"` 只跑到 image_analysis/video_analysis 即暂停返回），替换前端 `mockImageAnalysis` 2. 新增 generate-copy 端点（跑到 copy_fusion/storyboard/review 即返回文案），替换前端 `mockGenerateCopy` 3. `_to_response` 返回 `image_analysis` 字段（字段名已对齐） 4. `confirm-intent` 拆分：confirm 文案仅锁定文案不跑视频；新端点 trigger-video-render 触发视频生成
xiaoxia added 1 commit 2026-10-01 11:02:18 +08:00
feat(viral-video): #2041 三步骤独立交互——分析图片/生成文案/生成视频拆分
CI/CD Pipeline / Check push changed paths (pull_request) Has been skipped
Details
CI/CD Pipeline / Dedup Check - skip PR tests when covered by push pipeline (pull_request) Successful in 1s
Details
CI/CD Pipeline / Build Staging API Image (pull_request) Has been skipped
Details
CI/CD Pipeline / Build Staging Web Image (pull_request) Has been skipped
Details
CI/CD Pipeline / Build Staging Worker Image (pull_request) Has been skipped
Details
CI/CD Pipeline / Check if frontend-only change (pull_request) Successful in 5s
Details
CI/CD Pipeline / Unit Tests (pull_request) Has been skipped
Details
CI/CD Pipeline / Integration Tests (pull_request) Has been skipped
Details
CI/CD Pipeline / PR Build API Image (pull_request) Has been skipped
Details
CI/CD Pipeline / PR Build Worker Image (pull_request) Has been skipped
Details
CI/CD Pipeline / Retag skipped Staging API Image (pull_request) Has been skipped
Details
CI/CD Pipeline / Retag skipped Staging Web Image (pull_request) Has been skipped
Details
CI/CD Pipeline / Retag skipped Staging Worker Image (pull_request) Has been skipped
Details
CI/CD Pipeline / Deploy Staging (Watchtower auto-deploy) (pull_request) Has been skipped
Details
CI/CD Pipeline / ACR Image Cleanup (pull_request) Has been skipped
Details
CI/CD Pipeline / Staging API Integration Tests (pull_request) Has been skipped
Details
CI/CD Pipeline / Staging E2E Tests (pull_request) Has been skipped
Details
CI/CD Pipeline / Frontend Lint (pull_request) Successful in 1m24s
Details
CI/CD Pipeline / PR Build Web Image (pull_request) Successful in 1m22s
Details
PR Automation / Auto Approve on CI Green (pull_request) Successful in 1m40s
Details
CI/CD Pipeline / Frontend Unit Tests (pull_request) Successful in 1m36s
Details
Preview Deploy / Deploy Preview Environment (pull_request) Successful in 1m44s
Details
CI/CD Pipeline / Validate - Style (pull_request) Successful in 4m16s
Details
CI/CD Pipeline / Validate - Python (mypy + alembic) (pull_request) Successful in 4m53s
Details
AI Code Review / AI Code Review (pull_request) Successful in 6m37s
Details
CI/CD Pipeline / Validate - Security (pull_request) Successful in 11m26s
Details
CI/CD Pipeline / Build Production API Image (pull_request) Has been skipped
Details
CI/CD Pipeline / Build Production Web Image (pull_request) Has been skipped
Details
CI/CD Pipeline / Build Production Worker Image (pull_request) Has been skipped
Details
CI/CD Pipeline / CI Gate (pull_request) Successful in 1s
Details
CI/CD Pipeline / Deploy Production (pull_request) Has been skipped
Details
CI/CD Pipeline / Canary Release to Production (pull_request) Has been skipped
Details
CI/CD Pipeline / Production Browser E2E (pull_request) Has been skipped
Details
PR Automation / Auto Merge on CI Green + Approved (pull_request) Successful in 10m31s
Details
ACR Cleanup / ACR Image Cleanup (pull_request_target) Successful in 37s
Details
Preview Cleanup / Cleanup Preview Environment (pull_request) Successful in 1m1s
Details
dc0782a911 
- 新增 uiStep 状态机：step1_upload→step1_analyzing→step1_done→step2_generating→
  step2_copy_ready→step3_ready→step3_generating→step3_done/failed，三步完全独立
- STEP1 按钮改为「🔍 分析图片」，仅跑图片VLM分析（含mockImageAnalysis占位，后端上线analyze-only端点后替换）
- STEP2 独立为「✍️ 生成文案」按钮+可编辑文案textarea+「🎬 确认文案并生成视频」按钮，
  文案生成用mockGenerateCopy占位，返回完整营销文案文本（非空meta信息）
- STEP3 独立为「🎬 开始生成视频」按钮，点击后才调generateViralVideo→TTS→Seedance→渲染
- 删除原「⚡ 开始分析」和黄卡合并的「确认文案并生成视频」
- STEP2/STEP3 在前置步骤未完成时禁用（opacity 0.55 + pointer-events:none + 锁提示）
- 识别汇览展示商品/规格/品牌/视觉特征/品牌标签文字（新增brand/label_text字段）
- 类型扩展：ViralVideoStatus 新增 image_analyzed/copy_generated；GenerateViralVideoRequest
  新增 step 字段（analyze/generate_copy/generate_video）；新增 CopyResult 接口
- tsc/eslint/prettier/vite build 全通过
auto-approve-bot approved these changes 2026-10-01 11:03:58 +08:00
auto-approve-bot left a comment
Collaborator
Copy Link
Copy Source

CI全绿，自动审批通过。

CI全绿，自动审批通过。
auto-approve-bot approved these changes 2026-10-01 11:03:59 +08:00
auto-approve-bot left a comment
Collaborator
Copy Link
Copy Source

CI全绿，自动审批通过。

CI全绿，自动审批通过。
gitea-actions bot commented 2026-10-01 11:04:02 +08:00
Copy Link
Copy Source

🚀 预览环境已部署

项目 详情
PR号 #2116
预览链接 https://pr-2116.preview.xiaoxiajianji.com
API环境 staging

💡 预览环境使用 staging API 数据，请勿在预览环境中操作重要数据。

🔄 每次提交新代码后预览环境会自动更新。

🗑️ PR 关闭或合并后，预览环境会自动清理。

🚀 **预览环境已部署** | 项目 | 详情 | |------|------| | PR号 | #2116 | | 预览链接 | [https://pr-2116.preview.xiaoxiajianji.com](https://pr-2116.preview.xiaoxiajianji.com) | | API环境 | staging | > 💡 预览环境使用 staging API 数据，请勿在预览环境中操作重要数据。 > > 🔄 每次提交新代码后预览环境会自动更新。 > > 🗑️ PR 关闭或合并后，预览环境会自动清理。
auto-approve-bot merged commit b2fd6fe46b into develop 2026-10-01 11:14:28 +08:00
auto-approve-bot deleted branch feat/2041-three-step-independent-flow 2026-10-01 11:14:31 +08:00
gitea-actions bot commented 2026-10-01 11:15:31 +08:00
Copy Link
Copy Source

🗑️ 预览环境已清理

PR #2116 已关闭或合并，对应的预览环境已被清理。

如有需要，可以重新打开 PR 来重新生成预览环境。

🗑️ **预览环境已清理** PR #2116 已关闭或合并，对应的预览环境已被清理。 > 如有需要，可以重新打开 PR 来重新生成预览环境。
Sign in to join this conversation.
Reviewers
No Reviewers
auto-approve-bot
Labels
Clear labels
architecture
架构设计
 backend
后端相关
 blocked
阻塞中
 bug
Bug修复
 ci-bug
CI本身的bug
 ci-optimization
CI优化类任务
 ci-pipeline
CI流水线/workflow相关
 cleanup
代码清理
 devops
运维/部署/CI
 documentation
文档相关
 feature
新功能
 frontend
前端相关
 P0
阻塞性，必须立即处理
 P1
高优先级
 P2
中优先级
 P3
低优先级/后考虑
 question
需要讨论确认
 ready
PR CI通过，可合并
 refactor
代码重构
No Label
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
auto-approve-bot frontend-dev xiaoxia
No Assignees
3 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: xiaoxia/xiaoxia-saas#2116
Delete Branch "feat/2041-three-step-independent-flow"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?