diff --git a/src/components/common/flow/flowView.vue b/src/components/common/flow/flowView.vue index 6351991..e6dbd29 100644 --- a/src/components/common/flow/flowView.vue +++ b/src/components/common/flow/flowView.vue @@ -23,14 +23,12 @@
-
-
+
- + - diff --git a/src/views/simulation/creation/components/nodeEvents.ts b/src/views/simulation/creation/components/nodeEvents.ts index 4c90bdb..57a246a 100644 --- a/src/views/simulation/creation/components/nodeEvents.ts +++ b/src/views/simulation/creation/components/nodeEvents.ts @@ -14,16 +14,12 @@ let selectNode: any = null; export const initNodeEvents = (graph: any) => { graph.on('node:mouseenter', () => { const container = document.getElementById(FLOW_CREATE_ID)!; - const ports = container.querySelectorAll( - '.x6-port-body' - ) as NodeListOf; + const ports = container.querySelectorAll('.x6-port-body') as NodeListOf; showPorts(ports, true); }); graph.on('node:mouseleave', () => { const container = document.getElementById(FLOW_CREATE_ID)!; - const ports = container.querySelectorAll( - '.x6-port-body' - ) as NodeListOf; + const ports = container.querySelectorAll('.x6-port-body') as NodeListOf; showPorts(ports, false); }); graph.on('node:selected', () => { @@ -31,21 +27,18 @@ export const initNodeEvents = (graph: any) => { // const flowElement = document.getElementById('flow-create-content') as HTMLElement; // flowElement.tabIndex = -1; // flowElement.focus(); - }); - graph.on('node:unselected', ({ node }:any) => { + graph.on('node:unselected', ({ node }: any) => { console.log('unselected node', node); node.removeTools(); const container = document.getElementById(FLOW_CREATE_ID)!; - const ports = container.querySelectorAll( - '.x6-port-body' - ) as NodeListOf; + const ports = container.querySelectorAll('.x6-port-body') as NodeListOf; showPorts(ports, false); drawerVisible.value = false; selectNode = null; }); - graph.on('node:click', ({ node }:any) => { + graph.on('node:click', ({ node }: any) => { console.log('click node', node, node.data); if (node.data.isApp) { drawerVisible.value = true; @@ -73,6 +66,24 @@ export const initNodeEvents = (graph: any) => { }, }); }); + graph.on('edge:click', ({ edge }: any) => { + // graph.cleanSelection(); + edge.addTools({ + name: 'boundary', + args: { + padding: 5, + attrs: { + // fill: '#7c68fc', + stroke: '#333', + 'stroke-width': 0.5, + 'fill-opacity': 0.2, + }, + }, + }); + }); + graph.on('edge:unselected', ({ edge }: any) => { + edge.removeTools(); + }); }; export const useNodeEvents = () => { @@ -128,12 +139,15 @@ const zoomOutFun = (graph: any) => { const xAlign = (graph: any) => { const nodes = graph.getSelectedCells(); if (nodes.length > 2) { - nodes.sort((a:any, b:any) => { + nodes.sort((a: any, b: any) => { return a.position().x - b.position().x; }); const xLength = nodes[1].position().x - nodes[0].position().x - nodes[0].size().width; for (let index = 2; index < nodes.length; index++) { - nodes[index].position(nodes[index - 1].position().x + nodes[index - 1].size().width + xLength, nodes[index].position().y); + nodes[index].position( + nodes[index - 1].position().x + nodes[index - 1].size().width + xLength, + nodes[index].position().y + ); } } else { ElMessage.warning('请框选超过 2 个节点!'); @@ -185,7 +199,7 @@ export const nodeAttribute = reactive({ pageConfigList: [], }); -export const updateNodeAttribute = (val:any) => { +export const updateNodeAttribute = (val: any) => { for (const key in val) { nodeAttribute[key] = val[key]; } @@ -193,4 +207,3 @@ export const updateNodeAttribute = (val:any) => { selectNode.setData(nodeAttribute); } }; - diff --git a/src/views/task/projectDetail/components/loadcase.vue b/src/views/task/projectDetail/components/loadcase.vue index 8e7d29d..cde70aa 100644 --- a/src/views/task/projectDetail/components/loadcase.vue +++ b/src/views/task/projectDetail/components/loadcase.vue @@ -1,6 +1,5 @@ - - + @@ -105,26 +65,40 @@ - + - + - +