xyc
2024-10-12 9ccfd089b6cac9f8ba0cb7cadfee01857a715f0d
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": {
@@ -528,26 +528,26 @@
        imagesList: [
          {
            imgPath: 'switch',
            imgName: 'switch',
            imgName: '',
            nodeType: 'switch',
            imgWidth: 50,
            imgHeight: 50,
            imgId: '5',
            data: {}
          },
          {imgPath: 'vote', imgName: 'vote', nodeType: 'vote', imgWidth: 50, imgHeight: 50, imgId: '6', data: {}},
          {
            imgPath: 'parallel',
            imgName: 'parallel',
            nodeType: 'parallel',
            imgWidth: 50,
            imgHeight: 50,
            imgId: '9',
            data: {}
          },
          {imgPath: 'vote', imgName: '', nodeType: 'vote', imgWidth: 50, imgHeight: 50, imgId: '6', data: {}},
          {
            imgPath: 'parallel',
            imgName: '',
            nodeType: 'parallel',
            imgWidth: 50,
            imgHeight: 50,
            imgId: '5',
            data: {}
          },
          {
            imgPath: 'bridgeConnection',
            imgName: 'bridgeConnection',
            imgName: '',
            nodeType: 'bridgeConnection',
            imgWidth: 50,
            imgHeight: 50,
@@ -1926,6 +1926,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 +1941,7 @@
          router: {
            name: 'manhattan',
            args: {
              startDirections: ['right'], // 从下方开始
              startDirections: ['top','bottom'], // 从下方开始
              endDirections: ['left'],      // 向左方结束
            },
          },
@@ -1949,25 +1955,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 +1969,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 +2034,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 +2118,7 @@
              'xlink:href': '/modelImg/dashedBox.svg',
            },
            text: {
              text: 'dashedBox',
              text: '',
              fontSize: 14,
              refX: 0.5,
              refY: '100%',
@@ -2162,7 +2154,7 @@
              'xlink:href': '/modelImg/connect.svg',
            },
            text: {
              text: 'connect',
              text: '',
              fontSize: 14,
              refX: 0.5,
              refY: '100%',
@@ -2176,18 +2168,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: '',