From f6739d7542be48f7f8139c3d5fc7b2326e5cfc8d Mon Sep 17 00:00:00 2001 From: songshankun <songshankun@foxmail.com> Date: 星期三, 22 十一月 2023 11:06:35 +0800 Subject: [PATCH] feat: 轮询plc时间调整; 接口报错时也轮询plc --- src/views/visualization.vue | 504 +++++++++++++++++++++++++++++++++++++++++-------------- 1 files changed, 372 insertions(+), 132 deletions(-) diff --git a/src/views/visualization.vue b/src/views/visualization.vue index 163be06..8811c49 100644 --- a/src/views/visualization.vue +++ b/src/views/visualization.vue @@ -4,8 +4,9 @@ <!-- v-if="Tasks&&Tasks.length>0" --> <template > <div class="left"> - <p class="title"> - <template v-if="Number(ChannelAmount)>1"> + <div class="title"> + <div class="dashboard-channels"> + <template v-if="Number(ChannelAmount)>1"> <span class="font set-title" style="float: left; margin-right: 15px;" @@ -16,36 +17,48 @@ <img style="width:32px;" src="../../public/one.png" /> </span> </span> - <span class="font set-title" style="float: left;margin-right: 15px;" @click="cutClick(2)"> + <span class="font set-title" style="float: left;margin-right: 15px;" @click="cutClick(2)"> <img style="width:32px;" v-if="activeName == 2" src="../../public/two-blue.png" /> <img style="width:32px;" v-else src="../../public/two.png" /> </span> - <span - class="font set-title" - style="float: left;" - @click="cutClick(3)" - > + <span + class="font set-title" + style="float: left;" + @click="cutClick(3)" + > <img style="width:32px;" v-if="activeName == 3" src="../../public/right-blue.png" /> <span v-else> <img style="width:32px;" src="../../public/right.png" /> </span> </span> - </template> - 鐢熶骇绠$悊鐪嬫澘 - <span - class="font el-icon-setting set-title" - style="float: right" - @click="setUrl" - ></span> - <span - style="float: right;margin-right:20px;font-size:28px;line-height:25px;" - @click="taskClick" - > + </template> + </div> + <div class="dashboard-title"> + 鏅鸿兘宸ヤ綔鍙� 鈥� {{currentDeviceName}} + + <i @click="showDeviceModal=true" class="el-icon" style="font-size: 26px; height: 32px; color: #0db7f5; margin-left: 20px; cursor: pointer;"><svg data-v-c3da359e="" viewBox="0 0 24 24" width="1.2em" height="1.2em"><path fill="currentColor" d="M13 5h9v2h-9zM2 7h7v2h2V3H9v2H2zm7 10h13v2H9zm10-6h3v2h-3zm-2 4V9.012h-2V11H2v2h13v2zM7 21v-6H5v2H2v2h3v2z"></path></svg></i> + </div> + <div class="dashboard-btn"> + <span + class="font el-icon-setting set-title" + style="float: right" + @click="setUrl" + ></span> + <span + class="font el-icon-s-tools set-title" + style="float: right;margin-right: 6px" + @click="openParamsConfigModal" + ></span> + <span + style="float: right;margin-right:20px;font-size:28px;line-height:25px;" + @click="taskClick" + > <el-badge :value="TaskCount" :class="(TaskCount==0||isTipShow)?'item color_666':'item color_fff'"> <i class="el-icon-chat-dot-round" /> </el-badge> </span> - </p> + </div> + </div> <div :class="(activeName == 1||activeName == 3) ? 'active-one' : 'active-two'" v-for="(taskData, index) in Tasks" @@ -53,7 +66,7 @@ > <template v-if="taskData"> <div class="gong-date"> - 宸ュ簭杩愯鏃堕棿锛歿{ getFormatTime(taskData.Procedure.startTime) }} + 宸ュ簭杩愯鏃堕棿锛歿{ getTaskRunningTime(taskData.Procedure.realStartTime,taskData.Procedure.realEndTime) }} </div> <div class="statelist"> <span class="title-item" @@ -104,7 +117,8 @@ style="font-size: 35px; font-weight: 600" class="color_green" > - {{ taskData.finishNumber || 0 }}{{ taskData.Order.unit }} + {{ processingStatistics(taskData).finishNumber }} +<!-- {{ taskData.Order.unit }}--> </dd> </dl> </div> @@ -117,7 +131,8 @@ style="font-size: 35px; font-weight: 600" class="color_green" > - {{ taskData.Order.amount || 0 }}{{ taskData.Order.unit }} + {{ processingStatistics(taskData).totalNumber }} +<!-- {{ taskData.Order.unit }}--> </dd> </dl> </div> @@ -125,8 +140,8 @@ </div> <div class="content_right"> <div class="gif" v-if="taskData.Procedure.ID" @click="processModelClick(taskData,index)"> - <img v-if="taskData.isUpdateIcon" src="../../public/shan.gif" /> - <span v-else class="yuandian"></span> + <img class="blink" v-if="taskData.isUpdateIcon" src="../../public/shan.gif" /> + <span v-else class="tip"></span> </div> <el-descriptions :column="(activeName == 1||activeName == 3) ? 2 : 1" :colon="true"> <el-descriptions-item label="浜у搧鍚嶇О">{{ @@ -143,9 +158,9 @@ {{ taskData.Procedure.procedure.workHours || "--" }} </el-descriptions-item> <el-descriptions-item label="璁″垝鏃堕棿" - >{{ formatDate(taskData.Order.startTime) || "--" }} + >{{ formatDate(taskData.Procedure.startTime) || "--" }} - - {{ formatDate(taskData.Order.endTime) }}</el-descriptions-item + {{ formatDate(taskData.Procedure.endTime) }}</el-descriptions-item > <el-descriptions-item label="閫氶亾"> {{ channelNameConfig[taskData.Channel] || "--" }} @@ -166,16 +181,7 @@ text-color="#fff" :text-inside="true" :stroke-width="30" - :percentage=" - (taskData.Order && taskData.finishNumber != 0 && taskData.Order.amount) - ? parseInt( - (taskData.finishNumber / taskData.Order.amount) * - 100 - )>100?100:parseInt( - (taskData.finishNumber / taskData.Order.amount) * - 100 - ): 0 - " + :percentage="calculateProgress(processingStatistics(taskData))" ></el-progress> </el-descriptions-item> <!-- <el-descriptions-item label="鍚堟牸鐜�" style="width: 100%"> @@ -297,15 +303,7 @@ </div> <div class="card_top-3"> <span class="card-top-r-t" - >瀹屾垚杩涘害锛歿{ - (taskData.Order && taskData.finishNumber != 0 && taskData.Order.amount) - ? parseInt( - (taskData.finishNumber / - taskData.Order.amount) * - 100 - ) - : 0 - }}</span + >瀹屾垚杩涘害锛歿{calculateProgress(processingStatistics(taskData))}}</span > <span class="card-top-r-b"> <el-progress @@ -314,26 +312,14 @@ text-color="#fff" :text-inside="true" :stroke-width="10" - :percentage=" - (taskData.Order && taskData.finishNumber != 0) - ? parseInt( - (taskData.finishNumber / - taskData.Order.amount) * - 100 - )>100?100:parseInt( - (taskData.finishNumber / - taskData.Order.amount) * - 100 - ) - : 0 - " + :percentage="calculateProgress(processingStatistics(taskData))" :show-text="false" ></el-progress> </span> </div> <div class="card_top-2"> <div style="line-height: 45px; text-align: center"> - {{ taskData.Procedure.Status==3?'鐢熶骇瀹屾垚':'鐢熶骇涓�' }} + {{ displayProcedureStatus(taskData) }} </div> <!-- <span class="card-top-r-t">瀹屾垚杩涘害锛�50%</span> <span class="card-top-r-b">12鏈�28鏃� 08:24</span> --> @@ -383,10 +369,11 @@ class="button-finish" v-model="finishShow['finishShow&'+index]" trigger="click" + :ref="'popoverRef_' + index" > <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 size="mini" @click="closePopover(index)"> 鍙栨秷</el-button > <el-button @@ -494,26 +481,28 @@ </div> <div class="right-top-m"> 璁惧鐘舵��: - <!-- 1鏂紑2鐢熶骇3寰呮満 --> - <span style="position: relative" v-if="plcStatus" > - <el-popover - v-if="plcStatus == 1&&plcNotConnected" - width="180" - :content="plcNotConnected" - placement="top-end" - trigger="click" - > - <span slot="reference"> - <img src="../../public/duan.png" /> - 鏂紑 + <template v-for="(plcStatus, channel) in displayPLCStatus"> + <!-- 1鏂紑2鐢熶骇3寰呮満 --> + <span class="plc-status" style="position: relative" v-if="plcStatus"> + <el-popover + v-if="plcStatus === 1&&plcNotConnected" + width="180" + :content="plcNotConnected" + placement="top-end" + trigger="click" + > + <span slot="reference"> + <img src="../../public/duan.png"/> + 鏂紑 + </span> + </el-popover> + <span v-else> + <img v-if="plcStatus === 1&&!plcNotConnected" src="../../public/duan.png"/> + <img v-else src="../../public/lian.png"/> + {{ plcStatus === 1 ? '鏂紑' : (plcStatus === 2 ? '鐢熶骇涓�' : '寰呮満') }} </span> - </el-popover> - <span v-else> - <img v-if="plcStatus == 1&&!plcNotConnected" src="../../public/duan.png" /> - <img v-else src="../../public/lian.png" /> - {{ plcStatus==1?'鏂紑':(plcStatus==2?'鐢熶骇涓�':'寰呮満') }} </span> - </span> + </template> </div> <div class="right-top-m-btn"> <!-- <el-button type="primary" @click="controlClick"> 鎺у埗</el-button> --> @@ -524,7 +513,7 @@ <div class="right-person-box" v-if="workers && workers.length > 0"> <dl class="right-small-person" - v-for="(item, index) in workers" + v-for="(item, index) in deduplicateWorkers(displayWorkers())" :key="index" > <dt> @@ -617,6 +606,8 @@ :listData="listData" @updateGet="updateGet" /> + <ParamsConfigModal :visible="paramsConfigIsShow" @close="closeParamsConfigModal"></ParamsConfigModal> + <DeviceSelectModal :visible.sync="showDeviceModal" @should-reload="reloadAllData"></DeviceSelectModal> </div> </template> @@ -639,8 +630,14 @@ import ProcessModel from "../components/ProcessModel.vue"; import TaskControlModal from "@/components/TaskControlModal.vue"; import {channelNameConfig} from "@/common/constants"; +import _ from 'lodash' +import ParamsConfigModal from "@/components/ParamsConfigModal.vue"; +import DeviceSelectModal from "@/components/DeviceSelectModal.vue"; +import {mapActions, mapGetters, mapState} from "vuex"; export default { components: { + DeviceSelectModal, + ParamsConfigModal, TaskControlModal, Card, Knowledge, @@ -650,6 +647,7 @@ }, data() { return { + showDeviceModal:false, pollingTaskCountTimer: null, activeName: 1, progress: 70, //杩涘害 @@ -660,6 +658,8 @@ // 鍙充晶瀹屾垚 finishShow:{}, workers:[], + // 淇濆瓨褰撳墠涓嶅悓閫氶亾鐨勫�肩彮浜� + channelWorkersMap:{0:[],1:[]}, TasksCopy:[], Tasks: [ { @@ -752,7 +752,7 @@ cutdownTimer: null, ProcessModelTimer: null, TaskCount:0, - plcStatus:0, + PLCStatusMap:{0:0,1:0}, isTipShow:false, // isFinsh:0, safeProduce:'', @@ -774,6 +774,7 @@ resprocInfoTimer:null, channelNameConfig: channelNameConfig, index:null, + paramsConfigIsShow:false }; }, mounted() { @@ -794,6 +795,7 @@ this.activeName = channelType this.getTaskInfo(channelType); this.getTaskCountStatistics() + this.getDeviceInfo() }, beforeDestroy() { clearTimeout(this.pollingTaskCountTimer) @@ -807,7 +809,98 @@ // } // } }, + computed:{ + ...mapState(['deviceInfo']), + ...mapGetters(['currentDeviceName']), + displayPLCStatus(){ + let PLCStatus = [] + if (this.activeName===1){ + PLCStatus =[this.PLCStatusMap[0]] + }else if (this.activeName===2){ + PLCStatus =[this.PLCStatusMap[0],this.PLCStatusMap[1]] + }else if (this.activeName===3){ + PLCStatus =[this.PLCStatusMap[1]] + }else { + return [] + } + + return PLCStatus + } + }, methods: { + ...mapActions(["getDeviceInfo"]), + reloadAllData(){ + console.log(1) + this.getTaskInfo(this.activeName); + this.getTaskCountStatistics() + this.getDeviceInfo() + }, + newTaskPlaceholder(channel){ + return { + Order: {}, + Procedure: { + procedure: { inputMaterials: [], outputMaterials: [], workers: [] }, + }, + Channel:channel, + inputMaterials: [], + outputMaterials: [], + procedureList: [], + } + }, + /** + * 灞曠ず宸ュ簭鐘舵�� + * 濡傛灉PLC鐨勭姸鎬佹槸寰呮満瑕佽窡闅廝LC鐘舵�� + * @param taskData + * @return {string} + */ + displayProcedureStatus(taskData){ + if (taskData?.plcStatus === 3){ + return '寰呮満' + } + if (!taskData?.Procedure?.Status){ + return '' + } + if (taskData.Procedure.Status===3){ + return '鐢熶骇瀹屾垚' + }else{ + return '鐢熶骇涓�' + } + }, + /** + * 浠庝换鍔′腑鑾峰彇鍔犲伐鏁板拰鐩爣鏁� + * @param taskData + * @return {{totalNumber: number, finishNumber: number}} + */ + processingStatistics(taskData){ + const totalNumber = taskData?.totalNumber ?? 0 + const finishNumber = taskData?.finishNumber ?? 0 + + return { + /** 鐩爣鏁� */ + totalNumber: +totalNumber, + /** 鍔犲伐鏁� */ + finishNumber: +finishNumber, + } + }, + /** + * 璁$畻鐢熶骇杩涘害 + * @param {{totalNumber: number, finishNumber: number}} statistics + * @return {number} 杩涘害,0~100 + */ + calculateProgress(statistics){ + if (statistics.finishNumber === 0){ + return 0 + } + if (statistics.finishNumber === statistics.totalNumber){ + return 100 + } + + const result = Math.floor(statistics.finishNumber / statistics.totalNumber * 100) + return result > 100 ? 100 : result + }, + deduplicateWorkers(workers){ + return _.uniqBy(workers,ele=>ele.workerName) + }, updateGet(number,val){ if(val){ this.getTaskInfo(this.activeName,'new') @@ -821,12 +914,12 @@ getModelList(){ for (let i in this.TasksCopy){ this.TasksCopy[i].isUpdateIcon=false; - if(this.TasksCopy[i].Procedure.ID&&this.TasksCopy[i].number){ + // number:this.TasksCopy[i].number + if(this.TasksCopy[i].Procedure.ID){ processModelList({ procedureId: this.TasksCopy[i].Procedure.ID, page: 1, pageSize:6, - number:this.TasksCopy[i].number }).then(res=>{ if(res.code==200){ this.processList=res.data?res.data:[]; @@ -841,7 +934,7 @@ } } this.resResult[i]=res; - console.log( this.resResult[i],'===res111') + // console.log( this.resResult[i],'===res111') }) } } @@ -850,12 +943,11 @@ this.listData=list; this.index=index if( Object.keys(this.listData).length > 0){ - if(this.listData.Procedure.ID&&this.listData.number){ + if(this.listData.Procedure.ID){ this.$refs.processModel.islook=true return true; } } - this.$message.error('褰撳墠宸ュ簭鏃犵紪鍙凤紝鏃犳硶鏌ョ湅宸ュ簭!') }, getProcessModelList(){ this.getModelList() @@ -997,23 +1089,55 @@ let now = new Date(); this.formatTime2 = this.getDateObj(now, "yyyy骞碝M鏈坉d鏃�"); }, - getFormatTime(date){ - const getCha=()=>{ - let now=new Date().getTime() - let String=now-date*1000; - let seconds=Math.floor(String/1000) - let minutes=Math.floor(seconds/60) - - let days=Math.floor(String/1000/60/60/24) - let hours=Math.floor(minutes/60)-days*24 - let m=minutes-days*24*60-hours*60 - return days+'澶�'+hours+'鏃�'+m+'鍒�' + /** + * 璁$畻鏃堕棿娈�, 娉ㄦ剰鍙傛暟瑕佹眰鏃堕棿鎴充负 JS Date 鐨�13浣嶆椂闂存埑 + * @param {number} startTime + * @param {number} endTime + * @return {string} + */ + calcRunningDuration(startTime,endTime){ + let timeDuration=endTime-startTime; + if (timeDuration<0){ + return '0澶�0鏃�0鍒�' } - let d= getCha() + + let seconds=Math.floor(timeDuration/1000) + let minutes=Math.floor(seconds/60) + + let days=Math.floor(timeDuration/1000/60/60/24) + let hours=Math.floor(minutes/60)-days*24 + let m=minutes-days*24*60-hours*60 + return `${days}澶�${hours}鏃�${m}鍒哷 + }, + + /** + * 宸ュ簭杩愯鏃堕棿 + * 鏍规嵁鎺ュ彛杩斿洖 realStartTime realEndTime 鍒ゆ柇濡備綍灞曠ず + * 濡傛灉 realEndTime 涓� 0 鍒� 鐢ㄥ綋鍓嶆椂闂� - realStartTime + * 濡傛灉 瀛樺湪 realEndTime, 鍒� realEndTime - realStartTime + * 娉ㄦ剰 realStartTime realEndTime 鏄帴鍙h繑鍥炵殑10浣嶆椂闂存埑 + * @param realStartTime + * @param realEndTime + * @return {string} + */ + getTaskRunningTime(realStartTime,realEndTime){ + const getInfo = ()=>{ + if (!realStartTime && !realEndTime){ + return '--' + } + if(!realEndTime){ + const now = Math.floor(new Date().getTime()/1000) * 1000 + return this.calcRunningDuration(realStartTime*1000,now) + } + + return this.calcRunningDuration(realStartTime*1000,realEndTime*1000) + } + + let result = getInfo() setInterval(() => { - d= getCha(); + result = getInfo(); }, 6000); - return date?d:'--'; + return result; }, setInterCard(value, name, i) { if (this.TasksCopy[i].Procedure.procedure[value]!=null) { @@ -1061,6 +1185,8 @@ getTaskInfo({taskMode:1}).then((res) => { if (res.code === 200&&res.data) { this.TaskCount=res.data?.TaskCount ?? 0 + }else { + this.TaskCount = 0 } },err=>{ this.TaskCount = 0 @@ -1068,9 +1194,28 @@ }).finally(()=>{ this.pollingTaskCountTimer = setTimeout(()=>{ this.getTaskCountStatistics() - // 20绉掍竴娆¤疆璇� - },20000) + // 20绉掍竴娆¤疆璇� // 鏀逛竴鍒嗛挓 + },60000) }); + }, + + /** + * 鏍规嵁褰撳墠灞曠ず鐨勬槸0閫氶亾杩樻槸1閫氶亾杩樻槸涓や釜閫氶亾灞曠ず瀵瑰簲鐨勫�肩彮浜� + * @return {*[]} + */ + displayWorkers(){ + let showWorkers = [] + if (this.activeName===1){ + showWorkers =[...this.channelWorkersMap[0]] + }else if (this.activeName===2){ + showWorkers =[...this.channelWorkersMap[0],...this.channelWorkersMap[1]] + }else if (this.activeName===3){ + showWorkers =[...this.channelWorkersMap[1]] + }else { + return [] + } + + return showWorkers }, getTaskInfo(val,info) { @@ -1078,35 +1223,40 @@ this.TasksCopy=[] getTaskInfo({taskMode:2}).then((res) => { if (res.code == 200&&res.data) { - // let arr=[] - if(res.data.Tasks){ - res.data.Tasks.sort(function(a,b){ - return (a.Channel - b.Channel) - }) - } - this.TasksCopy = res.data.Tasks ? res.data.Tasks : []; + this.TasksCopy = res.data?.Tasks ?? []; // this.safeProduce=res.data.Prompt.safeProduce?res.data.Prompt.safeProduce:'' - this.plcNotConnected=res.data.Prompt.plcNotConnected?res.data.Prompt.plcNotConnected:'' - this.ChannelAmount=res.data.ChannelAmount?res.data.ChannelAmount:1 + this.plcNotConnected=res.data.Prompt.plcNotConnected ?? '' + this.ChannelAmount=res.data.ChannelAmount ?? 1 // if(this.ChannelAmount>1 &&this.TasksCopy.length<2){ // this.TasksCopy.push(this.object) // } - this.TaskCount=res.data.TaskCount?res.data.TaskCount:0 + this.TaskCount=res.data.TaskCount ?? 0 - if ((this.TasksCopy.length ==0 )||!this.TasksCopy) { - if (this.activeName == 1||this.activeName == 3) { - this.TasksCopy.push(this.object); - } else { - this.TasksCopy.push(this.object); - this.TasksCopy.push(this.object); - } - } + // 鎵惧嚭缂哄皯浠诲姟鏁版嵁鐨勯�氶亾, 浣跨敤鍗犱綅鏁版嵁鍗犱綇瀵瑰簲閫氶亾 + const channelNumbers = this.TasksCopy.map(task=>task.Channel) + const allChannels = [0,1]; + const lackChannels = _.chain(allChannels).difference(channelNumbers).value() + lackChannels.forEach(channel => this.TasksCopy.push(this.newTaskPlaceholder(channel))) + this.TasksCopy.sort((a,b)=>a.Channel - b.Channel) + this.workers=res.data.workers?res.data.workers:[] + + // 灏嗗�肩彮浜烘牴鎹�氶亾鍙峰垎缁� + const groupByChannel= _.groupBy(res.data.Tasks,ele=>ele.Channel) + const taskList0= _.first(groupByChannel[0]) + const taskList1= _.first(groupByChannel[1]) + const worker0List = taskList0?.Procedure?.procedure?.workers ?? [] + const worker1List = taskList1?.Procedure?.procedure?.workers ?? [] + this.channelWorkersMap['0'] =worker0List + this.channelWorkersMap['1'] =worker1List + for (let i in this.TasksCopy) { this.TasksCopy[i].procedureList = []; this.TasksCopy[i].inputMaterials = []; this.TasksCopy[i].outputMaterials = []; this.TasksCopy[i].finishNumber = 0; + this.TasksCopy[i].totalNumber = 0; + this.TasksCopy[i].plcStatus = 0; this.TasksCopy[i].number=0; this.TasksCopy[i].isUpdateIcon=false; this.finishShow['finishShow&'+i]=false @@ -1141,17 +1291,35 @@ } this.getProcessModelList(); this.getStartArr() - this.cutClick(val?val:1) + if(this.ChannelAmount===1){ + this.cutClick(1) + }else{ + this.cutClick(val?val:1) + } + if(info=='new'){ return true; } - + this.getProgressInfo(); if (!this.procInfoTimer&&!this.resprocInfoTimer) { this.procInfoTimer = setInterval(() => { this.getProgressInfo(); }, 3000); } + }else{ + this.TaskCount = 0 + const allChannels = [0,1]; + this.workers = [] + allChannels.forEach(channel => this.TasksCopy.push(this.newTaskPlaceholder(channel))) + this.TasksCopy.sort((a,b)=>a.Channel - b.Channel) + this.cutClick(1) + this.getProgressInfo(); + if (!this.procInfoTimer&&!this.resprocInfoTimer) { + this.procInfoTimer = setInterval(() => { + this.getProgressInfo(); + }, 3000); + } } // if (res.code != 200 || this.TasksCopy.length == 0) { // this.getcountdown(); @@ -1163,6 +1331,14 @@ // } // } + },err=>{ + console.error(err) + this.TaskCount = 0 + const allChannels = [0,1]; + this.workers = [] + allChannels.forEach(channel => this.TasksCopy.push(this.newTaskPlaceholder(channel))) + this.TasksCopy.sort((a,b)=>a.Channel - b.Channel) + this.cutClick(1) }); // this.TasksCopy.push(this.object) // this.TasksCopy.push(this.object) @@ -1215,20 +1391,17 @@ getProgressInfo() { this.resprocInfoTimer=null for (let i in this.TasksCopy){ - if(this.TasksCopy[i].Procedure.ID){ getProgress({ channel: Number(i), - procedureId: this.TasksCopy[i].Procedure.ID, }).then((res) => { if (res.code == 200) { - this.TasksCopy[i].finishNumber = res.data.finishNumber - ? res.data.finishNumber - : 0; - this.plcStatus=res.data.plcStatus?res.data.plcStatus:0 + this.TasksCopy[i].finishNumber = res.data?.finishNumber ?? 0; + this.TasksCopy[i].totalNumber = res.data?.totalNumber ?? 0; + this.TasksCopy[i].plcStatus = res.data?.plcStatus ?? 0 + this.PLCStatusMap[i] = res.data?.plcStatus ?? 0 } this.resprocInfoTimer=res; }); - } } }, // 璁剧疆 @@ -1240,6 +1413,12 @@ this.$router.push({ path: "/set", }); + }, + openParamsConfigModal(){ + this.paramsConfigIsShow=true + }, + closeParamsConfigModal(){ + this.paramsConfigIsShow=false }, // 鍙充晶鎺у埗 controlClick() { @@ -1267,6 +1446,15 @@ } else { this.$message.error("褰撳墠璁惧娌℃湁宸ュ簭锛�"); } + }, + + /** + * 鍏抽棴 tooltip + * @param index + */ + closePopover(index){ + this.finishShow['finishShow&'+index] = false + this.$refs?.['popoverRef_' + index]?.[0]?.doClose() }, getRandomNumber(min, max) { return Math.floor(Math.random() * (max - min + 1) + min); @@ -1558,6 +1746,28 @@ // margin-top:-5px; vertical-align: middle; } + + +.tip { + display:inline-block; + // background: #15d815; + background:red; + border-radius: 50%; + // margin-top:-5px; + vertical-align: middle; +} +.blink{ + display: inline-block; + width: 14px; + height: 14px; +} +.tip, .blink{ + position: absolute; + top: -6px; + right: -6px; + width: 14px; + height: 14px; +} .bottom_list { position: relative; padding: 10px; @@ -1687,6 +1897,9 @@ padding: 30px; padding-top: 20px; .title { + display: flex; + align-items: center; + justify-content: space-between; font-size: 30px; font-weight: 600; height:40px; @@ -1766,15 +1979,18 @@ border-radius: 6px; position:relative; .gif{ + background: url("../../public/setting.png") no-repeat; + background-size:100% 100%; position:absolute; right:15px; top:10px; width:35px; + height: 35px; vertical-align: middle; cursor:pointer; - img{ - width:100%; - } + //img{ + // width:100%; + //} } // background: #233b9e; .el-descriptions-row{ @@ -2146,4 +2362,28 @@ padding: 12px; } } +.plc-status{ + margin-right: 24px; + position: relative; + display: inline-block; + height: 50px; + &:after{ + content: ''; + position: absolute; + top: 50%; + right: -12px; + margin-top: -15px; + border-right: 2px solid #ffffff; + height: 30px; + } +} +.plc-status:last-child{ + &:after{ + display: none; + } +} +.dashboard-title{ + display: flex; + align-items: center; +} </style> -- Gitblit v1.8.0