feat: 增强表格交互体验和数据展示
- 新增每页数量localStorage缓存,刷新后保持用户选择 - 增加表格显示高度从600px到800px,显示更多数据 - 支持点击表格行进行选择,提升操作便利性 - 格式化创建时间显示为详细时间(年/月/日 时:分) - 优化复选框和操作按钮的点击事件冲突 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
		| @@ -58,9 +58,24 @@ export function useAccounts(): UseAccountsReturn { | ||||
|   const [loading, setLoading] = useState(false); | ||||
|   const [selectedIds, setSelectedIds] = useState<number[]>([]); | ||||
|    | ||||
|   // 从 localStorage 获取缓存的分页大小,默认为 20 | ||||
|   const getInitialPageSize = () => { | ||||
|     if (typeof window !== 'undefined') { | ||||
|       const saved = localStorage.getItem('accounts-page-size'); | ||||
|       if (saved) { | ||||
|         const pageSize = parseInt(saved, 10); | ||||
|         // 验证是否为有效值 | ||||
|         if ([20, 100, 1000, 10000].includes(pageSize)) { | ||||
|           return pageSize; | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|     return 20; | ||||
|   }; | ||||
|    | ||||
|   const [pagination, setPagination] = useState({ | ||||
|     page: 1, | ||||
|     pageSize: 20, | ||||
|     pageSize: getInitialPageSize(), | ||||
|     total: 0, | ||||
|     totalPages: 0 | ||||
|   }); | ||||
| @@ -92,7 +107,6 @@ export function useAccounts(): UseAccountsReturn { | ||||
|  | ||||
|   // 获取账户列表 | ||||
|   const fetchAccounts = useCallback(async () => { | ||||
|     console.log('fetchAccounts called with pagination:', pagination); | ||||
|     setLoading(true); | ||||
|     try { | ||||
|       const body: ListAccountsBody = { | ||||
| @@ -104,10 +118,8 @@ export function useAccounts(): UseAccountsReturn { | ||||
|         sort | ||||
|       }; | ||||
|        | ||||
|       console.log('Sending request with body:', body); | ||||
|       const response = await apiClient.getAccountsList(body); | ||||
|       if (response.code === BusinessCode.Success && response.data) { | ||||
|         console.log('Response received:', response.data.list.length, 'accounts'); | ||||
|         setAccounts(response.data.list); | ||||
|         setPagination(prev => ({ | ||||
|           ...prev, | ||||
| @@ -136,12 +148,16 @@ export function useAccounts(): UseAccountsReturn { | ||||
|  | ||||
|   // 处理每页大小变化 | ||||
|   const handlePageSizeChange = (pageSize: number) => { | ||||
|     console.log('handlePageSizeChange called with:', pageSize); | ||||
|     setPagination(prev => { | ||||
|       const newPagination = { ...prev, pageSize, page: 1 }; | ||||
|       console.log('Setting new pagination:', newPagination); | ||||
|       return newPagination; | ||||
|     }); | ||||
|     // 保存到 localStorage | ||||
|     if (typeof window !== 'undefined') { | ||||
|       localStorage.setItem('accounts-page-size', pageSize.toString()); | ||||
|     } | ||||
|      | ||||
|     setPagination(prev => ({ | ||||
|       ...prev,  | ||||
|       pageSize,  | ||||
|       page: 1 | ||||
|     })); | ||||
|   }; | ||||
|  | ||||
|   // 处理排序 | ||||
|   | ||||
		Reference in New Issue
	
	Block a user