jinlin
2024-10-22 26ebef24f023a80f5be5ff27c93585f70688f6ee
web/src/views/modules/taskReliability/RBD-edit-img.vue
@@ -109,7 +109,7 @@
                "text": {
                  "refY": "100%",
                  "textVerticalAnchor": "top",
                  "text": "start",
                  "text": "",
                  "refY2": 4
                },
                "image": {
@@ -232,7 +232,7 @@
                "text": {
                  "refY": "100%",
                  "textVerticalAnchor": "top",
                  "text": "dashedBox",
                  "text": "",
                  "refY2": 4
                },
                "image": {
@@ -260,7 +260,7 @@
                        "r": 4,
                        "magnet": true,
                        "stroke": "#5F95FF",
                        "strokeWidth": 1,
                        "fill": "#fff",
                        "style": {
                          "visibility": "hidden"
@@ -354,7 +354,7 @@
                "text": {
                  "refY": "100%",
                  "textVerticalAnchor": "top",
                  "text": "end",
                  "text": "",
                  "refY2": 4
                },
                "image": {
@@ -514,6 +514,7 @@
    },
    data() {
      return {
        canAdd: true,
        nodeX: '',
        nodeY: '',
        isFirstLoad: true,
@@ -528,17 +529,17 @@
        imagesList: [
          {
            imgPath: 'switch',
            imgName: 'switch',
            imgName: '',
            nodeType: 'switch',
            imgWidth: 50,
            imgHeight: 50,
            imgId: '9',
            data: {}
          },
          {imgPath: 'vote', imgName: 'vote', nodeType: 'vote', imgWidth: 50, imgHeight: 50, imgId: '6', data: {}},
          {imgPath: 'vote', imgName: '', nodeType: 'vote', imgWidth: 50, imgHeight: 50, imgId: '6', data: {}},
          {
            imgPath: 'parallel',
            imgName: 'parallel',
            imgName: '',
            nodeType: 'parallel',
            imgWidth: 50,
            imgHeight: 50,
@@ -547,7 +548,7 @@
          },
          {
            imgPath: 'bridgeConnection',
            imgName: 'bridgeConnection',
            imgName: '',
            nodeType: 'bridgeConnection',
            imgWidth: 50,
            imgHeight: 50,
@@ -905,26 +906,48 @@
        })
        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()
            }
          },
          validateNode: (node) => {
            const existingNodes = this.graph.getNodes(); // 获取画布上所有节点
            for (const existingNode of existingNodes) {
              if (existingNode.id === node.id) {
                this.$message({message: '该设备节点已在画布上,无法再次绘制', type: 'warning'})
                return false; // 取消添加节点操作
              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
                  if (node.getData().basicUnitNum>1){
                    node.attr('text/text', node.attr('text/text') + '-' + i)
                  }
                  break
                }
              }
              if (no === 0) {
                this.canAdd = false
              }
            }
            return node.clone()
          },
          validateNode: (node) => {
            if (!this.canAdd) {
              this.$message({message: '该设备节点已在画布上,无法再次绘制', type: 'warning'})
              return false
            }
          },
          title: '',
          target: this.graph,
@@ -1003,10 +1026,12 @@
            //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,
@@ -1174,7 +1199,7 @@
          }
          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)
@@ -1487,14 +1512,29 @@
        const nodes = this.graph.getNodes()
        for (const node of nodes) {
          if (node.getData().nodeType === 'dashedBox') {
            this.$message({message: '该模型中存在虚框,无法保存', type: 'warning'})
            return false; // 取消添加节点操作
            this.$message({message: '该模型中存在虚框,无法提交', type: 'warning'})
            return false;
          }
          if (node.getData().nodeType === 'vote') {
            const edges = this.graph.getConnectedEdges(node);
            if (node.getData().voteNum === null || node.getData().voteNum === '') {
              this.$message({message: '表决节点的表决数量未设置', type: 'warning'})
              return false;
            }
            const edges = this.graph.getIncomingEdges(node);
            if (node.getData().voteNum >= edges.length) {
              this.$message({message: '表决数量不能高于该节点的进线数量', type: 'warning'})
              return false; // 取消添加节点操作
              this.$message({message: '表决节点的表决数量必须小于该节点的进线数量', type: 'warning'})
              return false;
            }
          }
          if (node.getData().nodeType === 'switch') {
            if (node.getData().voteNum === null || node.getData().voteNum === '') {
              this.$message({message: '旁联节点的备份数量未设置', type: 'warning'})
              return false;
            }
            const edges = this.graph.getIncomingEdges(node);
            if (node.getData().voteNum >= edges.length) {
              this.$message({message: '旁联节点的备份数量必须小于该节点的进线数量', type: 'warning'})
              return false;
            }
          }
        }
