From 3d3b89a84fd8c3aa524c013afe56c6949fc3a874 Mon Sep 17 00:00:00 2001 From: songshankun <songshankun@foxmail.com> Date: 星期日, 08 十月 2023 16:19:45 +0800 Subject: [PATCH] feat: 工序添加工艺参数展示 --- src/views/visualization.vue | 160 +++++++++++++++++++++++++++++++++++++--------------- 1 files changed, 113 insertions(+), 47 deletions(-) diff --git a/src/views/visualization.vue b/src/views/visualization.vue index 2da3f20..a74ba65 100644 --- a/src/views/visualization.vue +++ b/src/views/visualization.vue @@ -271,11 +271,12 @@ v-for="(item, index) in taskData.procedureList" > <div - class="card" :key="index2" v-for="(list, index2) in item" > - <template v-if="list.name == '宸ュ簭'"> + <div + class="card" + v-if="list.name == '宸ュ簭'"> <div class="card_content"> <div class="card_contentLeft color_blue font_dian"> <!-- {{ list.deviceName }} --> @@ -333,24 +334,34 @@ <!-- <span class="card-top-r-t">瀹屾垚杩涘害锛�50%</span> <span class="card-top-r-b">12鏈�28鏃� 08:24</span> --> </div> - </template> - <template v-else> - <!-- <div class="card_content"> - - </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; - color: #cfcfcf; - line-height: 20px; - " + </div> + <div v-else class="process-params"> + <div class="process-params-title"> + <el-popover + width="200" + :content="list.number" + placement="top-start" + trigger="click" > - 宸ヨ壓鐨勫叿浣撲俊鎭鐐瑰嚮鎺у埗鏌ョ湅锛� - </div> --> + <span slot="reference">宸ヨ壓缂栧彿锛歿{ list.number }}</span> + </el-popover> + </div> - </template> + <div class="process-params-value"> + <!-- 宸ヨ壓鍙傛暟--> + {{mergeProcessParams(taskData.Arr)}} + </div> + + <!-- <div + style=" + font-size: 14px; + color: #cfcfcf; + line-height: 20px; + " + > + 宸ヨ壓鐨勫叿浣撲俊鎭鐐瑰嚮鎺у埗鏌ョ湅锛� + </div> --> + </div> </div> </el-carousel-item> </el-carousel> @@ -360,9 +371,9 @@ ></p> <div class="right-small-btn bottom-box-btn"> <el-button type="primary"> 鎵撳嵃</el-button> - + <el-popover - v-if="taskData.Procedure.Status!=3" + v-if="taskData.Procedure.Status && taskData.Procedure.Status!==3" placement="top-end" width="160" class="button-finish" @@ -457,7 +468,7 @@ <template v-if="activeName == 2 &&(!taskData||Object.keys(taskData).length==0)" > - + <el-empty description="鏆傛棤浠诲姟..."></el-empty> </template> </div> @@ -530,9 +541,9 @@ <!-- <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%; @@ -588,19 +599,14 @@ </div> </div> </div> - + </template> --> <!-- 鎺у埗鐨勫脊妗� --> <AddControl ref="control" :Arr="Arr" /> <!-- 鎺у埗鐨勫脊妗� --> - <AddIssue + <TaskControlModal ref="control" - :Arr="Arr" :activeName="activeName" - :ArrError="ArrError" - :safeProduce="safeProduce" - :taskData="taskData" - :Order="taskData.Order" @getSetProductNumber="reloadPage" @isTip="isTip" /> @@ -628,8 +634,10 @@ 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, @@ -638,6 +646,7 @@ }, data() { return { + pollingTaskCountTimer: null, activeName: 1, progress: 70, //杩涘害 passrate: 30, //鍚堟牸鐜� @@ -779,6 +788,10 @@ this.getDate2(); }, 5000); this.getTaskInfo(); + this.getTaskCountStatistics() + }, + beforeDestroy() { + clearTimeout(this.pollingTaskCountTimer) }, watch:{ // isFinsh(){ @@ -788,10 +801,17 @@ // } }, methods: { + mergeProcessParams(params){ + if (params?.length){ + return params.map(ele=> `${ele.Key}: ${ele.Value}`).join(' ') + }else{ + return '' + } + }, taskClick(){ if(this.TaskCount>0){ - this.getStartArr() - this.$refs.control.islook=true + // this.getStartArr() + this.$refs.control.show=true }else{ this.$message({ message:'鐩墠娌℃湁浠诲姟锛�', @@ -847,6 +867,8 @@ } }); }, + + getDateObj(date, fmt) { if (/(y+)/.test(fmt)) { @@ -910,7 +932,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 @@ -961,6 +983,25 @@ } }, + /** + * 杞鑾峰彇浠诲姟鏁伴噺 + */ + 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 = []; this.TasksCopy=[] @@ -973,14 +1014,14 @@ }) } this.TasksCopy = res.data.Tasks ? res.data.Tasks : []; - this.safeProduce=res.data.Prompt.safeProduce?res.data.Prompt.safeProduce:'' + // 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 - + if ((this.TasksCopy.length ==0 )||!this.TasksCopy) { if (this.activeName == 1||this.activeName == 3) { this.TasksCopy.push(this.object); @@ -1007,7 +1048,7 @@ ...this.TasksCopy[i].Procedure.procedure, }, ]); - + if (this.TasksCopy[i].Procedure.ID) { startTask({ id: this.TasksCopy[i].Procedure.ID }).then((res) => { if (res.code == 200) { @@ -1015,7 +1056,7 @@ this.TasksCopy[i].procedureList[0].push({ number: res.data.Number, }); - // this.TasksCopy[i].Arr=res.data.Params ? res.data.Params : [] + this.TasksCopy[i].Arr=res.data.Params ? res.data.Params : [] // this.isFinsh=Number(i)+1 } }); @@ -1085,7 +1126,7 @@ }); } } - + }, // 璁剧疆 setUrl() { @@ -1143,7 +1184,7 @@ background:#12234a!important; color:#fff!important; border-color: #09e5ed !important; - + .popper__arrow::after{ border-top-color:#09e5ed !important; } @@ -1192,7 +1233,7 @@ box-sizing: border-box; border-right: 1px solid #eee; } - + .small_title { margin-bottom: 30px; } @@ -1248,7 +1289,7 @@ font-size:14px; } } - + .el-step{ .el-step__icon{ background:#00cc66; @@ -1436,8 +1477,7 @@ overflow-y:auto; } .el-carousel__item{ - // height:auto; - min-height:160px; + height:auto; } } .bottom-box-btn{ @@ -1445,6 +1485,10 @@ position:absolute; bottom:10px; left:10px; + .el-button{ + height: 40px; + + } } } @@ -1452,7 +1496,6 @@ font-size: 20px; } .right-small-btn { - margin-top: 10px; width: calc(100% - 20px); margin: 0 auto; position: absolute; @@ -1750,7 +1793,7 @@ border-radius: 5px 5px 0 0; background: rgb(19, 35, 90); } - + .card_contentRight { width: 100%; @@ -1821,7 +1864,7 @@ display:inline-block; } } - + .yuandian { width: 25px; height: 25px; @@ -1904,7 +1947,7 @@ .right-base-btn { width: 100%; position: absolute; - bottom: 0; + bottom: 24px; left: 0; .el-button--primary { width: 100%; @@ -1914,6 +1957,10 @@ color: #fff; font-weight: 700; font-size: 18px; + height: 40px; + display: flex; + align-items: center; + justify-content: center; } } // .call { @@ -1939,4 +1986,23 @@ font-weight: 700 !important; font-size: 16px; } +.process-params{ + margin-top: 10px; + border-radius: 5px; + overflow: hidden; + color: #fff; + font-size: 12px; + &-title{ + height: 25px; + padding: 0 5px; + background-color: #13235a; + line-height: 25px; + } + &-value{ + background-color: #6b83ff; + min-height: 45px; + box-sizing: border-box; + padding: 12px; + } +} </style> -- Gitblit v1.8.0