From 664db98c9e8595ce4dd636a27f480e3a08b81ff5 Mon Sep 17 00:00:00 2001
From: xyc <jc_xiong@hotmail.com>
Date: 星期五, 21 二月 2025 11:13:51 +0800
Subject: [PATCH] 新增可忽略的维修时间

---
 web/src/views/modules/taskReliability/RBD-edit-img.vue |  391 ++++++++++++++++++++++++++++++++++---------------------
 1 files changed, 243 insertions(+), 148 deletions(-)

diff --git a/web/src/views/modules/taskReliability/RBD-edit-img.vue b/web/src/views/modules/taskReliability/RBD-edit-img.vue
index 21089cb..a83d7e4 100644
--- a/web/src/views/modules/taskReliability/RBD-edit-img.vue
+++ b/web/src/views/modules/taskReliability/RBD-edit-img.vue
@@ -1,14 +1,14 @@
 <template>
   <div>
     <el-row :gutter="[8,8]">
-      <el-col :span="3">
+      <el-col :span="4">
         <div :style="'height:' +left_p+'px'">
           <div style="height: 100%">
             <div id="stencilImg"></div>
           </div>
         </div>
       </el-col>
-      <el-col :span="21">
+      <el-col :span="20">
         <div class="fa-card-a">
           <el-form :inline="true">
             <el-form-item>
@@ -18,7 +18,10 @@
               <el-button type="primary" @click="saveDiagram()">鏆傚瓨</el-button>
               <el-button type="primary" @click="analyzeDiagram()">鎻愪氦</el-button>
               <el-button type="primary" @click="clearDiagram()">娓呯┖鍥惧舰</el-button>
-              <el-button type="primary" @click="layoutDiagram()">涓�閿帓鐗�</el-button>
+              <el-checkbox style="margin: 0 10px 0 10px" v-model="dataForm.autoLayout" :true-label="1" :false-label="0">
+                鏄惁寮�鍚竴閿帓鐗�
+              </el-checkbox>
+              <el-button type="primary" @click="layoutDiagram()" :disabled="!dataForm.autoLayout">涓�閿帓鐗�</el-button>
               <el-button @click="leftAlign()">
                 <i style="font-size: 1rem;" class="wt-iconfont icon-zuoduiqi"></i>
               </el-button>
