feat: display total items text for plugins list (#4500)

#### What type of PR is this?

/area console
/kind improvement
/milestone 2.9.x

#### What this PR does / why we need it:

在 https://github.com/halo-dev/halo/pull/4473 中移除了插件管理的分页功能,但可能会造成列表底部看起来不协调,所以恢复总条数的文字显示。

#### Which issue(s) this PR fixes:

Fixes #4498 

#### Does this PR introduce a user-facing change?

```release-note
None 
```
pull/4460/head^2
Ryan Wang 2023-08-27 22:50:13 -05:00 committed by GitHub
parent 24d1d9460c
commit e7f53fad05
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 13 additions and 0 deletions

View File

@ -52,6 +52,8 @@ function handleClearFilters() {
selectedEnabledValue.value = undefined;
}
const total = ref(0);
const { data, isLoading, isFetching, refetch } = useQuery<Plugin[]>({
queryKey: ["plugins", keyword, selectedEnabledValue, selectedSortValue],
queryFn: async () => {
@ -62,6 +64,9 @@ const { data, isLoading, isFetching, refetch } = useQuery<Plugin[]>({
enabled: selectedEnabledValue.value,
sort: [selectedSortValue.value].filter(Boolean) as string[],
});
total.value = data.total;
return data.items;
},
keepPreviousData: true,
@ -304,6 +309,14 @@ onMounted(() => {
</li>
</ul>
</Transition>
<template #footer>
<div class="flex h-8 items-center">
<span class="text-sm text-gray-500">
{{ $t("core.components.pagination.total_label", { total: total }) }}
</span>
</div>
</template>
</VCard>
</div>
</template>