| | |
| | | }, |
| | | data() { |
| | | return { |
| | | canAdd: true, |
| | | nodeX: '', |
| | | nodeY: '', |
| | | isFirstLoad: true, |
| | |
| | | }) |
| | | this.graph.centerContent() |
| | | const stencil = new Addon.Stencil({ |
| | | getDragNode: (node) => node.clone({keepId: true}), |
| | | //getDragNode: (node) => node.clone({keepId: true}), |
| | | getDropNode: (node) => { |
| | | this.canAdd = true |
| | | const {width, height} = node.size() |
| | | if (node.getData().type && node.getData().nodeType === 'dashedBox') { |
| | | return node.clone().size(60, 40) |
| | | } |
| | | if (node.getData().type && node.getData().type === 'imageNodes2') { |
| | | return node.clone({keepId: true}) |
| | | } else { |
| | | return node.clone() |
| | | const nodes = this.graph.getNodes() |
| | | let deviceNoArr = [] |
| | | // 检查除当前节点之外的所有节点的包围框是否相交 |
| | | for (const node2 of nodes) { |
| | | console.log(node2, 'saveDiagram node') |
| | | if (node2.getData().nodeType == 'node' && node2.getData().dataId) { |
| | | if (node2.getData().dataId == node.getData().dataId) { |
| | | deviceNoArr.push(node2.getData().deviceNo) |
| | | } |
| | | } |
| | | } |
| | | let no = 0 |
| | | console.log(node, 'node') |
| | | console.log(deviceNoArr, 'deviceNoArr') |
| | | for (let i = 1; i <= node.getData().basicUnitNum; i++) { |
| | | if (deviceNoArr.findIndex(item => item === i) === -1) { |
| | | no = i |
| | | node.getData().deviceNo = i |
| | | node.attr('text/text', node.attr('text/text') + '-' + i) |
| | | break |
| | | } |
| | | } |
| | | if (no === 0) { |
| | | this.canAdd = false |
| | | } |
| | | } |
| | | return node.clone() |
| | | |
| | | }, |
| | | validateNode: (node) => { |
| | | const existingNodes = this.graph.getNodes(); // 获取画布上所有节点 |
| | | for (const existingNode of existingNodes) { |
| | | if (existingNode.id === node.id) { |
| | | if (!this.canAdd) { |
| | | this.$message({message: '该设备节点已在画布上,无法再次绘制', type: 'warning'}) |
| | | return false; // 取消添加节点操作 |
| | | return false |
| | | } |
| | | } |
| | | |
| | | }, |
| | | title: '', |
| | | target: this.graph, |
| | |
| | | //imageUrl: `${window.SITE_CONFIG['apiURL']}/sysPictureBase/getProductImg?token=${Cookies.get('token')}&id=${item.imgPath}`, |
| | | width: 60, |
| | | height: 60, |
| | | id: item.dataId, // 手动设置节点的 ID |
| | | //id: item.dataId, // 手动设置节点的 ID |
| | | data: { |
| | | type: 'imageNodes2', |
| | | dataId: item.dataId, |
| | | basicUnitNum: item.basicUnitNum, |
| | | deviceNo: 0, |
| | | nodeType: item.nodeType, |
| | | nodeTypeExt: item.nodeTypeExt, |
| | | productType: item.productType, |
| | |
| | | } |
| | | const nodeType = node.getData().nodeType; // 获取节点的类型 |
| | | const nodeObj = node |
| | | console.log(123) |
| | | console.log(node.id, 'node.id') |
| | | let intersectNode = this.findIntersectsNode(node) |
| | | if (intersectNode) { // 当有节点相交 ==>并行 |
| | | this.addBranch(intersectNode, nodeObj) |