diff --git a/frontend/src/components/admin/usage/UsageCleanupDialog.vue b/frontend/src/components/admin/usage/UsageCleanupDialog.vue
index 91a43ecd..d5e81e72 100644
--- a/frontend/src/components/admin/usage/UsageCleanupDialog.vue
+++ b/frontend/src/components/admin/usage/UsageCleanupDialog.vue
@@ -66,6 +66,19 @@
+
+
@@ -108,6 +121,7 @@ import { useI18n } from 'vue-i18n'
import { useAppStore } from '@/stores/app'
import BaseDialog from '@/components/common/BaseDialog.vue'
import ConfirmDialog from '@/components/common/ConfirmDialog.vue'
+import Pagination from '@/components/common/Pagination.vue'
import UsageFilters from '@/components/admin/usage/UsageFilters.vue'
import { adminUsageAPI } from '@/api/admin/usage'
import type { AdminUsageQueryParams, UsageCleanupTask, CreateUsageCleanupTaskRequest } from '@/api/admin/usage'
@@ -131,6 +145,9 @@ const localEndDate = ref('')
const tasks = ref([])
const tasksLoading = ref(false)
+const tasksPage = ref(1)
+const tasksPageSize = ref(5)
+const tasksTotal = ref(0)
const submitting = ref(false)
const confirmVisible = ref(false)
const cancelConfirmVisible = ref(false)
@@ -146,6 +163,8 @@ const resetFilters = () => {
localEndDate.value = props.endDate
localFilters.value.start_date = localStartDate.value
localFilters.value.end_date = localEndDate.value
+ tasksPage.value = 1
+ tasksTotal.value = 0
}
const startPolling = () => {
@@ -219,8 +238,18 @@ const loadTasks = async () => {
if (!props.show) return
tasksLoading.value = true
try {
- const res = await adminUsageAPI.listCleanupTasks({ page: 1, page_size: 5 })
+ const res = await adminUsageAPI.listCleanupTasks({
+ page: tasksPage.value,
+ page_size: tasksPageSize.value
+ })
tasks.value = res.items || []
+ tasksTotal.value = res.total || 0
+ if (res.page) {
+ tasksPage.value = res.page
+ }
+ if (res.page_size) {
+ tasksPageSize.value = res.page_size
+ }
} catch (error) {
console.error('Failed to load cleanup tasks:', error)
appStore.showError(t('admin.usage.cleanup.loadFailed'))
@@ -229,6 +258,18 @@ const loadTasks = async () => {
}
}
+const handleTaskPageChange = (page: number) => {
+ tasksPage.value = page
+ loadTasks()
+}
+
+const handleTaskPageSizeChange = (size: number) => {
+ if (!Number.isFinite(size) || size <= 0) return
+ tasksPageSize.value = size
+ tasksPage.value = 1
+ loadTasks()
+}
+
const openConfirm = () => {
confirmVisible.value = true
}
diff --git a/frontend/src/components/common/Pagination.vue b/frontend/src/components/common/Pagination.vue
index 728bc0d3..3365a186 100644
--- a/frontend/src/components/common/Pagination.vue
+++ b/frontend/src/components/common/Pagination.vue
@@ -37,7 +37,7 @@
-
+
{{ t('pagination.perPage') }}:
@@ -49,6 +49,22 @@
/>
+
+
+ {{ t('pagination.jumpTo') }}
+
+
+
@@ -102,7 +118,7 @@