From 6bcd8b0118a455c9ef9bb59841ee033dfeee83c2 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: Wed, 6 Aug 2025 17:07:37 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E5=B7=A5=E4=BD=9C=E6=B5=81?=
 =?UTF-8?q?=E6=9A=82=E5=81=9C=E5=8A=9F=E8=83=BD=EF=BC=8C=E6=9B=B4=E6=96=B0?=
 =?UTF-8?q?=E7=9B=B8=E5=85=B3=E7=BB=84=E4=BB=B6=E4=BB=A5=E6=94=AF=E6=8C=81?=
 =?UTF-8?q?=E6=9A=82=E5=81=9C=E7=8A=B6=E6=80=81=E7=9A=84=E7=AE=A1=E7=90=86?=
 =?UTF-8?q?=E5=92=8C=E6=98=BE=E7=A4=BA=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/pages/work-flow.tsx                |   1 +
 components/pages/work-flow/task-info.tsx      | 130 +++++++++---------
 .../pages/work-flow/use-workflow-data.tsx     |   5 +-
 3 files changed, 70 insertions(+), 66 deletions(-)

diff --git a/components/pages/work-flow.tsx b/components/pages/work-flow.tsx
index 80f3461..3e22339 100644
--- a/components/pages/work-flow.tsx
+++ b/components/pages/work-flow.tsx
@@ -125,6 +125,7 @@ export default function WorkFlow() {
                       currentLoadingText={currentLoadingText}
                       dataLoadError={dataLoadError}
                       roles={roles}
+                      isPauseWorkFlow={isPauseWorkFlow}
                     />
                   </ErrorBoundary>
                 </div>
diff --git a/components/pages/work-flow/task-info.tsx b/components/pages/work-flow/task-info.tsx
index 344be20..e4328ae 100644
--- a/components/pages/work-flow/task-info.tsx
+++ b/components/pages/work-flow/task-info.tsx
@@ -17,6 +17,7 @@ interface TaskInfoProps {
   currentLoadingText: string;
   dataLoadError?: string | null;
   roles: any[];
+  isPauseWorkFlow: boolean;
 }
 
 const stageIconMap = {
@@ -41,7 +42,7 @@ const stageIconMap = {
 const TAG_COLORS = ['#FF5733', '#126821', '#8d3913', '#FF33A1', '#A133FF', '#FF3333', '#3333FF', '#A1A1A1', '#a1115e', '#30527f'];
 
 // 阶段图标组件
-const StageIcons = ({ currentStage, isExpanded }: { currentStage: number, isExpanded: boolean }) => {
+const StageIcons = ({ currentStage, isExpanded, isPauseWorkFlow }: { currentStage: number, isExpanded: boolean, isPauseWorkFlow: boolean }) => {
   // 根据当前阶段重新排序图标
   const orderedStages = useMemo(() => {
     const stages = Object.entries(stageIconMap).map(([stage, data]) => ({
@@ -97,7 +98,7 @@ const StageIcons = ({ currentStage, isExpanded }: { currentStage: number, isExpa
             >
               <motion.div
                 className={`relative rounded-full p-1 ${isCurrentStage ? 'bg-opacity-20' : 'bg-opacity-10'}`}
-                animate={isCurrentStage ? {
+                animate={(isCurrentStage && !isPauseWorkFlow) ? {
                   rotate: [0, 360],
                   scale: [1, 1.2, 1],
                   transition: {
@@ -124,7 +125,8 @@ export function TaskInfo({
   taskObject, 
   currentLoadingText, 
   dataLoadError,
-  roles
+  roles,
+  isPauseWorkFlow
 }: TaskInfoProps) {
   const [isScriptModalOpen, setIsScriptModalOpen] = useState(false);
   const [currentStage, setCurrentStage] = useState(0);
@@ -299,15 +301,15 @@ export function TaskInfo({
           <motion.div
             className="w-1.5 h-1.5 rounded-full"
             style={{ backgroundColor: stageColor }}
-            animate={{ 
+            animate={!isPauseWorkFlow ? {
               scale: [1, 1.5, 1],
-              opacity: [1, 0.5, 1]
-            }}
-            transition={{ 
-              duration: 1,
-              repeat: Infinity,
-              repeatDelay: 0.2
-            }}
+              opacity: [1, 0.5, 1],
+              transition: {
+                duration: 1,
+                repeat: Infinity,
+                repeatDelay: 0.2
+              }
+            } : {}}
           />
           
           {/* 阶段图标 */}
@@ -321,7 +323,7 @@ export function TaskInfo({
             onMouseEnter={() => setIsStageIconsExpanded(true)}
             onMouseLeave={() => setIsStageIconsExpanded(false)}
           >
-            <StageIcons currentStage={currentStage} isExpanded={isStageIconsExpanded} />
+            <StageIcons currentStage={currentStage} isExpanded={isStageIconsExpanded} isPauseWorkFlow={isPauseWorkFlow} />
             
             <motion.div
               className="relative"
@@ -333,43 +335,43 @@ export function TaskInfo({
               {/* 背景发光效果 */}
               <motion.div
                 className="absolute inset-0 text-transparent bg-clip-text bg-gradient-to-r from-blue-400 via-cyan-400 to-purple-400 blur-sm"
-                animate={{
+                animate={!isPauseWorkFlow ? {
                   backgroundPosition: ["0% 50%", "100% 50%", "0% 50%"],
-                }}
-                transition={{
-                  duration: 2,
-                  repeat: Infinity,
-                  ease: "linear"
-                }}
+                  transition: {
+                    duration: 2,
+                    repeat: Infinity,
+                    ease: "linear"
+                  }
+                }: {}}
                 style={{
                   backgroundSize: "200% 200%",
                 }}
               >
-                <span className="normalS400 subtitle-had8uE">{currentLoadingText}</span>
+                <span className="normalS400 subtitle-had8uE">{isPauseWorkFlow ? 'workflow paused' : currentLoadingText}</span>
               </motion.div>
 
               {/* 主文字 - 颜色填充动画 */}
               <motion.div
                 className="relative z-10"
-                animate={{
+                animate={!isPauseWorkFlow ? {
                   scale: [1, 1.02, 1],
-                }}
-                transition={{
-                  duration: 1.5,
-                  repeat: Infinity,
-                  ease: "easeInOut"
-                }}
+                  transition: {
+                    duration: 1.5,
+                    repeat: Infinity,
+                    ease: "easeInOut"
+                  }
+                }: {}}
               >
                 <motion.span
                   className="normalS400 subtitle-had8uE text-transparent bg-clip-text bg-gradient-to-r from-blue-600 via-cyan-500 to-purple-600"
-                  animate={{
+                  animate={!isPauseWorkFlow ? {
                     backgroundPosition: ["0% 50%", "100% 50%", "0% 50%"],
-                  }}
-                  transition={{
+                    transition: {
                     duration: 3,
-                    repeat: Infinity,
-                    ease: "linear"
-                  }}
+                      repeat: Infinity,
+                      ease: "linear"
+                    }
+                  }: {}}
                   style={{
                     backgroundSize: "300% 300%",
                   }}
@@ -381,16 +383,16 @@ export function TaskInfo({
               {/* 动态光点效果 */}
               <motion.div
                 className="absolute left-0 top-1/2 transform -translate-y-1/2 w-2 h-2 bg-gradient-to-r from-cyan-400 to-blue-500 rounded-full blur-sm"
-                animate={{
+                animate={!isPauseWorkFlow ? {
                   x: [0, 200, 0],
                   opacity: [0, 1, 0],
                   scale: [0.5, 1, 0.5],
-                }}
-                transition={{
-                  duration: 2.5,
-                  repeat: Infinity,
-                  ease: "easeInOut",
-                }}
+                  transition: {
+                    duration: 2.5,
+                    repeat: Infinity,
+                    ease: "easeInOut",
+                  }
+                }: {}}
               />
 
               {/* 文字底部装饰线 */}
@@ -399,12 +401,12 @@ export function TaskInfo({
                 style={{
                   background: `linear-gradient(to right, ${stageColor}, rgb(34 211 238), rgb(168 85 247))`,
                 }}
-                animate={{
-                  width: ["0%", "100%", "0%"]
-                }}
-                transition={{
-                  width: { duration: 2, repeat: Infinity, ease: "easeInOut" }
-                }}
+                animate={!isPauseWorkFlow ? {
+                  width: ["0%", "100%", "0%"],
+                  transition: {
+                    width: { duration: 2, repeat: Infinity, ease: "easeInOut" }
+                  }
+                } : {}}
               />
             </motion.div>
           </motion.div>
@@ -412,30 +414,30 @@ export function TaskInfo({
           <motion.div
             className="w-1.5 h-1.5 rounded-full"
             style={{ backgroundColor: stageColor }}
-            animate={{ 
+            animate={!isPauseWorkFlow ? { 
               scale: [1, 1.5, 1],
-              opacity: [1, 0.5, 1]
-            }}
-            transition={{ 
-              duration: 1,
-              repeat: Infinity,
-              repeatDelay: 0.2,
-              delay: 0.3
-            }}
+              opacity: [1, 0.5, 1],
+              transition: {
+                duration: 1,
+                repeat: Infinity,
+                repeatDelay: 0.2,
+                delay: 0.3
+              }
+            } : {}}
           />
           <motion.div
             className="w-1.5 h-1.5 rounded-full"
             style={{ backgroundColor: stageColor }}
-            animate={{ 
+            animate={!isPauseWorkFlow ? { 
               scale: [1, 1.5, 1],
-              opacity: [1, 0.5, 1]
-            }}
-            transition={{ 
-              duration: 1,
-              repeat: Infinity,
-              repeatDelay: 0.2,
-              delay: 0.6
-            }}
+              opacity: [1, 0.5, 1],
+              transition: {
+                duration: 1,
+                repeat: Infinity,
+                repeatDelay: 0.2,
+                delay: 0.3
+              }
+            } : {}}
           />
         </motion.div>
       )}
diff --git a/components/pages/work-flow/use-workflow-data.tsx b/components/pages/work-flow/use-workflow-data.tsx
index e7df22e..58c2c5d 100644
--- a/components/pages/work-flow/use-workflow-data.tsx
+++ b/components/pages/work-flow/use-workflow-data.tsx
@@ -75,7 +75,7 @@ export function useWorkflowData() {
   const [dataLoadError, setDataLoadError] = useState<string | null>(null);
   const [needStreamData, setNeedStreamData] = useState(false);
   const [isPauseWorkFlow, setIsPauseWorkFlow] = useState(false);
-  const [mode, setMode] = useState<'auto' | 'manual'>('manual');
+  const [mode, setMode] = useState<'auto' | 'manual'>('auto');
 
   const dispatch = useAppDispatch();
   const { sketchCount, videoCount } = useAppSelector((state) => state.workflow);
@@ -356,7 +356,8 @@ export function useWorkflowData() {
         throw new Error(response.message);
       }
 
-      const { name, status, data, tags } = response.data;
+      const { name, status, data, tags, mode } = response.data;
+      setMode(mode);
       setIsLoading(false);
 
       // 设置初始数据