From 6193faefd6a64c6f2e5843c0c1859e1a9dc89133 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 18:39:31 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0=20ScriptService=20=E6=8E=A5?= =?UTF-8?q?=E5=8F=A3=E4=BB=A5=E6=94=AF=E6=8C=81=E6=96=B0=E7=9A=84=20setAny?= =?UTF-8?q?Attribute=20=E6=96=B9=E6=B3=95=EF=BC=8C=E4=BC=98=E5=8C=96?= =?UTF-8?q?=E5=89=A7=E6=9C=AC=E5=B1=9E=E6=80=A7=E8=AE=BE=E7=BD=AE=E9=80=BB?= =?UTF-8?q?=E8=BE=91=EF=BC=8C=E5=B9=B6=E5=9C=A8=E7=9B=B8=E5=85=B3=E7=BB=84?= =?UTF-8?q?=E4=BB=B6=E4=B8=AD=E9=9B=86=E6=88=90=E8=AF=A5=E5=8A=9F=E8=83=BD?= =?UTF-8?q?=EF=BC=9B=E6=B7=BB=E5=8A=A0=E8=B0=83=E8=AF=95=E4=BF=A1=E6=81=AF?= =?UTF-8?q?=E4=BB=A5=E4=BE=BF=E4=BA=8E=E5=BC=80=E5=8F=91=E8=B0=83=E8=AF=95?= =?UTF-8?q?=E3=80=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app/service/Interaction/ScriptService.ts | 31 +++++++++++++++- components/pages/work-flow.tsx | 4 +++ components/pages/work-flow/media-viewer.tsx | 10 ++++-- .../pages/work-flow/use-workflow-data.tsx | 4 +++ components/script-renderer/ScriptRenderer.tsx | 36 ++++--------------- components/ui/script-tab-content.tsx | 14 -------- 6 files changed, 52 insertions(+), 47 deletions(-) diff --git a/app/service/Interaction/ScriptService.ts b/app/service/Interaction/ScriptService.ts index 0a89abc..9b9e458 100644 --- a/app/service/Interaction/ScriptService.ts +++ b/app/service/Interaction/ScriptService.ts @@ -53,7 +53,7 @@ export interface UseScriptService { /** 根据项目ID初始化已有剧本 */ initializeFromProject: (projectId: string, script?: string) => Promise; /** 修改剧本 */ - updateScript: (scriptText: string) => Promise; + updateScript: () => Promise; /** 应用剧本到视频生成流程 */ applyScript: () => Promise; /** 中断视频任务 */ @@ -105,6 +105,8 @@ export interface UseScriptService { resolution: string, language: string ) => Promise; + /** 设置任何属性 */ + setAnyAttribute: (type: string, value: SetStateAction, tags?: string[]) => void; } /** @@ -113,6 +115,7 @@ export interface UseScriptService { * 包括剧本生成、项目创建、剧本保存等功能 */ export const useScriptService = (): UseScriptService => { + console.log('useScriptService----9((@@@@@@@@@@@@@@@@@@'); // 响应式状态 const [loading, setLoading] = useState(false); const [synopsis, setSynopsis] = useState(""); @@ -406,6 +409,30 @@ export const useScriptService = (): UseScriptService => { [characterArc, scriptEditUseCase] ); + const setAnyAttributeWrapper = useCallback( + (type: string, value: SetStateAction, tags?: string[]) => { + console.log('setAnyAttributeWrapper', type); + if (type === 'synopsis') { + setSynopsisWrapper(value); + } else if (type === 'categories') { + setCategoriesWrapper(tags || []); + } else if (type === 'protagonist') { + setProtagonistWrapper(value); + } else if (type === 'incitingIncident') { + setIncitingIncidentWrapper(value); + } else if (type === 'problem') { + setProblemWrapper(value); + } else if (type === 'conflict') { + setConflictWrapper(value); + } else if (type === 'stakes') { + setStakesWrapper(value); + } else if (type === 'characterArc') { + setCharacterArcWrapper(value); + } + }, + [scriptEditUseCase] + ); + /** * 聚焦处理函数 */ @@ -538,5 +565,7 @@ export const useScriptService = (): UseScriptService => { setConflict: setConflictWrapper, setStakes: setStakesWrapper, setCharacterArc: setCharacterArcWrapper, + // 封装统一的set函数 + setAnyAttribute: setAnyAttributeWrapper, }; }; diff --git a/components/pages/work-flow.tsx b/components/pages/work-flow.tsx index 21bb39a..04edc4a 100644 --- a/components/pages/work-flow.tsx +++ b/components/pages/work-flow.tsx @@ -15,6 +15,7 @@ import { motion } from "framer-motion"; import { GlassIconButton } from '@/components/ui/glass-icon-button'; export default function WorkFlow() { + console.log('WorkFlow--0294877777777777') const containerRef = useRef(null); const [isEditModalOpen, setIsEditModalOpen] = React.useState(false); const [activeEditTab, setActiveEditTab] = React.useState('1'); @@ -44,6 +45,7 @@ export default function WorkFlow() { isPauseWorkFlow, mode, setIsPauseWorkFlow, + setAnyAttribute } = useWorkflowData(); const { @@ -189,6 +191,8 @@ export default function WorkFlow() { onTogglePlay={togglePlay} final={final} setIsPauseWorkFlow={setIsPauseWorkFlow} + setAnyAttribute={setAnyAttribute} + isPauseWorkFlow={isPauseWorkFlow} /> diff --git a/components/pages/work-flow/media-viewer.tsx b/components/pages/work-flow/media-viewer.tsx index a3f5973..1adbacd 100644 --- a/components/pages/work-flow/media-viewer.tsx +++ b/components/pages/work-flow/media-viewer.tsx @@ -1,6 +1,6 @@ 'use client'; -import React, { useRef, useEffect, useState } from 'react'; +import React, { useRef, useEffect, useState, SetStateAction } from 'react'; import { motion, AnimatePresence } from 'framer-motion'; import { Edit3, Play, Pause, Volume2, VolumeX, Maximize, Minimize } from 'lucide-react'; import { ProgressiveReveal, presets } from '@/components/ui/progressive-reveal'; @@ -26,6 +26,8 @@ interface MediaViewerProps { onTogglePlay: () => void; final?: any; setIsPauseWorkFlow: (isPause: boolean) => void; + setAnyAttribute: (type: string, value: SetStateAction, tags?: string[]) => void; + isPauseWorkFlow: boolean; } export function MediaViewer({ @@ -44,7 +46,9 @@ export function MediaViewer({ onToggleVideoPlay, onTogglePlay, final, - setIsPauseWorkFlow + setIsPauseWorkFlow, + setAnyAttribute, + isPauseWorkFlow }: MediaViewerProps) { const mainVideoRef = useRef(null); const finalVideoRef = useRef(null); @@ -808,7 +812,7 @@ export function MediaViewer({
{ scriptData ? ( - + ) : (
diff --git a/components/pages/work-flow/use-workflow-data.tsx b/components/pages/work-flow/use-workflow-data.tsx index e245253..8ff766e 100644 --- a/components/pages/work-flow/use-workflow-data.tsx +++ b/components/pages/work-flow/use-workflow-data.tsx @@ -54,6 +54,8 @@ interface TaskObject { } export function useWorkflowData() { + console.log('98877766777777888888990') + const searchParams = useSearchParams(); const episodeId = searchParams.get('episodeId') || ''; @@ -86,6 +88,7 @@ export function useWorkflowData() { const { scriptBlocksMemo, // 渲染剧本数据 initializeFromProject, + setAnyAttribute } = useScriptService(); // 初始化剧本 useEffect(() => { @@ -602,5 +605,6 @@ export function useWorkflowData() { isPauseWorkFlow, mode, setIsPauseWorkFlow, + setAnyAttribute }; } \ No newline at end of file diff --git a/components/script-renderer/ScriptRenderer.tsx b/components/script-renderer/ScriptRenderer.tsx index 25969db..416357b 100644 --- a/components/script-renderer/ScriptRenderer.tsx +++ b/components/script-renderer/ScriptRenderer.tsx @@ -1,4 +1,4 @@ -import React, { useRef, useState, useMemo, useEffect } from 'react'; +import React, { useRef, useState, useMemo, useEffect, SetStateAction } from 'react'; import { motion, AnimatePresence } from 'framer-motion'; import { SquarePen, Lightbulb, Navigation, Globe, Copy, SendHorizontal, X, Plus } from 'lucide-react'; import { ScriptData, ScriptBlock, ScriptContent, ThemeTagBgColor, ThemeType } from './types'; @@ -6,14 +6,15 @@ 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: any[]; setIsPauseWorkFlow: (isPause: boolean) => void; + setAnyAttribute: (type: string, value: SetStateAction, tags?: string[]) => void; + isPauseWorkFlow: boolean; } -export const ScriptRenderer: React.FC = ({ data, setIsPauseWorkFlow }) => { +export const ScriptRenderer: React.FC = ({ data, setIsPauseWorkFlow, setAnyAttribute, isPauseWorkFlow }) => { const [activeBlockId, setActiveBlockId] = useState(null); const [hoveredBlockId, setHoveredBlockId] = useState(null); const contentRefs = useRef<{ [key: string]: HTMLDivElement | null }>({}); @@ -22,16 +23,7 @@ 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.find(block => block.id === 'categories'); @@ -119,21 +111,7 @@ export const ScriptRenderer: React.FC = ({ data, setIsPause 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); - } + setAnyAttribute(block.id, text); } }; @@ -149,7 +127,7 @@ export const ScriptRenderer: React.FC = ({ data, setIsPause } setIsPauseWorkFlow(true); setAddThemeTag(value); - setCategories(value); + setAnyAttribute('categories', '', value); }; const handleEditBlock = (block: ScriptBlock) => { diff --git a/components/ui/script-tab-content.tsx b/components/ui/script-tab-content.tsx index 1fbe84b..7830750 100644 --- a/components/ui/script-tab-content.tsx +++ b/components/ui/script-tab-content.tsx @@ -5,25 +5,11 @@ import * as Popover from '@radix-ui/react-popover'; import { mockSceneOptions, mockCharacterOptions } from '@/app/model/enums'; import { Button } from './button'; import { Input } from './input'; -import { useScriptService } from '@/app/service/Interaction/ScriptService'; const ScriptTabContent: React.FC = () => { // 获取当前项目ID（这里需要根据实际项目路由或上下文获取） const projectId = 'current-project-id'; // TODO: 从路由或上下文获取实际项目ID - const { - scriptSlices, - userPrompt, - loading, - error, - updateUserPrompt, - fetchScriptData, - setFocusedSlice, - updateScriptSliceText, - resetScript, - applyScript, - fetchProjectScript - } = useScriptService(); // 组件挂载时获取项目剧本数据 useEffect(() => {