From d51f9f012e92d0e0a1db90c3677b1a0a475ec5fe Mon Sep 17 00:00:00 2001
From: wodeyangzipingpingwuqi <zhengweilins@foxmail.com>
Date: Fri, 26 Apr 2024 10:43:59 +0800
Subject: [PATCH] commit

---
 src/locales/langs/en-us.ts                    |  25 ++-
 src/locales/langs/zh-cn.ts                    |  23 +++
 src/router/elegant/imports.ts                 |   3 +-
 src/router/elegant/routes.ts                  |  29 ++-
 src/router/elegant/transform.ts               |   7 +-
 src/service/api/index.ts                      |   1 +
 src/service/api/retry-dead-letter.ts          |  28 +++
 src/typings/api.d.ts                          |  38 ++++
 src/typings/app.d.ts                          |  22 +++
 src/views/retry/dead-letter/index.vue         | 173 ++++++++++++++++++
 .../modules/dead-letter-operate-drawer.vue    | 140 ++++++++++++++
 .../modules/dead-letter-search.vue            |  77 ++++++++
 12 files changed, 551 insertions(+), 15 deletions(-)
 create mode 100644 src/service/api/retry-dead-letter.ts
 create mode 100644 src/views/retry/dead-letter/index.vue
 create mode 100644 src/views/retry/dead-letter/modules/dead-letter-operate-drawer.vue
 create mode 100644 src/views/retry/dead-letter/modules/dead-letter-search.vue