@@ -109,7 +112,7 @@
                 "text": {
                   "refY": "100%",
                   "textVerticalAnchor": "top",
-                  "text": "start",
+                  "text": "",
                   "refY2": 4
                 },
                 "image": {
@@ -232,7 +235,7 @@
                 "text": {
                   "refY": "100%",
                   "textVerticalAnchor": "top",
-                  "text": "dashedBox",
+                  "text": "",
                   "refY2": 4
                 },
                 "image": {
@@ -260,7 +263,7 @@
                         "r": 4,
                         "magnet": true,
                         "stroke": "#5F95FF",
-                        "strokeWidth": 1,
+
                         "fill": "#fff",
                         "style": {
                           "visibility": "hidden"
@@ -354,7 +357,7 @@
                 "text": {
                   "refY": "100%",
                   "textVerticalAnchor": "top",
-                  "text": "end",
+                  "text": "",
                   "refY2": 4
                 },
                 "image": {
@@ -514,6 +517,7 @@
     },
     data() {
       return {
+        canAdd: true,
         nodeX: '',
         nodeY: '',
         isFirstLoad: true,
@@ -528,17 +532,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 +551,7 @@
           },
           {
             imgPath: 'bridgeConnection',
-            imgName: 'bridgeConnection',
+            imgName: '',
             nodeType: 'bridgeConnection',
             imgWidth: 50,
             imgHeight: 50,
@@ -575,7 +579,8 @@
           publishContent: null,
           hasPublish: 0,
           urlPref: '',
-          nodeArr: []
+          nodeArr: [],
+          autoLayout: 1,
         },
         type: '',
         id: '',
@@ -753,6 +758,7 @@
         }
         let res = await this.$http.get(`/taskReliability/ModelLine/getDiagram`, {params: params})
         this.dataForm = res.data
+        this.dataForm.autoLayout = parseInt(this.dataForm.autoLayout)
         if (res.data.content != null) {
           console.log(this.dataForm, 'getDiagram datafrom')
           console.log(res.data, 'getDiagram res.data')
@@ -905,30 +911,56 @@
         })
         this.graph.centerContent()
         const stencil = new Addon.Stencil({
-          getDragNode: (node) => node.clone({keepId: true}),
+          // getDragNode: (node) => {
+          // node.removeAttrs('title')
+          // },
           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
+                  if (node.getData().basicUnitNum >= 1) {
+                    node.getData().deviceNo = i
+                    if(node.getData().deviceNo > 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,
-          stencilGraphWidth: 200,
+          stencilGraphWidth: 240,
           stencilGraphHeight: 280,
           collapsable: true,
           groups: [
@@ -942,13 +974,13 @@
               name: 'group2',
               graphHeight: '',
               layoutOptions: {
-                rowHeight: 90,
+                rowHeight: 100,
               },
             }
           ],
           layoutOptions: {
             columns: 2,
-            columnWidth: 105,
+            columnWidth: 130,
           },
         })
         document.getElementById('stencilImg').appendChild(stencil.container)
@@ -1002,11 +1034,13 @@
             shape: 'image',
             //imageUrl: `${window.SITE_CONFIG['apiURL']}/sysPictureBase/getProductImg?token=${Cookies.get('token')}&id=${item.imgPath}`,
             width: 60,
-            height: 60,
-            id: item.dataId, // 鎵嬪姩璁剧疆鑺傜偣鐨� ID
+            height: 70,
+            //id: item.dataId, // 鎵嬪姩璁剧疆鑺傜偣鐨� ID
             data: {
               type: 'imageNodes2',
               dataId: item.dataId,
+              basicUnitNum: item.basicUnitNum,
+              deviceNo: 1,
               nodeType: item.nodeType,
               nodeTypeExt: item.nodeTypeExt,
               productType: item.productType,
@@ -1030,43 +1064,68 @@
             },
             attrs: {
               image: {
-                'xlink:href': `${window.SITE_CONFIG['apiURL']}/sysPictureBase/getSvgImage?token=${Cookies.get('token')}&id=${item.imgPath}`,
+                'xlink:href': `${window.SITE_CONFIG['apiURL']}/basicInfo/XhProductModel/getImg?token=${Cookies.get('token')}&id=${item.dataId}&t=${new Date().getTime()}`,
                 //'xlink:href': urlObject.createObjectURL(new Blob([item.svgContent])),
+              },
+              title: {
+                text: item.basicUnitNum > 1 ? item.basicUnitNum : '',
+                refX: 15,
+                refY: 10,
+                fill: '#748be7',
+                fontSize: 14,
+                fontWeight: 'bold',
+                'text-anchor': 'start',
               },
               text: {
                 text: item.imgName,
                 fontSize: 14,
-                style: {
-                  color: this.globalGridAttr.nodeColor
-                },
                 refX: 0.5,
-                refY: '100%',
+                refY: '85%',
                 refY2: 4,
                 textAnchor: 'middle',
                 textVerticalAnchor: 'top',
+                textWrap: {
+                  width: 120,      // 瀹藉害涓� 120px鎹㈣
+                  ellipsis: false,  // 鏂囨湰瓒呭嚭鏄剧ず鑼冨洿鏃讹紝鑷姩娣诲姞鐪佺暐鍙�
+                  breakWord: true, // 鏄惁鎴柇鍗曡瘝
+                }
               },
             },
-            tools: [
+            markup: [
               {
-                name: 'button',
-                args: {
-                  markup: [
-                    {
-                      tagName: 'image',
-                      selector: 'icon',
-                      attrs: {
-                        // 'xlink:href': 'https://gw.alipayobjects.com/mdn/rms_43231b/afts/img/A*evDjT5vjkX0AAAAAAAAAAAAAARQnAQ',
-                        'xlink:href': item.statusImg,
-                        width: 30,
-                        height: 30,
-                        x: 0,
-                        y: 0
-                      }
-                    }
-                  ]
-                }
-              }
+                tagName: 'image',
+                selector: 'image',
+              },
+              {
+                tagName: 'text',
+                selector: 'title',
+              },
+              {
+                tagName: 'text',
+                selector: 'text',
+              },
             ],
+            // tools: [
+            //   {
+            //     name: 'button',
+            //     args: {
+            //       markup: [
+            //         {
+            //           tagName: 'image',
+            //           selector: 'icon',
+            //           attrs: {
+            //             'xlink:href': 'https://gw.alipayobjects.com/mdn/rms_43231b/afts/img/A*evDjT5vjkX0AAAAAAAAAAAAAARQnAQ',
+            //             // 'xlink:href': item.statusImg,
+            //             width: 30,
+            //             height: 30,
+            //             x: 0,
+            //             y: 0
+            //           }
+            //         }
+            //       ]
+            //     }
+            //   }
+            // ],
             ports: {...this.ports},
           }),
         )
