[Core] [UI] [Refactor] Add schedule history

.github/workflows/bofore_checker.yml

@@ -59,4 +59,4 @@ jobs:
           java-version: '11'
           distribution: 'temurin'
       - run: chmod 755 ./mvnw
-      - run: ./mvnw -T 1C clean install package -Dfindbugs.skip -Dgpg.skip -Dcheckstyle.skip -DskipTests=true -q
+      - run: ./mvnw -T 1C clean install package -Dfindbugs.skip -Dgpg.skip -Dcheckstyle.skip -DskipTests=true

core/datacap-ui/src/i18n/langs/en/common.ts

@@ -34,4 +34,7 @@ export default {
     expression: 'Expression',
     active: 'Active Status',
     type: 'Type',
+    elapsed: 'Elapsed Time',
+    state: 'State',
+    result: 'Result',
 }

core/datacap-ui/src/i18n/langs/zhCn/common.ts

@@ -33,5 +33,8 @@ export default {
     successfully: '成功',
     expression: '表达式',
     active: '激活状态',
-    type: '类型'
+    type: '类型',
+    elapsed: '执行时间',
+    state: '状态',
+    result: '结果'
 }

core/datacap-ui/src/model/pagination.ts

@@ -1,5 +1,31 @@
-export class PaginationModel {
+export class PaginationModel
+{
     pageSize: number = 10
     currentPage: number = 0
     total: number = 0
 }
+
+export interface PaginationResponseModel
+{
+    size: number
+    total: number
+    page: number
+}
+
+export class PaginationRequest
+{
+    /**
+     * Creates a PaginationModel from a PaginationResponseModel.
+     *
+     * @param {PaginationResponseModel} data - the pagination response data
+     * @return {PaginationModel} the created pagination model
+     */
+    public static of(data: PaginationResponseModel): PaginationModel
+    {
+        return {
+            pageSize: data.size,
+            total: data.total,
+            currentPage: data.page
+        }
+    }
+}

core/datacap-ui/src/services/schedule.ts

@@ -1,4 +1,7 @@
 import { BaseService } from '@/services/base'
+import { FilterModel } from '@/model/filter'
+import { ResponseModel } from '@/model/response'
+import { HttpUtils } from '@/utils/http'
 
 const DEFAULT_PATH = '/api/v1/schedule'
 
@@ -9,6 +12,18 @@ class ScheduleService
     {
         super(DEFAULT_PATH)
     }
+
+    /**
+     * Get the schedule history.
+     *
+     * @param {FilterModel} filter - the filter for the schedule history
+     * @param {number} id - the ID of the schedule
+     * @return {Promise<ResponseModel>} the response model promise
+     */
+    getScheduleHistory(filter: FilterModel, id: number): Promise<ResponseModel>
+    {
+        return new HttpUtils().post(`${DEFAULT_PATH}/${id}/history`, filter)
+    }
 }
 
 export default new ScheduleService()

core/datacap-ui/src/views/pages/system/schedule/ScheduleHistory.vue

@@ -0,0 +1,107 @@
+<template>
+  <Dialog :open="isVisible" persistent @update:open="handlerCancel">
+    <DialogContent class="min-w-[60%]">
+      <DialogHeader class="border-b">
+        <DialogTitle class="pb-3.5">{{ $t('schedule.common.history') }}</DialogTitle>
+        <DialogDescription></DialogDescription>
+      </DialogHeader>
+      <CardContent class="grid gap-4 mt-5">
+        <TableCommon :loading="loading" :columns="headers" :data="data" :pagination="pagination" @changePage="handlerChangePage"></TableCommon>
+      </CardContent>
+    </DialogContent>
+  </Dialog>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import { ScheduleModel } from '@/model/schedule'
+import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from '@/components/ui/dialog'
+import { CardContent } from '@/components/ui/card'
+import TableCommon from '@/views/components/table/TableCommon.vue'
+import { FilterModel } from '@/model/filter'
+import { PaginationModel, PaginationRequest } from '@/model/pagination'
+import { useI18n } from 'vue-i18n'
+import { createHistoryHeaders } from '@/views/pages/system/schedule/ScheduleUtils'
+import ScheduleService from '@/services/schedule'
+import { cn } from '@/lib/utils'
+
+export default defineComponent({
+  name: 'ScheduleHistory',
+  components: {
+    TableCommon,
+    CardContent,
+    DialogDescription, DialogTitle, DialogHeader, DialogContent, Dialog
+  },
+  props: {
+    isVisible: {
+      type: Boolean,
+      default: () => false
+    },
+    info: {
+      type: Object as () => ScheduleModel | null,
+      default: null
+    }
+  },
+  computed: {
+    visible: {
+      get(): boolean
+      {
+        return this.isVisible
+      },
+      set(value: boolean)
+      {
+        this.$emit('close', value)
+      }
+    }
+  },
+  setup()
+  {
+    const filter: FilterModel = new FilterModel()
+    const headers = createHistoryHeaders(useI18n())
+
+    return {
+      filter,
+      headers
+    }
+  },
+  data()
+  {
+    return {
+      loading: false,
+      data: [],
+      pagination: {} as PaginationModel
+    }
+  },
+  created()
+  {
+    this.handlerInitialize()
+  },
+  methods: {
+    cn,
+    handlerInitialize()
+    {
+      this.loading = true
+      ScheduleService.getScheduleHistory(this.filter, this.info?.id as number)
+          .then((response) => {
+            if (response.status) {
+              this.data = response.data.content
+              this.pagination = PaginationRequest.of(response.data)
+            }
+          })
+          .finally(() => {
+            this.loading = false
+          })
+    },
+    handlerChangePage(value: PaginationModel)
+    {
+      this.filter.page = value.currentPage
+      this.filter.size = value.pageSize
+      this.handlerInitialize()
+    },
+    handlerCancel()
+    {
+      this.visible = false
+    }
+  }
+})
+</script>

