feat(sj_1.0.0): 完成重试任务的详情

2024-04-29 23:12:14 +08:00 · 2024-04-29 23:12:14 +08:00 · a728870f22
commit a728870f22
parent a4b38c85a5
8 changed files with 138 additions and 43 deletions
--- a/src/locales/langs/en-us.ts
+++ b/src/locales/langs/en-us.ts
@ -751,6 +751,7 @@ const local: App.I18n.Schema = {
    },
    retryTask: {
      title: 'RetryTask List',
+      detail: 'RetryTask Detail',
      uniqueId: 'UniqueId',
      groupName: 'Group name',
      sceneName: 'Scene name',
--- a/src/locales/langs/zh-cn.ts
+++ b/src/locales/langs/zh-cn.ts
@ -747,6 +747,7 @@ const local: App.I18n.Schema = {
    },
    retryTask: {
      title: '重试任务列表',
+      detail: '重试任务详情',
      uniqueId: 'UniqueId',
      groupName: '组名称',
      sceneName: '场景名称',
@ -823,7 +824,7 @@ const local: App.I18n.Schema = {
      }
    },
    retryLog: {
-      title: 'RetryLog 列表',
+      title: '重试日志列表',
      detail: '重试日志详情',
      UniqueId: 'UniqueId',
      groupName: '组名称',
--- a/src/typings/app.d.ts
+++ b/src/typings/app.d.ts
@ -899,6 +899,7 @@ declare namespace App {
        };
        retryTask: {
          title: string;
+          detail: string;
          uniqueId: string;
          groupName: string;
          sceneName: string;
--- a/src/views/retry/log/index.vue
+++ b/src/views/retry/log/index.vue
@ -125,9 +125,6 @@ const { columns, columnChecks, data, getData, loading, mobilePagination, searchP
      width: 130,
      render: row => (
        <div class="flex-center gap-8px">
-          <NButton type="primary" ghost size="small" onClick={() => edit(row.id)}>
-            {$t('common.detail')}
-          </NButton>
          {row.retryStatus === 1 ? (
            <NPopconfirm onPositiveClick={() => handleDelete(row.id)}>
              {{
@ -148,7 +145,7 @@ const { columns, columnChecks, data, getData, loading, mobilePagination, searchP
  ]
 });

-const { handleAdd, handleEdit, checkedRowKeys } = useTableOperate(data, getData);
+const { checkedRowKeys } = useTableOperate(data, getData);

 async function handleBatchDelete() {
  const { error } = await fetchBatchDeleteRetryLog(checkedRowKeys.value as any[]);
@ -168,10 +165,6 @@ async function loadRetryInfo(row: Api.RetryLog.RetryLog) {
  const res = await fetchRetryLogById(row.id!);
  detailData.value = (res.data as Api.RetryLog.RetryLog) || null;
 }
-
-function edit(id: any) {
-  handleEdit(id);
-}
 </script>

 <template>
@ -189,7 +182,6 @@ function edit(id: any) {
          v-model:columns="columnChecks"
          :disabled-delete="checkedRowKeys.length === 0"
          :loading="loading"
-          @add="handleAdd"
          @delete="handleBatchDelete"
          @refresh="getData"
        />
--- a/src/views/retry/log/modules/retry-log-detail-drawer.vue
+++ b/src/views/retry/log/modules/retry-log-detail-drawer.vue
@ -28,7 +28,7 @@ watch(
 </script>

 <template>
-  <OperateDrawer v-model="visible" :title="$t('page.retryScene.detail')">
+  <OperateDrawer v-model="visible" :title="$t('page.retryLog.detail')">
    <NDescriptions label-placement="top" bordered :column="6">
      <NDescriptionsItem :label="$t('page.retryLog.UniqueId')">
        {{ rowData?.uniqueId }}
@ -67,7 +67,7 @@ watch(
      <NDescriptionsItem :label="$t('page.retryTask.argsStr')">{{ rowData?.argsStr }}</NDescriptionsItem>
    </NDescriptions>
    <NDescriptions label-placement="top" bordered :column="6">
-      <NDescriptionsItem :label="$t('page.retryLog.createDt')">{{ rowData?.createDt }}</NDescriptionsItem>
+      <NDescriptionsItem :label="$t('common.createDt')">{{ rowData?.createDt }}</NDescriptionsItem>
    </NDescriptions>
  </OperateDrawer>
 </template>
--- a/src/views/retry/task/index.vue
+++ b/src/views/retry/task/index.vue
@ -1,9 +1,11 @@
 <script setup lang="tsx">
 import { NButton, NPopconfirm, NTag } from 'naive-ui';
 import { useBoolean } from '@sa/hooks';
+import { ref } from 'vue';
 import {
  fetchBatchDeleteRetryTask,
  fetchExecuteRetryTask,
+  fetchGetRetryTaskById,
  fetchGetRetryTaskList,
  fetchUpdateRetryTaskStatus
 } from '@/service/api';
@ -11,10 +13,16 @@ import { $t } from '@/locales';
 import { useAppStore } from '@/store/modules/app';
 import { useTable, useTableOperate } from '@/hooks/common/table';
 import { retryTaskStatusTypeRecord, retryTaskTypeRecord } from '@/constants/business';
+import { tagColor } from '@/utils/common';
 import CustomerTableHeaderOperation from './modules/customer-table-header-operation.vue';
 import RetryTaskOperateDrawer from './modules/retry-task-operate-drawer.vue';
 import RetryTaskBatchAddDrawer from './modules/retry-task-batch-add-drawer.vue';
 import RetryTaskSearch from './modules/retry-task-search.vue';
+import RetryTaskDetailDrawerVue from './modules/retry-task-detail-drawer.vue';
+const detailData = ref();
+const detailVisible = defineModel<boolean>('detailVisible', {
+  default: false
+});

 const appStore = useAppStore();

@ -36,17 +44,23 @@ const { columns, columnChecks, data, getData, loading, mobilePagination, searchP
      align: 'center',
      width: 48
    },
-    {
-      key: 'index',
-      title: $t('common.index'),
-      align: 'center',
-      width: 64
-    },
    {
      key: 'uniqueId',
      title: $t('page.retryTask.uniqueId'),
      align: 'left',
-      minWidth: 120
+      minWidth: 120,
+      render: row => {
+        async function showDetailDrawer() {
+          await loadRetryInfo(row);
+          detailVisible.value = true;
+        }
+
+        return (
+          <n-button text tag="a" type="primary" onClick={showDetailDrawer} class="ws-normal">
+            {row.uniqueId}
+          </n-button>
+        );
+      }
    },
    {
      key: 'groupName',
@ -93,15 +107,9 @@ const { columns, columnChecks, data, getData, loading, mobilePagination, searchP
        if (row.retryStatus === null) {
          return null;
        }
-        const tagMap: Record<Api.RetryTask.RetryStatusType, NaiveUI.ThemeColor> = {
-          0: 'info',
-          1: 'success',
-          2: 'error',
-          3: 'warning'
-        };
        const label = $t(retryTaskStatusTypeRecord[row.retryStatus!]);

-        return <NTag type={tagMap[row.retryStatus!]}>{label}</NTag>;
+        return <NTag type={tagColor(row.retryStatus!)}>{label}</NTag>;
      }
    },
    {
@ -129,23 +137,13 @@ const { columns, columnChecks, data, getData, loading, mobilePagination, searchP
      width: 260,
      render: row => (
        <div class="flex-center gap-8px">
-          <NPopconfirm onPositiveClick={() => handleDelete(row.groupName!, row.id!)}>
-            {{
-              default: () => $t('common.confirmDelete'),
-              trigger: () => (
-                <NButton type="error" ghost size="small">
-                  {$t('common.delete')}
-                </NButton>
-              )
-            }}
-          </NPopconfirm>
          {/* 非[完成,最大次数], 显示[执行]按钮 */}
          {row.retryStatus !== 1 && row.retryStatus !== 2 ? (
            <NPopconfirm onPositiveClick={() => handleExecute(row.groupName!, row.uniqueId!)}>
              {{
                default: () => $t('common.confirmExecute'),
                trigger: () => (
-                  <NButton type="error" ghost size="small">
+                  <NButton type="info" ghost size="small">
                    {$t('common.execute')}
                  </NButton>
                )
@ -160,7 +158,7 @@ const { columns, columnChecks, data, getData, loading, mobilePagination, searchP
              {{
                default: () => $t('common.confirmFinish'),
                trigger: () => (
-                  <NButton type="error" ghost size="small">
+                  <NButton type="warning" ghost size="small">
                    {$t('common.finish')}
                  </NButton>
                )
@ -175,7 +173,7 @@ const { columns, columnChecks, data, getData, loading, mobilePagination, searchP
              {{
                default: () => $t('common.confirmPause'),
                trigger: () => (
-                  <NButton type="error" ghost size="small">
+                  <NButton type="success" ghost size="small">
                    {$t('common.pause')}
                  </NButton>
                )
@ -190,7 +188,7 @@ const { columns, columnChecks, data, getData, loading, mobilePagination, searchP
              {{
                default: () => $t('common.confirmResume'),
                trigger: () => (
-                  <NButton type="error" ghost size="small">
+                  <NButton type="info" ghost size="small">
                    {$t('common.resume')}
                  </NButton>
                )
@ -199,6 +197,18 @@ const { columns, columnChecks, data, getData, loading, mobilePagination, searchP
          ) : (
            ''
          )}
+          {
+            <NPopconfirm onPositiveClick={() => handleDelete(row.groupName!, row.id!)}>
+              {{
+                default: () => $t('common.confirmDelete'),
+                trigger: () => (
+                  <NButton type="error" ghost size="small">
+                    {$t('common.delete')}
+                  </NButton>
+                )
+              }}
+            </NPopconfirm>
+          }
        </div>
      )
    }
@ -224,6 +234,11 @@ async function handleDelete(groupName: string, id: string) {
  onDeleted();
 }

+async function loadRetryInfo(row: Api.RetryTask.RetryTask) {
+  const res = await fetchGetRetryTaskById(row.id!, row.groupName!);
+  detailData.value = (res.data as Api.RetryLog.RetryLog) || null;
+}
+
 async function handleBatchDelete() {
  const ids: string[] = checkedRowKeys.value as string[];
  if (ids.length === 0) return;
@ -297,6 +312,7 @@ async function updateRetryTaskStatus(id: number, groupName: string, retryStatus:
      />
      <RetryTaskOperateDrawer v-model:visible="drawerVisible" :operate-type="operateType" @submitted="getData" />
      <RetryTaskBatchAddDrawer v-model:visible="batchAddDrawerVisible" @submitted="getData" />
+      <RetryTaskDetailDrawerVue v-model:visible="detailVisible" :row-data="detailData" />
    </NCard>
  </div>
 </template>
--- a/src/views/retry/task/modules/retry-task-detail-drawer.vue
+++ b/src/views/retry/task/modules/retry-task-detail-drawer.vue
@ -0,0 +1,84 @@
+<script setup lang="ts">
+import { watch } from 'vue';
+import { $t } from '@/locales';
+import { tagColor } from '@/utils/common';
+import { retryTaskStatusTypeRecord, retryTaskTypeRecord } from '@/constants/business';
+
+defineOptions({
+  name: 'SceneDetailDrawer'
+});
+
+interface Props {
+  /** row data */
+  rowData?: Api.RetryTask.RetryTask | null;
+}
+
+const visible = defineModel<boolean>('visible', {
+  default: false
+});
+const props = defineProps<Props>();
+
+watch(
+  () => props.rowData,
+  () => {
+    console.log(props.rowData);
+  },
+  { immediate: true }
+);
+</script>
+
+<template>
+  <OperateDrawer v-model="visible" :title="$t('page.retryTask.detail')">
+    <NDescriptions label-placement="top" bordered :column="6">
+      <NDescriptionsItem :label="$t('page.retryTask.uniqueId')">
+        {{ rowData?.uniqueId }}
+      </NDescriptionsItem>
+    </NDescriptions>
+    <NDescriptions label-placement="top" bordered :column="6">
+      <NDescriptionsItem :label="$t('page.retryTask.groupName')">{{ rowData?.groupName }}</NDescriptionsItem>
+    </NDescriptions>
+    <NDescriptions label-placement="top" bordered :column="6">
+      <NDescriptionsItem :label="$t('page.retryTask.sceneName')">{{ rowData?.sceneName }}</NDescriptionsItem>
+    </NDescriptions>
+    <NDescriptions label-placement="top" bordered :column="6">
+      <NDescriptionsItem :label="$t('page.retryTask.nextTriggerAt')">{{ rowData?.nextTriggerAt }}</NDescriptionsItem>
+    </NDescriptions>
+    <NDescriptions label-placement="top" bordered :column="6">
+      <NDescriptionsItem :label="$t('page.retryTask.retryCount')">{{ rowData?.retryCount }}</NDescriptionsItem>
+    </NDescriptions>
+    <NDescriptions label-placement="top" bordered :column="6">
+      <NDescriptionsItem :label="$t('page.retryTask.retryStatus')">
+        <NTag :type="tagColor(rowData?.retryStatus!)">
+          {{ $t(retryTaskStatusTypeRecord[rowData?.retryStatus!]) }}
+        </NTag>
+      </NDescriptionsItem>
+    </NDescriptions>
+    <NDescriptions label-placement="top" bordered :column="6">
+      <NDescriptionsItem :label="$t('page.retryTask.taskType')">
+        <NTag :type="tagColor(rowData?.taskType!)">{{ $t(retryTaskTypeRecord[rowData?.taskType!]) }}</NTag>
+      </NDescriptionsItem>
+    </NDescriptions>
+    <NDescriptions label-placement="top" bordered :column="6">
+      <NDescriptionsItem :label="$t('page.retryTask.bizNo')">{{ rowData?.bizNo }}</NDescriptionsItem>
+    </NDescriptions>
+    <NDescriptions label-placement="top" bordered :column="6">
+      <NDescriptionsItem :label="$t('page.retryTask.idempotentId')">
+        {{ rowData?.idempotentId }}
+      </NDescriptionsItem>
+    </NDescriptions>
+    <NDescriptions label-placement="top" bordered :column="6">
+      <NDescriptionsItem :label="$t('page.retryTask.executorName')">{{ rowData?.executorName }}</NDescriptionsItem>
+    </NDescriptions>
+    <NDescriptions label-placement="top" bordered :column="6">
+      <NDescriptionsItem :label="$t('page.retryTask.argsStr')">{{ rowData?.argsStr }}</NDescriptionsItem>
+    </NDescriptions>
+    <NDescriptions label-placement="top" bordered :column="6">
+      <NDescriptionsItem :label="$t('common.createDt')">{{ rowData?.createDt }}</NDescriptionsItem>
+    </NDescriptions>
+    <NDescriptions label-placement="top" bordered :column="6">
+      <NDescriptionsItem :label="$t('common.updateDt')">{{ rowData?.updateDt }}</NDescriptionsItem>
+    </NDescriptions>
+  </OperateDrawer>
+</template>
+
+<style scoped></style>
--- a/src/views/retry/task/modules/retry-task-search.vue
+++ b/src/views/retry/task/modules/retry-task-search.vue
@ -53,9 +53,6 @@ onMounted(() => {

 <template>
  <SearchForm :model="model" @search="search" @reset="reset">
-    <NFormItemGi span="24 s:12 m:6" :label="$t('page.retryTask.uniqueId')" path="uniqueId" class="pr-24px">
-      <NInput v-model:value="model.uniqueId" :placeholder="$t('page.retryTask.form.uniqueId')" />
-    </NFormItemGi>
    <NFormItemGi span="24 s:12 m:6" :label="$t('page.retryTask.groupName')" path="groupName" class="pr-24px">
      <NSelect
        v-model:value="model.groupName"
@ -74,6 +71,9 @@ onMounted(() => {
        clearable
      />
    </NFormItemGi>
+    <NFormItemGi span="24 s:12 m:6" :label="$t('page.retryTask.uniqueId')" path="uniqueId" class="pr-24px">
+      <NInput v-model:value="model.uniqueId" :placeholder="$t('page.retryTask.form.uniqueId')" />
+    </NFormItemGi>
    <NFormItemGi span="24 s:12 m:6" :label="$t('page.retryTask.idempotentId')" path="idempotentId" class="pr-24px">
      <NInput v-model:value="model.idempotentId" :placeholder="$t('page.retryTask.form.idempotentId')" />
    </NFormItemGi>