feat: 增加加载状态管理,优化数据加载体验
This commit is contained in:
@@ -15,6 +15,7 @@ import type { TableColumnCheck } from '~/packages/hooks/src';
|
||||
const route = useRoute();
|
||||
const { t } = useI18n();
|
||||
|
||||
const loading = ref(false);
|
||||
const title = t(route.meta.i18nKey as string);
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
@@ -44,14 +45,21 @@ const pagination = ref<PaginationProps>({
|
||||
});
|
||||
|
||||
async function loadData(query?: Record<string, any>) {
|
||||
loading.value = true;
|
||||
const page = pagination.value.page || 1;
|
||||
const pageSize = pagination.value.pageSize || 10;
|
||||
const { data } = await props.fetchData({
|
||||
const { data } = await props
|
||||
.fetchData({
|
||||
pagination: {
|
||||
pageIndex: page,
|
||||
pageSize
|
||||
},
|
||||
filter: query
|
||||
})
|
||||
.finally(() => {
|
||||
setTimeout(() => {
|
||||
loading.value = false;
|
||||
}, 300);
|
||||
});
|
||||
|
||||
tableData.value = (data.value as any).data;
|
||||
@@ -109,6 +117,7 @@ defineExpose({
|
||||
|
||||
<NDataTable
|
||||
:row-key="row => (row as any).id"
|
||||
:loading="loading"
|
||||
:scroll-x="2000"
|
||||
:columns="dataTableColumns"
|
||||
:data="tableData"
|
||||
|
||||
Reference in New Issue
Block a user