From 404bd17f83c0054388e4a02ff31dbc37c27a4b11 Mon Sep 17 00:00:00 2001
From: wente <329538422@qq.com>
Date: 星期五, 29 三月 2024 16:09:29 +0800
Subject: [PATCH] 样式修改
---
web/src/views/modules/taskReliability/RBD-edit-img.vue | 151 ++++++++++++++++++++++++++++++++------------------
1 files changed, 96 insertions(+), 55 deletions(-)
diff --git a/web/src/views/modules/taskReliability/RBD-edit-img.vue b/web/src/views/modules/taskReliability/RBD-edit-img.vue
index d31fb73..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,14 +355,18 @@
},
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)
@@ -493,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) {
@@ -501,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,
@@ -535,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,
@@ -572,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,
@@ -727,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)
@@ -810,9 +836,23 @@
this.graph.on('edge:mouseenter', ({cell}) => {
// alert(123)
- cell.addTools(
- ['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}) => {
@@ -880,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') {
@@ -892,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('瑙ｆ瀽鎴愬姛', '鎻愮ず', {
--
Gitblit v1.9.1