完善任务日志

src/service/api/jobLog.ts

@@ -0,0 +1,50 @@
+import { request } from '../request';
+
+
+export function doGetjobLogList(params?: any) {
+  return request<Api.SystemManage.UserList>({
+    url: '/schedule/job/log/list',
+    method: 'get',
+    params
+  });
+}
+
+export function doGetjobLogInfo(paramsId: any) {
+  return request<any>({
+    url: `/schedule/job/log/${paramsId}`,
+    method: 'get',
+  });
+}
+
+export function doDeleteJobLog(jobLogId: any) {
+  return request({ url: `/schedule/job/log/${jobLogId.join(',')}`, method: 'delete' });
+}
+
+
+/**
+ * 清空调度日志
+ * @returns object
+ */
+export function doCleanJobLog() {
+  return request({
+    url: '/schedule/job/log/clean',
+    method: 'delete',
+  });
+}
+
+/**
+ * 定时任务调度日志列表导出
+ * @returns bolb
+ */
+export function exportJobLog(
+) {
+  return request({
+    url: '/schedule/job/log/export',
+    method: 'post',
+    responseType: 'blob',
+    headers: {
+      "Authorization": "Bearer your_token_here",
+      "Accept": "application/json, text/plain, */*",
+  },
+  });
+}

src/typings/auto-imports.d.ts

