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

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',

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: '组名称',

src/typings/app.d.ts

@@ -899,6 +899,7 @@ declare namespace App {
         };
         retryTask: {
           title: string;
+          detail: string;
           uniqueId: string;
           groupName: string;
           sceneName: string;

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"
         />

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>

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>

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>

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>