From 12b1901605e51506a0fde960a376eb8fc6b2a593 Mon Sep 17 00:00:00 2001 From: jinlin <jinlin> Date: 星期四, 07 三月 2024 08:57:03 +0800 Subject: [PATCH] 修改 --- web/src/views/modules/taskReliability/RBD-edit-img.vue | 71 ++++++++++++++++++++++++++--------- 1 files changed, 53 insertions(+), 18 deletions(-) diff --git a/web/src/views/modules/taskReliability/RBD-edit-img.vue b/web/src/views/modules/taskReliability/RBD-edit-img.vue index df2d1ef..60d4d7e 100644 --- a/web/src/views/modules/taskReliability/RBD-edit-img.vue +++ b/web/src/views/modules/taskReliability/RBD-edit-img.vue @@ -1,25 +1,30 @@ <template> <div> <el-row :gutter="[8,8]"> - <el-col :span="5"> + <el-col :span="4"> <div :style="'height:' +left_p+'px'"> <div class="fa-card-a" style="height: 100%"> <div id="stencilImg"></div> </div> </div> </el-col> - <el-col :span="19"> + <el-col :span="20"> <div class="fa-card-a"> <el-form :inline="true"> <el-form-item> - modelId - <el-input placeholder="鎼滅储鏂藉伐鍐呭" v-model="dataForm.modelId" clearable class="input-with-select"> + 妯″瀷ID + </el-form-item> + <el-form-item> + <el-input placeholder="鎼滅储妯″瀷ID" v-model="dataForm.modelId" clearable class="input-with-select"> <el-button slot="append" icon="el-icon-search" @click="search()"></el-button> </el-input> - - <el-button type="primary" @click="saveDiagram()">淇濆瓨</el-button> - <el-button type="primary" @click="analyzeDiagram()">瑙f瀽</el-button> </el-form-item> + + <el-form-item> + <el-button type="primary" @click="saveDiagram()">淇濆瓨</el-button> + <el-button type="primary" @click="analyzeDiagram()">瑙f瀽</el-button> + <el-button type="primary" @click="clearDiagram()">娓呯┖鍥惧舰</el-button> + </el-form-item> <el-form-item> <el-tooltip class="item" effect="dark" content="宸﹀榻�" placement="left"> <el-button class="" style="margin-left: 0;padding: 2px;border: 1px solid #5F95FF;" @@ -115,13 +120,14 @@ imgsList:[ {imgPath:'start',imgName:'start',nodeType:'start',imgWidth:60,imgHeight:60,imgId:'1',data:{}}, {imgPath:'end',imgName:'end',nodeType:'end',imgWidth:60,imgHeight:60,imgId:'2',data:{}}, + // {imgPath:'connect',imgName:'connect',nodeType:'connect',imgWidth:30,imgHeight:30,imgId:'3',data:{}}, // {imgPath:'parallelLeft',imgName:'parallelLeft',nodeType:'parallelLeft',imgWidth:60,imgHeight:60,imgId:'3',data:{}}, {imgPath:'parallelRight',imgName:'parallel',nodeType:'parallel',imgWidth:60,imgHeight:60,imgId:'4',data:{}}, {imgPath:'switchRight',imgName:'switch',nodeType:'switch',imgWidth:60,imgHeight:60,imgId:'5',data:{}}, {imgPath:'voteRight',imgName:'vote',nodeType:'vote',imgWidth:60,imgHeight:60,imgId:'6',data:{}}, ], imgsList2:[ - {imgPath:'logo',imgName:'logo',nodeType:'node',imgWidth:60,imgHeight:60,imgId:'100',data:{dataId:'123456',nodeTypeExt:''}}, + {imgPath:'logo',imgName:'logo',nodeType:'node',statusImg:'',imgWidth:60,imgHeight:60,imgId:'100',data:{dataId:'123456',nodeTypeExt:''}}, ], nodeType:'', first: true, @@ -175,6 +181,8 @@ id: '', graph: null, globalGridAttr: { + statusImg:'', + nodeTypeExt:'', type: 'mesh', size: 10, color: '#e5e5e5', @@ -392,6 +400,14 @@ // this.diagramIdChange(this.diagramId) this.getDiagram() },*/ + async clearDiagram() { + this.dataForm.id = null + // this.graph.fromJSON(this.emptyJson) + this.graph.fromJSON('') + this.graph.centerContent() + this.graph.zoomToFit() + // this.graph.freeze() + }, async getDiagram() { let params = { modelId : this.dataForm.modelId @@ -407,11 +423,7 @@ this.graph.centerContent() this.graph.zoomToFit() } else { - this.dataForm.id = null - // this.graph.fromJSON(this.emptyJson) - this.graph.centerContent() - this.graph.zoomToFit() - // this.graph.freeze() + await this.clearDiagram() } }, @@ -880,7 +892,8 @@ data: { dataId: item.data.dataId, nodeType: item.nodeType, - nodeTypeExt: item.data.nodeTypeExt + nodeTypeExt: item.data.nodeTypeExt, + statusImg:item.statusImg }, attrs: { text:{ @@ -896,13 +909,33 @@ textVerticalAnchor: 'top', }, }, + 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}, }), ) - // r1.push(r5,r6,r9) - console.log(imageNodes,'group1') stencil.load(imageNodes, 'group1') stencil.load(imageNodes2, 'group2') + this.graph.bindKey(['meta+c', 'ctrl+c'], () => { const cells = this.graph.getSelectedCells() @@ -998,8 +1031,10 @@ this.type = cell.isNode() ? 'node' : 'edge' this.shape = cell.shape this.id = cell.id - this.nodeType = cell.getData().nodeType - console.log(this.nodeType, 'this.nodeType') + if(this.type==='node'){ + this.nodeType = cell.getData().nodeType + console.log(this.nodeType, 'this.nodeType') + } console.log(this.shape, 'this.shape') // this.nodeOpt(this.id, this.globalGridAttr) }) -- Gitblit v1.9.1