From 722231fc31750241c78a63ce7934905ca1892cd9 Mon Sep 17 00:00:00 2001 From: haoxuan <haoxuan> Date: 星期一, 25 九月 2023 16:28:57 +0800 Subject: [PATCH] 距离任务 倒计时 为0的时候筛选获取任务的接口 --- src/views/visualization.vue | 206 +++++++++++++++++++++++++++++---------------------- 1 files changed, 116 insertions(+), 90 deletions(-) diff --git a/src/views/visualization.vue b/src/views/visualization.vue index 1f22bf7..5d2284a 100644 --- a/src/views/visualization.vue +++ b/src/views/visualization.vue @@ -143,8 +143,8 @@ <el-descriptions-item label="瀹屾垚搴�" style="width: 100%"> <!--:text-format="format" --> <el-progress - define-back-color="#133EAF" - color="#09E5ED" + define-back-color="#132f6e" + color="#00cc66" text-color="#fff" :text-inside="true" :stroke-width="30" @@ -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,11 +219,11 @@ </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> - <i class="el-icon-arrow-right font-arrow-20 color_4efefa"></i> + <i class="el-icon-arrow-right font-arrow-20 color_318583"></i> <div class="bottom_list"> <div class="bottom-title"> 褰撳墠宸ュ簭:{{ taskData.Procedure.procedure.procedureName || "" }} @@ -249,14 +249,14 @@ <div class="card_content"> <div class="card_contentLeft color_blue font_dian"> <!-- {{ list.deviceName }} --> - <el-tooltip - effect="dark" - popper-class="tooltip-width-200" + <el-popover + width="200" :content="list.deviceName" placement="top-start" + trigger="click" > - <span>{{ list.deviceName }}</span> - </el-tooltip> + <span slot="reference">{{ list.deviceName }}</span> + </el-popover> <!-- <span style="float: right">6m/s</span> --> </div> </div> @@ -274,8 +274,8 @@ > <span class="card-top-r-b"> <el-progress - define-back-color="#133EAF" - color="#09E5ED" + define-back-color="#132f6e" + color="#00cc66" text-color="#fff" :text-inside="true" :stroke-width="10" @@ -328,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" @@ -337,7 +337,7 @@ v-model="finishShow['finishShow&'+index]" trigger="click" > - <p>璇风‘璁ゆ槸鍚﹀凡瀹屾垚璇ョ敓浜т换鍔�?</p> + <p><i class="el-icon-error" style="color:red;margin-right:5px;"/>璇风‘璁ゆ槸鍚﹀凡瀹屾垚璇ョ敓浜т换鍔�?</p> <div style="text-align: right; margin: 0"> <el-button size="mini" @click="finishShow['finishShow&'+index] = false"> 鍙栨秷</el-button @@ -345,6 +345,7 @@ <el-button type="primary" size="mini" + class="color_f70f83" @click="finishClick(index, taskData)" > 纭畾</el-button @@ -354,7 +355,7 @@ </el-popover> </div> </div> - <i class="el-icon-arrow-right font-arrow-20 color_4efefa"></i> + <i class="el-icon-arrow-right font-arrow-20 color_318583"></i> <div class="bottom_list"> <div class="bottom-title"> <span>杈撳嚭璧勬簮</span> @@ -385,49 +386,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> @@ -460,7 +433,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> --> @@ -513,7 +486,7 @@ </div> --> </div> <div class="right_base"> - <div class="right-small-title" style="line-height: 40px">鐭ヨ瘑搴�</div> + <div class="right-small-title" style="line-height: 40px;margin-top:20px;">鐭ヨ瘑搴�</div> <Knowledge /> <div class="right-base-btn call"> <el-button type="primary" @@ -690,8 +663,9 @@ procInfoTimer: null, cutdownTimer: null, TaskCount:0, - plcStatus:1, + plcStatus:0, isTipShow:false, + isFinsh:0, }; }, mounted() { @@ -708,18 +682,17 @@ }, 5000); this.getTaskInfo(); }, + watch:{ + isFinsh(){ + if(this.isFinsh==this.Tasks.length){ + this.getStartArr() + } + } + }, methods: { taskClick(){ if(this.TaskCount>0){ - for(let i in this.Tasks){ - if(this.Tasks[i].Procedure.Status==1){ - this.isTipShow=false - break; - } - } - if(!this.isTipShow){ - this.$refs.control.islook=true - } + this.$refs.control.islook=true }else{ this.$message.error('鐩墠娌℃湁浠诲姟锛�') } @@ -747,6 +720,9 @@ this.countDownMinute = res.data.CountDownMinute ? res.data.CountDownMinute : 0; + if(this.countDownHour==0&& this.countDownMinute==0){ + this.getTaskInfo(); + } } }); }, @@ -866,7 +842,16 @@ procedure: { inputMaterials: [], outputMaterials: [], workers: [] }, }, inputMaterials: [], - outputMaterials: [], + outputMaterials: [ + // [ + // { + // materialId:11111, + // materialName:'272澶у鍟婃斁鍋囦簡鍗¤壈鑻﹀鏂楀瀮鍦惧彂蹇�掑瀮鍦惧弽棣堟潵寰楀強鍏嬮殕', + // amount:100, + // unit:'浠�' + // } + // ] + ], procedureList: [ // [ // { @@ -888,6 +873,14 @@ this.Tasks = res.data.Tasks ? res.data.Tasks : []; this.TaskCount=res.data.TaskCount?res.data.TaskCount:0 + if (this.Tasks.length == 0&&this.TaskCount==0) { + if (this.activeName == 1) { + this.Tasks.push(object); + } else { + this.Tasks.push(object); + this.Tasks.push(object); + } + } this.workers=res.data.workers?res.data.workers:[] for (let i in this.Tasks) { this.Tasks[i].procedureList = []; @@ -899,44 +892,37 @@ .procedure.workers ? this.Tasks[i].Procedure.procedure.workers : []; + this.Tasks[i].procedureList.push([ { name: "宸ュ簭", ...this.Tasks[i].Procedure.procedure, }, ]); - + if (this.Tasks[i].Procedure.ID) { startTask({ id: this.Tasks[i].Procedure.ID }).then((res) => { if (res.code == 200) { // res.data.number this.Tasks[i].procedureList[0].push({ number: res.data.Number, - name: "宸ヨ壓", - Arr:res.data.Params ? res.data.Params : [], }); + this.Tasks[i].Arr=res.data.Params ? res.data.Params : [] + this.isFinsh=Number(i)+1 } }); } this.setInterCard("inputMaterials", "cardBox1&" + i, i); this.setInterCard("outputMaterials", "cardBox3&" + i, i); } - this.getStartArr() + this.getProgressInfo(); 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, 鍙紑鍚竴涓畾鏃跺櫒 @@ -954,7 +940,7 @@ getStartArr(){ for (let i in this.Tasks) { if (this.Tasks[i].Procedure.Status==1) { - this.Arr = this.Tasks[i].procedureList[0].Arr ?this.Tasks[i].procedureList[0].Arr: []; + this.Arr = this.Tasks[i].Arr ?this.Tasks[i].Arr: []; this.taskData=this.Tasks[i]; break; } @@ -971,7 +957,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 } }); } @@ -1030,8 +1016,20 @@ width:200px; line-height:1.3!important; } +.el-popover{ + background:#12234a!important; + color:#fff!important; + border-color: #09e5ed !important; + + .popper__arrow::after{ + border-top-color:#09e5ed !important; + } +} .color_yellow{ color:yellow; +} +.color_318583{ + color:#318583; } .el-empty{ height:100%; @@ -1051,10 +1049,10 @@ margin-bottom: 20px; } .content { - height: 240px; + height: 300px; } .bottom { - height: calc(100% - 410px); + height: calc(100% - 470px); } .font_size_20px{ font-size:20px!important; @@ -1086,18 +1084,18 @@ line-height: 20px; } .content { - height: 370px; + height: 430px; .content-top { - height: calc(50% - 20px) !important; - padding-top: 10px !important; + height: calc(50% - 30px) !important; + padding-top: 20px !important; } .el-descriptions__body { font-size: 16px !important; } } .bottom { - height: calc(100% - 560px); + height: calc(100% - 610px); } .bottom_list .bottom-title { font-size: 16px; @@ -1309,7 +1307,7 @@ } .card-box { width: 100%; - height: calc(100% - 50px - 50px); + height: calc(100% - 50px - 40px); // height:300px; .el-carousel__container{ overflow-y:auto; @@ -1318,6 +1316,12 @@ // height:auto; min-height:160px; } + } + .bottom-box-btn{ + width:calc(100% - 20px); + position:absolute; + bottom:10px; + left:10px; } } @@ -1445,6 +1449,9 @@ background: rgb(22 72 173); border-radius: 6px; // background: #233b9e; + .el-descriptions-row{ + height:45px; + } .el-descriptions__body { background: transparent; font-size: 18px; @@ -1484,15 +1491,22 @@ margin-top: 10px; color: #333; position: relative; - .card_top-2, + .card_top-2{ + width:35%; + } + .card-top-input-out-r, .card_top-3 { - width: 50%; + width:65%; + } + .card_top-2,.card-top-input-out-r, + .card_top-3 { height: 45px; border-radius: 5px; background: #6b83ff; - font-size: 12px; + font-size: 13px; color: #fff; float: left; + font-weight: 700; .card-top-r-t { width: 100%; text-align: center; @@ -1526,7 +1540,7 @@ } } - .card_top, + .card_top,.card-top-input-out-l, .card_top-4 { width: 50%; height: 45px; @@ -1536,7 +1550,7 @@ font-size: 12px; line-height: 45px; > div { - margin-left: 12px; + padding-left: 12px; position: relative; p { position: absolute; @@ -1548,6 +1562,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); @@ -1689,7 +1715,7 @@ .right_dutyLst { width: calc(106% - 20px); // height: 270px; - height: 310px; + height: 370px; border-radius: 4px; line-height: 30px; overflow: hidden; @@ -1708,7 +1734,7 @@ } .right-person-box { width: 100%; - height: calc(100% - 40px); + height: calc(100% - 60px); overflow: auto; margin-top: -10px; } @@ -1738,7 +1764,7 @@ } .right_base { width: 100%; - height: calc(100% - 520px); + height: calc(100% - 580px); min-height: 200px; // overflow-y:auto; position: relative; -- Gitblit v1.8.0