From f5cbbd5e6ecf6ba16523cdea205572f52e7643ae Mon Sep 17 00:00:00 2001 From: haoxuan <haoxuan> Date: 星期三, 20 九月 2023 11:40:13 +0800 Subject: [PATCH] 开始生产的接口变化 --- src/views/visualization.vue | 169 ++++++++++++++++++++++++++++++++------------------------ 1 files changed, 97 insertions(+), 72 deletions(-) diff --git a/src/views/visualization.vue b/src/views/visualization.vue index 252d90b..aedaf2c 100644 --- a/src/views/visualization.vue +++ b/src/views/visualization.vue @@ -45,13 +45,13 @@ <span class="title-item" >宸ュ崟缂栧彿: <span class="color_4efefa">{{ - taskData.Order.workOrderId || "" + taskData.Order.workOrderId || "--" }}</span> </span> <span class="title-item" >褰撳墠宸ュ簭: <span class="color_4efefa">{{ - taskData.Procedure.procedure.procedureName || "" + taskData.Procedure.procedure.procedureName || "--" }}</span> </span> <span class="title-item" @@ -75,8 +75,8 @@ </span> </span> --> </div> - <div class="gongx" v-if="taskData.AllProcedures"> - <el-steps :active="taskData.CurrentProcedureIndex?taskData.CurrentProcedureIndex:0" finish-status="success" class="steps"> + <div class="gongx"> + <el-steps v-if="taskData.AllProcedures" :active="taskData.CurrentProcedureIndex?taskData.CurrentProcedureIndex:0" finish-status="success" class="steps"> <el-step icon="" :title="item" v-for="(item,index) in taskData.AllProcedures" :key="index"></el-step> </el-steps> </div> @@ -199,7 +199,7 @@ <div class="card_content"> <div class="card_contentLeft">{{ list.materialId }}</div> </div> - <div class="card_top"> + <div class="card-top-input-out-l"> <div> <!-- 璁惧12<i style="font-size: 14px" @@ -209,7 +209,7 @@ {{ list.materialName }} </div> </div> - <div class="card_top2"> + <div class="card-top-input-out-r"> <div style="line-height: 45px; text-align: center"> {{ list.amount }} {{ list.unit }} </div> @@ -219,7 +219,7 @@ </div> </el-carousel-item> </el-carousel> - <el-button type="primary" class="color_f70f83"> + <el-button type="primary" class="color_f70f83 bottom-box-btn"> <i class="el-icon-phone-outline" />鐗╂枡鍛煎彨</el-button > </div> @@ -247,8 +247,16 @@ > <template v-if="list.name == '宸ュ簭'"> <div class="card_content"> - <div class="card_contentLeft color_blue"> - {{ list.deviceName }} + <div class="card_contentLeft color_blue font_dian"> + <!-- {{ list.deviceName }} --> + <el-popover + width="200" + :content="list.deviceName" + placement="top-start" + trigger="click" + > + <span slot="reference">{{ list.deviceName }}</span> + </el-popover> <!-- <span style="float: right">6m/s</span> --> </div> </div> @@ -320,7 +328,7 @@ <p style="font-size: 22px; margin-left: 12px; margin-top: 50px" ></p> - <div class="right-small-btn"> + <div class="right-small-btn bottom-box-btn"> <el-button type="primary"> 鎵撳嵃</el-button> <el-popover placement="top-end" @@ -377,49 +385,21 @@ {{ list.materialId }} </div> </div> - <div class="card_top"> + <div class="card-top-input-out-l"> <div> {{ list.materialName }} - <!-- 璁惧12<i - style="font-size: 14px" - class="el-icon-right font-arrow-20" - ></i> - 璁惧13 --> </div> </div> - <div class="card_top2"> + <div class="card-top-input-out-r"> <div style="line-height: 45px; text-align: center"> {{ list.amount }} {{ list.unit }} </div> - <!-- <span class="card-top-r-t">鐢熶骇瀹屾垚</span> - <span class="card-top-r-b">12鏈�28鏃� 08:24</span> --> </div> - <!-- <div class="card-info-box">棰勮10鍒嗛挓閫佽揪</div> --> </div> - <!-- <div class="card"> - <div class="card_content"> - <div class="card_contentLeft color_green"> - 鍖呭彿:G22122304 100鍚� - </div> - </div> - <div class="card_top"> - <div> - 璁惧12<i - style="font-size: 14px" - class="el-icon-right font-arrow-20" - ></i> - 璁惧13 - </div> - </div> - <div class="card_top-2"> - <span class="card-top-r-t">鐢熶骇瀹屾垚</span> - <span class="card-top-r-b">12鏈�28鏃� 08:24</span> - </div> - </div> --> </div> </el-carousel-item> </el-carousel> - <el-button type="primary" class="color_f70f83"> + <el-button type="primary" class="color_f70f83 bottom-box-btn"> <i class="el-icon-phone-outline" />杩愯緭鍛煎彨</el-button > </div> @@ -452,7 +432,7 @@ 璁惧鐘舵��: <!-- 1鏂紑2鐢熶骇3寰呮満 --> <span style="position: relative" - > + v-if="plcStatus" > <img v-if="plcStatus == 1" src="../../public/duan.png" /> <img v-else src="../../public/lian.png" /> <!-- <span class="yuandian"></span> --> @@ -584,7 +564,7 @@ }, data() { return { - activeName: 2, + activeName: 1, progress: 70, //杩涘害 passrate: 30, //鍚堟牸鐜� production: 25, //鐢熶骇涓� @@ -682,7 +662,7 @@ procInfoTimer: null, cutdownTimer: null, TaskCount:0, - plcStatus:1, + plcStatus:0, isTipShow:false, }; }, @@ -810,11 +790,11 @@ return d; }, setInterCard(value, name, i) { - if (this.Tasks[i].Procedure.procedure[value]) { + if (this.Tasks[i].Procedure.procedure[value]!=null) { let height = 200; let num = 1; if (this.$refs[name]) { - height = this.$refs[name].$el.offsetHeight; + height = this.$refs[name].$el?this.$refs[name].$el.offsetHeight:200; num = Math.floor(height / 80); } let inputMaterials = JSON.parse( @@ -850,8 +830,24 @@ procedure: { inputMaterials: [], outputMaterials: [], workers: [] }, }, inputMaterials: [], - outputMaterials: [], - procedureList: [], + outputMaterials: [ + // [ + // { + // materialId:11111, + // materialName:'272澶у鍟婃斁鍋囦簡鍗¤壈鑻﹀鏂楀瀮鍦惧彂蹇�掑瀮鍦惧弽棣堟潵寰楀強鍏嬮殕', + // amount:100, + // unit:'浠�' + // } + // ] + ], + procedureList: [ + // [ + // { + // name:"宸ュ簭", + // deviceName:'1111dhafjdhajkhf jkdahjkf鎵撴硶鍗冲彲鎵撻枊閺堟帴鑲痉鍩哄晩鐪嬩締jdad澶ч浜笢鍗¤�佸徃鏈虹暘绐犲�掕嚰寮�浜嗘埧閲戦樋濂庣鍗佸叚灞婂弽棣堟媺寰锋柉鍩簁鎵撳崱鏈洪樋鐝傞檮浠舵墦寮�浜嗙偣鍑婚樋閲屽崱鍑忚偉鐨勫崱鎷夎兌寮�浜嗘埧澶ц涓婂厠闅唂k鍟﹀ぇ瀹堕槻绌洪浄閬旀暩鎿氱湅i' + // }, + // ] + ], }; this.Tasks = []; getTaskInfo({ page: 1, pageSize: this.activeName }).then((res) => { @@ -866,14 +862,6 @@ this.TaskCount=res.data.TaskCount?res.data.TaskCount:0 this.workers=res.data.workers?res.data.workers:[] - if (this.Tasks.length == 0) { - if (this.activeName == 1) { - this.Tasks.push(object); - } else { - this.Tasks.push(object); - this.Tasks.push(object); - } - } for (let i in this.Tasks) { this.Tasks[i].procedureList = []; this.Tasks[i].inputMaterials = []; @@ -911,9 +899,17 @@ if (!this.procInfoTimer) { this.procInfoTimer = setInterval(() => { this.getProgressInfo(); - }, 9000); + }, 3000); } } + if (this.Tasks.length == 0) { + if (this.activeName == 1) { + this.Tasks.push(object); + } else { + this.Tasks.push(object); + this.Tasks.push(object); + } + } if (res.code != 200 || this.Tasks.length == 0) { this.getcountdown(); // 鎺у埗閲嶆柊璇锋眰getTaskInfo, 鍙紑鍚竴涓畾鏃跺櫒 @@ -923,11 +919,10 @@ }, 60000); } } - debugger - if(this.activeName==2){ - this.Tasks[1]=null - } }); + + // this.Tasks.push(object) + // this.Tasks.push(object) }, getStartArr(){ for (let i in this.Tasks) { @@ -949,7 +944,7 @@ this.Tasks[i].finishNumber = res.data.finishNumber ? res.data.finishNumber : 0; - this.plcStatus=res.data.plcStatus?res.data.plcStatus:1 + this.plcStatus=res.data.plcStatus?res.data.plcStatus:0 } }); } @@ -1004,6 +999,10 @@ </script> <style lang="scss"> +.tooltip-width-200{ + width:200px; + line-height:1.3!important; +} .color_yellow{ color:yellow; } @@ -1283,14 +1282,21 @@ } .card-box { width: 100%; - height: calc(100% - 50px - 50px); + height: calc(100% - 50px - 40px); // height:300px; .el-carousel__container{ overflow-y:auto; } - // .el-carousel__item{ - // min-height:116px; - // } + .el-carousel__item{ + // height:auto; + min-height:160px; + } + } + .bottom-box-btn{ + width:calc(100% - 20px); + position:absolute; + bottom:10px; + left:10px; } } @@ -1357,11 +1363,12 @@ align-content: center; justify-content: space-around; align-items: center; + overflow:hidden; .title-item { - width: calc(33.333% - 50px); + width: calc((100% - 50px)/3); float: left; margin-right: 10px; - padding: 15px 20px; + padding: 10px 5px; text-align: center; border-radius: 4px; display: inline-block; @@ -1453,10 +1460,10 @@ // border: 1px solid #ccc; background: #6b83ff; border-radius: 5px; - margin-top: 20px; + margin-top: 10px; color: #333; position: relative; - .card_top-2, + .card_top-2,.card-top-input-out-r, .card_top-3 { width: 50%; height: 45px; @@ -1498,7 +1505,7 @@ } } - .card_top, + .card_top,.card-top-input-out-l, .card_top-4 { width: 50%; height: 45px; @@ -1508,7 +1515,7 @@ font-size: 12px; line-height: 45px; > div { - margin-left: 12px; + padding-left: 12px; position: relative; p { position: absolute; @@ -1520,6 +1527,18 @@ } .card_top{ float: left; + } + .card-top-input-out-l{ + float:left; + width:65%; + line-height:20px; + vertical-align: middle; + display:flex; + justify-content:space-around; + align-items:center; + } + .card-top-input-out-r{ + width:35%; } .card_top-4 { width: calc(100% - 20px); @@ -1558,6 +1577,12 @@ border-radius: 5px 5px 0 0; background: rgb(19, 35, 90); } + .font_dian{ + -webkit-box-orient:vertical; + overflow:hidden; + text-overflow:ellipsis; + white-space:nowrap; + } .card_contentRight { width: 100%; -- Gitblit v1.8.0