| | |
| | | 工时: {{ currentTaskData.Procedure.procedure.workHours || "" }} |
| | | </div> |
| | | <div class="title-item"> |
| | | 计划时间: {{ formatDate(currentTaskData.Order.startTime) || "" }} |
| | | 计划时间: {{ formatDate(currentTaskData.Procedure.startTime) || "" }} |
| | | - |
| | | {{ formatDate(currentTaskData.Order.endTime) }} |
| | | {{ formatDate(currentTaskData.Procedure.endTime) }} |
| | | </div> |
| | | |
| | | <div class="title-item"> |
| | | 客户名称:{{ currentTaskData.Order.customer || "" }} |
| | | </div> |
| | | <div class="title-item title-item-two"> |
| | | 货物描述: {{ currentTaskData.Order.orderAttr || "" }} |
| | | 通道: {{ channelNameConfig[currentTaskData.Channel] || "" }} |
| | | </div> |
| | | |
| | | <div class="title-item title-item-two"> |
| | |
| | | > |
| | | 工艺参数 |
| | | </div> |
| | | <!-- 未获取到工艺参数, 且当前设备允许在没有工艺参数的情况下生产, 则提示--> |
| | | <div v-if="processParamsLoaded && !currentProcessParams?.length && currentDeviceAllowNoParams" class="title-item title-item-two"> |
| | | 未获取到工艺参数, 请手动设置或在云端工艺模型中上传 |
| | | </div> |
| | | <div |
| | | class="title-item title-item-two" |
| | | v-for="(item, index) in currentProcessParams" |
| | |
| | | {{ item.Key }}:{{ item.Value || "" }} |
| | | |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="process-err-tip" v-if="getProcessParamsErrMsg && !currentDeviceAllowNoParams"> |
| | | <div class="tip-icon"> |
| | | <span class="el-icon-error color_error"></span> |
| | | </div> |
| | | <div class="tip-content"> |
| | | 提示: {{getProcessParamsErrMsg}} |
| | | </div> |
| | | </div> |
| | | <div class="process-box" v-if="showBtn === 2 || showBtn === 3"> |
| | |
| | | </div> |
| | | </template> |
| | | <div class="gif-right"> |
| | | ----- 剩余时间 ----- |
| | | <span>00:00:{{ 30 - Number(num) < 10 ? 0 : '' }}{{ 30 - Number(num) }}</span> |
| | | <div> |
| | | ----- 剩余时间 ----- |
| | | </div> |
| | | <div> |
| | | <span>00:00:{{ 30 - Number(num) < 10 ? 0 : '' }}{{ 30 - Number(num) }}</span> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | {{ message }} |
| | |
| | | </template> |
| | | </div> |
| | | <!--左翻页按钮--> |
| | | <div v-show="showPreviousTaskBtn" class="paginator-btn previous" @click="previousTask"><</div> |
| | | <div v-show="showPreviousTaskBtn" class="paginator-btn previous" :class="{disabled:showBtn ===2 ||messageError}" @click="previousTask"><</div> |
| | | <!--右翻页按钮--> |
| | | <div v-show="showNextTaskBtn" class="paginator-btn next" @click="nextTask">></div> |
| | | <div v-show="showNextTaskBtn" class="paginator-btn next" :class="{disabled:showBtn ===2 ||messageError}" @click="nextTask">></div> |
| | | </div> |
| | | <div slot="footer" :class="messageError?'dialog-footer tac btn-error':'dialog-footer tac'" |
| | | style="overflow: hidden"> |
| | | <template v-if="messageError"> |
| | | <template v-if="(messageError || getProcessParamsErrMsg) && !currentDeviceAllowNoParams"> |
| | | <div class="btn" v-if="messageError ==='下发成功!'||getProcessParamsErrMsg" @click="closeClick"> |
| | | <img src="../../public/close-btn.png"/> |
| | | </div> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import {getTaskInfo, sendProcessParams, startTask,} from "@/api/home"; // 产线 |
| | | import {getDeviceList, getTaskInfo, sendProcessParams, startTask,} from "@/api/home"; // 产线 |
| | | import {channelNameConfig} from "@/common/constants"; |
| | | export default { |
| | | name: 'TaskControlModal', |
| | | components: {}, |
| | |
| | | currentTaskIndex: 0, |
| | | // 当前展示的任务对应的工艺参数 |
| | | currentProcessParams: [], |
| | | processParamsLoaded:false, |
| | | getProcessParamsErrMsg: '', |
| | | // 任务列表 |
| | | taskList: [], |
| | | showBtn: 1, |
| | | num: 0, |
| | | timer: null, |
| | | safeProduce:'', |
| | | safeProduce: '', |
| | | message: this.safeProduce, |
| | | messageError: "", |
| | | resParams: {}, |
| | | isLoading: false, |
| | | second: 0, |
| | | secondTimer: null, |
| | | channelNameConfig: channelNameConfig, |
| | | currentDeviceAllowNoParams:false, |
| | | deviceInfo:null |
| | | }; |
| | | }, |
| | | mounted() { |
| | | this.getTaskList().then(() => { |
| | | const firstData = this.taskList[0] |
| | | const id = firstData?.Procedure?.ID |
| | | console.log(this.taskList) |
| | | this.getDeviceInfo() |
| | | if (id) { |
| | | this.currentTaskIndex = this.taskList.findIndex(ele => ele.Procedure.ID === id) |
| | | this.getCurrentTaskProduceParams(id) |
| | |
| | | } |
| | | }, |
| | | watch: { |
| | | taskData(val) { |
| | | this.message = this.safeProduce; |
| | | this.getInfo(); |
| | | }, |
| | | num() { |
| | | if (this.num === 30) { |
| | | clearInterval(this.timer); |
| | |
| | | if (this.timer) { |
| | | clearInterval(this.timer); |
| | | } |
| | | if (this.secondTimer) { |
| | | clearInterval(this.secondTimer) |
| | | } |
| | | this.processParamsLoaded=false |
| | | this.num = 0; |
| | | this.showBtn = 1; |
| | | this.isLoading = false |
| | |
| | | this.secondTimer = null |
| | | this.messageError = '' |
| | | this.resParams = {}; |
| | | if (newVal){ |
| | | if (newVal) { |
| | | this.getDeviceInfo() |
| | | this.getTaskList().then(() => { |
| | | const firstData = this.taskList[0] |
| | | const id = firstData?.Procedure?.ID |
| | |
| | | console.error(err) |
| | | },) |
| | | }, |
| | | getDeviceInfo(){ |
| | | getDeviceList().then(res=>{ |
| | | this.deviceInfo = res.data |
| | | this.currentDeviceAllowNoParams=this.getConfig(this.deviceInfo) |
| | | }).catch(err=>{ |
| | | console.error(err) |
| | | }) |
| | | }, |
| | | getConfig(deviceInfo){ |
| | | const currentDeviceInfo = deviceInfo.deviceList?.find((ele) => { |
| | | return ele.deviceID === deviceInfo.currentDeviceID |
| | | }) |
| | | return !currentDeviceInfo?.needSetProcessParams |
| | | }, |
| | | /** |
| | | * 获取当前展示的任务的工艺参数 |
| | | */ |
| | | getCurrentTaskProduceParams(id) { |
| | | // const id = this.currentTaskData?.Procedure?.ID |
| | | if (id) { |
| | | this.currentProcessParams = [] |
| | | this.getProcessParamsErrMsg = "" |
| | | this.processParamsLoaded =false |
| | | startTask({id}).then((res) => { |
| | | if (res.code === 200) { |
| | | this.currentProcessParams = res.data.Params ?? [] |
| | | this.getProcessParamsErrMsg ='' |
| | | } else { |
| | | this.currentProcessParams = [] |
| | | this.getProcessParamsErrMsg = res.msg ?? '获取工艺参数失败!'; |
| | | } |
| | | this.getInfo() |
| | | },err=>{ |
| | | console.error(err) |
| | | this.currentProcessParams = [] |
| | | this.getProcessParamsErrMsg = '获取工艺参数失败!' |
| | | }).finally(()=>{ |
| | | this.processParamsLoaded =true |
| | | }); |
| | | } |
| | | }, |
| | | |
| | | /** |
| | | * 前翻页 |
| | | */ |
| | | previousTask() { |
| | | // 生产准备倒计时中和下发失败禁止翻页 |
| | | if (this.showBtn === 2 || this.messageError){ |
| | | return |
| | | } |
| | | if (this.currentTaskIndex - 1 >= 0) { |
| | | this.currentTaskIndex -= 1 |
| | | this.$nextTick(() => { |
| | |
| | | * 后翻页 |
| | | */ |
| | | nextTask() { |
| | | // 生产准备倒计时中和下发失败禁止翻页 |
| | | if (this.showBtn === 2 || this.messageError){ |
| | | return |
| | | } |
| | | if (this.currentTaskIndex + 1 <= this.taskList.length - 1) { |
| | | this.currentTaskIndex += 1 |
| | | this.$nextTick(() => { |
| | |
| | | if (this.currentTaskData?.Procedure?.ID && this.currentTaskData?.Procedure?.Status === 1) { |
| | | this.num = 0; |
| | | this.showBtn = 1; |
| | | this.show = true; |
| | | // this.show = true; |
| | | } else { |
| | | this.show = false; |
| | | } |
| | | if (this.getProcessParamsErrMsg) { |
| | | this.messageError = this.getProcessParamsErrMsg; |
| | | // this.show = false; |
| | | } |
| | | }, |
| | | getDateObj(date, fmt) { |
| | |
| | | } |
| | | }, err => { |
| | | console.error(err) |
| | | }).finally(() => { |
| | | this.isLoading = false |
| | | }); |
| | | setTimeout(() => { |
| | | this.isLoading = false; |
| | | }, 30000) |
| | | } |
| | | }, |
| | | getCode(res) { |
| | |
| | | &.next { |
| | | right: -60px; |
| | | padding-left: 4px; |
| | | |
| | | } |
| | | &.disabled{ |
| | | background-color: #cccccc; |
| | | opacity: 0.8; |
| | | cursor: not-allowed; |
| | | } |
| | | } |
| | | |
| | |
| | | color: #ffffffaa; |
| | | font-size: 16px; |
| | | } |
| | | |
| | | } |
| | | .process-err-tip{ |
| | | box-sizing: border-box; |
| | | padding-top: 10px; |
| | | height: 160px; |
| | | width: 100%; |
| | | .tip-icon{ |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | height: 70px; |
| | | .el-icon-error{ |
| | | font-size: 70px; |
| | | } |
| | | } |
| | | .tip-content{ |
| | | height: 70px; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | color: #fff; |
| | | font-size: 17px; |
| | | font-weight: 500; |
| | | } |
| | | } |
| | | </style> |