src/views/dashboard/components/DeviceStatusInfo.vue
@@ -74,6 +74,7 @@
import { storeToRefs } from 'pinia'
import type { TasksGroupByChannel } from '@/api/task'
import { isNumber } from 'lodash-es'
import { useInterval } from '@vueuse/core'
export interface DeviceStatusInfoProps {
  plc?: PLCResponse
@@ -165,8 +166,17 @@
// 工序运行时间
const taskStore = useTasksStore()
const { activeTask, channels } = storeToRefs(taskStore)
// 工序运行时间: 使用当前选中任务所在通道的正处于运行中的任务来展示
const { counter, reset } = useInterval(1000, { controls: true })
const runningTime = computed(() => {
  if (counter.value > 1000) {
    // 拿一个 counter 定时触发工序运行时间的重新计算和渲染, 防止溢出需要重置
    reset()
  }
  // 如果当前选中的是已完成的任务, 使用当前选中任务来展示
  if (activeTask?.value?.Procedure?.Status === 3) {
    return getTaskRunningTime(activeTask.value.Procedure?.realStartTime, activeTask.value.Procedure?.realEndTime)
  }
  // 如果当前选中的是运行中或者未开始的任务, 使用当前选中任务所在通道的正处于运行中的任务来展示
  const runningTask = getChannelRunningTask(channels?.value, activeTask?.value?.Channel)
  return getTaskRunningTime(runningTask?.Procedure?.realStartTime, runningTask?.Procedure?.realEndTime)
})