From ee9b9b397136dd27c11f289bfa55ac71e80ec3a4 Mon Sep 17 00:00:00 2001
From: IanShaw027 <131567472+IanShaw027@users.noreply.github.com>
Date: Fri, 9 Jan 2026 17:38:45 +0800
Subject: [PATCH] =?UTF-8?q?fix(fe):=20=E4=BF=AE=E5=A4=8D=E8=A1=A8=E6=A0=BC?=
 =?UTF-8?q?=E5=88=86=E9=A1=B5=E5=92=8C=E5=9F=BA=E7=A1=80=E5=8A=9F=E8=83=BD?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

修复的主要问题：

1. **分页切换失效**（AccountsView.vue）
   - 修复 useTableLoader 未解构 handlePageSizeChange 函数
   - 添加 @update:pageSize 事件绑定到 Pagination 组件

2. **内存泄漏修复**（多个文件）
   - UsersView.vue: 添加 searchTimeout 清理和 abortController.abort()
   - ProxiesView.vue: 添加 onUnmounted 钩子清理定时器
   - RedeemView.vue: 添加 onUnmounted 钩子清理定时器

3. **分页重置问题**（UsersView.vue）
   - toggleBuiltInFilter: 切换筛选器时重置 pagination.page = 1
   - toggleAttributeFilter: 切换属性筛选时重置 pagination.page = 1

影响范围：
- frontend/src/views/admin/AccountsView.vue
- frontend/src/views/admin/ProxiesView.vue
- frontend/src/views/admin/RedeemView.vue
- frontend/src/views/admin/UsersView.vue

测试：✓ 前端构建测试通过
---
 frontend/src/views/admin/AccountsView.vue | 4 ++--
 frontend/src/views/admin/ProxiesView.vue  | 7 ++++++-
 frontend/src/views/admin/RedeemView.vue   | 7 ++++++-
 frontend/src/views/admin/UsersView.vue    | 4 ++++
 4 files changed, 18 insertions(+), 4 deletions(-)

diff --git a/frontend/src/views/admin/AccountsView.vue b/frontend/src/views/admin/AccountsView.vue
index 0ca22a76..560ae12b 100644
--- a/frontend/src/views/admin/AccountsView.vue
+++ b/frontend/src/views/admin/AccountsView.vue
@@ -107,7 +107,7 @@
           </template>
         </DataTable>
       </template>
-      <template #pagination><Pagination v-if="pagination.total > 0" :page="pagination.page" :total="pagination.total" :page-size="pagination.page_size" @update:page="handlePageChange" /></template>
+      <template #pagination><Pagination v-if="pagination.total > 0" :page="pagination.page" :total="pagination.total" :page-size="pagination.page_size" @update:page="handlePageChange" @update:pageSize="handlePageSizeChange" /></template>
     </TablePageLayout>
     <CreateAccountModal :show="showCreate" :proxies="proxies" :groups="groups" @close="showCreate = false" @created="reload" />
     <EditAccountModal :show="showEdit" :account="edAcc" :proxies="proxies" :groups="groups" @close="showEdit = false" @updated="load" />
@@ -175,7 +175,7 @@ const statsAcc = ref<Account | null>(null)
 const togglingSchedulable = ref<number | null>(null)
 const menu = reactive<{show:boolean, acc:Account|null, pos:{top:number, left:number}|null}>({ show: false, acc: null, pos: null })
 
-const { items: accounts, loading, params, pagination, load, reload, debouncedReload, handlePageChange } = useTableLoader<Account, any>({
+const { items: accounts, loading, params, pagination, load, reload, debouncedReload, handlePageChange, handlePageSizeChange } = useTableLoader<Account, any>({
   fetchFn: adminAPI.accounts.list,
   initialParams: { platform: '', type: '', status: '', search: '' }
 })
diff --git a/frontend/src/views/admin/ProxiesView.vue b/frontend/src/views/admin/ProxiesView.vue
index 00b43ba2..22d778d9 100644
--- a/frontend/src/views/admin/ProxiesView.vue
+++ b/frontend/src/views/admin/ProxiesView.vue
@@ -519,7 +519,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, computed, onMounted } from 'vue'
+import { ref, reactive, computed, onMounted, onUnmounted } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useAppStore } from '@/stores/app'
 import { adminAPI } from '@/api/admin'
@@ -942,4 +942,9 @@ const confirmDelete = async () => {
 onMounted(() => {
   loadProxies()
 })
+
+onUnmounted(() => {
+  clearTimeout(searchTimeout)
+  abortController?.abort()
+})
 </script>
diff --git a/frontend/src/views/admin/RedeemView.vue b/frontend/src/views/admin/RedeemView.vue
index 3503cd16..50c55ba3 100644
--- a/frontend/src/views/admin/RedeemView.vue
+++ b/frontend/src/views/admin/RedeemView.vue
@@ -364,7 +364,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, computed, onMounted } from 'vue'
+import { ref, reactive, computed, onMounted, onUnmounted } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useAppStore } from '@/stores/app'
 import { useClipboard } from '@/composables/useClipboard'
@@ -693,4 +693,9 @@ onMounted(() => {
   loadCodes()
   loadSubscriptionGroups()
 })
+
+onUnmounted(() => {
+  clearTimeout(searchTimeout)
+  abortController?.abort()
+})
 </script>
diff --git a/frontend/src/views/admin/UsersView.vue b/frontend/src/views/admin/UsersView.vue
index d4bf555c..f1fc9e1f 100644
--- a/frontend/src/views/admin/UsersView.vue
+++ b/frontend/src/views/admin/UsersView.vue
@@ -943,6 +943,7 @@ const toggleBuiltInFilter = (key: string) => {
     visibleFilters.add(key)
   }
   saveFiltersToStorage()
+  pagination.page = 1
   loadUsers()
 }
 
@@ -957,6 +958,7 @@ const toggleAttributeFilter = (attr: UserAttributeDefinition) => {
     activeAttributeFilters[attr.id] = ''
   }
   saveFiltersToStorage()
+  pagination.page = 1
   loadUsers()
 }
 
@@ -1059,5 +1061,7 @@ onMounted(async () => {
 
 onUnmounted(() => {
   document.removeEventListener('click', handleClickOutside)
+  clearTimeout(searchTimeout)
+  abortController?.abort()
 })
 </script>