From babcf4f0462ed0945fcefe59b1666d709910872c Mon Sep 17 00:00:00 2001
From: luxiaotao1123 <t1341870251@163.com>
Date: 星期一, 04 三月 2024 16:00:55 +0800
Subject: [PATCH] Merge branch 'master' of http://47.97.1.152:5880/r/zy-asrs-master
---
zy-asrs-flow/src/components/Flow/GraphComponent.jsx | 69 +++++++++++++++++++---------------
1 files changed, 38 insertions(+), 31 deletions(-)
diff --git a/zy-asrs-flow/src/components/Flow/GraphComponent.jsx b/zy-asrs-flow/src/components/Flow/GraphComponent.jsx
index c673a67..50c20e6 100644
--- a/zy-asrs-flow/src/components/Flow/GraphComponent.jsx
+++ b/zy-asrs-flow/src/components/Flow/GraphComponent.jsx
@@ -6,8 +6,8 @@
import { Clipboard } from '@antv/x6-plugin-clipboard';
import { Stencil } from '@antv/x6-plugin-stencil';
import { History } from '@antv/x6-plugin-history'
-import { commonGraphPorts, commonGraphAttrs } from "./GraphConfig";
-
+import { Transform } from '@antv/x6-plugin-transform'
+import { commonGraphPorts, commonGraphAttrs, initGraphConnecting } from "./GraphConfig";
export const GraphComponent = React.forwardRef((props, ref) => {
const container = useRef(null);
@@ -24,31 +24,11 @@
function initGrap() {
ref.current = new Graph({
container: container.current,
- // width: document.documentElement.clientWidth,
- // height: document.documentElement.clientHeight,
- width: 200,
- height: 500,
- // grid: 1,
- connecting: {
- snap: true,
- createEdge() {
- return new Shape.Edge({
- attrs: {
- line: {
- stroke: '#a0a0a0',
- strokeWidth: 1,
- targetMarker: {
- name: 'classic',
- size: 8,
- },
- },
- },
- })
- },
- connector: 'smooth',
- allowMulti: true,
- allowPort: true,
- }
+ width: document.documentElement.clientWidth,
+ height: document.documentElement.clientHeight - 100,
+ // width: 200,
+ // height: 500,
+ connecting: initGraphConnecting,
});
const graph = ref.current;
@@ -95,6 +75,14 @@
}),
)
+ graph.use(
+ new Transform({
+ resizing: {
+ enabled: true
+ },
+ }),
+ )
+
props.initHandle();//閫氱煡鐖剁粍浠跺垵濮嬪寲瀹屾垚
return graph;
}
@@ -120,14 +108,13 @@
stencilContainer.current.appendChild(stencil.container)
-
-
const n1 = graph.createNode({
shape: "rect",
width: 80,
height: 40,
label: "榛樿缁勪欢",
attrs: commonGraphAttrs,
+ ports: commonGraphPorts
})
const n2 = graph.createNode({
@@ -136,6 +123,7 @@
height: 40,
label: "娴嬭瘯缁勪欢",
attrs: commonGraphAttrs,
+ ports: commonGraphPorts
})
stencil.load([n1, n2], 'group1')
@@ -173,12 +161,16 @@
})
graph.bindKey('ctrl+z', () => {
- graph.undo()
+ if (graph.canUndo()) {
+ graph.undo()
+ }
return false
})
graph.bindKey('ctrl+y', () => {
- graph.redo()
+ if (graph.canRedo()) {
+ graph.redo()
+ }
return false
})
@@ -189,6 +181,21 @@
})
return false
})
+
+ graph.on('node:mouseenter', ({ node }) => {
+ const ports = document.querySelectorAll(".x6-port-body")
+ for (let i = 0, len = ports.length; i < len; i += 1) {
+ ports[i].style.visibility = 'visible'
+ }
+ })
+
+ graph.on('node:mouseleave', ({ node }) => {
+ const ports = document.querySelectorAll(".x6-port-body")
+ for (let i = 0, len = ports.length; i < len; i += 1) {
+ ports[i].style.visibility = 'hidden'
+ }
+ })
+
}
return (
--
Gitblit v1.9.1