@@ -10,6 +10,7 @@ declare global {
   const $notification: typeof import('ant-design-vue')['notification']
   const EffectScope: typeof import('vue')['EffectScope']
   const acceptHMRUpdate: typeof import('pinia')['acceptHMRUpdate']
+  const addJob: typeof import('../service/api/job')['addJob']
   const addPackage: typeof import('../service/api/auth')['addPackage']
   const addRateLimit: typeof import('../service/api/auth')['addRateLimit']
   const addThemeVarsToHtml: typeof import('../store/modules/theme/shared')['addThemeVarsToHtml']
@@ -24,7 +25,8 @@ declare global {
   const beforeAll: typeof import('vitest')['beforeAll']
   const beforeEach: typeof import('vitest')['beforeEach']
   const chai: typeof import('vitest')['chai']
-  const checkReport: typeof import('../service/api/auth')['checkReport']
+  const changeJobStatus: typeof import('../service/api/job')['changeJobStatus']
+  const cleanJobLog: typeof import('../service/api/jobLog')['cleanJobLog']
   const clearAuthStorage: typeof import('../store/modules/auth/shared')['clearAuthStorage']
   const cloneDeep: typeof import('lodash-es')['cloneDeep']
   const computed: typeof import('vue')['computed']
@@ -55,6 +57,7 @@ declare global {
   const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
   const defineComponent: typeof import('vue')['defineComponent']
   const defineStore: typeof import('pinia')['defineStore']
+  const delJobLog: typeof import('../service/api/job')['delJobLog']
   const deletePackage: typeof import('../service/api/auth')['deletePackage']
   const describe: typeof import('vitest')['describe']
   const doAddDept: typeof import('../service/api/dept')['doAddDept']
@@ -62,8 +65,10 @@ declare global {
   const doAddMenu: typeof import('../service/api/menu')['doAddMenu']
   const doAddPost: typeof import('../service/api/post')['doAddPost']
   const doCheckUserRepeat: typeof import('../service/api/auth')['doCheckUserRepeat']
+  const doCleanJobLog: typeof import('../service/api/jobLog')['doCleanJobLog']
   const doDeleteDept: typeof import('../service/api/dept')['doDeleteDept']
   const doDeleteDict: typeof import('../service/api/dict')['doDeleteDict']
+  const doDeleteJobLog: typeof import('../service/api/jobLog')['doDeleteJobLog']
   const doDeleteLog: typeof import('../service/api/log')['doDeleteLog']
   const doDeleteLogout: typeof import('../service/api/auth')['doDeleteLogout']
   const doDeleteMenu: typeof import('../service/api/menu')['doDeleteMenu']
@@ -74,6 +79,7 @@ declare global {
   const doEditDict: typeof import('../service/api/dict')['doEditDict']
   const doEditMenu: typeof import('../service/api/menu')['doEditMenu']
   const doEditPost: typeof import('../service/api/post')['doEditPost']
+  const doExportLog: typeof import('../service/api/log')['doExportLog']
   const doGetAdminUserPostsAndRoles: typeof import('../service/api/user')['doGetAdminUserPostsAndRoles']
   const doGetCheckCode: typeof import('../service/api/auth')['doGetCheckCode']
   const doGetDeptInfo: typeof import('../service/api/dept')['doGetDeptInfo']
@@ -85,6 +91,7 @@ declare global {
   const doGetPostList: typeof import('../service/api/post')['doGetPostList']
   const doGetRoleList: typeof import('../service/api/role')['doGetRoleList']
   const doGetRoleMenuList: typeof import('../service/api/menu')['doGetRoleMenuList']
+  const doGetType: typeof import('../service/api/dict')['doGetType']
   const doGetUserDeptTree: typeof import('../service/api/user')['doGetUserDeptTree']
   const doGetUserInfo: typeof import('../service/api/auth')['doGetUserInfo']
   const doGetUserList: typeof import('../service/api/user')['doGetUserList']
@@ -92,6 +99,8 @@ declare global {
   const doGetUserRoutes: typeof import('../service/api/route')['doGetUserRoutes']
   const doGetjobInfo: typeof import('../service/api/job')['doGetjobInfo']
   const doGetjobList: typeof import('../service/api/job')['doGetjobList']
+  const doGetjobLogInfo: typeof import('../service/api/jobLog')['doGetjobLogInfo']
+  const doGetjobLogList: typeof import('../service/api/jobLog')['doGetjobLogList']
   const doGetlogList: typeof import('../service/api/log')['doGetlogList']
   const doPostRole: typeof import('../service/api/role')['doPostRole']
   const doPostUser: typeof import('../service/api/user')['doPostUser']
@@ -102,6 +111,8 @@ declare global {
   const effectScope: typeof import('vue')['effectScope']
   const emptyInfo: typeof import('../store/modules/auth/shared')['emptyInfo']
   const expect: typeof import('vitest')['expect']
+  const exportJob: typeof import('../service/api/job')['exportJob']
+  const exportJobLog: typeof import('../service/api/jobLog')['exportJobLog']
   const extendRef: typeof import('@vueuse/core')['extendRef']
   const extractTabsByAllRoutes: typeof import('../store/modules/tab/shared')['extractTabsByAllRoutes']
   const fetchCustomBackendError: typeof import('../service/api/auth')['fetchCustomBackendError']
@@ -192,6 +203,8 @@ declare global {
   const reactiveComputed: typeof import('@vueuse/core')['reactiveComputed']
   const reactiveOmit: typeof import('@vueuse/core')['reactiveOmit']
   const reactivePick: typeof import('@vueuse/core')['reactivePick']
+  const readLoalXlsx: typeof import('../utils/execl-utils')['readLoalXlsx']
+  const readSheet: typeof import('../utils/execl-utils')['readSheet']
   const readonly: typeof import('vue')['readonly']
   const ref: typeof import('vue')['ref']
   const refAutoReset: typeof import('@vueuse/core')['refAutoReset']
@@ -204,6 +217,7 @@ declare global {
   const resolveComponent: typeof import('vue')['resolveComponent']
   const resolveRef: typeof import('@vueuse/core')['resolveRef']
   const resolveUnref: typeof import('@vueuse/core')['resolveUnref']
+  const runJob: typeof import('../service/api/job')['runJob']
   const sendCaptcha: typeof import('../service/api/auth')['sendCaptcha']
   const sessionStg: typeof import('../utils/storage')['sessionStg']
   const setActivePinia: typeof import('pinia')['setActivePinia']
@@ -245,6 +259,7 @@ declare global {
   const unref: typeof import('vue')['unref']
   const unrefElement: typeof import('@vueuse/core')['unrefElement']
   const until: typeof import('@vueuse/core')['until']
+  const updateJob: typeof import('../service/api/job')['updateJob']
   const updateLocaleOfGlobalMenus: typeof import('../store/modules/route/shared')['updateLocaleOfGlobalMenus']
   const updatePackage: typeof import('../service/api/auth')['updatePackage']
   const updateTabByI18nKey: typeof import('../store/modules/tab/shared')['updateTabByI18nKey']
@@ -440,6 +455,8 @@ declare global {
   const watchTriggerable: typeof import('@vueuse/core')['watchTriggerable']
   const watchWithFilter: typeof import('@vueuse/core')['watchWithFilter']
   const whenever: typeof import('@vueuse/core')['whenever']
+  const writeSheet: typeof import('../utils/execl-utils')['writeSheet']
+  const xlsxUrl: typeof import('../utils/execl-utils')['xlsxUrl']
 }
 // for type re-export
 declare global {

src/typings/components.d.ts

@@ -50,6 +50,8 @@ declare module 'vue' {
     ASteps: typeof import('ant-design-vue/es')['Steps']
     ASwitch: typeof import('ant-design-vue/es')['Switch']
     ATable: typeof import('ant-design-vue/es')['Table']
+    ATabPane: typeof import('ant-design-vue/es')['TabPane']
+    ATabs: typeof import('ant-design-vue/es')['Tabs']
     ATag: typeof import('ant-design-vue/es')['Tag']
     ATextarea: typeof import('ant-design-vue/es')['Textarea']
     ATooltip: typeof import('ant-design-vue/es')['Tooltip']
@@ -58,9 +60,12 @@ declare module 'vue' {
     BetterScroll: typeof import('./../components/custom/better-scroll.vue')['default']
     ButtonIcon: typeof import('./../components/custom/button-icon.vue')['default']
     CountTo: typeof import('./../components/custom/count-to.vue')['default']
+    CronModal: typeof import('./../components/CronModal/index.vue')['default']
     DarkModeContainer: typeof import('./../components/common/dark-mode-container.vue')['default']
+    Day: typeof import('./../components/CronModal/components/Day.vue')['default']
     ExceptionBase: typeof import('./../components/common/exception-base.vue')['default']
     FullScreen: typeof import('./../components/common/full-screen.vue')['default']
+    Hour: typeof import('./../components/CronModal/components/Hour.vue')['default']
     IconAntDesignReloadOutlined: typeof import('~icons/ant-design/reload-outlined')['default']
     IconAntDesignSettingOutlined: typeof import('~icons/ant-design/setting-outlined')['default']
     IconGridiconsFullscreen: typeof import('~icons/gridicons/fullscreen')['default']
@@ -76,10 +81,13 @@ declare module 'vue' {
     LangSwitch: typeof import('./../components/common/lang-switch.vue')['default']
     LookForward: typeof import('./../components/custom/look-forward.vue')['default']
     MenuToggler: typeof import('./../components/common/menu-toggler.vue')['default']
+    Minute: typeof import('./../components/CronModal/components/Minute.vue')['default']
+    Month: typeof import('./../components/CronModal/components/Month.vue')['default']
     PinToggler: typeof import('./../components/common/pin-toggler.vue')['default']
     ReloadButton: typeof import('./../components/common/reload-button.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
+    Second: typeof import('./../components/CronModal/components/Second.vue')['default']
     SoybeanAvatar: typeof import('./../components/custom/soybean-avatar.vue')['default']
     SvgIcon: typeof import('./../components/custom/svg-icon.vue')['default']
     SystemLogo: typeof import('./../components/common/system-logo.vue')['default']

src/views/manage/task/log/index.vue

@@ -0,0 +1,529 @@
+<script setup lang="tsx">
+import { message, Tag } from 'ant-design-vue';
+import type { Key } from 'ant-design-vue/es/_util/type';
+import { useTable, useTableOperate } from '@/hooks/common/table';
+import { SimpleScrollbar } from '~/packages/materials/src';
+import { useI18n } from "vue-i18n";
+import { SyncOutlined, SearchOutlined, ProfileOutlined, CloseOutlined,ExportOutlined,DeleteOutlined } from '@ant-design/icons-vue';
+import { enableStatusOptions } from '@/constants/business';
+import { saveAs } from 'file-saver';
+
+import Modal from 'ant-design-vue/es/modal/Modal';
+import { useRouter, useRoute } from 'vue-router';
+const router = useRouter();
+const route = useRoute();
+
+
+
+const { t } = useI18n();
+const wrapperEl = shallowRef<HTMLElement | null>(null);
+const { height: wrapperElHeight } = useElementSize(wrapperEl);
+
+const jobId = route.query && (route.query.jobId as string);
+
+/**对话框对象信息状态 */
+let modalState: any = reactive({
+  openByView: false,
+  openByEdit: false,
+  title: '任务',
+  from: {
+    jobId: undefined,
+    jobName: '',
+    invokeTarget: '',
+    cronExpression: '',
+    misfirePolicy: '3',
+    concurrent: '0',
+    jobGroup: 'DEFAULT',
+    status: '0',
+    saveLog: '0',
+    targetParams: '',
+    remark: '',
+    jobMessage: ''
+  },
+  confirmLoading: false,
+  openByCron: false,
+  statusOpt: [
+    { label: t('common.normal'), value: '0' },
+    { label: t('common.disable'), value: '1' }
+  ],
+  jobGroup: [
+    { label: t('common.default'), value: "DEFAULT" },
+    { label: t('common.system'), value: "SYSTEM" }
+  ],
+  sysJobSaveLog: [
+    { label: t('common.record'), value: "0" },
+    { label: t('common.noRecord'), value: "1" }
+  ]
+});
+
+
+const scrollConfig = computed(() => {
+  return {
+    y: wrapperElHeight.value - 72,
+    x: 1000
+  };
+});
+
+const { columns,  data, loading, getData, mobilePagination, searchParams, resetSearchParams } = useTable({
+  apiFn: doGetjobLogList,
+  apiParams: {
+    pageNum: 1,
+    pageSize: 10,
+    jobName: '',
+    jobGroup: '',
+    status: ''
+  },
+  rowKey: 'jobLogId',
+  columns: () => [
+    {
+      dataIndex: 'jobLogId',
+      title: t('page.manage.task.taskId'),
+      align: 'center'
+    },
+    {
+      key: 'jobName',
+      dataIndex: 'jobName',
+      title: t('page.manage.task.taskName'),
+      align: 'center'
+    },
+    {
+      key: 'jobGroup',
+      dataIndex: 'jobGroup',
+      title: t('page.manage.task.group'),
+      align: 'center',
+    },
+    {
+      key: 'invokeTarget',
+      dataIndex: 'invokeTarget',
+      title: t('page.manage.task.invoke'),
+      align: 'center'
+    },
+    {
+      key: 'status',
+      dataIndex: 'status',
+      align: 'center',
+      customRender: ({ record }: any) => {
+        if (record.status === null) {
+          return null;
+        }
+        const tagMap: any = {
+          '0': t('common.normal'),
+          '1': t('common.abnormal'),
+        };
+        const tagColor: any = {
+          '0': 'success',
+          '1': 'error'
+        };
+        return <Tag color={tagColor[record.status]}>{tagMap[record.status]}</Tag>;
+      },
+      title: t('page.manage.log.operStatus'),
+    },
+    {
+      key: 'jobMessage',
+      title: t('page.manage.task.jobMessage'),
+      dataIndex: 'jobMessage',
+      align: 'center',
+    },
+    {
+      title: t('page.manage.task.createTime'),
+      dataIndex: 'createTime',
+      align: 'center',
+      width: 150,
+      key: 'createTime',
+    },
+    {
+      key: 'jobLogId',
+      title: t('common.operate'),
+      align: 'center',
+      width: 200,
+    }
+  ]
+});
+
+const {
+  operateType,
+  checkedRowKeys,
+  onDeleted
+  // closeDrawer
+} = useTableOperate(data, { getData, idKey: 'jobLogId' });
+
+
+
+async function handleBatchDelete() {
+  Modal.confirm({
+    title: t('common.tipTitle'),
+    content: t('page.manage.task.delLogTip', { num: checkedRowKeys.value.join(',') }),
+    async onOk() {
+
+      const { error } = await doDeleteJobLog(checkedRowKeys.value);
+      if (!error) {
+        onDeleted();
+      }
+    }
+  })
+}
+
+
+function handleUserSelectChange(selectedRowKeys: Key[], selectedRows: any[]) {
+  checkedRowKeys.value = selectedRowKeys as number[];
+}
+
+function fnTest() {
+  if (jobId && jobId !== '0') {
+    searchParams.value = Object.assign(searchParams, {
+      status: undefined,
+      pageNum: 1,
+      pageSize: 10,
+    });
+  }else{
+    searchParams.value = Object.assign(searchParams, {
+      jobId: '',
+      jobName: '',
+      jobGroup: undefined,
+      status: undefined,
+      pageNum: 1,
+      pageSize: 10,
+    });
+  }
+  resetSearchParams();
+}
+
+async function fnRecordView(jobLogId: number) {
+  operateType.value = 'view';
+  if (modalState.confirmLoading) return;
+  const hide = message.loading('Waiting...', 0);
+  modalState.confirmLoading = true;
+  doGetjobLogInfo(jobLogId).then(res => {
+    modalState.confirmLoading = false;
+    hide();
+    if (!res.error) {
+      modalState.from = Object.assign(modalState.from, res.data);
+      modalState.openByView = true;
+      modalState.title = t('page.manage.task.viewJob');
+      console.log(modalState.openByView);
+    }
+  });
+}
+
+
+
+/**
+ * 对话框弹出关闭执行函数
+ * 进行表达规则校验
+ */
+function fnModalCancel() {
+  modalState.openByEdit = false;
+  modalState.openByView = false;
+}
+
+
+
+
+
+
+/**列表清空 */
+function fnCleanList() {
+  Modal.confirm({
+    title: t('common.tipTitle'),
+    content: t('page.manage.task.clearTip'),
+    onOk() {
+      const key = 'cleanJobLog';
+      message.loading({ content: t('common.loading'), key });
+      doCleanJobLog().then(res => {
+        if (!res.error) {
+          message.success({
+            content: t('page.manage.task.clearOk'),
+            key,
+            duration: 2,
+          });
+          getData();
+        }
+      });
+    },
+  });
+}
+
+
+/**列表导出 */
+function fnExportList() {
+  Modal.confirm({
+    title: t('common.tipTitle'),
+    content: t('common.exportTip'),
+    onOk() {
+      const key = 'exportJobLog';
+      message.loading({ content: t('common.loading'), key });
+      exportJobLog().then(res => {
+        console.log(res);
+        if (!res.error) {
+          message.success({
+            content: t('common.exportOk'),
+            key,
+            duration: 2,
+          });
+          saveAs(res.data, `job_log_${Date.now()}.xlsx`);
+        }
+      });
+    },
+  });
+}
+
+
+
+/**关闭跳转 */
+function fnClose(this: any) {
+  router.back(); // 返回到上一个页面
+}
+
+onMounted(() => {
+    // 指定任务id数据列表
+    if (jobId && jobId !== '0') {
+      doGetjobInfo(jobId).then(res => {
+      if (!res.error) {
+        console.log(res.data);
+        searchParams.jobId = res.data.jobId;
+        searchParams.jobName = res.data.jobName;
+        searchParams.jobGroup = res.data.jobGroup;
+       getData();
+      }
+    });
+  } else {
+    getData();
+  }
+})
+
+</script>
+
+<template>
+  <SimpleScrollbar>
+    <div class="min-h-500px flex-col-stretch gap-16px overflow-hidden lt-sm:overflow-auto">
+      <!-- 搜索框 -->
+      <ACard :title="$t('common.search')" :bordered="false" class="card-wrapper">
+        <AForm :model="searchParams" :label-width="80">
+          <ARow :gutter="[16, 16]" wrap>
+            <ACol :lg="6" :md="12" :xs="24" v-if="jobId !== '0'">
+              <AFormItem label="Name" name="jobName" class="m-0">
+                <AInput v-model:value="searchParams.jobName"    :disabled="jobId !== '0'"/>
+              </AFormItem>
+            </ACol>
+
+            <ACol :lg="6" :md="12" :xs="24">
+              <AFormItem label="Group" name="jobGroup" class="m-0">
+                <AInput v-model:value="searchParams.jobGroup" />
+              </AFormItem>
+            </ACol>
+
+
+            <ACol :lg="6" :md="12" :xs="24">
+              <AFormItem :label="$t('page.manage.user.status')" name="status" class="m-0">
+                <ASelect v-model:value="searchParams.status" :placeholder="$t('page.manage.user.form.status')"
+                  allow-clear>
+                  <ASelectOption v-for="option in enableStatusOptions" :key="option.value" :value="option.value">
+                    {{ $t(option.label) }}
+                  </ASelectOption>
+                </ASelect>
+              </AFormItem>
+            </ACol>
+
+
+            <ACol :lg="6" :md="12" :xs="24">
+              <AFormItem class="m-0">
+                <div class="w-full flex-y-center justify-end gap-8px">
+                  <a-space :size="8">
+                    <a-button @click="fnTest">
+                      <template #icon>
+                        <SyncOutlined />
+                      </template>
+                      {{ $t('common.reset') }}
+                    </a-button>
+                    <AButton type="primary" ghost @click="getData">
+                      <template #icon>
+                        <SearchOutlined />
+                      </template>
+                      {{ $t('common.search') }}
+                    </AButton>
+                  </a-space>
+
+                </div>
+              </AFormItem>
+            </ACol>
+          </ARow>
+        </AForm>
+      </ACard>
+
+      <ACard title="Task Log" :bordered="false" :body-style="{ flex: 1, overflow: 'hidden' }"
+        class="flex-col-stretch sm:flex-1-hidden card-wrapper">
+        <template #extra>
+          <div class="flex flex-wrap justify-end gap-x-12px gap-y-8px lt-sm:(w-200px py-12px)">
+            <slot name="prefix"></slot>
+            <slot name="default">
+
+              <a-button type="default" size="small" @click.prevent="fnClose()">
+                <template #icon>
+                  <CloseOutlined />
+                </template>
+                {{ t('common.close') }}
+              </a-button>
+
+              <APopconfirm :title="$t('common.confirmDelete')" :disabled="checkedRowKeys.length === 0"
+                @confirm="handleBatchDelete">
+                <AButton size="small" danger :disabled="checkedRowKeys.length <= 0">
+                  <div class="flex-y-center gap-8px">
+                    <icon-ic-round-delete class="text-icon" />
+                    <span>{{ $t('common.batchDelete') }}</span>
+                  </div>
+                </AButton>
+              </APopconfirm>
+
+              <APopconfirm :title="$t('common.confirmClean')" :disabled="checkedRowKeys.length === 0"
+                @confirm="handleBatchDelete">
+                <a-button size="small" type="dashed" danger @click.prevent="fnCleanList()">
+                  <template #icon>
+                    <DeleteOutlined />
+                  </template>
+                  {{ t('common.clearText') }}
+                </a-button>
+              </APopconfirm>
+
+              <AButton size="small" @click="getData">
+                <div class="flex-y-center gap-8px">
+                  <icon-mdi-refresh class="text-icon" />
+                  <span>{{ $t('common.refresh') }}</span>
+                </div>
+              </AButton>
+              <AButton size="small" type="primary" @click="fnExportList">
+                <template #icon>
+                  <ExportOutlined />
+                </template>
+                <span>{{ $t('common.export') }}</span>
+              </AButton>
+            </slot>
+
+            <slot name="suffix"></slot>
+          </div>
+        </template>
+
+
+        <ATable ref="wrapperEl" row-key="jobLogId" :columns="columns" :data-source="data" :loading="loading"
+          :row-selection="{
+            selectedRowKeys: checkedRowKeys,
+            onChange: handleUserSelectChange,
+          }" size="small" :pagination="mobilePagination" :scroll="scrollConfig" class="h-full">
+          <template #bodyCell="{ column, record }">
+
+            <template v-if="column.key === 'status'">
+              <a-switch v-model:checked="record.status" disabled checked-value="0" un-checked-value="1" size="small" />
+            </template>
+
+            <template v-if="column.key === 'jobLogId'">
+              <a-space :size="8" align="center">
+                <a-tooltip>
+                  <template #title>{{ t('common.view') }}</template>
+                  <a-button type="link" @click.prevent="fnRecordView(record.jobLogId)">
+                    <template #icon>
+                      <ProfileOutlined />
+                    </template>
+                  </a-button>
+                </a-tooltip>
+              </a-space>
+            </template>
+
+          </template>
+        </ATable>
+
+
+
+        <!-- <taskOperateDrawer v-model:visible="drawerVisible" :dept-tree-data="deptTreeData" :operate-type="operateType"
+          :row-data="editingData" @submitted="getData" /> -->
+
+
+        <!-- 详情框 -->
+        <a-modal :width="800" v-model:open="modalState.openByView" :title="modalState.title" @cancel="fnModalCancel">
+          <a-form layout=" horizontal" :label-col="{ span: 6 }" :label-wrap="true">
+            <a-row>
+              <a-col :lg="12" :md="12" :xs="24">
+                <a-form-item :label="$t('page.manage.task.taskId')" name="jobLogId">
+                  {{ modalState.from.jobLogId }}
+                </a-form-item>
+              </a-col>
+              <a-col :lg="12" :md="12" :xs="24">
+                <a-form-item :label="t('page.manage.task.status')" name="status">
+                  {{
+                    [{
+                      label: t('common.normal'),
+                      value: '0',
+                    }, {
+                      label: t('common.abnormal'),
+                      value: '1',
+                    }].find(s => s.value === modalState.from.status)
+                      ?.label
+                  }}
+                </a-form-item>
+              </a-col>
+            </a-row>
+
+            <a-row>
+              <a-col :lg="12" :md="12" :xs="24">
+                <a-form-item :label="$t('page.manage.task.taskName')" name="jobName">
+                  {{ modalState.from.jobName }}
+                </a-form-item>
+              </a-col>
+              <a-col :lg="12" :md="12" :xs="24">
+                <a-form-item :label="t('page.manage.task.group')" name="jobGroup">
+                  <!-- <DictTag
+                :options="dict.sysJobGroup"
+                :value="modalState.from.jobGroup"
+              /> -->
+                  {{ modalState.from.jobGroup }}
+                </a-form-item>
+              </a-col>
+            </a-row>
+
+            <a-row>
+              <a-col :lg="12" :md="12" :xs="24">
+                <a-form-item :label="t('page.manage.task.invoke')" name="invokeTarget">
+                  {{ modalState.from.invokeTarget }}
+                </a-form-item>
+              </a-col>
+              <!-- <a-col :lg="12" :md="12" :xs="24">
+                <a-form-item :label="t('page.manage.task.log')" name="saveLog">
+                  <DictTag
+                :options="dict.sysJobSaveLog"
+                :value="modalState.from.saveLog"
+              />
+                </a-form-item>
+              </a-col> -->
+              <a-col :lg="12" :md="12" :xs="24">
+                <a-form-item :label="t('page.manage.task.createTime')" name="createTime" :label-wrap="true">
+                  {{ modalState.from.createTime }}
+                </a-form-item>
+              </a-col>
+            </a-row>
+
+
+
+            <a-form-item :label="t('page.manage.task.targetParams')" name="targetParams" :label-col="{ span: 3 }"
+              :label-wrap="true">
+              <a-textarea v-model:value="modalState.from.targetParams" :auto-size="{ minRows: 2, maxRows: 6 }"
+                :disabled="true" />
+            </a-form-item>
+
+            <a-form-item :label="t('page.manage.task.jobMessage')" name="jobMessage" :label-col="{ span: 3 }"
+              :label-wrap="true">
+              <a-textarea v-model:value="modalState.from.jobMessage" :auto-size="{ minRows: 2, maxRows: 6 }"
+                :disabled="true" />
+            </a-form-item>
+          </a-form>
+          <template #footer>
+            <a-button key="cancel" @click="fnModalCancel">
+              {{ t('common.close') }}
+            </a-button>
+          </template>
+        </a-modal>
+      </ACard>
+
+
+    </div>
+  </SimpleScrollbar>
+</template>
+
+<style scoped></style>