@@ -1166,6 +1225,9 @@
         })
         // 鐩戝惉鑺傜偣娣诲姞浜嬩欢
         this.graph.on('node:added', ({node}) => {
+          node.setAttrs({
+            title: {text: ''},
+          })
           if (this.isFirstLoad) {
             return
           }
@@ -1174,7 +1236,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 +1549,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,33 +1580,35 @@
         await this.$http['post'](`/taskReliability/ModelLine/analyze`, this.dataForm).then(async res => {
           if (res.msg === 'success') {
             this.$emit('refreshDataList')
-            this.$alert('瑙f瀽鎴愬姛', '鎻愮ず', {
+            this.$alert('鎻愪氦鎴愬姛', '鎻愮ず', {
               confirmButtonText: '纭畾'
             })
           }
         })
       },
       async layoutDiagram() {
-        console.log(JSON.stringify(this.graph.toJSON()), 'graph.toJSON()')
-        this.dataForm.content = JSON.stringify(this.graph.toJSON())
-        this.dataForm.urlPref = window.SITE_CONFIG['apiURL']
-        await this.$http['post'](`/taskReliability/ModelLine/layout`, this.dataForm).then(async res => {
-          if (res.msg === 'success') {
-            // this.$emit('refreshDataList')
-            // this.$alert('瑙f瀽鎴愬姛', '鎻愮ず', {
-            //   confirmButtonText: '纭畾'
-            // })
-            console.log(res.data, 'layoutDiagram res.data')
-            this.dataForm.content = res.data.content
-            console.log(this.dataForm.content, 'layoutDiagram dataForm.content')
-            this.diagramJson = JSON.parse(this.dataForm.content)
-            this.graph.fromJSON(this.diagramJson)
-            this.isFirstLoad = false;
-            // console.log(this.diagramJson.cells.length, 'this.diagramJson.cells.length')
+        if (this.dataForm.autoLayout == 1) {
+          console.log(JSON.stringify(this.graph.toJSON()), 'graph.toJSON()')
+          this.dataForm.content = JSON.stringify(this.graph.toJSON())
+          this.dataForm.urlPref = window.SITE_CONFIG['apiURL']
+          await this.$http['post'](`/taskReliability/ModelLine/layout`, this.dataForm).then(async res => {
+            if (res.msg === 'success') {
+              // this.$emit('refreshDataList')
+              // this.$alert('瑙f瀽鎴愬姛', '鎻愮ず', {
+              //   confirmButtonText: '纭畾'
+              // })
+              console.log(res.data, 'layoutDiagram res.data')
+              this.dataForm.content = res.data.content
+              console.log(this.dataForm.content, 'layoutDiagram dataForm.content')
+              this.diagramJson = JSON.parse(this.dataForm.content)
+              this.graph.fromJSON(this.diagramJson)
+              this.isFirstLoad = false;
+              // console.log(this.diagramJson.cells.length, 'this.diagramJson.cells.length')
 
-            this.graph.positionContent('left')
-          }
-        })
+              this.graph.positionContent('left')
+            }
+          })
+        }
       },
       leftAlign() {
         const NODE = this.graph.getSelectedCells()
@@ -1669,7 +1748,7 @@
         let dragNodeType = dragNode.getData().nodeType
         let offHeight = 50
         if (dragNodeType === 'node') {
-          offHeight = 60
+          offHeight = 70
         } else if (dragNodeType === 'bridgeConnection') {
           offHeight = 175
         } else {
@@ -1706,9 +1785,11 @@
             inEdges[0].target = {cell: result.newStartNode.id}
             outEdges[0].source = {cell: result.newEndNode.id}
             graphNode.remove()
-            if (!result.canPlace) {
-//璋冪敤鑷姩鎺掔増
-              this.layoutDiagram()
+            if (this.dataForm.autoLayout == 1) {
+              if (!result.canPlace) {
+                //璋冪敤鑷姩鎺掔増
+                this.layoutDiagram()
+              }
             }
           }
         } else { //骞惰缁撴瀯
@@ -1727,13 +1808,13 @@
           this.getYRange(inEdges, graphNodeStartNode, pointXY)
           console.log(pointXY, 'new')
 
-          let minX = graphNodeStartNode.position().x + graphNode.getBBox().width + 15
-          let maxX = graphNode.position().x
+          let minX = graphNodeStartNode.position().x + graphNode.getBBox().width
+          let maxX = graphNode.position().x - dragNode.getBBox().width / 2
           let centerX = minX + (maxX - minX) / 2
           let centerY = graphNodeY + graphNode.getBBox().height / 2 - pointXY.minY > pointXY.maxY - (graphNodeY + graphNode.getBBox().height / 2) ?
             pointXY.maxY + offHeight / 2 + 30 : pointXY.minY - offHeight / 2 - 30
 
-          let result = this.addNodeAndConnect(null, dragNode, minX, centerY)
+          let result = this.addNodeAndConnect(null, dragNode, centerX, centerY)
           console.log(result, 'result111')
           this.graph.addEdge({
             source: {cell: graphNodeStartNode},
@@ -1761,9 +1842,11 @@
             connector: {name: 'rounded'},
             zIndex: -1
           })
-          if (!result.canPlace) {
-//璋冪敤鑷姩鎺掔増
-            this.layoutDiagram()
+          if (this.dataForm.autoLayout == 1) {
+            if (!result.canPlace) {
+              //璋冪敤鑷姩鎺掔増
+              this.layoutDiagram()
+            }
           }
         }
       },
@@ -1774,8 +1857,8 @@
           leftTopY = centerY
         let dragNodeType = dragNode.getData().nodeType
         if (dragNodeType === 'node') {
-          width = 60
-          height = 60
+          width = 100
+          height = 70
         } else if (dragNodeType === 'dashedBox') {
           width = 60
           height = 40
@@ -1784,7 +1867,7 @@
           height = 175
         } else {
           width = 270
-          height = 60
+          height = 70
         }
         leftTopX = centerX - width / 2
         leftTopY = centerY - height / 2
@@ -1893,8 +1976,11 @@
             })
             graphEdge.source = {cell: result.newEndNode.id}
           }
-          if (!result.canPlace) {
-            this.layoutDiagram()
+          if (this.dataForm.autoLayout == 1) {
+            if (!result.canPlace) {
+              //璋冪敤鑷姩鎺掔増
+              this.layoutDiagram()
+            }
           }
           // graphEdge.remove()
         }
@@ -1926,6 +2012,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 +2027,7 @@
           router: {
             name: 'manhattan',
             args: {
-              startDirections: ['right'], // 浠庝笅鏂瑰紑濮�
+              startDirections: ['top', 'bottom'], // 浠庝笅鏂瑰紑濮�
               endDirections: ['left'],      // 鍚戝乏鏂圭粨鏉�
             },
           },
@@ -1949,25 +2041,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 +2055,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 +2120,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 +2204,7 @@
               'xlink:href': '/modelImg/dashedBox.svg',
             },
             text: {
-              text: 'dashedBox',
+              text: '',
               fontSize: 14,
               refX: 0.5,
               refY: '100%',
@@ -2162,7 +2240,7 @@
               'xlink:href': '/modelImg/connect.svg',
             },
             text: {
-              text: 'connect',
+              text: '',
               fontSize: 14,
               refX: 0.5,
               refY: '100%',
@@ -2176,18 +2254,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: '',
@@ -2402,7 +2481,7 @@
 <style>
   #containerImg {
     display: flex;
-    border: 1px solid #dfe3e8;
+    /*border: 1px solid #dfe3e8;*/
     height: 400px;
     width: 100% !important;
   }
@@ -2436,4 +2515,20 @@
     top: 0
   }
 
+  #containerImg .x6-graph-pagebreak>.x6-graph-pagebreak-horizontal {
+    position: absolute;
+    right: 0;
+    left: 0;
+    box-sizing: border-box;
+    height: 0;
+    border-top: none;
+  }
+  #containerImg .x6-graph-pagebreak>.x6-graph-pagebreak-vertical {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    box-sizing: border-box;
+    width: 0;
+    border-left: none;
+  }
 </style>

--
Gitblit v1.9.1