From 5cec72fe099326a91c9c2807f782b893d100b7da Mon Sep 17 00:00:00 2001
From: ZLY <zhongliangyuan@gdngsk.com>
Date: Tue, 21 Oct 2025 16:34:37 +0800
Subject: [PATCH] =?UTF-8?q?feat(flow):=20=E5=BA=94=E7=94=A8=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6=E5=A2=9E=E5=8A=A0=E5=AE=9E=E4=BE=8B=E9=80=89=E6=8B=A9?=
 =?UTF-8?q?=E5=92=8C=E7=BB=84=E4=BB=B6=E4=BF=A1=E6=81=AF=E5=B1=95=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../nodeEditors/BasicNodeEditor.tsx           | 149 ++++++++++++++++--
 .../appCompComponent/compInfo.tsx             |   2 -
 src/utils/convertFlowData.ts                  |   4 +-
 3 files changed, 138 insertions(+), 17 deletions(-)

diff --git a/src/components/FlowEditor/nodeEditors/BasicNodeEditor.tsx b/src/components/FlowEditor/nodeEditors/BasicNodeEditor.tsx
index 126e45f..64118a9 100644
--- a/src/components/FlowEditor/nodeEditors/BasicNodeEditor.tsx
+++ b/src/components/FlowEditor/nodeEditors/BasicNodeEditor.tsx
@@ -1,12 +1,99 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
+import { useSelector } from 'react-redux';
 import { NodeEditorProps } from './index';
