后台任务状态实时刷新同步后台更改 1. startTime和endTime对象结构修改 2. runTime根据后端逻辑生成runTime

hcong

2024-12-03 e732f79fb39ca207464705308c9ee2deb3a79307

 src/components/bg-task/FYBgTaskCard.vue

@@ -46,6 +46,8 @@
import { useFetchData } from '@/composables/fetchData';
import bgtaskApi from '@/api/fysp/bgtaskApi';
import { enumBgTask, BG_TASK_TYPE, BG_TASK_STATUS } from '@/enum/bgTask';
import { SOCKET_MESSAGE_TYPE } from '@/enum/socketMessage';
import MessageManager from '@/socket/MessageManager.js';

export default {
  setup() {
@@ -77,6 +79,84 @@
    }
  },
  methods: {
    registerBgTaskMessage() {
      MessageManager.register(SOCKET_MESSAGE_TYPE.BACKGROUND_TASK.name, (data) => {
        this.refreshTaskById(data)
      })
    },
    computeRunTime(data) {
      const taskStatus = data.status
      const startTime = new Date(data.startTime).getTime()
      const endTime = new Date(data.endTime).getTime()
      const now = (new Date()).getTime();
      switch (taskStatus) {
        case BG_TASK_STATUS.WAITING.name:
          return 0;
        case BG_TASK_STATUS.RUNNING.name:
          return (now - startTime) / 1000; // 转换为秒
        case BG_TASK_STATUS.SUCCESS.name:
        case BG_TASK_STATUS.FAIL.name:
        case BG_TASK_STATUS.SHUTDOWN.name:
          return (endTime - startTime) / 1000; // 转换为秒
      }
    },
    /**
     * 刷新一个任务通过id，如果是新的任务则添加到任务列表taskList中
     * @param data 
     */
    refreshTaskById(data) {
      if (!data || data == {}) {
        return;
      }
      let isNewTask = true
      for (let index = 0; index < this.taskList.length; index++) {
        const task = this.taskList[index];
        if (task.id == data.id) {
          this.taskList[index] = data
          // 时间转换
          const hasStartTime = 'startTime' in data && data.startTime != {}
          const hasEndTime = 'endTime' in data && data.endTime != {}
          if (hasEndTime) {
            this.taskList[index].endTime = this.formatDate(data.endTime)
          }
          if (hasStartTime) {
            this.taskList[index].startTime = this.formatDate(data.startTime)
          }
          if (hasStartTime && hasEndTime) {
            this.taskList[index].runTime = this.computeRunTime(this.taskList[index])
          }
          isNewTask = false
          break
        }
      }
      if (isNewTask) {
        this.taskList.push(data)
      }
    },
    /**
     * 拷贝属性
     * @param from
     * @param to 
     */
    copyProperties(from, to) {
      for (const prop in to) {
        if (prop in from) {
          to[prop] = from[prop]
        }
      }
    },
    formatDate(date) {
      const dateObj = date.date
      const timeObj = date.time
      let year = dateObj.year;
      let month = dateObj.month < 10 ? '0' + dateObj.month : dateObj.month;
      let day = dateObj.day < 10 ? '0' + dateObj.day : dateObj.day;
      let hour = timeObj.hour < 10 ? '0' + timeObj.hour : timeObj.hour;
      let minute = timeObj.minute < 10 ? '0' + timeObj.minute : timeObj.minute;
      let second = timeObj.second < 10 ? '0' + timeObj.second : timeObj.second;

      return `${year}-${month}-${day} ${hour}:${minute}:${second}`;
    },
    addTask() {},
    newTestTask() {
      this.fetchData((page, pageSize) => {
@@ -150,6 +230,15 @@
      });
    },
    gotoResult(index) {}
  },
  created() {
    this.registerBgTaskMessage()
  },
  mounted() {
    this.fetchTask();
    // setInterval(() => {
    //   this.fetchTask();
    // }, 10000);
  }
};
</script>