feat(web): 完成循环节点的基本配置

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

@@ -0,0 +1,46 @@
+import {Background, BackgroundVariant, type NodeProps} from '@xyflow/react'
+import {classnames} from 'amis'
+import React from 'react'
+import {flowBackgroundColor, flowDotColor} from '../types.ts'
+import AmisNode, {nodeClassName, NormalNodeHandler} from './AmisNode.tsx'
+
+const LoopNode = (props: NodeProps) => {
+  return (
+    <AmisNode
+      className={classnames('w-full', 'h-full', nodeClassName('loop'))}
+      style={{
+        minWidth: '256px',
+        minHeight: '110px'
+      }}
+      nodeProps={props}
+      extraNodeDescription={
+        <div
+          className="nodrag relative h-full w-full"
+          style={{
+            minHeight: '8rem',
+          }}
+        >
+          <Background
+            id={`loop-background-${props.id}`}
+            className="rounded-xl"
+            variant={BackgroundVariant.Cross}
+            gap={20}
+            size={3}
+            style={{
+              zIndex: 0,
+            }}
+            color={flowDotColor}
+            bgColor={flowBackgroundColor}
+          />
+        </div>
+      }
+      handler={<NormalNodeHandler/>}
+      resize={{
+        minWidth: 256,
+        minHeight: 208,
+      }}
+    />
+  )
+}
+
+export default React.memo(LoopNode)