fix: 应用StatusSwitch到retry-scene

This commit is contained in:
dhb52 2024-04-25 23:39:42 +08:00
parent e7649b69f7
commit 5383e41ac3
2 changed files with 13 additions and 24 deletions

View File

@ -6,7 +6,7 @@ defineOptions({
}); });
interface Props { interface Props {
value: Api.Common.EnableStatusNumber; value?: Api.Common.EnableStatusNumber;
} }
const props = withDefaults(defineProps<Props>(), { const props = withDefaults(defineProps<Props>(), {

View File

@ -1,17 +1,15 @@
<script setup lang="tsx"> <script setup lang="tsx">
import { NButton, NSwitch, NTag } from 'naive-ui'; import { NButton, NTag } from 'naive-ui';
import { ref } from 'vue';
import { fetchGetRetryScenePageList, fetchUpdateSceneStatus } from '@/service/api'; import { fetchGetRetryScenePageList, fetchUpdateSceneStatus } from '@/service/api';
import { $t } from '@/locales'; import { $t } from '@/locales';
import { useAppStore } from '@/store/modules/app'; import { useAppStore } from '@/store/modules/app';
import { useTable, useTableOperate } from '@/hooks/common/table'; import { useTable, useTableOperate } from '@/hooks/common/table';
import { backOffRecord, routeKeyRecord } from '@/constants/business'; import { backOffRecord, routeKeyRecord } from '@/constants/business';
import StatusSwitch from '@/components/common/status-switch.vue';
import SceneOperateDrawer from './modules/scene-operate-drawer.vue'; import SceneOperateDrawer from './modules/scene-operate-drawer.vue';
import SceneSearch from './modules/scene-search.vue'; import SceneSearch from './modules/scene-search.vue';
const appStore = useAppStore(); const appStore = useAppStore();
/** 组状态 Switch 的 loading 状态 */
const statusSwitchLoading = ref(false);
const { columns, columnChecks, data, getData, loading, mobilePagination, searchParams, resetSearchParams } = useTable({ const { columns, columnChecks, data, getData, loading, mobilePagination, searchParams, resetSearchParams } = useTable({
apiFn: fetchGetRetryScenePageList, apiFn: fetchGetRetryScenePageList,
@ -48,15 +46,16 @@ const { columns, columnChecks, data, getData, loading, mobilePagination, searchP
align: 'left', align: 'left',
minWidth: 120, minWidth: 120,
render: row => { render: row => {
return ( const fetchFn = async (sceneStatus: Api.Common.EnableStatusNumber, callback: () => void) => {
<NSwitch const { error } = await fetchUpdateSceneStatus(row.id!, sceneStatus);
v-model:value={row.sceneStatus} if (!error) {
v-model:loading={statusSwitchLoading.value} row.sceneStatus = sceneStatus;
checkedValue={1} window.$message?.success($t('common.updateSuccess'));
uncheckedValue={0} }
onUpdateValue={() => handleUpdateValue(row)} callback();
></NSwitch> };
);
return <StatusSwitch v-model:value={row.sceneStatus} onFetch={fetchFn} />;
} }
}, },
{ {
@ -145,16 +144,6 @@ const { drawerVisible, operateType, editingData, handleAdd, handleEdit, checkedR
function edit(id: string) { function edit(id: string) {
handleEdit(id); handleEdit(id);
} }
async function handleUpdateValue(scene: Api.RetryScene.Scene) {
statusSwitchLoading.value = true;
try {
await fetchUpdateSceneStatus(scene.id as any, scene.sceneStatus);
} finally {
await getData();
statusSwitchLoading.value = false;
}
}
</script> </script>
<template> <template>