feat: 优化
1. 已完成的订单控制按钮禁用点击
2. 调整时间格式化, 由显示到日改为显示到分钟
3. 切换未完成/今日任务/已完成筛选时重新选中当前第一个不为空的通道的第一条任务并展示详情
4. 通道后添加任务总数展示
| | |
| | | return getTaskList(params) |
| | | .then((res) => { |
| | | channels.value = res.data |
| | | |
| | | // 首次获取通道数据时自动选中第一个任务 |
| | | if (!activeTask?.value) { |
| | | selectFirstTask(channels.value) |
| | | } |
| | | selectFirstTask(channels.value) |
| | | }) |
| | | .catch((err) => { |
| | | console.error(err) |
| | |
| | | const firstNotEmptyChannel = Object.entries(channels).find((ele) => { |
| | | const taskList = (ele[1] as TasksResponse)?.Tasks |
| | | |
| | | return !!taskList.length |
| | | return !!taskList?.length |
| | | }) |
| | | |
| | | if (firstNotEmptyChannel) { |
| | | const channelNumber = +firstNotEmptyChannel[0] |
| | | activeTask.value = channels[channelNumber].Tasks[0] |
| | | } else { |
| | | // 如果没有任务就清空当前选中的任务 |
| | | activeTask.value = undefined |
| | | } |
| | | } |
| | | |
| | |
| | | <el-collapse-item |
| | | v-for="(channel, channelNumber) in channels" |
| | | :key="channelNumber" |
| | | :title="CHANNEL_NAME_MAP[channelNumber] + ' 通道'" |
| | | :title="CHANNEL_NAME_MAP[channelNumber] + ' 通道' + ' (' + (channel?.TaskCount ?? 0) + ')'" |
| | | :name="String(channelNumber)" |
| | | > |
| | | <TaskInfo |
| | |
| | | </div> |
| | | <div class="details"> |
| | | <div class="row"> |
| | | <div class="col">工单编号: {{ task?.Order?.workOrderId || '' }}</div> |
| | | <div class="col">订单编号: {{ task?.Order?.orderId || '' }}</div> |
| | | <div class="col">工单编号: {{ task?.Order?.workOrderId ?? '--' }}</div> |
| | | <div class="col">订单编号: {{ task?.Order?.orderId ?? '--' }}</div> |
| | | </div> |
| | | |
| | | <div class="row"> |
| | | <div class="col">产品名称: {{ task?.Order?.productName || '--' }}</div> |
| | | <div class="col">数量: {{ task?.Order?.amount || 0 }}{{ task?.Order?.unit }}</div> |
| | | <div class="col">数量: {{ task?.Order?.amount ?? '--' }}{{ task?.Order?.unit }}</div> |
| | | </div> |
| | | <div class="row"> |
| | | <div class="col">交货日期: {{ task?.Order?.deliverDate || '--' }}</div> |
| | |
| | | <div class="col">通道: {{ isNumber(task?.Channel) ? CHANNEL_NAME_MAP[task?.Channel] : '--' }}</div> |
| | | </div> |
| | | <div class="row"> |
| | | <div class="col">客户名称: {{ task?.Order?.customer || '' }}</div> |
| | | <div class="col">参数要求: {{ task?.Order?.parameter || '' }}</div> |
| | | <div class="col">客户名称: {{ task?.Order?.customer || '--' }}</div> |
| | | <div class="col">参数要求: {{ task?.Order?.parameter || '--' }}</div> |
| | | </div> |
| | | </div> |
| | | <div class="process"> |
| | |
| | | if (!timestamp) { |
| | | return '--' |
| | | } |
| | | const time = useDateFormat(timestamp * 1000, 'YYYY-MM-DD', { locales: 'zh-cn' }) |
| | | const time = useDateFormat(timestamp * 1000, 'YYYY-MM-DD HH:mm:ss', { locales: 'zh-cn' }) |
| | | return time.value |
| | | } |
| | | </script> |
| | |
| | | } |
| | | } |
| | | .details { |
| | | font-size: 18px; |
| | | font-size: 17px; |
| | | padding: 10px 20px; |
| | | color: $text-color; |
| | | .row { |
| | |
| | | } |
| | | } |
| | | .process { |
| | | font-size: 18px; |
| | | font-size: 17px; |
| | | padding: 10px 20px; |
| | | color: $text-color; |
| | | display: flex; |
| | |
| | | 开始生产 |
| | | </BigButton> |
| | | <template v-if="task?.Procedure.Status === 2 || task?.Procedure.Status === 3"> |
| | | <BigButton class="btn" bg-color="#ff9933">打印</BigButton> |
| | | <BigButton class="btn" bg-color="#00cc33" @click="openReportModal">报工</BigButton> |
| | | <BigButton class="btn" bg-color="#ff9933" :disabled="task?.Procedure.Status === 3">打印</BigButton> |
| | | <BigButton class="btn" bg-color="#00cc33" :disabled="task?.Procedure.Status === 3" @click="openReportModal"> |
| | | 报工 |
| | | </BigButton> |
| | | <el-popconfirm |
| | | width="340" |
| | | confirm-button-text="确定" |
| | |
| | | @confirm="finishTaskProduce" |
| | | > |
| | | <template #reference> |
| | | <BigButton class="btn" bg-color="#ff0000">完成</BigButton> |
| | | <BigButton class="btn" bg-color="#ff0000" :disabled="task?.Procedure.Status === 3">完成</BigButton> |
| | | </template> |
| | | </el-popconfirm> |
| | | </template> |
| | |
| | | if (!timestamp) { |
| | | return '--' |
| | | } |
| | | const time = useDateFormat(timestamp * 1000, 'YYYY-MM-DD', { locales: 'zh-cn' }) |
| | | const time = useDateFormat(timestamp * 1000, 'YYYY-MM-DD HH:mm:ss', { locales: 'zh-cn' }) |
| | | return time.value |
| | | } |
| | | // 报工 |
| | |
| | | |
| | | const planTimeText = computed(() => { |
| | | const format = (date: number) => { |
| | | return useDateFormat(date, 'YYYY-MM-DD', { locales: 'zh-cn' }) |
| | | return useDateFormat(date, 'YYYY-MM-DD HH:mm:ss', { locales: 'zh-cn' }) |
| | | } |
| | | |
| | | const startTime = task.value.Procedure?.startTime |