xiaoxia
9a51cad137
CI/CD Pipeline / Frontend Lint (push) Successful in 48s
CI/CD Pipeline / Validate - Code Quality (push) Failing after 2m24s
CI/CD Pipeline / Validate - Migration (alembic) (push) Successful in 2m25s
CI/CD Pipeline / Validate - Type Check (mypy) (push) Successful in 2m27s
CI/CD Pipeline / Build Staging Worker Image (push) Successful in 3m8s
CI/CD Pipeline / Build Staging Web Image (push) Successful in 3m16s
CI/CD Pipeline / Frontend Unit Tests (push) Successful in 1m20s
CI/CD Pipeline / Integration Tests (push) Successful in 3m53s
CI/CD Pipeline / Unit Tests (push) Failing after 7m53s
CI/CD Pipeline / Build Staging API Image (push) Successful in 11m29s
CI/CD Pipeline / Deploy Staging (Watchtower auto-deploy) (push) Successful in 1m13s
CI/CD Pipeline / ACR Image Cleanup (push) Successful in 26s
CI/CD Pipeline / Staging E2E Tests (push) Failing after 1m3s
CI/CD Pipeline / Staging API Integration Tests (push) Successful in 3m15s
CI/CD Pipeline / Production Browser E2E (push) Failing after 1294h4m36s
CI/CD Pipeline / Build Production Worker Image (push) Failing after 1294h5m22s
CI/CD Pipeline / Build Production Web Image (push) Failing after 1294h5m22s
CI/CD Pipeline / PR Build Worker Image (push) Failing after 1294h7m45s
CI/CD Pipeline / PR Build Web Image (push) Failing after 1294h7m47s
CI/CD Pipeline / PR Build API Image (push) Failing after 1294h7m47s
CI/CD Pipeline / Check if frontend-only change (push) Failing after 1294h7m49s
CI/CD Pipeline / Deploy Production (push) Failing after 1294h37m5s
CI/CD Pipeline / Build Production API Image (push) Failing after 1294h37m51s
58 lines
2.1 KiB
TypeScript
58 lines
2.1 KiB
TypeScript
/**
|
|
* Step 3 生成预览组件
|
|
*/
|
|
import React from "react"
|
|
import { CheckCircleFilled } from "@ant-design/icons"
|
|
import type { EditingTemplate } from "@/api/editing-planner"
|
|
import { useStep3Preview } from "../hooks/useStep3Preview"
|
|
|
|
interface Step3GeneratePreviewProps {
|
|
templates: EditingTemplate[]
|
|
selectedTemplate: string
|
|
materialMode: "manual" | "auto"
|
|
selectedMaterials: string[]
|
|
smartSelectedIds: string[]
|
|
duration: number
|
|
videoRatio: string
|
|
}
|
|
|
|
const Step3GeneratePreview: React.FC<Step3GeneratePreviewProps> = (props) => {
|
|
const { templateName, materialCount, duration, videoRatio } = useStep3Preview(props)
|
|
|
|
return (
|
|
<div className="xx-form-section">
|
|
<h3>🎬 生成预览</h3>
|
|
<div className="xx-preview-tip">
|
|
<CheckCircleFilled style={{ color: "#52c41a", marginRight: 8 }} />
|
|
<span>素材已选好，AI 将为您智能匹配剪辑方案</span>
|
|
</div>
|
|
<div className="xx-preview-plan-card">
|
|
<div className="xx-preview-plan-title">模板草稿预览</div>
|
|
<div className="xx-preview-plan-info">
|
|
<div className="xx-preview-plan-row">
|
|
<span className="xx-preview-plan-label">模板</span>
|
|
<span className="xx-preview-plan-value">{templateName}</span>
|
|
</div>
|
|
<div className="xx-preview-plan-row">
|
|
<span className="xx-preview-plan-label">素材数量</span>
|
|
<span className="xx-preview-plan-value">{materialCount}</span>
|
|
</div>
|
|
<div className="xx-preview-plan-row">
|
|
<span className="xx-preview-plan-label">预计时长</span>
|
|
<span className="xx-preview-plan-value">{duration} 秒</span>
|
|
</div>
|
|
<div className="xx-preview-plan-row">
|
|
<span className="xx-preview-plan-label">视频比例</span>
|
|
<span className="xx-preview-plan-value">{videoRatio}</span>
|
|
</div>
|
|
</div>
|
|
<div className="xx-preview-plan-hint">
|
|
💡 点击「下一步」进入标题设置，AI 将根据素材内容为您推荐标题
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default Step3GeneratePreview
|