From e9c1bc5f107ebfdb58b6c85e01a719bbeb643d66 Mon Sep 17 00:00:00 2001 From: songshankun <songshankun@foxmail.com> Date: 星期日, 08 十月 2023 11:39:59 +0800 Subject: [PATCH] feat: 任务弹窗添加翻页展示 --- src/views/visualization.vue | 674 ++++++++++++++++++++++++++++++++++++++----------------- 1 files changed, 463 insertions(+), 211 deletions(-) diff --git a/src/views/visualization.vue b/src/views/visualization.vue index 3745c30..bbf6439 100644 --- a/src/views/visualization.vue +++ b/src/views/visualization.vue @@ -1,22 +1,36 @@ <template> - <div class="home"> - <!-- v-if="Object.keys(taskData).length > 0 && taskData.Procedure.ID" --> - <template v-if="Tasks&&Tasks.length>0"> + <div class="home" ref="homeRef"> + <!-- v-if="Tasks&&Tasks.length>0" --> + <template > <div class="left"> <p class="title"> - <span - class="font set-title" - style="float: left; margin-right: 15px;" - @click="cutClick(1)" - > - <img style="width:32px;" v-if="activeName == 1" src="../../public/one-blue.png" /> - <img style="width:32px;" v-else src="../../public/one.png" /> - </span> - <span class="font set-title" style="float: left" @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> + <template v-if="Number(ChannelAmount)>1"> + <span + class="font set-title" + style="float: left; margin-right: 15px;" + @click="cutClick(1)" + > + <img style="width:32px;" v-if="activeName == 1" src="../../public/one-blue.png" /> + <span v-else> + <img style="width:32px;" src="../../public/one.png" /> + </span> + </span> + <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)" + > + <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" @@ -33,10 +47,11 @@ </span> </p> <div - :class="activeName == 1 ? 'active-one' : 'active-two'" + :class="(activeName == 1||activeName == 3) ? 'active-one' : 'active-two'" v-for="(taskData, index) in Tasks" :key="index" > + <template v-if="taskData"> <div class="gong-date"> 宸ュ簭杩愯鏃堕棿锛歿{ getFormatTime(taskData.Procedure.startTime) }} </div> @@ -44,13 +59,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" @@ -74,8 +89,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> @@ -89,7 +104,7 @@ style="font-size: 35px; font-weight: 600" class="color_green" > - {{ taskData.finishNumber }}{{ taskData.Order.unit }} + {{ taskData.finishNumber || 0 }}{{ taskData.Order.unit }} </dd> </dl> </div> @@ -109,46 +124,46 @@ </div> </div> <div class="content_right"> - <el-descriptions :column="activeName == 1 ? 2 : 1" :colon="true"> + <el-descriptions :column="(activeName == 1||activeName == 3) ? 2 : 1" :colon="true"> <el-descriptions-item label="浜у搧鍚嶇О">{{ - taskData.Order.productName || "" + taskData.Order.productName || "--" }}</el-descriptions-item> <el-descriptions-item label="鏁伴噺" >{{ taskData.Order.amount || 0 }}{{ taskData.Order.unit }}</el-descriptions-item > <el-descriptions-item label="浜よ揣鏃ユ湡">{{ - taskData.Order.deliverDate || "" + taskData.Order.deliverDate || "--" }}</el-descriptions-item> <el-descriptions-item label="宸ユ椂"> - {{ taskData.Procedure.procedure.workHours || "" }} + {{ taskData.Procedure.procedure.workHours || "--" }} </el-descriptions-item> <el-descriptions-item label="璁″垝鏃堕棿" - >{{ formatDate(taskData.Order.startTime) || "" }} + >{{ formatDate(taskData.Order.startTime) || "--" }} - {{ formatDate(taskData.Order.endTime) }}</el-descriptions-item > <el-descriptions-item label="璐х墿鎻忚堪">{{ - taskData.Order.orderAttr || "" + taskData.Order.orderAttr || "--" }}</el-descriptions-item> <el-descriptions-item label="瀹㈡埛鍚嶇О">{{ - taskData.Order.customer || "" + taskData.Order.customer || "--" }}</el-descriptions-item> <el-descriptions-item label="鍙傛暟瑕佹眰">{{ - taskData.Order.parameter || "" + taskData.Order.parameter || "--" }}</el-descriptions-item> </el-descriptions> <el-descriptions :column="1" :colon="true"> <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" :percentage=" - (taskData.Order && taskData.finishNumber != 0) + (taskData.Order && taskData.finishNumber != 0 && taskData.Order.amount) ? parseInt( (taskData.finishNumber / taskData.Order.amount) * 100 @@ -196,19 +211,35 @@ v-for="(list, index2) in item" > <div class="card_content"> - <div class="card_contentLeft">{{ list.materialId }}</div> + <div class="card_contentLeft font_dian"> + <el-popover + width="200" + :content="list.materialId" + placement="top-start" + trigger="click" + > + <span slot="reference">{{ list.materialId }}</span> + </el-popover> + </div> </div> - <div class="card_top"> - <div> + <div class="card-top-input-out-l"> + <div class="font_dian"> <!-- 璁惧12<i style="font-size: 14px" class="el-icon-right font-arrow-20" ></i> 璁惧13 --> - {{ list.materialName }} + <el-popover + width="200" + :content="list.materialName" + placement="top-start" + trigger="click" + > + <span slot="reference">{{ list.materialName }}</span> + </el-popover> </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> @@ -218,11 +249,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 || "" }} @@ -246,15 +277,23 @@ > <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> <div class="card_top-3"> <span class="card-top-r-t" >瀹屾垚杩涘害锛歿{ - taskData.Order && taskData.finishNumber != 0 + (taskData.Order && taskData.finishNumber != 0 && taskData.Order.amount) ? parseInt( (taskData.finishNumber / taskData.Order.amount) * @@ -265,8 +304,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" @@ -289,7 +328,7 @@ </div> <div class="card_top-2"> <div style="line-height: 45px; text-align: center"> - 鐢熶骇涓� + {{ taskData.Procedure.Status==3?'鐢熶骇瀹屾垚':'鐢熶骇涓�' }} </div> <!-- <span class="card-top-r-t">瀹屾垚杩涘害锛�50%</span> <span class="card-top-r-b">12鏈�28鏃� 08:24</span> --> @@ -297,10 +336,10 @@ </template> <template v-else> <!-- <div class="card_content"> - + </div> --> - <div class="card_top-4"> - <div>宸ヨ壓缂栧彿锛歿{ list.number }}</div> + <div :class="(activeName==1||activeName == 3)?'card_top-4 font_size_20px':'card_top-4'"> + <div>宸ヨ壓缂栧彿锛�<div >{{ list.number }}</div></div> <!-- <div style=" font-size: 14px; @@ -319,16 +358,18 @@ <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 + v-if="taskData.Procedure.Status && taskData.Procedure.Status!==3" placement="top-end" width="160" class="button-finish" 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 @@ -336,6 +377,7 @@ <el-button type="primary" size="mini" + class="color_f70f83" @click="finishClick(index, taskData)" > 纭畾</el-button @@ -343,9 +385,10 @@ </div> <el-button type="primary" slot="reference"> 瀹屾垚</el-button> </el-popover> + <el-button v-else type="primary" class="huise"> 瀹屾垚</el-button> </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> @@ -372,57 +415,51 @@ > <div class="card"> <div class="card_content"> - <div class="card_contentLeft"> - {{ list.materialId }} + <div class="card_contentLeft font_dian"> + <el-popover + width="200" + :content="list.materialId" + placement="top-start" + trigger="click" + > + <span slot="reference">{{ list.materialId }}</span> + </el-popover> </div> </div> - <div class="card_top"> - <div> - {{ list.materialName }} - <!-- 璁惧12<i - style="font-size: 14px" - class="el-icon-right font-arrow-20" - ></i> - 璁惧13 --> + <div class="card-top-input-out-l"> + <div class="font_dian"> + <el-popover + width="200" + :content="list.materialName" + placement="top-start" + trigger="click" + > + <span slot="reference">{{ list.materialName }}</span> + </el-popover> </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> </div> + </template> + <!-- 2涓换鍔$殑鏃跺�欙紝绗簩涓换鍔′负绌虹殑鏃跺�欐樉绀� --> + <template + v-if="activeName == 2 &&(!taskData||Object.keys(taskData).length==0)" + > + + <el-empty description="鏆傛棤浠诲姟..."></el-empty> + </template> </div> </div> <div class="right"> @@ -443,12 +480,25 @@ <div class="right-top-m"> 璁惧鐘舵��: <!-- 1鏂紑2鐢熶骇3寰呮満 --> - <span style="position: relative" + <span style="position: relative" v-if="plcStatus" > + <el-popover + v-if="plcStatus == 1&&plcNotConnected" + width="180" + :content="plcNotConnected" + placement="top-end" + trigger="click" > - <img v-if="plcStatus == 1" src="../../public/duan.png" /> - <img v-else src="../../public/lian.png" /> - <!-- <span class="yuandian"></span> --> - {{ plcStatus==1?'鏂紑':(plcStatus==2?'鐢熶骇涓�':'寰呮満') }} + <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" /> + <!-- <span class="yuandian"></span> --> + {{ plcStatus==1?'鏂紑':(plcStatus==2?'鐢熶骇涓�':'寰呮満') }} + </span> </span> </div> <div class="right-top-m-btn"> @@ -477,9 +527,12 @@ style="font-size: 20px; font-weight: 600; margin-right: 10px" >{{ item.workerName || "" }}</span > - <span>{{ item.phoneNum || "" }}</span> + <!-- <span>{{ item.phoneNum || "" }}</span> --> + <span class="color_yellow"><i class="el-icon-star-on" /><i class="el-icon-star-on" /><i class="el-icon-star-on" /><i class="el-icon-star-on" /><i class="el-icon-star-on" /></span> </dl> + </div> + <!-- <div style=" width: 100%; @@ -494,7 +547,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" @@ -504,8 +557,8 @@ </div> </div> </template> - <!-- v-else --> - <template v-else> + <!-- --> + <!-- <template v-else> <div class="home-img-box"> <div class="bg-title"> <img src="../../public/bg-title.png" /> @@ -535,17 +588,21 @@ </div> </div> </div> - </template> + + </template> --> <!-- 鎺у埗鐨勫脊妗� --> <AddControl ref="control" :Arr="Arr" /> <!-- 鎺у埗鐨勫脊妗� --> - <AddIssue + <TaskControlModal ref="control" - :Arr="Arr" - :taskData="taskData" - :Order="taskData.Order" - @getSetProductNumber="getTaskInfo" + :activeName="activeName" + @getSetProductNumber="reloadPage" @isTip="isTip" + /> + <!-- 宸ヨ壓妯″瀷 --> + <ProcessModel + ref="processModel" + :processList="processList" /> </div> </template> @@ -559,20 +616,26 @@ startTask, getProgress, countdown, + getTaskUnStarted, } from "@/api/home/index"; // 浜х嚎 import Card from "@/components/Card.vue"; import Knowledge from "../components/Knowledge.vue"; import AddControl from "../components/AddControl.vue"; import AddIssue from "../components/AddIssue.vue"; +import ProcessModel from "../components/ProcessModel.vue"; +import TaskControlModal from "@/components/TaskControlModal.vue"; export default { components: { + TaskControlModal, Card, Knowledge, AddControl, AddIssue, + ProcessModel, }, data() { return { + pollingTaskCountTimer: null, activeName: 1, progress: 70, //杩涘害 passrate: 30, //鍚堟牸鐜� @@ -582,6 +645,7 @@ // 鍙充晶瀹屾垚 finishShow:{}, workers:[], + TasksCopy:[], Tasks: [ { Order: { @@ -667,12 +731,37 @@ countDownHour: 0, countDownMinute: 0, Arr: [], + ArrError:'', // 璁板綍瀹氭椂鍣ㄧ姸鎬� procInfoTimer: null, cutdownTimer: null, TaskCount:0, - plcStatus:1, + plcStatus:0, isTipShow:false, + // isFinsh:0, + safeProduce:'', + // 璁惧鏂紑鐨勫師鍥� + plcNotConnected:'', + ChannelAmount:0, + object:{ + Order: {}, + Procedure: { + procedure: { inputMaterials: [], outputMaterials: [], workers: [] }, + }, + inputMaterials: [], + outputMaterials: [], + procedureList: [], + }, + processList:[ + { + name:'浜у搧1+宸ヨ壓2', + number:'v1.0' + }, + { + name:'浜у搧1+宸ヨ壓2', + number:'v2.0' + } + ] }; }, mounted() { @@ -688,13 +777,29 @@ this.getDate2(); }, 5000); this.getTaskInfo(); + this.getTaskCountStatistics() + }, + beforeDestroy() { + clearTimeout(this.pollingTaskCountTimer) + }, + watch:{ + // isFinsh(){ + // if(this.isFinsh==this.Tasks.length){ + // this.getStartArr() + // } + // } }, methods: { taskClick(){ if(this.TaskCount>0){ - this.$refs.control.islook=true + // this.getStartArr() + this.$refs.control.show=true }else{ - this.$message.error('鐩墠娌℃湁浠诲姟锛�') + this.$message({ + message:'鐩墠娌℃湁浠诲姟锛�', + type: 'error', + duration: 3 * 1000 + }) } }, isTip(val){ @@ -702,11 +807,29 @@ }, cutClick(val) { this.activeName = val; - this.getTaskInfo(); + if(this.activeName==2){ + this.Tasks=this.TasksCopy.slice(0,2) + if(this.Tasks.length<2){ + if(this.Tasks.length==0){ + this.Tasks.push(this.object) + } + this.Tasks.push(this.object) + } + }else if(this.activeName==1){ + this.Tasks=this.TasksCopy.slice(0,1) + if(this.Tasks.length<1){ + this.Tasks.push(this.object) + } + }else if(this.activeName==3){ + this.Tasks=this.TasksCopy.slice(1) + if(this.Tasks.length<1){ + this.Tasks.push(this.object) + } + } }, - reloadPage() { + reloadPage(val) { // window.location.reload(); - this.getTaskInfo(); + this.getTaskInfo(val); }, getcountdown() { countdown().then((res) => { @@ -720,9 +843,14 @@ this.countDownMinute = res.data.CountDownMinute ? res.data.CountDownMinute : 0; + if(this.countDownHour==0&& this.countDownMinute==0){ + this.getTaskInfo(); + } } }); }, + + getDateObj(date, fmt) { if (/(y+)/.test(fmt)) { @@ -756,7 +884,7 @@ formatDate(value) { if (value) { const now = value ? new Date(value * 1000) : new Date(); - let time = this.getDateObj(now, "yyyy-MM-dd hh:mm:ss"); + let time = this.getDateObj(now, "MM-dd hh:mm"); return time; } else { return ""; @@ -786,7 +914,7 @@ 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 @@ -796,18 +924,23 @@ setInterval(() => { d= getCha(); }, 6000); - return d; + return date?d:'--'; }, setInterCard(value, name, i) { - if (this.Tasks[i].Procedure.procedure[value]) { + if (this.TasksCopy[i].Procedure.procedure[value]!=null) { let height = 200; - let num = 1; - if (this.$refs[name]) { - height = this.$refs[name].$el.offsetHeight; - num = Math.floor(height / 80); + let num = 3; + // if (this.$refs[name]) { + // height = this.$refs[name].$el?this.$refs[name].$el.offsetHeight:200; + // num = Math.floor(height / 80); + // } + height = this.$refs['homeRef']?(this.$refs['homeRef'].offsetHeight-470-90-20):200; + if(this.activeName==2){ + height=height-610-90-20 } + num = Math.floor(height / 80); let inputMaterials = JSON.parse( - JSON.stringify(this.Tasks[i].Procedure.procedure[value]) + JSON.stringify(this.TasksCopy[i].Procedure.procedure[value]) ); let newDataList = []; let current = 0; @@ -828,66 +961,85 @@ } } } - this.Tasks[i][value] = [...newDataList]; + this.TasksCopy[i][value] = [...newDataList]; } }, - getTaskInfo() { - let object = { - Order: {}, - Procedure: { - procedure: { inputMaterials: [], outputMaterials: [], workers: [] }, - }, - inputMaterials: [], - outputMaterials: [], - procedureList: [], - }; + /** + * 杞鑾峰彇浠诲姟鏁伴噺 + */ + getTaskCountStatistics(){ + getTaskInfo({taskMode:1}).then((res) => { + if (res.code === 200&&res.data) { + this.TaskCount=res.data?.TaskCount ?? 0 + } + },err=>{ + this.TaskCount = 0 + console.error(err) + }).finally(()=>{ + this.pollingTaskCountTimer = setTimeout(()=>{ + this.getTaskCountStatistics() + // 20绉掍竴娆¤疆璇� + },20000) + }); + }, + + getTaskInfo(val) { this.Tasks = []; - getTaskInfo({ page: 1, pageSize: this.activeName }).then((res) => { + this.TasksCopy=[] + getTaskInfo({taskMode:2}).then((res) => { if (res.code == 200&&res.data) { let arr=[] if(res.data.Tasks){ arr.sort(function(a,b){ - return (a.Position - b.Position) + return (a.Channel - b.Channel) }) } - this.Tasks = res.data.Tasks ? res.data.Tasks : []; + this.TasksCopy = res.data.Tasks ? 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 + // if(this.ChannelAmount>1 &&this.TasksCopy.length<2){ + // this.TasksCopy.push(this.object) + // } 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); + + if ((this.TasksCopy.length ==0 )||!this.TasksCopy) { + if (this.activeName == 1||this.activeName == 3) { + this.TasksCopy.push(this.object); } else { - this.Tasks.push(object); - this.Tasks.push(object); + this.TasksCopy.push(this.object); + this.TasksCopy.push(this.object); } } - for (let i in this.Tasks) { - this.Tasks[i].procedureList = []; - this.Tasks[i].inputMaterials = []; - this.Tasks[i].outputMaterials = []; - this.Tasks[i].finishNumber = 0; + this.workers=res.data.workers?res.data.workers:[] + for (let i in this.TasksCopy) { + this.TasksCopy[i].procedureList = []; + this.TasksCopy[i].inputMaterials = []; + this.TasksCopy[i].outputMaterials = []; + this.TasksCopy[i].finishNumber = 0; this.finishShow['finishShow&'+i]=false - this.Tasks[i].Procedure.procedure.workers = this.Tasks[i].Procedure + this.TasksCopy[i].Procedure.procedure.workers = this.TasksCopy[i].Procedure .procedure.workers - ? this.Tasks[i].Procedure.procedure.workers + ? this.TasksCopy[i].Procedure.procedure.workers : []; - this.Tasks[i].procedureList.push([ + + this.TasksCopy[i].procedureList.push([ { name: "宸ュ簭", - ...this.Tasks[i].Procedure.procedure, + ...this.TasksCopy[i].Procedure.procedure, }, ]); - - if (this.Tasks[i].Procedure.ID) { - startTask({ id: this.Tasks[i].Procedure.ID }).then((res) => { + + if (this.TasksCopy[i].Procedure.ID) { + startTask({ id: this.TasksCopy[i].Procedure.ID }).then((res) => { if (res.code == 200) { // res.data.number - this.Tasks[i].procedureList[0].push({ + this.TasksCopy[i].procedureList[0].push({ number: res.data.Number, - name: "宸ヨ壓", - Arr:res.data.Params ? res.data.Params : [], }); + // this.TasksCopy[i].Arr=res.data.Params ? res.data.Params : [] + // this.isFinsh=Number(i)+1 } }); } @@ -899,44 +1051,64 @@ if (!this.procInfoTimer) { this.procInfoTimer = setInterval(() => { this.getProgressInfo(); - }, 9000); + }, 3000); } } - if (res.code != 200 || this.Tasks.length == 0) { - this.getcountdown(); - // 鎺у埗閲嶆柊璇锋眰getTaskInfo, 鍙紑鍚竴涓畾鏃跺櫒 - if (!this.cutdownTimer) { - this.cutdownTimer = setInterval(() => { - this.getcountdown(); - }, 60000); - } - } + // if (res.code != 200 || this.TasksCopy.length == 0) { + // this.getcountdown(); + // // 鎺у埗閲嶆柊璇锋眰getTaskInfo, 鍙紑鍚竴涓畾鏃跺櫒 + // if (!this.cutdownTimer) { + // this.cutdownTimer = setInterval(() => { + // this.getcountdown(); + // }, 60000); + // } + // } + this.cutClick(val?val:1) }); + // this.TasksCopy.push(this.object) + // this.TasksCopy.push(this.object) }, 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.taskData=this.Tasks[i]; - break; + // for (let i in this.TasksCopy) { + // if (this.TasksCopy[i].Procedure.Status==1) { + // this.Arr = this.TasksCopy[i].Arr ?this.TasksCopy[i].Arr: []; + // // this.taskData=this.TasksCopy[i]; + // break; + // } + // } + getTaskInfo({taskMode:1}).then(res=>{ + if(res.code==200){ + this.taskData=res.data.Tasks?res.data.Tasks[0]:{}; + this.ArrError='' + if (Object.keys(this.taskData).length > 0 &&this.taskData.Procedure.ID) { + startTask({ id: this.taskData.Procedure.ID }).then((res) => { + if (res.code == 200) { + this.Arr =res.data.Params ? res.data.Params : [] + }else{ + this.ArrError=res.msg?res.msg:'鑾峰彇宸ヨ壓鍙傛暟澶辫触锛�'; + } + }); + } } - } + }) }, getProgressInfo() { - for (let i in this.Tasks){ - getProgress({ - position: Number(i), - procedureId: this.Tasks[i].Procedure.ID, - }).then((res) => { - if (res.code == 200) { - this.Tasks[i].finishNumber = res.data.finishNumber - ? res.data.finishNumber - : 0; - this.plcStatus=res.data.plcStatus?res.data.plcStatus:1 - } - }); + 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 + } + }); + } } - + }, // 璁剧疆 setUrl() { @@ -967,7 +1139,7 @@ finishTask({ id: taskData.Procedure.ID }).then((res) => { if (res.code == 200) { this.finishShow['finishShow&'+i] = false; - this.getTaskInfo(); + this.reloadPage(this.activeName?this.activeName:1); this.$message.success("鎿嶄綔鎴愬姛锛�"); } }); @@ -986,6 +1158,33 @@ </script> <style lang="scss"> +.tooltip-width-200{ + 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:calc(100% - 190px); + .el-empty__description p{ + font-size:16px!important; + color:#fff!important; + } +} + .active-one { width: 100%; height: calc(100% - 100px); @@ -996,10 +1195,13 @@ margin-bottom: 20px; } .content { - height: 240px; + height: 300px; } .bottom { - height: calc(100% - 410px); + height: calc(100% - 470px); + } + .font_size_20px{ + font-size:20px!important; } } .active-two { @@ -1013,6 +1215,7 @@ box-sizing: border-box; border-right: 1px solid #eee; } + .small_title { margin-bottom: 30px; } @@ -1027,18 +1230,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; @@ -1068,7 +1271,7 @@ font-size:14px; } } - + .el-step{ .el-step__icon{ background:#00cc66; @@ -1250,14 +1453,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; } } @@ -1291,6 +1501,15 @@ border: 0; } } + .huise{ + width: 46%; + float: right; + } + .huise.el-button--primary { + background: #CCE8E8; + color: #AAAAAA; + border: 0; + } } .home { width: 100%; @@ -1324,11 +1543,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; @@ -1384,6 +1604,9 @@ background: rgb(22 72 173); border-radius: 6px; // background: #233b9e; + .el-descriptions-row{ + height:45px; + } .el-descriptions__body { background: transparent; font-size: 18px; @@ -1420,18 +1643,31 @@ // border: 1px solid #ccc; background: #6b83ff; border-radius: 5px; - margin-top: 20px; + margin-top: 10px; color: #333; position: relative; - .card_top-2, + .font_dian{ + -webkit-box-orient:vertical; + overflow:hidden; + text-overflow:ellipsis; + white-space:nowrap; + } + .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; @@ -1465,7 +1701,7 @@ } } - .card_top, + .card_top,.card-top-input-out-l, .card_top-4 { width: 50%; height: 45px; @@ -1474,10 +1710,8 @@ color: #fff; font-size: 12px; line-height: 45px; - float: left; - > div { - margin-left: 12px; + padding-left: 12px; position: relative; p { position: absolute; @@ -1487,15 +1721,32 @@ } } } + .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); - padding: 0 10px; - height: 70px; - - line-height: 70px; + padding: 10px 10px; color: #fff; background: rgb(19, 35, 90); - font-size: 20px; + font-size: 14px; + height:50px; + line-height: 25px; + >div{ + margin-left:0px; + } } .card-info-box { position: absolute; @@ -1522,6 +1773,7 @@ border-radius: 5px 5px 0 0; background: rgb(19, 35, 90); } + .card_contentRight { width: 100%; @@ -1592,7 +1844,7 @@ display:inline-block; } } - + .yuandian { width: 25px; height: 25px; @@ -1619,7 +1871,7 @@ .right_dutyLst { width: calc(106% - 20px); // height: 270px; - height: 310px; + height: 370px; border-radius: 4px; line-height: 30px; overflow: hidden; @@ -1638,7 +1890,7 @@ } .right-person-box { width: 100%; - height: calc(100% - 40px); + height: calc(100% - 60px); overflow: auto; margin-top: -10px; } @@ -1668,7 +1920,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