From 37733cc39c04b863a0b997c7fa3d9ac6a24e08be Mon Sep 17 00:00:00 2001
From: zjj <3272660260@qq.com>
Date: 星期三, 19 六月 2024 15:58:19 +0800
Subject: [PATCH] #
---
zy-asrs-flow/src/components/Flow/GraphComponent.jsx | 129 +++++++++++++++++++++++++++++++++---------
1 files changed, 101 insertions(+), 28 deletions(-)
diff --git a/zy-asrs-flow/src/components/Flow/GraphComponent.jsx b/zy-asrs-flow/src/components/Flow/GraphComponent.jsx
index 50c20e6..55d909d 100644
--- a/zy-asrs-flow/src/components/Flow/GraphComponent.jsx
+++ b/zy-asrs-flow/src/components/Flow/GraphComponent.jsx
@@ -7,7 +7,7 @@
import { Stencil } from '@antv/x6-plugin-stencil';
import { History } from '@antv/x6-plugin-history'
import { Transform } from '@antv/x6-plugin-transform'
-import { commonGraphPorts, commonGraphAttrs, initGraphConnecting } from "./GraphConfig";
+import { commonGraphPorts, commonGraphAttrs, initGraphConnecting, initNodeData } from "./GraphConfig";
export const GraphComponent = React.forwardRef((props, ref) => {
const container = useRef(null);
@@ -33,25 +33,27 @@
const graph = ref.current;
- const rect = graph.addNode({
- x: 60,
- y: 60,
- width: 120,
- height: 40,
- label: '璁㈠崟绠＄悊',
- ports: commonGraphPorts,
- attrs: commonGraphAttrs,
- });
+ // const rect = graph.addNode({
+ // x: 60,
+ // y: 60,
+ // width: 120,
+ // height: 40,
+ // label: '璁㈠崟绠＄悊',
+ // ports: commonGraphPorts,
+ // attrs: commonGraphAttrs,
+ // data: initNodeData,
+ // });
- const rect2 = graph.addNode({
- x: 240,
- y: 240,
- width: 120,
- height: 40,
- label: '搴撳瓨绠＄悊',
- ports: commonGraphPorts,
- attrs: commonGraphAttrs,
- });
+ // const rect2 = graph.addNode({
+ // x: 240,
+ // y: 240,
+ // width: 120,
+ // height: 40,
+ // label: '搴撳瓨绠＄悊',
+ // ports: commonGraphPorts,
+ // attrs: commonGraphAttrs,
+ // data: initNodeData,
+ // });
graph.use(
new Snapline({
@@ -77,11 +79,11 @@
graph.use(
new Transform({
- resizing: {
- enabled: true
- },
+ resizing: {
+ enabled: true
+ },
}),
- )
+ )
props.initHandle();//閫氱煡鐖剁粍浠跺垵濮嬪寲瀹屾垚
return graph;
@@ -102,31 +104,102 @@
{
name: 'group1',
title: '甯哥敤缁勪欢',
+ },
+ {
+ name: 'group2',
+ title: '閫昏緫缁勪欢'
}
],
})
stencilContainer.current.appendChild(stencil.container)
+ const n1Data = JSON.parse(JSON.stringify(initNodeData))
+ n1Data.root = true;//璁剧疆涓烘牴鑺傜偣
const n1 = graph.createNode({
shape: "rect",
width: 80,
height: 40,
- label: "榛樿缁勪欢",
+ label: "绋嬪簭鍏ュ彛",
attrs: commonGraphAttrs,
- ports: commonGraphPorts
+ ports: commonGraphPorts,
+ data: n1Data,
})
const n2 = graph.createNode({
shape: "rect",
width: 80,
height: 40,
- label: "娴嬭瘯缁勪欢",
+ label: "甯哥敤缁勪欢",
attrs: commonGraphAttrs,
- ports: commonGraphPorts
+ ports: commonGraphPorts,
+ data: initNodeData,
})
- stencil.load([n1, n2], 'group1')
+ const crnData = JSON.parse(JSON.stringify(initNodeData))
+ crnData.type = "crn";
+ const crnStencil = graph.createNode({
+ shape: "rect",
+ width: 80,
+ height: 40,
+ label: "鍫嗗灈鏈虹粍浠�",
+ attrs: commonGraphAttrs,
+ ports: commonGraphPorts,
+ data: crnData,
+ })
+
+ const shuttleData = JSON.parse(JSON.stringify(initNodeData))
+ shuttleData.type = "shuttle";
+ const shuttleStencil = graph.createNode({
+ shape: "rect",
+ width: 80,
+ height: 40,
+ label: "鍥涘悜杞︾粍浠�",
+ attrs: commonGraphAttrs,
+ ports: commonGraphPorts,
+ data: shuttleData,
+ })
+
+ const liftData = JSON.parse(JSON.stringify(initNodeData))
+ liftData.type = "lift";
+ const liftStencil = graph.createNode({
+ shape: "rect",
+ width: 80,
+ height: 40,
+ label: "鎻愬崌鏈虹粍浠�",
+ attrs: commonGraphAttrs,
+ ports: commonGraphPorts,
+ data: liftData,
+ })
+
+ const devpData = JSON.parse(JSON.stringify(initNodeData))
+ devpData.type = "devp";
+ const devpStencil = graph.createNode({
+ shape: "rect",
+ width: 80,
+ height: 40,
+ label: "杈撻�佺嚎缁勪欢",
+ attrs: commonGraphAttrs,
+ ports: commonGraphPorts,
+ data: devpData,
+ })
+
+ const logicStencilData = JSON.parse(JSON.stringify(initNodeData))
+ logicStencilData.isLogic = true;//閫昏緫鍒ゆ柇
+ const logicStencil = graph.createNode({
+ shape: 'path',
+ width: 100,
+ height: 60,
+ // https://www.svgrepo.com/svg/13653/like
+ path: 'M 50 0 L 100 50 L 50 100 L 0 50 Z',
+ attrs: commonGraphAttrs,
+ label: '閫昏緫鍒ゆ柇',
+ ports: commonGraphPorts,
+ data: logicStencilData,
+ })
+
+ stencil.load([n1, n2, crnStencil, shuttleStencil, liftStencil, devpStencil], 'group1')
+ stencil.load([logicStencil], 'group2')
}
function initBind(graph) {
--
Gitblit v1.9.1