refactor(sj_1.0.0_beta4): 使用SelectGroup,SelectScene组件重构
This commit is contained in:
parent
0ff686e27d
commit
979559f96a
@ -282,7 +282,7 @@ watch(visible, () => {
|
||||
/>
|
||||
</NFormItem>
|
||||
<NFormItem :label="$t('page.jobTask.groupName')" path="groupName">
|
||||
<SelectGroup v-model:value="model.groupName" />
|
||||
<SelectGroup v-model:value="model.groupName" :disabled="props.operateType === 'edit'" />
|
||||
</NFormItem>
|
||||
<NFormItem :label="$t('page.jobTask.jobStatus')" path="jobStatus">
|
||||
<NRadioGroup v-model:value="model.jobStatus" name="jobStatus">
|
||||
|
@ -1,7 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref } from 'vue';
|
||||
import { $t } from '@/locales';
|
||||
import { fetchGetAllGroupNameList } from '@/service/api';
|
||||
import SelectGroup from '@/components/common/select-group.vue';
|
||||
import SelectScene from '@/components/common/select-scene.vue';
|
||||
|
||||
@ -18,14 +16,6 @@ const emit = defineEmits<Emits>();
|
||||
|
||||
const model = defineModel<Api.RetryDeadLetter.RetryDeadLetterSearchParams>('model', { required: true });
|
||||
|
||||
/** 组列表 */
|
||||
const groupNameList = ref<string[]>([]);
|
||||
|
||||
async function getGroupNameList() {
|
||||
const res = await fetchGetAllGroupNameList();
|
||||
groupNameList.value = res.data as string[];
|
||||
}
|
||||
|
||||
function reset() {
|
||||
emit('reset');
|
||||
}
|
||||
@ -33,10 +23,6 @@ function reset() {
|
||||
function search() {
|
||||
emit('search');
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getGroupNameList();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
@ -1,12 +1,12 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, nextTick, onMounted, reactive, ref, watch } from 'vue';
|
||||
import { computed, reactive, ref, watch } from 'vue';
|
||||
import { useFormRules, useNaiveForm } from '@/hooks/common/form';
|
||||
import OperateDrawer from '@/components/common/operate-drawer.vue';
|
||||
import RouteKey from '@/components/common/route-key.vue';
|
||||
import { $t } from '@/locales';
|
||||
import { fetchAddRetryScene, fetchEditRetryScene, fetchGetAllGroupNameList } from '@/service/api';
|
||||
import { fetchAddRetryScene, fetchEditRetryScene } from '@/service/api';
|
||||
import { DelayLevel, backOffRecordOptions, enableStatusNumberOptions } from '@/constants/business';
|
||||
import { translateOptions, translateOptions2 } from '@/utils/common';
|
||||
import { translateOptions } from '@/utils/common';
|
||||
|
||||
defineOptions({
|
||||
name: 'SceneOperateDrawer'
|
||||
@ -19,7 +19,6 @@ interface Props {
|
||||
rowData?: Api.RetryScene.Scene | null;
|
||||
}
|
||||
|
||||
const groupNameList = ref<string[]>([]);
|
||||
const delayLevelDesc = ref<string>('10s');
|
||||
|
||||
const props = defineProps<Props>();
|
||||
@ -77,17 +76,6 @@ function createDefaultModel(): Model {
|
||||
};
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
nextTick(() => {
|
||||
getGroupNameList();
|
||||
});
|
||||
});
|
||||
|
||||
async function getGroupNameList() {
|
||||
const res = await fetchGetAllGroupNameList();
|
||||
groupNameList.value = res.data as string[];
|
||||
}
|
||||
|
||||
type RuleKey = Extract<
|
||||
keyof Model,
|
||||
| 'groupName'
|
||||
@ -239,13 +227,7 @@ watch(
|
||||
/>
|
||||
</NFormItem>
|
||||
<NFormItem :label="$t('page.retryScene.groupName')" path="groupName">
|
||||
<NSelect
|
||||
v-model:value="model.groupName"
|
||||
:disabled="props.operateType === 'edit'"
|
||||
:placeholder="$t('page.retryScene.form.groupName')"
|
||||
:options="translateOptions2(groupNameList)"
|
||||
clearable
|
||||
/>
|
||||
<SelectGroup v-model:value="model.groupName" :disabled="props.operateType === 'edit'" />
|
||||
</NFormItem>
|
||||
<NFormItem :label="$t('page.retryScene.sceneStatus')" path="sceneStatus">
|
||||
<NRadioGroup v-model:value="model.sceneStatus" name="sceneStatus">
|
||||
|
@ -1,11 +1,12 @@
|
||||
<script setup lang="ts">
|
||||
import { onMounted, reactive, ref, watch } from 'vue';
|
||||
import { reactive, watch } from 'vue';
|
||||
import { useFormRules, useNaiveForm } from '@/hooks/common/form';
|
||||
import OperateDrawer from '@/components/common/operate-drawer.vue';
|
||||
import { $t } from '@/locales';
|
||||
import { fetchBatchAddRetryTask, fetchGetAllGroupNameList } from '@/service/api';
|
||||
import { translateOptions, translateOptions2 } from '@/utils/common';
|
||||
import { fetchBatchAddRetryTask } from '@/service/api';
|
||||
import { translateOptions } from '@/utils/common';
|
||||
import { retryTaskStatusTypeOptions } from '@/constants/business';
|
||||
import SelectGroup from '@/components/common/select-group.vue';
|
||||
|
||||
defineOptions({
|
||||
name: 'RetryTaskBatchAddDrawer'
|
||||
@ -28,9 +29,6 @@ type Model = Pick<Api.RetryTask.RetryTaskBatchAdd, 'groupName' | 'retryStatus' |
|
||||
|
||||
const model: Model = reactive(createDefaultModel());
|
||||
|
||||
/** 组列表 */
|
||||
const groupNameList = ref<string[]>([]);
|
||||
|
||||
function createDefaultModel(): Model {
|
||||
return {
|
||||
groupName: '',
|
||||
@ -63,33 +61,19 @@ async function handleSubmit() {
|
||||
emit('submitted');
|
||||
}
|
||||
|
||||
async function getGroupNameList() {
|
||||
const res = await fetchGetAllGroupNameList();
|
||||
groupNameList.value = res.data as string[];
|
||||
}
|
||||
|
||||
watch(visible, () => {
|
||||
if (visible.value) {
|
||||
restoreValidation();
|
||||
}
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
getGroupNameList();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<OperateDrawer v-model="visible" :title="$t('page.retryTask.batchAddRetryTask')" @handle-submit="handleSubmit">
|
||||
<NForm ref="formRef" :model="model" :rules="rules">
|
||||
<NFormItem :label="$t('page.retryTask.groupName')" path="groupName">
|
||||
<NSelect
|
||||
v-model:value="model.groupName"
|
||||
:placeholder="$t('page.retryTask.form.groupName')"
|
||||
:options="translateOptions2(groupNameList)"
|
||||
/>
|
||||
<SelectGroup v-model:value="model.groupName" />
|
||||
</NFormItem>
|
||||
|
||||
<NFormItem :label="$t('page.retryTask.retryStatus')" path="retryStatus">
|
||||
<NSelect
|
||||
v-model:value="model.retryStatus"
|
||||
|
@ -1,17 +1,14 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, onMounted, reactive, ref, watch } from 'vue';
|
||||
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 {
|
||||
fetchAddRetryTask,
|
||||
fetchGetAllGroupNameList,
|
||||
fetchGetRetrySceneList,
|
||||
fetchIdempotentIdGenerate
|
||||
} from '@/service/api';
|
||||
import { translateOptions, translateOptions2 } from '@/utils/common';
|
||||
import { fetchAddRetryTask, fetchIdempotentIdGenerate } from '@/service/api';
|
||||
import { translateOptions } from '@/utils/common';
|
||||
import { retryTaskStatusTypeOptions } from '@/constants/business';
|
||||
import CodeMirror from '@/components/common/code-mirror.vue';
|
||||
import SelectGroup from '@/components/common/select-group.vue';
|
||||
import SelectScene from '@/components/common/select-scene.vue';
|
||||
|
||||
defineOptions({
|
||||
name: 'RetryTaskOperateDrawer'
|
||||
@ -54,11 +51,6 @@ type Model = Pick<
|
||||
|
||||
const model: Model = reactive(createDefaultModel());
|
||||
|
||||
/** 组列表 */
|
||||
const groupNameList = ref<string[]>([]);
|
||||
/** 场景列表 */
|
||||
const sceneNameList = ref<string[]>([]);
|
||||
|
||||
function createDefaultModel(): Model {
|
||||
return {
|
||||
groupName: '',
|
||||
@ -130,21 +122,6 @@ watch(visible, () => {
|
||||
}
|
||||
});
|
||||
|
||||
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.sceneName = '';
|
||||
sceneNameList.value = [];
|
||||
}
|
||||
}
|
||||
|
||||
async function setIdempotentId() {
|
||||
const groupName = model.groupName;
|
||||
const sceneName = model.sceneName;
|
||||
@ -160,29 +137,18 @@ async function setIdempotentId() {
|
||||
model.idempotentId = idempotentId;
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getGroupNameList();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<OperateDrawer v-model="visible" :title="title" @handle-submit="handleSubmit">
|
||||
<NForm ref="formRef" :model="model" :rules="rules">
|
||||
<NFormItem :label="$t('page.retryTask.groupName')" path="groupName">
|
||||
<NSelect
|
||||
v-model:value="model.groupName"
|
||||
:placeholder="$t('page.retryTask.form.groupName')"
|
||||
:options="translateOptions2(groupNameList)"
|
||||
:disabled="props.operateType === 'edit'"
|
||||
@update-value="handleGroupNameUpdate"
|
||||
/>
|
||||
<SelectGroup v-model:value="model.groupName" :disabled="props.operateType === 'edit'" />
|
||||
</NFormItem>
|
||||
<NFormItem :label="$t('page.retryTask.sceneName')" path="sceneName">
|
||||
<NSelect
|
||||
<SelectScene
|
||||
v-model:value="model.sceneName"
|
||||
:placeholder="$t('page.retryTask.form.sceneName')"
|
||||
:options="translateOptions2(sceneNameList)"
|
||||
:group-name="model.groupName as string"
|
||||
:disabled="props.operateType === 'edit'"
|
||||
/>
|
||||
</NFormItem>
|
||||
|
Loading…
Reference in New Issue
Block a user