diff --git a/apps/web/src/pages/generate/components/Step2MaterialSelect.tsx b/apps/web/src/pages/generate/components/Step2MaterialSelect.tsx index dc9306393..8c5e2c487 100644 --- a/apps/web/src/pages/generate/components/Step2MaterialSelect.tsx +++ b/apps/web/src/pages/generate/components/Step2MaterialSelect.tsx @@ -2,30 +2,30 @@ * Step 1 素材选择组件(#1899 原 Step2 前移) * 新增片段数量输入,系统按片段数智能匹配素材 */ -import React from "react"; -import type { EditPlanClip } from "@/api/template-editor"; -import { useStep2Materials } from "../hooks/useStep2Materials"; -import MaterialModeTabs from "./material/MaterialModeTabs"; -import ManualMaterialList from "./material/ManualMaterialList"; -import SmartMatchInput from "./material/SmartMatchInput"; -import SmartMatchResults from "./material/SmartMatchResults"; +import React from "react" +import type { EditPlanClip } from "@/api/template-editor" +import { useStep2Materials } from "../hooks/useStep2Materials" +import MaterialModeTabs from "./material/MaterialModeTabs" +import ManualMaterialList from "./material/ManualMaterialList" +import SmartMatchInput from "./material/SmartMatchInput" +import SmartMatchResults from "./material/SmartMatchResults" interface Step2MaterialSelectProps { - materialMode: "manual" | "auto"; - onMaterialModeChange: (mode: "manual" | "auto") => void; - selectedMaterials: string[]; - onSelectedMaterialsChange: (ids: string[]) => void; - smartSelectedIds: string[]; - onSmartSelectedIdsChange: (ids: string[]) => void; + materialMode: "manual" | "auto" + onMaterialModeChange: (mode: "manual" | "auto") => void + selectedMaterials: string[] + onSelectedMaterialsChange: (ids: string[]) => void + smartSelectedIds: string[] + onSmartSelectedIdsChange: (ids: string[]) => void /** 片段数量(#1899) */ - clipCount: number; - onClipCountChange: (n: number) => void; + clipCount: number + onClipCountChange: (n: number) => void /** 服务端 clips 创建成功后的回调 */ - onServerClipsChange?: (clips: EditPlanClip[]) => void; + onServerClipsChange?: (clips: EditPlanClip[]) => void } const Step2MaterialSelect: React.FC = (props) => { - const m = useStep2Materials(props); + const m = useStep2Materials(props) return (
@@ -42,9 +42,8 @@ const Step2MaterialSelect: React.FC = (props) => { step={1} value={props.clipCount} onChange={(e) => { - const v = parseInt(e.target.value, 10); - if (!isNaN(v)) - props.onClipCountChange(Math.max(1, Math.min(10, v))); + const v = parseInt(e.target.value, 10) + if (!isNaN(v)) props.onClipCountChange(Math.max(1, Math.min(10, v))) }} style={{ width: 80, @@ -56,18 +55,13 @@ const Step2MaterialSelect: React.FC = (props) => { fontSize: 14, }} /> - + 系统将按片段数量智能匹配素材(1-10,默认3)
- +
@@ -102,9 +96,7 @@ const Step2MaterialSelect: React.FC = (props) => { gap: 10, }} > - - 已选 {m.selectedMaterials.length} 个素材 - + 已选 {m.selectedMaterials.length} 个素材
= (props) => { loading={m.materialsLoading} /> - + )} - ); -}; + ) +} -export default Step2MaterialSelect; +export default Step2MaterialSelect