1
This commit is contained in:
parent
547e5abed5
commit
63e6fbe2c3
@ -12,16 +12,6 @@ export const DEFAULT_STYLES = {
|
||||
fontSize: 12,
|
||||
fill: '#000000',
|
||||
},
|
||||
port: {
|
||||
r: 4,
|
||||
magnet: true,
|
||||
stroke: '#5F95FF',
|
||||
strokeWidth: 1,
|
||||
fill: '#fff',
|
||||
style: {
|
||||
visibility: 'hidden',
|
||||
},
|
||||
},
|
||||
edge: {
|
||||
stroke: '#1890ff',
|
||||
strokeWidth: 2,
|
||||
@ -48,26 +38,6 @@ export const NODE_SIZES = {
|
||||
},
|
||||
} as const;
|
||||
|
||||
// 生成端口组配置
|
||||
export const generatePortGroups = () => {
|
||||
const groups: Record<string, any> = {};
|
||||
|
||||
PORT_GROUPS.forEach(position => {
|
||||
groups[position] = {
|
||||
position,
|
||||
attrs: {
|
||||
circle: { ...DEFAULT_STYLES.port },
|
||||
},
|
||||
};
|
||||
});
|
||||
|
||||
return groups;
|
||||
};
|
||||
|
||||
// 生成端口项配置
|
||||
export const generatePortItems = () =>
|
||||
PORT_GROUPS.map(group => ({ group }));
|
||||
|
||||
// 网格配置
|
||||
export const GRID_CONFIG = {
|
||||
size: 10,
|
||||
@ -118,10 +88,6 @@ export const NODE_REGISTRY_CONFIG = {
|
||||
body: DEFAULT_STYLES.node,
|
||||
label: DEFAULT_STYLES.label,
|
||||
},
|
||||
ports: {
|
||||
groups: generatePortGroups(),
|
||||
items: generatePortItems(),
|
||||
},
|
||||
},
|
||||
rectangle: {
|
||||
inherit: 'rect',
|
||||
@ -131,10 +97,6 @@ export const NODE_REGISTRY_CONFIG = {
|
||||
body: DEFAULT_STYLES.node,
|
||||
label: DEFAULT_STYLES.label,
|
||||
},
|
||||
ports: {
|
||||
groups: generatePortGroups(),
|
||||
items: generatePortItems(),
|
||||
},
|
||||
},
|
||||
diamond: {
|
||||
inherit: 'polygon',
|
||||
@ -147,9 +109,5 @@ export const NODE_REGISTRY_CONFIG = {
|
||||
},
|
||||
label: DEFAULT_STYLES.label,
|
||||
},
|
||||
ports: {
|
||||
groups: generatePortGroups(),
|
||||
items: generatePortItems(),
|
||||
},
|
||||
},
|
||||
} as const;
|
||||
|
||||
@ -13,7 +13,7 @@ import {
|
||||
GRID_CONFIG,
|
||||
CONNECTING_CONFIG,
|
||||
HIGHLIGHTING_CONFIG,
|
||||
DEFAULT_STYLES, generatePortGroups, generatePortItems,
|
||||
DEFAULT_STYLES
|
||||
} from './constants';
|
||||
|
||||
const WorkflowDesign: React.FC = () => {
|
||||
@ -96,22 +96,21 @@ const WorkflowDesign: React.FC = () => {
|
||||
response.graph.nodes.forEach((nodeData: any) => {
|
||||
// 根据节点类型动态注册
|
||||
const nodeConfig = {
|
||||
inherit: 'rect', // 使用基础的矩形节点作为默认继承
|
||||
inherit: nodeData.graph.shape === 'circle' ? 'circle' :
|
||||
nodeData.graph.shape === 'polygon' ? 'polygon' : 'rect',
|
||||
width: nodeData.graph.size.width,
|
||||
height: nodeData.graph.size.height,
|
||||
attrs: {
|
||||
body: nodeData.graph.style,
|
||||
label: {
|
||||
text: nodeData.name,
|
||||
fill: '#000000',
|
||||
fontSize: 12,
|
||||
}
|
||||
},
|
||||
ports: nodeData.graph.ports
|
||||
};
|
||||
|
||||
// 根据形状选择不同的基础节点类型
|
||||
if (nodeData.graph.shape === 'circle') {
|
||||
nodeConfig.inherit = 'circle';
|
||||
} else if (nodeData.graph.shape === 'polygon') {
|
||||
nodeConfig.inherit = 'polygon';
|
||||
}
|
||||
|
||||
// 注册节点类型
|
||||
Graph.registerNode(nodeData.code, nodeConfig, true);
|
||||
|
||||
@ -128,6 +127,7 @@ const WorkflowDesign: React.FC = () => {
|
||||
fontSize: 12,
|
||||
}
|
||||
},
|
||||
// 保存完整的节点信息用于后续操作
|
||||
nodeDefinition: nodeData,
|
||||
});
|
||||
nodeMap.set(nodeData.id, node);
|
||||
|
||||
Loading…
Reference in New Issue
Block a user