@@ -1503,7 +1543,7 @@
        await this.$http['post'](`/taskReliability/ModelLine/analyze`, this.dataForm).then(async res => {
          if (res.msg === 'success') {
            this.$emit('refreshDataList')
            this.$alert('解析成功', '提示', {
            this.$alert('提交成功', '提示', {
              confirmButtonText: '确定'
            })
          }
@@ -1926,6 +1966,12 @@
      createParallelBrach(x, y, dragNode) {
        dragNode.position(x + 320, y - dragNode.size().height / 2)
        const connectNode = this.createConnectNode(x + 50, y)
        this.createBrach(dragNode, connectNode, x, y - 50)
        this.createBrach(dragNode, connectNode, x, y + 50)
        return {newStartNode: connectNode, newEndNode: dragNode}
      },
      createBrach(dragNode, connectNode, x, y) {
        const dashedBox = this.createDashedBox(x + 150, y)
        dragNode.setData({startNodeId: connectNode.id})
@@ -1935,7 +1981,7 @@
          router: {
            name: 'manhattan',
            args: {
              startDirections: ['right'], // 从下方开始
              startDirections: ['top', 'bottom'], // 从下方开始
              endDirections: ['left'],      // 向左方结束
            },
          },
@@ -1949,25 +1995,12 @@
            name: 'manhattan',
            args: {
              startDirections: ['right'], // 从下方开始
              endDirections: ['left'],      // 向左方结束
              endDirections: ['top', 'bottom'],      // 向左方结束
            },
          },
          connector: {name: 'rounded'},
          zIndex: -1
        })
        return {newStartNode: connectNode, newEndNode: dragNode}
        /*        this.graph.addEdge({
                  source: {cell: startNode, port: 'right1'},
                  target: {cell: connectNode, port: 'left1'},
                  router: {name: 'manhattan'},
                  connector: {name: 'rounded'}
                })
                this.graph.addEdge({
                  source: {cell: dragNode, port: 'right1'},
                  target: {cell: endNode, port: 'left1'},
                  router: {name: 'manhattan'},
                  connector: {name: 'rounded'}
                })*/
      },
      createBridgeConnection(x, y, dragNode) {
        console.log(x, y, 'leftX centerY')
@@ -1976,10 +2009,36 @@
        const leftConnectNode = this.createConnectNode(x, y + 87)
        const alignCenterDashedBox = this.createDashedBox(x + 209, y + 87)
        const rightConnectNode = this.createBridgeNode(x + 530, y + 87)
        const leftBottomDashedBox = this.createDashedBox(x + 40, y + 160)
        const rightBottomDashedBox = this.createDashedBox(x + 380, y + 160)
        let edgeTop = this.graph.addEdge({
          source: {cell: leftTopDashedBox},
          target: {cell: rightTopDashedBox},
          router: {
            name: 'manhattan',
            args: {
              startDirections: ['right'], // 从下方开始
              endDirections: ['left'],      // 向左方结束
            },
          },
          connector: {name: 'rounded'},
          zIndex: -1
        })
        let edgeBottom = this.graph.addEdge({
          source: {cell: leftBottomDashedBox},
          target: {cell: rightBottomDashedBox},
          router: {
            name: 'manhattan',
            args: {
              startDirections: ['right'], // 从下方开始
              endDirections: ['left'],      // 向左方结束
            },
          },
          connector: {name: 'rounded'},
          zIndex: -1
        })
        const rightConnectNode = this.createBridgeNode(x + 530, y + 87, leftConnectNode.id, edgeTop.id, edgeBottom.id)
        rightConnectNode.setData({startNodeId: leftConnectNode.id})
        leftConnectNode.setData({endNodeId: rightConnectNode.id})
@@ -2015,33 +2074,6 @@
            name: 'manhattan',
            args: {
              startDirections: ['top', 'bottom'], // 从下方开始
              endDirections: ['left'],      // 向左方结束
            },
          },
          connector: {name: 'rounded'},
          zIndex: -1
        })
        let edgeTop = this.graph.addEdge({
          source: {cell: leftTopDashedBox},
          target: {cell: rightTopDashedBox},
          router: {
            name: 'manhattan',
            args: {
              startDirections: ['right'], // 从下方开始
              endDirections: ['left'],      // 向左方结束
            },
          },
          connector: {name: 'rounded'},
          zIndex: -1
        })
        let edgeBottom = this.graph.addEdge({
          source: {cell: leftBottomDashedBox},
          target: {cell: rightBottomDashedBox},
          router: {
            name: 'manhattan',
            args: {
              startDirections: ['right'], // 从下方开始
              endDirections: ['left'],      // 向左方结束
            },
          },
@@ -2126,7 +2158,7 @@
              'xlink:href': '/modelImg/dashedBox.svg',
            },
            text: {
              text: 'dashedBox',
              text: '',
              fontSize: 14,
              refX: 0.5,
              refY: '100%',
@@ -2162,7 +2194,7 @@
              'xlink:href': '/modelImg/connect.svg',
            },
            text: {
              text: 'connect',
              text: '',
              fontSize: 14,
              refX: 0.5,
              refY: '100%',
@@ -2176,18 +2208,19 @@
        connectNode.position(x, y - connectNode.size().height / 2)
        return connectNode
      },
      createBridgeNode(x, y) {
        const connectId = getUUID().toString()
      createBridgeNode(x, y, connectId, edgeTopId, edgeBottomId) {
        const dragNodeId = getUUID().toString()
        let bridgeNode = this.graph.addNode({
          shape: 'image',
          width: 30,
          height: 30,
          id: connectId,
          id: dragNodeId,
          data: {
            isSelfCreated: true,
            type: 'imageNodes',
            endNodeId: dragNodeId,
            startNodeId: connectId,
            edgeTopId: edgeTopId,
            edgeBottomId: edgeBottomId,
            dataId: '',
            nodeType: 'bridge',
            nodeTypeExt: '',