feat(sj_1.0.0_beta4): 重试任务列表搜索, 默认选中第一个组

src/views/retry/task/index.vue

@@ -1,10 +1,11 @@
 <script setup lang="tsx">
 import { NButton, NPopconfirm, NTag } from 'naive-ui';
 import { useBoolean } from '@sa/hooks';
-import { ref } from 'vue';
+import { onMounted, ref } from 'vue';
 import {
   fetchBatchDeleteRetryTask,
   fetchExecuteRetryTask,
+  fetchGetAllGroupNameList,
   fetchGetRetryTaskById,
   fetchGetRetryTaskList,
   fetchUpdateRetryTaskStatus
@@ -297,6 +298,14 @@ async function updateRetryTaskStatus(id: number, groupName: string, retryStatus:
   window.$message?.success($t('common.updateSuccess'));
   getData();
 }
+
+onMounted(async () => {
+  const { error, data: groupList } = await fetchGetAllGroupNameList();
+  if (!error && groupList.length > 0) {
+    searchParams.groupName = groupList[0];
+    getData();
+  }
+});
 </script>
 
 <template>

src/views/retry/task/modules/retry-task-search.vue

@@ -1,9 +1,9 @@
 <script setup lang="ts">
-import { onMounted, ref } from 'vue';
 import { $t } from '@/locales';
-import { translateOptions, translateOptions2 } from '@/utils/common';
+import { translateOptions } from '@/utils/common';
 import { retryTaskStatusTypeOptions } from '@/constants/business';
-import { fetchGetAllGroupNameList, fetchGetRetrySceneList } from '@/service/api';
+import SelectGroup from '@/components/common/select-group.vue';
+import SelectScene from '@/components/common/select-scene.vue';
 
 defineOptions({
   name: 'RetryTaskSearch'
@@ -18,11 +18,6 @@ const emit = defineEmits<Emits>();
 
 const model = defineModel<Api.RetryTask.RetryTaskSearchParams>('model', { required: true });
 
-/** 组列表 */
-const groupNameList = ref<string[]>([]);
-/** 场景列表 */
-const sceneNameList = ref<string[]>([]);
-
 function reset() {
   emit('reset');
 }
@@ -30,46 +25,15 @@ function reset() {
 function search() {
   emit('search');
 }
-
-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 = [];
-  }
-}
-
-onMounted(() => {
-  getGroupNameList();
-});
 </script>
 
 <template>
   <SearchForm :model="model" @search="search" @reset="reset">
     <NFormItemGi span="24 s:12 m:6" :label="$t('page.retryTask.groupName')" path="groupName" class="pr-24px">
-      <NSelect
+      <SelectGroup v-model:value="model.groupName" />
-        v-model:value="model.groupName"
-        :placeholder="$t('page.retryTask.form.groupName')"
-        :options="translateOptions2(groupNameList)"
-        clearable
-        filterable
-        @update:value="handleGroupNameUpdate"
-      />
     </NFormItemGi>
     <NFormItemGi span="24 s:12 m:6" :label="$t('page.retryTask.sceneName')" path="sceneName" class="pr-24px">
-      <NSelect
+      <SelectScene v-model:value="model.sceneName" :group-name="model.groupName as string" />
-        v-model:value="model.sceneName"
-        :placeholder="$t('page.retryTask.form.sceneName')"
-        :options="translateOptions2(sceneNameList)"
-        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')" />