-import { Form, Input, Select } from '@arco-design/web-react';
+import { Form, Input, Select, Typography } from '@arco-design/web-react';
+import { IconUnorderedList } from '@arco-design/web-react/icon';
+import ParamsTable from '@/components/FlowEditor/nodeEditors/components/ParamsTable';
+import { queryInstance } from '@/api/components';
 
 const BasicNodeEditor: React.FC<NodeEditorProps> = ({
-  node,
-  nodeData,
-  updateNodeData
-}) => {
+                                                      node,
+                                                      nodeData,
+                                                      updateNodeData
+                                                    }) => {
+  const [currentCompInfo, setCurrentCompInfo] = useState(null);
+  const [options, setOptions] = useState([]);
+  const { projectComponentData, info, currentAppData } = useSelector(state => state.ideContainer);
+
+  const getCurrentProjectStoreData = () => {
+    const compData = projectComponentData[currentAppData.sceneId] || {};
+
+    const result: any[] = [];
+
+    // 处理projectCompDto中的数据
+    if (compData.projectCompDto) {
+      const { mineComp = [], pubComp = [], teamWorkComp = [] } = compData.projectCompDto;
+
+      // 添加mineComp数据
+      mineComp.forEach((item: any) => {
+        result.push({
+          ...item,
+          type: 'mineComp'
+        });
+      });
+
+      // 添加pubComp数据
+      pubComp.forEach((item: any) => {
+        result.push({
+          ...item,
+          type: 'pubComp'
+        });
+      });
+
+      // 添加teamWorkComp数据
+      teamWorkComp.forEach((item: any) => {
+        result.push({
+          ...item,
+          type: 'teamWorkComp'
+        });
+      });
+    }
+
+    // 处理projectFlowDto中的数据
+    if (compData.projectFlowDto) {
+      const { mineFlow = [], pubFlow = [] } = compData.projectFlowDto;
+
+      // 添加mineFlow数据
+      mineFlow.forEach((item: any) => {
+        result.push({
+          ...item,
+          type: 'mineFlow'
+        });
+      });
+
+      // 添加pubFlow数据
+      pubFlow.forEach((item: any) => {
+        result.push({
+          ...item,
+          type: 'pubFlow'
+        });
+      });
+    }
+
+    return result;
+  };
+
+  const getCompInfo = () => {
+    const flatData = getCurrentProjectStoreData();
+    setCurrentCompInfo(flatData.find((item: any) => item.id === nodeData.compId));
+  };
+  const getCompInstance = async () => {
+    const res: any = await queryInstance(nodeData.compId);
+    if (res.code === 200) {
+      console.log('res:', res);
+      const newOptions = res.data.map((item: any) => {
+        return {
+          label: item.identifier,
+          value: item.identifier
+        };
+      });
+      setOptions(newOptions);
+    }
+  };
+  useEffect(() => {
+    getCompInfo();
+    getCompInstance();
+  }, []);
   return (
     <Form layout="vertical">
       <Form.Item label="节点标题">
@@ -21,17 +108,53 @@ const BasicNodeEditor: React.FC<NodeEditorProps> = ({
           onChange={(value) => updateNodeData('description', value)}
         />
       </Form.Item>
+      <Typography.Title heading={5}><IconUnorderedList style={{ marginRight: 5 }} />组件信息</Typography.Title>
+      <div style={{ display: 'flex', marginTop: 10, marginBottom: 10 }}>
+        <span>组件类型：</span>
+        <div>{currentCompInfo?.type}</div>
+      </div>
+      <div style={{ display: 'flex', marginTop: 10, marginBottom: 10 }}>
+        <span>组件名称：</span>
+        <div>{currentCompInfo?.name}</div>
+      </div>
+      <div style={{ display: 'flex', marginTop: 10, marginBottom: 10 }}>
+        <span>组件描述：</span>
+        <div>{currentCompInfo?.description}</div>
+      </div>
       <Form.Item label="节点类型">
         <Select
-          value={nodeData.category || ''}
-          onChange={(value) => updateNodeData('category', value)}
-          options={[
-            { label: '数据处理', value: 'data' },
-            { label: '逻辑判断', value: 'logic' },
-            { label: '外部接口', value: 'api' }
-          ]}
+          value={nodeData?.component?.compIdentifier || ''}
+          onChange={(value) => {
+            console.log(value);
+            updateNodeData('component', {
+              ...nodeData.component,
+              compIdentifier: value,
+              compInstanceIdentifier: value
+            });
+          }}
+          options={options}
         />
       </Form.Item>
+      <Typography.Title heading={5}><IconUnorderedList style={{ marginRight: 5 }} />输入参数</Typography.Title>
+      <ParamsTable
+        initialData={nodeData.parameters.dataIns || []}
+        onUpdateData={(data) => {
+          updateNodeData('parameters', {
+            ...nodeData.parameters,
+            dataIns: data
+          });
+        }}
+      />
+      <Typography.Title heading={5}><IconUnorderedList style={{ marginRight: 5 }} />输出参数</Typography.Title>
+      <ParamsTable
+        initialData={nodeData.parameters.dataOuts || []}
+        onUpdateData={(data) => {
+          updateNodeData('parameters', {
+            ...nodeData.parameters,
+            dataOuts: data
+          });
+        }}
+      />
     </Form>
   );
 };
diff --git a/src/pages/orchestration/appCompComponent/compInfo.tsx b/src/pages/orchestration/appCompComponent/compInfo.tsx
index 87678b6..092a1d1 100644
--- a/src/pages/orchestration/appCompComponent/compInfo.tsx
+++ b/src/pages/orchestration/appCompComponent/compInfo.tsx
@@ -4,8 +4,6 @@ import { Space, Divider, Table, TableColumnProps } from '@arco-design/web-react'
 
 const CompInfo = ({ currentCompInfo }) => {
 
-  console.log('currentCompInfo:', currentCompInfo);
-
   const columns: TableColumnProps[] = [
     {
       title: '参数名',
diff --git a/src/utils/convertFlowData.ts b/src/utils/convertFlowData.ts
index ccfd912..95cad7b 100644
--- a/src/utils/convertFlowData.ts
+++ b/src/utils/convertFlowData.ts
@@ -483,7 +483,7 @@ const getNodeApiIns = (nodeId: string, nodeConfig: any, currentProjectCompData:
   else {
     const comp = currentProjectCompData.filter(item => item.id === nodeConfig?.component?.compId);
     if (comp && comp.length > 0) {
-      return comp[0].def.apis.map(v => {
+      return comp[0].def?.apis.map(v => {
         return {
           ...v,
           name: v.id,
@@ -566,7 +566,7 @@ const getNodeApiOuts = (nodeId: string, nodeConfig: any, currentProjectCompData:
     const comp = currentProjectCompData.filter(item => item.id === nodeConfig?.component?.compId);
     if (comp && comp.length > 0) {
       return [{
-        ...comp[0].def.apiOut,
+        ...comp[0].def?.apiOut,
         dataType: '',
         defaultValue: ''
       }];