feat(flowEditor): 添加基础节点组件并优化数据转换逻辑

- 在 flowEditor 目录下新增 basicNode 文件夹和 BasicNode 组件
- 更新 convertFlowData 函数,增加 nodeType 字段
- 在 FlowEditor 组件中注册 BasicNode 节点类型
master
钟良源 5 months ago
parent b9b5ec2f19
commit ebc6de6965

@ -18,6 +18,7 @@ import TextUpdaterNode from './node/textUpdateNode/TextUpdaterNode';
import StartNode from './node/startNode/StartNode'; import StartNode from './node/startNode/StartNode';
import EndNode from './node/endNode/EndNode'; import EndNode from './node/endNode/EndNode';
import DraggableNode from './node/draggableNode/DraggableNode'; import DraggableNode from './node/draggableNode/DraggableNode';
import BasicNode from './node/basicNode/BasicNode';
import SideBar from './sideBar/sideBar'; import SideBar from './sideBar/sideBar';
import { convertFlowData } from '@/utils/convertFlowData'; import { convertFlowData } from '@/utils/convertFlowData';
import { exampleFlowData } from '@/pages/flowEditor/test/exampleFlowData'; import { exampleFlowData } from '@/pages/flowEditor/test/exampleFlowData';
@ -26,7 +27,8 @@ const nodeTypes: NodeTypes = {
textUpdater: TextUpdaterNode, textUpdater: TextUpdaterNode,
start: StartNode, start: StartNode,
end: EndNode, end: EndNode,
draggable: DraggableNode draggable: DraggableNode,
BASIC: BasicNode
}; };
const { nodes: convertedNodes, edges: convertedEdges } = convertFlowData(exampleFlowData); const { nodes: convertedNodes, edges: convertedEdges } = convertFlowData(exampleFlowData);

@ -0,0 +1,29 @@
import React from 'react';
import styles from '@/pages/flowEditor/node/style/base.module.less';
import NodeContent from '@/pages/flowEditor/components/nodeContent';
interface BasicNodeData {
title?: string;
parameters?: {
inputs?: any[];
outputs?: any[];
};
showFooter?: boolean;
[key: string]: any;
}
const BasicNode = ({ data }: { data: BasicNodeData }) => {
const title = data.title || '基础节点';
return (
<div className={styles['node-container']}>
<div className={styles['node-header']} style={{ backgroundColor: '#ea911b' }}>
{title}
</div>
<NodeContent data={{ ...data }} />
</div>
);
};
export default BasicNode;

@ -51,7 +51,8 @@ export const convertFlowData = (flowData: any) => {
dataType: output.dataType, dataType: output.dataType,
defaultValue: output.defaultValue defaultValue: output.defaultValue
})) || [] })) || []
} },
type: nodeType,
} }
}; };

Loading…
Cancel
Save