From f3ad14f8af7fb651426d1ee617e7ecb9d3fc9aab Mon Sep 17 00:00:00 2001 From: xyc <jc_xiong@hotmail.com> Date: 星期四, 28 三月 2024 11:15:52 +0800 Subject: [PATCH] 新增产品节点上设置关系,可设置项为“无/旁联/表决” --- web/src/views/modules/taskReliability/RBD-edit-img.vue | 109 ++++++++++++++++++++++++++++++++---------------------- 1 files changed, 65 insertions(+), 44 deletions(-) diff --git a/web/src/views/modules/taskReliability/RBD-edit-img.vue b/web/src/views/modules/taskReliability/RBD-edit-img.vue index b3fe5d6..7db0238 100644 --- a/web/src/views/modules/taskReliability/RBD-edit-img.vue +++ b/web/src/views/modules/taskReliability/RBD-edit-img.vue @@ -3,7 +3,7 @@ <el-row :gutter="[8,8]"> <el-col :span="4"> <div :style="'height:' +left_p+'px'"> - <div class="fa-card-a" style="height: 100%"> + <div style="height: 100%"> <div id="stencilImg"></div> </div> </div> @@ -157,6 +157,7 @@ content: null, publishContent: null, hasPublish: 0, + urlPref: '', }, // emptyJson: { // // 鑺傜偣 @@ -184,7 +185,8 @@ id: '', graph: null, globalGridAttr: { - voteSum: '', + productType:'', + voteNum: '', repairMttcr: '', repairMttcrOther: '', repairDistribType: '', @@ -335,19 +337,24 @@ }, async getDiagram(modelId) { let params = { - modelId: modelId + modelId: modelId, + urlPref: window.SITE_CONFIG['apiURL'], + token: Cookies.get('token'), } let res = await this.$http.get(`/taskReliability/ModelLine/getDiagram`, {params: params}) console.log(res, 'async getDiagram( res') - if (res.data !== null && res.data.content != null) { + if (res.data !== null && (res.data.content != null)) { this.dataForm = res.data console.log(this.dataForm, 'this.dataForm in getDiagram') - this.diagramJson = JSON.parse(this.dataForm.content) + if(this.dataForm.content!=''){ + this.diagramJson = JSON.parse(this.dataForm.content) + } // console.log(this.dataForm.content,'this.Diagram content') console.log(this.diagramJson, 'this.Diagram json') this.graph.fromJSON(this.diagramJson) - this.graph.centerContent() - this.graph.zoomToFit() + this.graph.positionContent('left') + // this.graph.centerContent() + // this.graph.zoomToFit() } else { await this.clearDiagram() } @@ -356,8 +363,8 @@ this.dataForm.id = null // this.graph.fromJSON(this.emptyJson) this.graph.fromJSON('') - this.graph.centerContent() - this.graph.zoomToFit() + // this.graph.centerContent() + // this.graph.zoomToFit() // this.graph.freeze() }, async initDigram(productId) { @@ -372,15 +379,16 @@ grid: { visible: true, }, - onToolItemCreated({tool}) { - const handle = tool - const options = handle.options - if (options && options.index % 2 === 1) { - tool.setAttrs({fill: 'red'}) - } - }, autoResize: true, - history: true, + history: { + enabled: true, + beforeAddCommand(event, args) { + if (args.key==='tools') { + console.log(args.key,'event, args') + return false + } + }, + }, // panning: { // enabled: true, // }, @@ -450,6 +458,12 @@ } } }], + tools: { + name: 'segments', + args: { + attrs: { fill: '#666' }, + }, + }, zIndex: 0, }) }, @@ -485,6 +499,7 @@ }) this.graph.centerContent() const stencil = new Addon.Stencil({ + getDragNode: (node) => node.clone({ keepId: true }), getDropNode(node) { let {width, height} = node.size() if (node.getData().imgWidth) { @@ -493,31 +508,33 @@ if (node.getData().imgHeight) { height = node.getData().imgHeight } - console.log(node.getData().imgWidth, node.getData().imgHeight, 'node.size()') - return node.clone().size(width, height) + return node.clone({ keepId: true }).size(width, height) }, - // 杩斿洖涓�涓柊鐨勮妭鐐逛綔涓哄疄闄呮斁缃埌鐢诲竷涓婄殑鑺傜偣 + validateNode(node){ + console.log(node.id) + }, title: '', target: this.graph, - stencilGraphWidth: 230, - stencilGraphHeight: 300, - collapsable: false, + stencilGraphWidth: 200, + stencilGraphHeight: 280, + collapsable: true, groups: [ { title: '杩愮畻绗﹀彿', name: 'group1', - collapsable: false }, { title: '璁惧鑺傜偣', name: 'group2', - collapsable: false + graphHeight: '', + layoutOptions: { + rowHeight: 90, + }, } ], layoutOptions: { columns: 2, - columnWidth: 110, - // rowHeight: 75, + columnWidth: 105, }, }) document.getElementById('stencilImg').appendChild(stencil.container) @@ -532,7 +549,8 @@ data: { dataId: '', nodeType: item.nodeType, - nodeTypeExt: '' + nodeTypeExt: '', + voteNum:'' }, attrs: { text: { @@ -563,8 +581,9 @@ imageUrl: `${window.SITE_CONFIG['apiURL']}/sysPictureBase/getProductImg?token=${Cookies.get('token')}&id=${item.imgPath}`, width: 60, height: 60, + id: item.dataId, // 鎵嬪姩璁剧疆鑺傜偣鐨� ID data: { - isRepair: false, + isRepair: item.isRepair, dataId: item.dataId, nodeType: item.nodeType, nodeTypeExt: item.nodeTypeExt, @@ -576,9 +595,9 @@ repairMttcrOther: item.repairMttcrOther, taskMtbcf: item.taskMtbcf, taskMtbcfOther: item.taskMtbcfOther, - voteSum: '', imgHeight: item.imgHeight, - imgWidth: item.imgWidth + imgWidth: item.imgWidth, + voteNum:'', }, attrs: { text: { @@ -718,7 +737,7 @@ this.id = cell.id if (this.type === 'node') { this.nodeType = cell.getData().nodeType - console.log(this.nodeType, 'this.nodeType') + console.log(this.nodeType,cell.id,'this.nodeType') } console.log(this.shape, 'this.shape') // this.nodeOpt(this.id, this.globalGridAttr) @@ -799,7 +818,7 @@ this.showPorts(ports, false) }) - this.graph.on('edge:mouseenter', ({cell, view}) => { + this.graph.on('edge:mouseenter', ({cell}) => { // alert(123) cell.addTools([ { @@ -813,15 +832,11 @@ }, }, }, - ]) - cell.addTools( - [ { - name: 'segments', - args: {snapRadius: 20, attrs: {fill: '#444'}} - } - ] - ) + name: 'segments', + args: {snapRadius: 20, attrs: {fill: '#444'}} + }, + ]) }) this.graph.on('edge:mouseleave', ({cell}) => { @@ -889,6 +904,7 @@ async saveDiagram() { console.log(JSON.stringify(this.graph.toJSON()), 'graph.toJSON()') this.dataForm.content = JSON.stringify(this.graph.toJSON()) + this.dataForm.urlPref = window.SITE_CONFIG['apiURL'] console.log(this.dataForm, 'dataFrom') await this.$http[this.dataForm.id === null ? 'post' : 'put'](`/taskReliability/ModelLine/`, this.dataForm).then(async res => { if (res.msg === 'success') { @@ -901,7 +917,7 @@ async analyzeDiagram() { console.log(JSON.stringify(this.graph.toJSON()), 'graph.toJSON()') this.dataForm.content = JSON.stringify(this.graph.toJSON()) - console.log(this.dataForm, 'dataFrom') + this.dataForm.urlPref = window.SITE_CONFIG['apiURL'] await this.$http['post'](`/taskReliability/ModelLine/analyze`, this.dataForm).then(async res => { if (res.msg === 'success') { this.$alert('瑙f瀽鎴愬姛', '鎻愮ず', { @@ -1055,10 +1071,15 @@ position: relative; height: 100%; } - +#stencilImg .x6-graph-svg-viewport{ + height: 100%; +} .x6-widget-stencil-content { position: relative; - height: 100%; + height: calc(100% - 32px); +} +#stencilImg .x6-widget-stencil.collapsable > .x6-widget-stencil-content{ + top:0 } </style> -- Gitblit v1.9.1