增加了动态生成跟节点验证。

This commit is contained in:
戚辰先生 2024-12-06 21:45:55 +08:00
parent 80de1149d3
commit a45d25634f
4 changed files with 20 additions and 9 deletions

View File

@ -7,7 +7,8 @@ export const NODE_CONFIG: Record<string, NodeConfig> = {
theme: {
fill: '#f6ffed',
stroke: '#52c41a'
}
},
label: '开始'
},
END: {
size: { width: 80, height: 80 },
@ -15,7 +16,8 @@ export const NODE_CONFIG: Record<string, NodeConfig> = {
theme: {
fill: '#fff1f0',
stroke: '#ff4d4f'
}
},
label: '结束'
},
SHELL: {
size: { width: 200, height: 80 },
@ -24,6 +26,7 @@ export const NODE_CONFIG: Record<string, NodeConfig> = {
fill: '#e6f7ff',
stroke: '#1890ff'
},
label: '脚本',
extras: {
rx: 4,
ry: 4,
@ -43,6 +46,7 @@ export const NODE_CONFIG: Record<string, NodeConfig> = {
fill: '#fff7e6',
stroke: '#fa8c16'
},
label: '定时器',
extras: {
rx: 4,
ry: 4,
@ -62,6 +66,7 @@ export const NODE_CONFIG: Record<string, NodeConfig> = {
fill: '#f9f0ff',
stroke: '#722ed1'
},
label: '网关',
extras: {
refPoints: '0,10 10,0 20,10 10,20'
}

View File

@ -532,10 +532,15 @@ const FlowDesigner: React.FC = () => {
}
);
// 创建节点配置
// 获取节点配置
const position = calculateNodePosition(nodeType.code, dropPosition);
const nodeStyle = generateNodeStyle(nodeType.code);
const ports = generatePorts(nodeType.code);
const config = NODE_CONFIG[nodeType.code];
if (!config) {
throw new Error(`未找到节点类型 ${nodeType.code} 的配置`);
}
// 创建节点
const node = graphRef.current.addNode({
@ -544,7 +549,7 @@ const FlowDesigner: React.FC = () => {
ports,
data: {
type: nodeType.code,
name: nodeType.name,
name: config.label, // 使用配置中的中文名称
config: {} as any,
},
});
@ -554,7 +559,7 @@ const FlowDesigner: React.FC = () => {
graphRef.current.select(node);
setCurrentNode(node);
setCurrentNodeType(nodeType);
form.setFieldsValue({ name: nodeType.name });
form.setFieldsValue({ name: config.label }); // 使用配置中的中文名称
setConfigVisible(true);
message.success('节点创建成功');

View File

@ -13,9 +13,11 @@ export interface NodeConfig {
fill: string;
stroke: string;
};
label: string;
extras?: {
rx?: number;
ry?: number;
refPoints?: string;
icon?: {
'xlink:href': string;
width: number;
@ -23,6 +25,5 @@ export interface NodeConfig {
x: number;
y: number;
};
refPoints?: string;
};
}

View File

@ -81,18 +81,18 @@ export const generateNodeStyle = (nodeType: string): NodeStyle => {
...(config.extras || {})
},
label: {
text: nodeType,
text: config.label,
fill: '#000000',
fontSize: 14,
fontWeight: 500,
...(nodeType === 'SHELL' ? {
...(config.shape === 'rect' ? {
refX: 0.5,
refY: 0.5,
textAnchor: 'middle',
textVerticalAnchor: 'middle'
} : {})
},
...(nodeType === 'SHELL' && config.extras?.icon ? {
...(config.extras?.icon ? {
image: config.extras.icon
} : {})
}