feat(web): 完成分支节点动态改变handle

service-web/client/src/components/flow/node/LoopNode.tsx

@@ -1,6 +1,6 @@
 import {Background, BackgroundVariant, type NodeProps} from '@xyflow/react'
 import {classnames} from 'amis'
-import React, {useCallback, useEffect} from 'react'
+import React, {useEffect, useMemo} from 'react'
 import AddNodeButton from '../component/AddNodeButton.tsx'
 import {useDataStore} from '../store/DataStore.ts'
 import {flowBackgroundColor, flowDotColor} from '../types.ts'
@@ -22,7 +22,7 @@ const LoopNode = (props: NodeProps) => {
     )
   }, [props.id])
 
-  const columnsSchema = useCallback(() => [
+  const columnsSchema = useMemo(() => [
     {
       type: 'switch',
       name: 'failFast',
@@ -41,6 +41,26 @@ const LoopNode = (props: NodeProps) => {
     ...outputsFormColumns(false, true),
   ], [props.id])
 
+  const extraNodeDescription = useMemo(() => {
+    return (
+      <div className="nodrag relative w-full h-full" style={{minHeight: '211px'}}>
+        <Background
+          id={`loop-background-${props.id}`}
+          className="rounded-xl"
+          variant={BackgroundVariant.Cross}
+          gap={20}
+          size={3}
+          style={{
+            zIndex: 0,
+          }}
+          color={flowDotColor}
+          bgColor={flowBackgroundColor}
+        />
+        <AddNodeButton className="mt-2 ml-2" parent={props.id} onlyIcon/>
+      </div>
+    )
+  }, [props.id])
+
   return (
     <AmisNode
       className={classnames('w-full', 'h-full', nodeClassName('loop'))}
@@ -49,23 +69,7 @@ const LoopNode = (props: NodeProps) => {
         minHeight: '290px',
       }}
       nodeProps={props}
-      extraNodeDescription={
-        <div className="nodrag relative w-full h-full" style={{minHeight: '211px'}}>
-          <Background
-            id={`loop-background-${props.id}`}
-            className="rounded-xl"
-            variant={BackgroundVariant.Cross}
-            gap={20}
-            size={3}
-            style={{
-              zIndex: 0,
-            }}
-            color={flowDotColor}
-            bgColor={flowBackgroundColor}
-          />
-          <AddNodeButton className="mt-2 ml-2" parent={props.id} onlyIcon/>
-        </div>
-      }
+      extraNodeDescription={extraNodeDescription}
       columnSchema={columnsSchema}
       handler={<NormalNodeHandler/>}
       resize={{