core/datacap-ui/src/views/pages/system/schedule/ScheduleHome.vue

@@ -29,6 +29,7 @@
         </TableCommon>
       </CardContent>
     </Card>
+    <ScheduleHistory v-if="dataHistoryVisible" :is-visible="dataHistoryVisible" :info="dataInfo" @close="handlerChangeInfo(false, null)"></ScheduleHistory>
   </div>
 </template>
 
@@ -45,10 +46,13 @@ import { useI18n } from 'vue-i18n'
 import { PaginationModel } from '@/model/pagination'
 import ScheduleService from '@/services/schedule'
 import { Switch } from '@/components/ui/switch';
+import ScheduleHistory from '@/views/pages/system/schedule/ScheduleHistory.vue'
+import { ScheduleModel } from '@/model/schedule'
 
 export default defineComponent({
   name: 'ScheduleHome',
   components: {
+    ScheduleHistory,
     ArrowBigUp, History, Pencil,
     Button, Switch,
     Card, CardHeader, CardTitle, CardContent,
@@ -69,8 +73,10 @@ export default defineComponent({
   {
     return {
       loading: false,
+      dataHistoryVisible: false,
       data: [],
-      pagination: {} as PaginationModel
+      pagination: {} as PaginationModel,
+      dataInfo: null as ScheduleModel | null
     }
   },
   created()
@@ -99,6 +105,11 @@ export default defineComponent({
       this.filter.page = value.currentPage
       this.filter.size = value.pageSize
       this.handlerInitialize()
+    },
+    handlerChangeInfo(isOpen: boolean, dataInfo: any)
+    {
+      this.dataHistoryVisible = isOpen
+      this.dataInfo = dataInfo
     }
   }
 })

core/datacap-ui/src/views/pages/system/schedule/ScheduleUtils.ts

@@ -1,3 +1,9 @@
+/**
+ * Creates headers for a table using the given internationalization object.
+ *
+ * @param {any} i18n - the internationalization object used for translating header labels
+ * @return {Array} an array of header objects
+ */
 const createHeaders = (i18n: any) => {
     return [
         {key: 'id', hidden: true, header: i18n.t('common.id'), width: 80},
@@ -13,6 +19,25 @@ const createHeaders = (i18n: any) => {
     ]
 }
 
-export {
+/**
-    createHeaders
+ * Creates history headers with internationalization support.
+ *
+ * @param {any} i18n - the internationalization object
+ * @return {Array} an array of history headers
+ */
+const createHistoryHeaders = (i18n: any) => {
+    return [
+        {key: 'id', hidden: true, header: i18n.t('common.id'), width: 80},
+        {key: 'name', hidden: true, header: i18n.t('common.name'), width: 100},
+        {key: 'createTime', hidden: true, header: i18n.t('common.createTime')},
+        {key: 'updateTime', hidden: true, header: i18n.t('common.updateTime')},
+        {key: 'elapsed', hidden: true, header: i18n.t('common.elapsed')},
+        {key: 'state', hidden: true, header: i18n.t('common.state')},
+        {key: 'result', hidden: true, header: i18n.t('common.result')}
+    ]
+}
+
+export {
+    createHeaders,
+    createHistoryHeaders
 }