use placeholder data for paginated queries

This commit is contained in:
Gauthier Roebroeck 2025-08-08 16:19:55 +08:00
parent 0abc20fc1c
commit 9a296f7b21
2 changed files with 6 additions and 7 deletions

View file

@ -214,6 +214,7 @@ export const authenticationActivityQuery = defineQueryOptions(
})
// unwrap the openapi-fetch structure on success
.then((res) => res.data),
placeholderData: (previousData: any) => previousData, // eslint-disable-line @typescript-eslint/no-explicit-any
}),
)
@ -243,5 +244,6 @@ export const myAuthenticationActivityQuery = defineQueryOptions(
})
// unwrap the openapi-fetch structure on success
.then((res) => res.data),
placeholderData: (previousData: any) => previousData, // eslint-disable-line @typescript-eslint/no-explicit-any
}),
)

View file

@ -1,8 +1,9 @@
<template>
<v-data-table-server
v-model:sort-by="sortBy"
:loading="isLoading"
:items="data?.content"
:items-length="lastTotalElements"
:items-length="data?.totalElements || 0"
:headers="headers"
fixed-header
fixed-footer
@ -73,6 +74,8 @@ const intl = useIntl()
const { forMe = false } = defineProps<{ forMe?: boolean }>()
const sortBy = ref<SortItem[]>([{ key: 'dateTime', order: 'desc' }])
const headers = computed(() => {
const h = []
if (!forMe)
@ -153,12 +156,6 @@ const { data, isLoading, error } = useQuery(
() => ({ ...pageRequest.value }),
)
const lastTotalElements = ref<number>(0)
watch(data, (data) => {
// to avoid NaN showing in the table footer
if (data && data.totalElements) lastTotalElements.value = data.totalElements
})
function updateOptions({
page,
itemsPerPage,