From 652ec7d6dfdee121704961847fae3a3a5be3f5b6 Mon Sep 17 00:00:00 2001
From: jinlin <jinlin>
Date: 星期一, 01 四月 2024 15:26:15 +0800
Subject: [PATCH] 修改
---
web/src/views/modules/taskReliability/RBD-edit-img.vue | 162 ++++++++++++++++++++++++++++++++++--------------------
1 files changed, 102 insertions(+), 60 deletions(-)
diff --git a/web/src/views/modules/taskReliability/RBD-edit-img.vue b/web/src/views/modules/taskReliability/RBD-edit-img.vue
index 5b240b8..dcaa6b1 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>
@@ -18,49 +18,67 @@
<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 @click="leftAlign()">
+ <i style="font-size: 1rem;" class="wt-iconfont icon-zuoduiqi"></i>
+ </el-button>
+ <el-button @click="centerAlign()">
+ <i style="font-size: 1rem;" class="wt-iconfont icon-chuizhiduiqi"></i>
+ </el-button>
+ <el-button @click="rightAlign()">
+ <i style="font-size: 1rem;" class="wt-iconfont icon-youduiqi"></i>
+ </el-button>
+ <el-button @click="topAlign()">
+ <i style="font-size: 1rem;" class="wt-iconfont icon-dingduiqi"></i>
+ </el-button>
+ <el-button @click="shuipingAlign()">
+ <i style="font-size: 1rem;" class="wt-iconfont icon-shuipingduiqi"></i>
+ </el-button>
+ <el-button @click="bottomAlign()">
+ <i style="font-size: 1rem;" class="wt-iconfont icon-diduiqi"></i>
+ </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;"
- @click="leftAlign()"><i style="font-size: 2rem;"
- class="wt-iconfont icon-zuoduiqi"></i></el-button>
- </el-tooltip>
- </el-form-item>
- <el-form-item>
- <el-tooltip class="item" effect="dark" content="灞呬腑瀵归綈" placement="left">
- <el-button style="margin-left: 0;padding: 2px;border: 1px solid #5F95FF"
- @click="centerAlign()"><i style="font-size: 2rem;"
- class="wt-iconfont icon-chuizhiduiqi"></i></el-button>
- </el-tooltip>
- </el-form-item>
- <el-form-item>
- <el-tooltip class="item" effect="dark" content="鍙冲榻�" placement="left">
- <el-button style="margin-left: 0;padding: 2px;border: 1px solid #5F95FF"
- @click="rightAlign()"><i style="font-size: 2rem;"
- class="wt-iconfont icon-youduiqi"></i></el-button>
- </el-tooltip>
- </el-form-item>
- <el-form-item>
- <el-tooltip class="item" effect="dark" content="椤堕儴瀵归綈" placement="left">
- <el-button style="margin-left: 0;padding: 2px;border: 1px solid #5F95FF"
- @click="topAlign()"><i style="font-size: 2rem;"
- class="wt-iconfont icon-dingduiqi"></i></el-button>
- </el-tooltip>
- </el-form-item>
- <el-form-item>
- <el-tooltip class="item" effect="dark" content="姘村钩瀵归綈" placement="left">
- <el-button style="margin-left: 0;padding: 2px;border: 1px solid #5F95FF"
- @click="shuipingAlign()"><i style="font-size: 2rem;"
- class="wt-iconfont icon-shuipingduiqi"></i></el-button>
- </el-tooltip>
- </el-form-item>
- <el-form-item>
- <el-tooltip class="item" effect="dark" content="搴曢儴瀵归綈" placement="left">
- <el-button style="margin-left: 0;padding: 2px;border: 1px solid #5F95FF"
- @click="bottomAlign()"><i style="font-size: 2rem;"
- class="wt-iconfont icon-diduiqi"></i></el-button>
- </el-tooltip>
- </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;" @click="leftAlign()">-->
+<!-- <i style="font-size: 2rem;" class="wt-iconfont icon-zuoduiqi"></i>-->
+<!-- </el-button>-->
+<!-- </el-tooltip>-->
+<!-- </el-form-item>-->
+<!-- <el-form-item>-->
+<!-- <el-tooltip class="item" effect="dark" content="灞呬腑瀵归綈" placement="left">-->
+<!-- <el-button style="margin-left: 0;padding: 2px;border: 1px solid #5F95FF"-->
+<!-- @click="centerAlign()"><i style="font-size: 2rem;"-->
+<!-- class="wt-iconfont icon-chuizhiduiqi"></i></el-button>-->
+<!-- </el-tooltip>-->
+<!-- </el-form-item>-->
+<!-- <el-form-item>-->
+<!-- <el-tooltip class="item" effect="dark" content="鍙冲榻�" placement="left">-->
+<!-- <el-button style="margin-left: 0;padding: 2px;border: 1px solid #5F95FF"-->
+<!-- @click="rightAlign()"><i style="font-size: 2rem;"-->
+<!-- class="wt-iconfont icon-youduiqi"></i></el-button>-->
+<!-- </el-tooltip>-->
+<!-- </el-form-item>-->
+<!-- <el-form-item>-->
+<!-- <el-tooltip class="item" effect="dark" content="椤堕儴瀵归綈" placement="left">-->
+<!-- <el-button style="margin-left: 0;padding: 2px;border: 1px solid #5F95FF"-->
+<!-- @click="topAlign()"><i style="font-size: 2rem;"-->
+<!-- class="wt-iconfont icon-dingduiqi"></i></el-button>-->
+<!-- </el-tooltip>-->
+<!-- </el-form-item>-->
+<!-- <el-form-item>-->
+<!-- <el-tooltip class="item" effect="dark" content="姘村钩瀵归綈" placement="left">-->
+<!-- <el-button style="margin-left: 0;padding: 2px;border: 1px solid #5F95FF"-->
+<!-- @click="shuipingAlign()"><i style="font-size: 2rem;"-->
+<!-- class="wt-iconfont icon-shuipingduiqi"></i></el-button>-->
+<!-- </el-tooltip>-->
+<!-- </el-form-item>-->
+<!-- <el-form-item>-->
+<!-- <el-tooltip class="item" effect="dark" content="搴曢儴瀵归綈" placement="left">-->
+<!-- <el-button style="margin-left: 0;padding: 2px;border: 1px solid #5F95FF"-->
+<!-- @click="bottomAlign()"><i style="font-size: 2rem;"-->
+<!-- class="wt-iconfont icon-diduiqi"></i></el-button>-->
+<!-- </el-tooltip>-->
+<!-- </el-form-item>-->
</el-form>
<div id="containerImg" style="border: 1px solid #EAEBEE;border-radius: 6px;
box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);">
@@ -157,6 +175,7 @@
content: null,
publishContent: null,
hasPublish: 0,
+ urlPref: '',
},
// emptyJson: {
// // 鑺傜偣
@@ -184,6 +203,7 @@
id: '',
graph: null,
globalGridAttr: {
+ productType:'',
voteNum: '',
repairMttcr: '',
repairMttcrOther: '',
@@ -335,19 +355,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 +381,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) {
@@ -452,7 +477,7 @@
}
}],
tools: {
- name: 'vertices',
+ name: 'segments',
args: {
attrs: { fill: '#666' },
},
@@ -492,6 +517,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) {
@@ -500,9 +526,11 @@
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: 200,
@@ -534,8 +562,6 @@
imageUrl: require('/public/modelImg/' + item.imgPath + '.png'),
width: item.imgWidth,
height: item.imgHeight,
- x: item.imgWidth,
- y: item.imgHeight,
data: {
dataId: '',
nodeType: item.nodeType,
@@ -571,6 +597,7 @@
imageUrl: `${window.SITE_CONFIG['apiURL']}/sysPictureBase/getProductImg?token=${Cookies.get('token')}&id=${item.imgPath}`,
width: 60,
height: 60,
+ id: item.dataId, // 鎵嬪姩璁剧疆鑺傜偣鐨� ID
data: {
isRepair: item.isRepair,
dataId: item.dataId,
@@ -726,7 +753,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)
@@ -809,9 +836,23 @@
this.graph.on('edge:mouseenter', ({cell}) => {
// alert(123)
- cell.addTools(
- ['vertices', 'segments']
- )
+ cell.addTools([
+ {
+ name: 'source-arrowhead',
+ },
+ {
+ name: 'target-arrowhead',
+ args: {
+ attrs: {
+ fill: 'red',
+ },
+ },
+ },
+ {
+ name: 'segments',
+ args: {snapRadius: 20, attrs: {fill: '#444'}}
+ },
+ ])
})
this.graph.on('edge:mouseleave', ({cell}) => {
@@ -879,6 +920,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') {
@@ -891,7 +933,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瀽鎴愬姛', '鎻愮ず', {
--
Gitblit v1.9.1