feat(flow): 支持复合组件节点类型

- 将节点类型 'BASIC' 更新为 'SUB'以支持复合组件
- 在 appRes API 中新增 refPublish 方法用于引用公开组件
- 更新 convertFlowData 和 flowCommon 工具函数以识别 SUB 类型节点
- 在 FlowEditor 组件中注册并映射 SUB 节点类型及其显示名称
- 移除 setIsRunning 状态及相关逻辑
- 修改 useFlowCallbacks 钩子以处理复合组件的保存和发布逻辑
- 调整节点配置中的 compId 获取方式以兼容 flowHousVO.id

src/api/appRes.ts

@@ -25,6 +25,11 @@ export function setMainFlowNew(data: FlowDefinition, appId: string) {
   return axios.post(`${urlPrefix}/appRes/${appId}/updateMainNew`, data);
 }
 
+// 引用公开组件到应用组件内
+export function refPublish(data) {
+  return axios.put(`${urlPrefix}/appRes/refPublish`, data);
+}
+
 // 新增子流程
 export function addSub(appId: string, data?: FlowDefinition[]) {
   return axios.post(

src/components/FlowEditor/node/index.tsx

@@ -15,6 +15,7 @@ export const nodeTypes: NodeTypes = {
   start: StartNode,
   end: EndNode,
   BASIC: BasicNode,
+  SUB: BasicNode,
   APP: AppNode,
   CODE: CodeNode,
   IMAGE: ImageNode,
@@ -28,6 +29,7 @@ export const nodeTypeMap: Record<string, string> = {
   'start': 'start',
   'end': 'end',
   'basic': 'BASIC',
+  'sub': 'SUB',
   'app': 'APP',
   'code': 'CODE',
   'image': 'IMAGE',
@@ -41,6 +43,7 @@ export const nodeTypeNameMap: Record<string, string> = {
   'start': '开始节点',
   'end': '结束节点',
   'basic': '基础节点',
+  'sub': '复合节点',
   'app': '应用节点',
   'code': '代码节点',
   'image': '图片节点',

src/hooks/useFlowCallbacks.ts

@@ -7,7 +7,7 @@ import {
   Node,
   Edge
 } from '@xyflow/react';
-import { setMainFlow, setMainFlowNew } from '@/api/appRes';
+import { refPublish, setMainFlow, setMainFlowNew } from '@/api/appRes';
 import { Message } from '@arco-design/web-react';
 import { nodeTypeMap, registerNodeType } from '@/components/FlowEditor/node';
 import { convertFlowData, reverseConvertFlowData, revertFlowData } from '@/utils/convertFlowData';
@@ -60,8 +60,7 @@ export const useFlowCallbacks = (
   setEdgeForNodeAdd: React.Dispatch<React.SetStateAction<Edge | null>>,
   positionForNodeAdd: { x: number, y: number } | null,
   setPositionForNodeAdd: React.Dispatch<React.SetStateAction<{ x: number, y: number } | null>>,
-  setIsDelete: React.Dispatch<React.SetStateAction<boolean>>,
+  setIsDelete: React.Dispatch<React.SetStateAction<boolean>>
-  setIsRunning: React.Dispatch<React.SetStateAction<boolean>>
 ) => {
   const { getGuidelines, clearGuidelines } = useAlignmentGuidelines();
   // region 画布操作
@@ -633,7 +632,7 @@ export const useFlowCallbacks = (
         ...nodeDefinition.data,
         title: nodeDefinition.nodeName,
         type: nodeType,
-        compId: nodeDefinition.id
+        compId: nodeDefinition.id || nodeDefinition.flowHousVO.id
       }
     };
 
@@ -750,7 +749,7 @@ export const useFlowCallbacks = (
         ...nodeDefinition.data,
         title: nodeDefinition.nodeName,
         type: nodeType,
-        compId: nodeDefinition.id
+        compId: nodeDefinition.id || nodeDefinition.flowHousVO.id
       }
     };
 
@@ -770,7 +769,6 @@ export const useFlowCallbacks = (
         customDef: { eventId: emptyEvent.id, name: emptyEvent.name, topic: emptyEvent.topic }
       };
     }
-
     // 将未定义的节点动态追加进nodeTypes
     const nodeMap = Array.from(Object.values(nodeTypeMap).map(key => key));
     // 目前默认添加的都是系统组件/本地组件
@@ -867,6 +865,17 @@ export const useFlowCallbacks = (
       updateAppEvent(initialData.appId, params);
     }
   };
+  const upDatePublish = (revertedData) => {
+    const { currentAppData } = store.getState().ideContainer;
+    const params = {
+      appId: currentAppData.id,
+      publishAppId: []
+    };
+    revertedData.forEach(item => {
+      if (item?.component && item.component.type === 'SUB') params.publishAppId.push(item.component.compId); // 复合组件的这个compId实际上就是flowHousVO里面的id
+    });
+    if (params.publishAppId.length > 0) refPublish(params);
+  };
   const saveFlowDataToServer = useCallback(async () => {
     if (useDefault) {
       try {
@@ -895,7 +904,7 @@ export const useFlowCallbacks = (
           components: newRevertedData
         };
         // return;
-
+        upDatePublish(revertedData.nodeConfigs);
         updateEvent(revertedData.nodeConfigs);
         // 旧版数据结构
         // const res: any = await setMainFlow(revertedData, initialData.appId);

src/pages/flowEditor/FlowEditorMain.tsx

@@ -51,7 +51,6 @@ interface FlowEditorMainProps {
   positionForNodeAdd: { x: number, y: number } | null;
   setPositionForNodeAdd: React.Dispatch<React.SetStateAction<{ x: number, y: number } | null>>;
   isRunning: boolean;
-  setIsRunning: React.Dispatch<React.SetStateAction<boolean>>;
   initialData: any;
   canvasDataMap: any;
 

src/pages/flowEditor/components/addNodeMenu.tsx

@@ -59,7 +59,7 @@ const AddNodeMenu: React.FC<AddNodeMenuProps> = ({
         return {
           ...v,
           nodeName: v?.main?.name || '复合组件',
-          nodeType: 'BASIC',
+          nodeType: 'SUB',
           nodeGroup: 'composite',
           data: {
             parameters: {

src/pages/flowEditor/index.tsx

@@ -53,7 +53,6 @@ const FlowEditor: React.FC<{ initialData?: any, useDefault?: boolean }> = ({ ini
     positionForNodeAdd,
     setPositionForNodeAdd,
     isRunning,
-    setIsRunning,
     historyInitialized,
     setHistoryInitialized,
     historyTimeoutRef,
@@ -120,8 +119,7 @@ const FlowEditor: React.FC<{ initialData?: any, useDefault?: boolean }> = ({ ini
     setEdgeForNodeAdd,
     positionForNodeAdd,
     setPositionForNodeAdd,
-    setIsDelete,
+    setIsDelete
-    setIsRunning
   );
 
   // 节点右键菜单处理
@@ -275,7 +273,6 @@ const FlowEditor: React.FC<{ initialData?: any, useDefault?: boolean }> = ({ ini
         positionForNodeAdd={positionForNodeAdd}
         setPositionForNodeAdd={setPositionForNodeAdd}
         isRunning={isRunning}
-        setIsRunning={setIsRunning}
         initialData={initialData}
         canvasDataMap={canvasDataMap}
 

src/utils/convertFlowData.ts

@@ -333,7 +333,6 @@ export const convertFlowData = (flowData: any, useDefault = true) => {
       });
     }
   }
-
   return { nodes, edges };
 };
 
@@ -396,7 +395,7 @@ export const revertFlowData = (nodes: any[], edges: any[]) => {
           type: nodeType
         };
       }
-      if (['BASIC'].includes(nodeType)) nodeConfig.component.compId = node.data.compId || '';
+      if (['BASIC', 'SUB'].includes(nodeType)) nodeConfig.component.compId = node.data.compId || '';
 
       // 处理参数信息
       const parameters = node.data?.parameters || {};
@@ -776,6 +775,7 @@ const getCurrentProjectStoreData = () => {
 const getNodeComponent = (nodeType: string) => {
   switch (nodeType) {
     case 'BASIC':
+    case 'SUB':
       return BasicNode;
     case 'SWITCH':
       return SwitchNode;

src/utils/flowCommon.ts

@@ -81,6 +81,7 @@ const validateDataType = (sourceNode: defaultNodeTypes, targetNode: defaultNodeT
 const getNodeComponent = (nodeType: string) => {
   switch (nodeType) {
     case 'BASIC':
+    case 'SUB':
       return BasicNode;
     case 'SWITCH':
       return SwitchNode;