diff --git a/src/locales/langs/en-us.ts b/src/locales/langs/en-us.ts
index 564fc1a..18df177 100644
--- a/src/locales/langs/en-us.ts
+++ b/src/locales/langs/en-us.ts
@@ -18,6 +18,7 @@ const local: App.I18n.Schema = {
     confirm: 'Confirm',
     save: 'Save',
     delete: 'Delete',
+    rollback: 'RollBACK',
     deleteSuccess: 'Delete Success',
     confirmDelete: 'Are you sure you want to delete?',
     edit: 'Edit',
@@ -262,7 +263,8 @@ const local: App.I18n.Schema = {
     retry: 'Retry task',
     retry_task: 'Retry task',
     retry_scene: 'Retry scene',
-    retry_log: 'Retry log',
+    retry_log: 'Retry Log',
+    'retry_dead-letter': 'Retry Dead Letter',
     workflow: 'Workflow',
     workflow_task: 'Workflow Task',
     workflow_batch: 'Workflow Batch',
@@ -366,6 +368,7 @@ const local: App.I18n.Schema = {
       jobTaskCount: 'Job Task',
       userCount: 'User',
       retryTask: 'Retry Task',
+      retryDeadLetter: 'Retry DeadLetter',
       retryTaskTip: 'Total task volume: retry/callback task volume',
       jobTask: 'Job Task',
       jobBatch: 'Job Batch',
@@ -704,6 +707,26 @@ const local: App.I18n.Schema = {
       weCom: 'WeCom',
       lark: 'Lark'
     },
+    retryDeadLetter: {
+      title: 'RetryDeadLetter List',
+      uniqueId: 'UniqueId',
+      groupName: 'Group name',
+      sceneName: 'Scene name',
+      idempotentId: 'Idempotent ID',
+      bizNo: 'bizNo',
+      taskType: 'taskType',
+      createDt: 'createDt',
+      form: {
+        title: 'Please enter RetryDeadLetter List',
+        uniqueId: 'Please enter UniqueId',
+        groupName: 'Please enter Group name',
+        sceneName: 'Please enter Scene name',
+        idempotentId: 'Please enter Idempotent ID',
+        bizNo: 'Please enter bizNo',
+        taskType: 'Please enter taskType',
+        createDt: 'Please enter createDt'
+      }
+    },
     retryTask: {
       title: 'RetryTask List',
       uniqueId: 'UniqueId',
diff --git a/src/locales/langs/zh-cn.ts b/src/locales/langs/zh-cn.ts
index 3ac9898..b7f0bdc 100644
--- a/src/locales/langs/zh-cn.ts
+++ b/src/locales/langs/zh-cn.ts
@@ -18,6 +18,7 @@ const local: App.I18n.Schema = {
     confirm: '确认',
     save: '保存',
     delete: '删除',
+    rollback: '回滚',
     deleteSuccess: '删除成功',
     confirmDelete: '确认删除吗？',
     edit: '编辑',
@@ -262,6 +263,7 @@ const local: App.I18n.Schema = {
     notify_scene: '通知场景',
     retry: '重试任务',
     retry_task: '重试任务',
+    'retry_dead-letter': '死信任务',
     retry_scene: '重试场景',
     retry_log: '重试日志',
     workflow: '工作流',
@@ -363,6 +365,7 @@ const local: App.I18n.Schema = {
       jobTaskCount: '定时任务',
       userCount: '用户',
       retryTask: '重试任务',
+      retryDeadLetter: '死信任务',
       retryTaskTip: '总任务量: 重试/回调任务量',
       jobTask: '定时任务',
       jobBatch: '任务批次',
@@ -700,6 +703,26 @@ const local: App.I18n.Schema = {
       weCom: '企业微信',
       lark: '飞书'
     },
+    retryDeadLetter: {
+      title: '死信任务列表',
+      uniqueId: 'UniqueId',
+      groupName: '组名',
+      sceneName: '场景名称',
+      idempotentId: '幂等ID',
+      bizNo: '业务编号',
+      taskType: '任务类型',
+      createDt: '创建时间',
+      form: {
+        title: '请输入死信任务列表',
+        uniqueId: '请输入UniqueId',
+        groupName: '请输入组名',
+        sceneName: '请输入场景名称',
+        idempotentId: '请输入幂等ID',
+        bizNo: '请输入业务编号',
+        taskType: '请输入任务类型',
+        createDt: '请输入创建时间'
+      }
+    },
     retryTask: {
       title: '重试任务列表',
       uniqueId: 'UniqueId',
diff --git a/src/router/elegant/imports.ts b/src/router/elegant/imports.ts
index 9ca9816..30e47eb 100644
--- a/src/router/elegant/imports.ts
+++ b/src/router/elegant/imports.ts
@@ -30,8 +30,8 @@ export const views: Record<LastLevelRouteKey, RouteComponent | (() => Promise<Ro
   "function_toggle-auth": () => import("@/views/function/toggle-auth/index.vue"),
   group: () => import("@/views/group/index.vue"),
   home: () => import("@/views/home/index.vue"),
-  job_task: () => import("@/views/job/task/index.vue"),
   job_batch: () => import("@/views/job/batch/index.vue"),
+  job_task: () => import("@/views/job/task/index.vue"),
   manage_menu: () => import("@/views/manage/menu/index.vue"),
   manage_role: () => import("@/views/manage/role/index.vue"),
   "manage_user-detail": () => import("@/views/manage/user-detail/[id].vue"),
@@ -42,6 +42,7 @@ export const views: Record<LastLevelRouteKey, RouteComponent | (() => Promise<Ro
   notify_recipient: () => import("@/views/notify/recipient/index.vue"),
   notify_scene: () => import("@/views/notify/scene/index.vue"),
   pods: () => import("@/views/pods/index.vue"),
+  "retry_dead-letter": () => import("@/views/retry/dead-letter/index.vue"),
   retry_log: () => import("@/views/retry/log/index.vue"),
   retry_scene: () => import("@/views/retry/scene/index.vue"),
   retry_task: () => import("@/views/retry/task/index.vue"),
diff --git a/src/router/elegant/routes.ts b/src/router/elegant/routes.ts
index ee14017..d4bb7eb 100644
--- a/src/router/elegant/routes.ts
+++ b/src/router/elegant/routes.ts
@@ -202,16 +202,6 @@ export const generatedRoutes: GeneratedRoute[] = [
       icon: 'eos-icons:cronjob'
     },
     children: [
-      {
-        name: 'job_task',
-        path: '/job/task',
-        component: 'view.job_task',
-        meta: {
-          title: 'job_task',
-          i18nKey: 'route.job_task',
-          icon: 'octicon:tasklist'
-        }
-      },
       {
         name: 'job_batch',
         path: '/job/batch',
@@ -221,6 +211,16 @@ export const generatedRoutes: GeneratedRoute[] = [
           i18nKey: 'route.job_batch',
           icon: 'carbon:batch-job'
         }
+      },
+      {
+        name: 'job_task',
+        path: '/job/task',
+        component: 'view.job_task',
+        meta: {
+          title: 'job_task',
+          i18nKey: 'route.job_task',
+          icon: 'octicon:tasklist'
+        }
       }
     ]
   },
@@ -430,6 +430,15 @@ export const generatedRoutes: GeneratedRoute[] = [
       icon: 'carbon:retry-failed'
     },
     children: [
+      {
+        name: 'retry_dead-letter',
+        path: '/retry/dead-letter',
+        component: 'view.retry_dead-letter',
+        meta: {
+          title: 'retry_dead-letter',
+          i18nKey: 'route.retry_dead-letter'
+        }
+      },
       {
         name: 'retry_log',
         path: '/retry/log',
diff --git a/src/router/elegant/transform.ts b/src/router/elegant/transform.ts
index 0b1a1f9..d66cb0a 100644
--- a/src/router/elegant/transform.ts
+++ b/src/router/elegant/transform.ts
@@ -114,14 +114,14 @@ function transformElegantRouteToVueRoute(
     }
 
   }
-
+  
   // add redirect to child
   if (children?.length && !vueRoute.redirect) {
     vueRoute.redirect = {
       name: children[0].name
     };
   }
-
+  
   if (children?.length) {
     const childRoutes = children.flatMap(child => transformElegantRouteToVueRoute(child, layouts, views));
 
@@ -164,8 +164,8 @@ const routeMap: RouteMap = {
   "group": "/group",
   "home": "/home",
   "job": "/job",
-  "job_task": "/job/task",
   "job_batch": "/job/batch",
+  "job_task": "/job/task",
   "login": "/login/:module(pwd-login)?",
   "manage": "/manage",
   "manage_menu": "/manage/menu",
@@ -184,6 +184,7 @@ const routeMap: RouteMap = {
   "notify_scene": "/notify/scene",
   "pods": "/pods",
   "retry": "/retry",
+  "retry_dead-letter": "/retry/dead-letter",
   "retry_log": "/retry/log",
   "retry_scene": "/retry/scene",
   "retry_task": "/retry/task",
diff --git a/src/service/api/index.ts b/src/service/api/index.ts
index dbc4d37..e1d82d2 100644
--- a/src/service/api/index.ts
+++ b/src/service/api/index.ts
@@ -8,6 +8,7 @@ export * from './notify';
 export * from './group';
 export * from './retry-task';
 export * from './retry';
+export * from './retry-dead-letter';
 export * from './workflow';
 export * from './job';
 export * from './job-batch';
diff --git a/src/service/api/retry-dead-letter.ts b/src/service/api/retry-dead-letter.ts
new file mode 100644
index 0000000..e804f3f
--- /dev/null
+++ b/src/service/api/retry-dead-letter.ts
@@ -0,0 +1,28 @@
+import { request } from '../request';
+
+/** get retry dead letter list */
+export function fetchGetRetryDeadLetterPageList(params?: Api.RetryDeadLetter.RetryDeadLetterSearchParams) {
+  return request<Api.RetryDeadLetter.RetryDeadLetterList>({
+    url: '/retry-dead-letter/list',
+    method: 'get',
+    params
+  });
+}
+
+/** add retry scene */
+export function fetchRollbackRetryDeadLetter(data: { id: string | undefined | null }) {
+  return request<boolean>({
+    url: '/retry-dead-letter/batch/rollback',
+    method: 'post',
+    data
+  });
+}
+
+/** edit retry scene */
+export function fetchDeleteRetryDeadLetter(data: { id: string | undefined | null }) {
+  return request<boolean>({
+    url: '/retry-dead-letter/batch',
+    method: 'delete',
+    data
+  });
+}
diff --git a/src/typings/api.d.ts b/src/typings/api.d.ts
index 60838ff..fb65e18 100644
--- a/src/typings/api.d.ts
+++ b/src/typings/api.d.ts
@@ -645,6 +645,44 @@ declare namespace Api {
     type AlarmType = 1 | 2 | 3 | 4;
   }
 
+  namespace RetryDeadLetter {
+    type CommonSearchParams = Pick<Common.PaginatingCommonParams, 'page' | 'size'>;
+
+    type TaskType = 1 | 2;
+
+    /** deadLetter */
+    type DeadLetter = Common.CommonRecord<{
+      /** id */
+      id?: string;
+      /** UniqueId */
+      uniqueId?: string;
+      /** 组名称 */
+      groupName?: string;
+      /** 场景名称 * */
+      sceneName?: string;
+      /** 幂等ID */
+      idempotentId?: string;
+      /** 业务编号 * */
+      bizNo?: string;
+      /** 任务类型 * */
+      taskType?: TaskType;
+      /** 创建时间 * */
+      createDt?: string;
+    }>;
+
+    /** deadLetter search params */
+    type RetryDeadLetterSearchParams = CommonType.RecordNullable<
+      Pick<
+        Api.RetryDeadLetter.DeadLetter,
+        'id' | 'uniqueId' | 'groupName' | 'sceneName' | 'idempotentId' | 'bizNo' | 'taskType' | 'createDt'
+      > &
+        CommonSearchParams
+    >;
+
+    /** DeadLetter list */
+    type RetryDeadLetterList = Common.PaginatingQueryRecord<DeadLetter>;
+  }
+
   /**
    * namespace RetryTask
    *
diff --git a/src/typings/app.d.ts b/src/typings/app.d.ts
index 0b53302..425e332 100644
--- a/src/typings/app.d.ts
+++ b/src/typings/app.d.ts
@@ -264,6 +264,7 @@ declare namespace App {
         confirm: string;
         save: string;
         delete: string;
+        rollback: string;
         deleteSuccess: string;
         confirmDelete: string;
         edit: string;
@@ -527,6 +528,7 @@ declare namespace App {
           jobTaskCount: string;
           userCount: string;
           retryTask: string;
+          retryDeadLetter: string;
           retryTaskTip: string;
           jobTask: string;
           jobBatch: string;
@@ -865,6 +867,26 @@ declare namespace App {
           weCom: string;
           lark: string;
         };
+        retryDeadLetter: {
+          title: string;
+          uniqueId: string;
+          groupName: string;
+          sceneName: string;
+          idempotentId: string;
+          bizNo: string;
+          taskType: string;
+          createDt: string;
+          form: {
+            title: string;
+            uniqueId: string;
+            groupName: string;
+            sceneName: string;
+            idempotentId: string;
+            bizNo: string;
+            taskType: string;
+            createDt: string;
+          };
+        };
         retryTask: {
           title: string;
           uniqueId: string;
diff --git a/src/views/retry/dead-letter/index.vue b/src/views/retry/dead-letter/index.vue
new file mode 100644
index 0000000..aaf8959
--- /dev/null
+++ b/src/views/retry/dead-letter/index.vue
@@ -0,0 +1,173 @@
+<script setup lang="tsx">
+import { NButton, NPopconfirm } from 'naive-ui';
+import { fetchGetRetryDeadLetterPageList } from '@/service/api';
+import { $t } from '@/locales';
+import { useAppStore } from '@/store/modules/app';
+import { useTable, useTableOperate } from '@/hooks/common/table';
+import RetryDeadLetterOperateDrawer from './modules/dead-letter-operate-drawer.vue';
+import RetryDeadLetterSearch from './modules/dead-letter-search.vue';
+
+const appStore = useAppStore();
+
+const { columns, columnChecks, data, getData, loading, mobilePagination, searchParams, resetSearchParams } = useTable({
+  apiFn: fetchGetRetryDeadLetterPageList,
+  apiParams: {
+    page: 1,
+    size: 10
+    // if you want to use the searchParams in Form, you need to define the following properties, and the value is null
+    // the value can not be undefined, otherwise the property in Form will not be reactive
+  },
+  columns: () => [
+    {
+      type: 'selection',
+      align: 'center',
+      width: 48
+    },
+    {
+      key: 'index',
+      title: $t('common.index'),
+      align: 'center',
+      width: 64
+    },
+    {
+      key: 'uniqueId',
+      title: $t('page.retryDeadLetter.uniqueId'),
+      align: 'left',
+      minWidth: 120
+    },
+    {
+      key: 'groupName',
+      title: $t('page.retryDeadLetter.groupName'),
+      align: 'left',
+      minWidth: 120
+    },
+    {
+      key: 'sceneName',
+      title: $t('page.retryDeadLetter.sceneName'),
+      align: 'left',
+      minWidth: 120
+    },
+    {
+      key: 'idempotentId',
+      title: $t('page.retryDeadLetter.idempotentId'),
+      align: 'left',
+      minWidth: 120
+    },
+    {
+      key: 'bizNo',
+      title: $t('page.retryDeadLetter.bizNo'),
+      align: 'left',
+      minWidth: 120
+    },
+    {
+      key: 'taskType',
+      title: $t('page.retryDeadLetter.taskType'),
+      align: 'left',
+      minWidth: 120
+    },
+    {
+      key: 'createDt',
+      title: $t('page.retryDeadLetter.createDt'),
+      align: 'left',
+      minWidth: 120
+    },
+    {
+      key: 'operate',
+      title: $t('common.operate'),
+      align: 'center',
+      width: 130,
+      render: row => (
+        <div class="flex-center gap-8px">
+          <NButton type="primary" ghost size="small" onClick={() => rollback(row.id!)}>
+            {$t('common.rollback')}
+          </NButton>
+          <NPopconfirm onPositiveClick={() => handleDelete(row.id!)}>
+            {{
+              default: () => $t('common.confirmDelete'),
+              trigger: () => (
+                <NButton type="error" ghost size="small">
+                  {$t('common.delete')}
+                </NButton>
+              )
+            }}
+          </NPopconfirm>
+        </div>
+      )
+    }
+  ]
+});
+
+const {
+  drawerVisible,
+  operateType,
+  editingData,
+  handleAdd,
+  handleEdit,
+  checkedRowKeys,
+  onBatchDeleted,
+  onDeleted
+  // closeDrawer
+} = useTableOperate(data, getData);
+
+async function handleBatchDelete() {
+  // request
+  console.log(checkedRowKeys.value);
+
+  onBatchDeleted();
+}
+
+function handleDelete(id: string) {
+  // request
+  console.log(id);
+
+  onDeleted();
+}
+
+function rollback(id: string) {
+  handleEdit(id);
+}
+</script>
+
+<template>
+  <div class="min-h-500px flex-col-stretch gap-16px overflow-hidden lt-sm:overflow-auto">
+    <RetryDeadLetterSearch v-model:model="searchParams" @reset="resetSearchParams" @search="getData" />
+    <NCard
+      :title="$t('page.retryDeadLetter.title')"
+      :bordered="false"
+      size="small"
+      class="sm:flex-1-hidden card-wrapper"
+      header-class="view-card-header"
+    >
+      <template #header-extra>
+        <TableHeaderOperation
+          v-model:columns="columnChecks"
+          :disabled-delete="checkedRowKeys.length === 0"
+          :loading="loading"
+          @add="handleAdd"
+          @delete="handleBatchDelete"
+          @refresh="getData"
+        />
+      </template>
+      <NDataTable
+        v-model:checked-row-keys="checkedRowKeys"
+        :columns="columns"
+        :data="data"
+        :flex-height="!appStore.isMobile"
+        :scroll-x="962"
+        :loading="loading"
+        remote
+        :row-key="row => row.id"
+        :pagination="mobilePagination"
+        class="sm:h-full"
+      />
+      <RetryDeadLetterOperateDrawer
+        v-model:visible="drawerVisible"
+        :operate-type="operateType"
+        :row-data="editingData"
+        @submitted="getData"
+      />
+    </NCard>
+  </div>
+</template>
+
+<style scoped></style>
diff --git a/src/views/retry/dead-letter/modules/dead-letter-operate-drawer.vue b/src/views/retry/dead-letter/modules/dead-letter-operate-drawer.vue
new file mode 100644
index 0000000..00c5cf8
--- /dev/null
+++ b/src/views/retry/dead-letter/modules/dead-letter-operate-drawer.vue
@@ -0,0 +1,140 @@
+<script setup lang="ts">
+import { computed, reactive, watch } from 'vue';
+import { useFormRules, useNaiveForm } from '@/hooks/common/form';
+import OperateDrawer from '@/components/common/operate-drawer.vue';
+import { $t } from '@/locales';
+import { fetchDeleteRetryDeadLetter, fetchRollbackRetryDeadLetter } from '@/service/api';
+
+defineOptions({
+  name: 'RetryDeadLetterOperateDrawer'
+});
+
+interface Props {
+  /** the type of operation */
+  operateType: NaiveUI.TableOperateType;
+  /** the edit row data */
+  rowData?: Api.RetryDeadLetter.DeadLetter | null;
+}
+
+const props = defineProps<Props>();
+
+interface Emits {
+  (e: 'submitted'): void;
+}
+
+const emit = defineEmits<Emits>();
+
+const visible = defineModel<boolean>('visible', {
+  default: false
+});
+
+const { formRef, validate, restoreValidation } = useNaiveForm();
+const { defaultRequiredRule } = useFormRules();
+
+const title = computed(() => {
+  const titles: Record<NaiveUI.TableOperateType, string> = {
+    add: $t('page.retryScene.addScene'),
+    edit: $t('page.retryScene.editScene')
+  };
+  return titles[props.operateType];
+});
+
+type Model = Pick<
+  Api.RetryDeadLetter.RetryDeadLetterSearchParams,
+  'id' | 'uniqueId' | 'groupName' | 'sceneName' | 'idempotentId' | 'bizNo' | 'taskType' | 'createDt'
+>;
+
+const model: Model = reactive(createDefaultModel());
+
+function createDefaultModel(): Model {
+  return {
+    id: '',
+    uniqueId: '',
+    groupName: '',
+    sceneName: '',
+    idempotentId: '',
+    bizNo: '',
+    taskType: 1,
+    createDt: ''
+  };
+}
+
+type RuleKey = Extract<
+  keyof Model,
+  'id' | 'groupName' | 'sceneName' | 'idempotentId' | 'bizNo' | 'taskType' | 'createDt'
+>;
+
+const rules = {
+  id: [defaultRequiredRule],
+  groupName: [defaultRequiredRule],
+  sceneName: [
+    defaultRequiredRule,
+    {
+      required: true,
+      pattern: /^[A-Za-z0-9_]{1,64}$/,
+      trigger: 'change',
+      message: $t('page.retryScene.form.sceneName2')
+    }
+  ],
+  idempotentId: [defaultRequiredRule],
+  bizNo: [defaultRequiredRule],
+  taskType: [defaultRequiredRule],
+  createDt: [defaultRequiredRule]
+} satisfies Record<RuleKey, App.Global.FormRule[]>;
+
+function handleUpdateModelWhenEdit() {
+  if (props.operateType === 'add') {
+    Object.assign(model, createDefaultModel());
+    return;
+  }
+
+  if (props.operateType === 'edit' && props.rowData) {
+    Object.assign(model, props.rowData);
+  }
+}
+
+function closeDrawer() {
+  visible.value = false;
+}
+
+async function handleSubmit() {
+  await validate();
+  // request
+  if (props.operateType === 'edit') {
+    const { id } = model;
+    const { error } = await fetchRollbackRetryDeadLetter({ id });
+    if (error) return;
+  }
+
+  if (props.operateType === 'add') {
+    const { id } = model;
+    const { error } = await fetchDeleteRetryDeadLetter({ id });
+    if (error) return;
+  }
+
+  window.$message?.success($t('common.updateSuccess'));
+  closeDrawer();
+  emit('submitted');
+}
+
+watch(visible, () => {
+  if (visible.value) {
+    handleUpdateModelWhenEdit();
+    restoreValidation();
+  }
+});
+</script>
+
+<template>
+  <OperateDrawer v-model="visible" :title="title" @handle-submit="handleSubmit">
+    <NForm ref="formRef" :model="model" :rules="rules"></NForm>
+    <template #footer>
+      <NSpace :size="16">
+        <NButton @click="closeDrawer">{{ $t('common.cancel') }}</NButton>
+        <NButton type="primary" @click="handleSubmit">{{ $t('common.save') }}</NButton>
+      </NSpace>
+    </template>
+  </OperateDrawer>
+</template>
+
+<style scoped></style>
diff --git a/src/views/retry/dead-letter/modules/dead-letter-search.vue b/src/views/retry/dead-letter/modules/dead-letter-search.vue
new file mode 100644
index 0000000..70af4e3
--- /dev/null
+++ b/src/views/retry/dead-letter/modules/dead-letter-search.vue
@@ -0,0 +1,77 @@
+<script setup lang="ts">
+import { onMounted, ref } from 'vue';
+import { $t } from '@/locales';
+import { translateOptions2 } from '@/utils/common';
+import { fetchGetAllGroupNameList, fetchGetRetrySceneList } from '@/service/api';
+
+defineOptions({
+  name: 'RetryDeadLetterSearch'
+});
+
+interface Emits {
+  (e: 'reset'): void;
+  (e: 'search'): void;
+}
+
+const emit = defineEmits<Emits>();
+
+const model = defineModel<Api.RetryDeadLetter.RetryDeadLetterSearchParams>('model', { required: true });
+
+/** 组列表 */
+const groupNameList = ref<string[]>([]);
+/** 场景列表 */
+const sceneNameList = ref<string[]>([]);
+
+async function getGroupNameList() {
+  const res = await fetchGetAllGroupNameList();
+  groupNameList.value = res.data as string[];
+}
+
+async function handleGroupNameUpdate(groupName: string) {
+  if (groupName) {
+    const res = await fetchGetRetrySceneList({ groupName });
+    sceneNameList.value = res.data!.map((scene: Api.RetryScene.Scene) => scene.sceneName);
+  } else {
+    model.value.sceneName = '';
+    sceneNameList.value = [];
+  }
+}
+
+function reset() {
+  emit('reset');
+}
+
+function search() {
+  emit('search');
+}
+
+onMounted(() => {
+  getGroupNameList();
+});
+</script>
+
+<template>
+  <SearchForm :model="model" @search="search" @reset="reset">
+    <NFormItemGi span="24 s:12 m:6" :label="$t('page.retryDeadLetter.groupName')" path="groupName" class="py-1 pr-24px">
+      <NSelect
+        v-model:value="model.groupName"
+        :placeholder="$t('page.retryDeadLetter.form.groupName')"
+        :options="translateOptions2(groupNameList)"
+        clearable
+        filterable
+        @update:value="handleGroupNameUpdate"
+      />
+    </NFormItemGi>
+
+    <NFormItemGi span="24 s:12 m:6" :label="$t('page.retryDeadLetter.sceneName')" path="sceneName" class="py-1 pr-24px">
+      <NSelect
+        v-model:value="model.sceneName"
+        :placeholder="$t('page.retryDeadLetter.form.sceneName')"
+        :options="translateOptions2(sceneNameList)"
+        clearable
+      />
+    </NFormItemGi>
+  </SearchForm>
+</template>
+
+<style scoped></style>