From 884aa5794f56dc10373ba8f36fe81424ec567fc9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=8C=97=E6=9E=B3?= <7854742+wang_rumeng@user.noreply.gitee.com> Date: Thu, 7 Aug 2025 17:34:22 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0=20ScriptRenderer=20=E4=BB=A5?= =?UTF-8?q?=E6=94=AF=E6=8C=81=E6=96=B0=E7=9A=84=E6=95=B0=E6=8D=AE=E7=BB=93?= =?UTF-8?q?=E6=9E=84=EF=BC=8C=E4=BC=98=E5=8C=96=E5=89=A7=E6=9C=AC=E6=95=B0?= =?UTF-8?q?=E6=8D=AE=E5=A4=84=E7=90=86=E9=80=BB=E8=BE=91=E5=B9=B6=E6=B7=BB?= =?UTF-8?q?=E5=8A=A0=E8=B0=83=E8=AF=95=E4=BF=A1=E6=81=AF=EF=BC=9B=E8=B0=83?= =?UTF-8?q?=E6=95=B4=20TaskInfo=20=E4=B8=AD=E7=9A=84=E5=8A=A0=E8=BD=BD?= =?UTF-8?q?=E7=8A=B6=E6=80=81=E9=80=BB=E8=BE=91=E4=BB=A5=E9=80=82=E5=BA=94?= =?UTF-8?q?=E6=96=B0=E7=9A=84=E5=89=A7=E6=9C=AC=E5=8A=A0=E8=BD=BD=E6=9D=A1?= =?UTF-8?q?=E4=BB=B6=E3=80=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app/service/Interaction/ScriptService.ts | 3 ++ components/pages/work-flow/media-viewer.tsx | 4 +- components/pages/work-flow/task-info.tsx | 22 +++------ .../pages/work-flow/use-workflow-data.tsx | 10 ++-- components/script-renderer/ScriptRenderer.tsx | 48 +++++++++++++++---- 5 files changed, 58 insertions(+), 29 deletions(-) diff --git a/app/service/Interaction/ScriptService.ts b/app/service/Interaction/ScriptService.ts index 82298f8..0a89abc 100644 --- a/app/service/Interaction/ScriptService.ts +++ b/app/service/Interaction/ScriptService.ts @@ -318,6 +318,7 @@ export const useScriptService = (): UseScriptService => { const setSynopsisWrapper = useCallback( (value: SetStateAction) => { const newValue = typeof value === "function" ? value(synopsis) : value; + console.log('setSynopsisWrapper', newValue); setSynopsis(newValue); if (scriptEditUseCase) { scriptEditUseCase.updateStoryField("synopsis", newValue); @@ -487,6 +488,8 @@ export const useScriptService = (): UseScriptService => { ]; // 筛选出有内容的block const filteredArr = arr.filter(item => (item.content.length > 0 && item.content[0].text !== '')); + console.log('scriptBlocksMemo 所有关联数据', synopsis, categories, protagonist, incitingIncident, problem, conflict, stakes, characterArc); + console.log('scriptBlocksMemo', filteredArr); return filteredArr; }, [ synopsis, diff --git a/components/pages/work-flow/media-viewer.tsx b/components/pages/work-flow/media-viewer.tsx index 47d1381..a3f5973 100644 --- a/components/pages/work-flow/media-viewer.tsx +++ b/components/pages/work-flow/media-viewer.tsx @@ -807,8 +807,8 @@ export function MediaViewer({ return (
{ - mockScriptData ? ( - + scriptData ? ( + ) : (
diff --git a/components/pages/work-flow/task-info.tsx b/components/pages/work-flow/task-info.tsx index e4328ae..75e71c6 100644 --- a/components/pages/work-flow/task-info.tsx +++ b/components/pages/work-flow/task-info.tsx @@ -205,21 +205,13 @@ export function TaskInfo({ setIsScriptModalOpen(true); setCurrentStage(1); } - // if (currentLoadingText.includes('character')) { - // console.log('isScriptModalOpen-character', currentLoadingText, isScriptModalOpen); - // if (isScriptModalOpen) { - // setIsScriptModalOpen(false); - - // // 延迟8s 再次打开 - // timerRef.current = setTimeout(() => { - // setIsScriptModalOpen(true); - // setCurrentStage(0); - // }, 8000); - // } else { - // setIsScriptModalOpen(true); - // setCurrentStage(0); - // } - // } + if (currentLoadingText.includes('script')) { + console.log('isScriptModalOpen-script', currentLoadingText, isScriptModalOpen); + if (isScriptModalOpen) { + setIsScriptModalOpen(false); + } + setCurrentStage(0); + } if (currentLoadingText.includes('initializing')) { console.log('isScriptModalOpen-initializing', currentLoadingText, isScriptModalOpen); setIsScriptModalOpen(true); diff --git a/components/pages/work-flow/use-workflow-data.tsx b/components/pages/work-flow/use-workflow-data.tsx index 773406f..e245253 100644 --- a/components/pages/work-flow/use-workflow-data.tsx +++ b/components/pages/work-flow/use-workflow-data.tsx @@ -19,6 +19,7 @@ const STEP_MAP = { // 执行loading文字映射 const LOADING_TEXT_MAP = { initializing: 'initializing...', + script: 'Generating script...', getSketchStatus: 'Getting sketch status...', sketch: (count: number, total: number) => `Generating sketch ${count + 1 > total ? total : count + 1}/${total}...`, sketchComplete: 'Sketch generation complete', @@ -83,7 +84,6 @@ export function useWorkflowData() { const { sketchCount, videoCount } = useAppSelector((state) => state.workflow); const { - loading, // 加载状态 scriptBlocksMemo, // 渲染剧本数据 initializeFromProject, } = useScriptService(); @@ -94,10 +94,12 @@ export function useWorkflowData() { }, [originalText]); // 监听剧本加载完毕 useEffect(() => { - if (!loading) { - console.log('开始初始化剧本-scriptBlocksMemo', scriptBlocksMemo); + if (scriptBlocksMemo.length > 0) { + console.log('scriptBlocksMemo 更新:', scriptBlocksMemo); + setScriptData(scriptBlocksMemo); + setCurrentLoadingText(LOADING_TEXT_MAP.script); } - }, [loading, scriptBlocksMemo]); + }, [scriptBlocksMemo]); // 自动开始播放一轮 const autoPlaySketch = useCallback(() => { diff --git a/components/script-renderer/ScriptRenderer.tsx b/components/script-renderer/ScriptRenderer.tsx index cb43b45..25969db 100644 --- a/components/script-renderer/ScriptRenderer.tsx +++ b/components/script-renderer/ScriptRenderer.tsx @@ -6,9 +6,10 @@ import ContentEditable, { ContentEditableEvent } from 'react-contenteditable'; import { toast } from 'sonner'; import { SelectDropdown } from '@/components/ui/select-dropdown'; import { TypewriterText } from '@/components/workflow/work-office/common/TypewriterText'; +import { useScriptService } from '@/app/service/Interaction/ScriptService'; interface ScriptRendererProps { - data: ScriptData; + data: any[]; setIsPauseWorkFlow: (isPause: boolean) => void; } @@ -21,14 +22,25 @@ export const ScriptRenderer: React.FC = ({ data, setIsPause const [addThemeTag, setAddThemeTag] = useState([]); const [isInit, setIsInit] = useState(true); + const { + setSynopsis, + setCategories, + setProtagonist, + setIncitingIncident, + setProblem, + setConflict, + setStakes, + setCharacterArc, + } = useScriptService(); + useEffect(() => { - const themeBlock = data.blocks.find(block => block.id === 'categories'); + const themeBlock = data.find(block => block.id === 'categories'); if (themeBlock && themeBlock.content.length > 0) { const themeTag = themeBlock.content[0].text.split(',').map(item => item.trim()); console.log('themeTag', themeTag); setAddThemeTag(themeTag); } - }, [data.blocks]); + }, [data]); // 添加聚焦效果 useEffect(() => { @@ -99,12 +111,30 @@ export const ScriptRenderer: React.FC = ({ data, setIsPause }; const handleBlockTextChange = (block: ScriptBlock) => (e: ContentEditableEvent) => { - console.log(e.target.value); + // console.log(e.target.value); }; const handleBlockTextBlur = (block: ScriptBlock) => (e: ContentEditableEvent) => { - console.log(e.target.value); setEditBlockId(null); + if (contentEditableRef.current) { + const text = contentEditableRef.current.innerText; + console.log('contentEditableRef---text', text); + if (block.id === 'synopsis') { + setSynopsis(text); + } else if (block.id === 'protagonist') { + setProtagonist(text); + } else if (block.id === 'incitingIncident') { + setIncitingIncident(text); + } else if (block.id === 'problem') { + setProblem(text); + } else if (block.id === 'conflict') { + setConflict(text); + } else if (block.id === 'stakes') { + setStakes(text); + } else if (block.id === 'characterArc') { + setCharacterArc(text); + } + } }; const handleThemeTagChange = (value: string[]) => { @@ -117,7 +147,9 @@ export const ScriptRenderer: React.FC = ({ data, setIsPause }); return; } + setIsPauseWorkFlow(true); setAddThemeTag(value); + setCategories(value); }; const handleEditBlock = (block: ScriptBlock) => { @@ -248,7 +280,7 @@ export const ScriptRenderer: React.FC = ({ data, setIsPause return (
- {data.blocks.map(renderBlock)} + {data.map(renderBlock)}
{/* 翻译功能 待开发 */} @@ -275,9 +307,9 @@ export const ScriptRenderer: React.FC = ({ data, setIsPause

- 导航 + navigation

- {data.blocks.map((block) => ( + {data.map((block) => (