diff --git a/frontend/src/hooks/useTableData.ts b/frontend/src/hooks/useTableData.ts index a9f1610b..59721af9 100644 --- a/frontend/src/hooks/useTableData.ts +++ b/frontend/src/hooks/useTableData.ts @@ -32,9 +32,10 @@ export function useTableData({ ...defaultParams, ...params, pageNum: state.pagination.current, - pageSize: state.pagination.pageSize - }, - transform: true + pageSize: state.pagination.pageSize, + sortOrder: params?.sortOrder === 'ascend' ? 'asc' : + params?.sortOrder === 'descend' ? 'desc' : undefined + } }); setState(prev => ({ diff --git a/frontend/src/pages/System/User/index.tsx b/frontend/src/pages/System/User/index.tsx index 6026488b..36ea28ac 100644 --- a/frontend/src/pages/System/User/index.tsx +++ b/frontend/src/pages/System/User/index.tsx @@ -5,7 +5,7 @@ import type {UserResponse, Role} from './types'; import type {DepartmentDTO} from '../Department/types'; import {getUsers, createUser, updateUser, deleteUser, resetPassword} from './service'; import {useTableData} from '@/hooks/useTableData'; -import type {FixedType, AlignType} from 'rc-table/lib/interface'; +import type {FixedType, AlignType, SortOrder} from 'rc-table/lib/interface'; import {Response} from "@/utils/request.ts"; const UserPage: React.FC = () => { @@ -120,6 +120,7 @@ const UserPage: React.FC = () => { dataIndex: 'username', key: 'username', width: 100, + sorter: true }, { title: '昵称', @@ -153,6 +154,8 @@ const UserPage: React.FC = () => { dataIndex: 'createTime', key: 'createTime', width: 150, + sorter: true, + defaultSortOrder: 'descend' as SortOrder }, { title: '更新时间', @@ -208,6 +211,19 @@ const UserPage: React.FC = () => { }, ]; + const handleTableChange = ( + pagination: TablePaginationConfig, + filters: Record, + sorter: SorterResult | SorterResult[] + ) => { + const { field, order } = Array.isArray(sorter) ? sorter[0] : sorter; + + fetchUsers({ + sortField: field as string, + sortOrder: order + }); + }; + return (
@@ -222,25 +238,8 @@ const UserPage: React.FC = () => { dataSource={users} rowKey="id" scroll={{x: 1500}} - pagination={{ - ...pagination, - showSizeChanger: true, - showQuickJumper: true, - showTotal: (total) => `共 ${total} 条记录`, - onChange: onPageChange, - size: 'small' - }} - rowSelection={{ - type: 'checkbox', - onChange: (selectedRowKeys, selectedRows) => { - console.log('selectedRowKeys:', selectedRowKeys); - console.log('selectedRows:', selectedRows); - }, - getCheckboxProps: (record) => ({ - disabled: record.username === 'admin', - }), - fixed: true, - }} + pagination={pagination} + onChange={handleTableChange} size="middle" bordered /> diff --git a/frontend/src/pages/System/User/types.ts b/frontend/src/pages/System/User/types.ts index 06489083..fd768559 100644 --- a/frontend/src/pages/System/User/types.ts +++ b/frontend/src/pages/System/User/types.ts @@ -2,10 +2,10 @@ import type { BaseResponse } from '@/types/base/response'; import type { Page } from '@/types/base/page'; export interface UserQuery { - current?: number; + pageNum?: number; pageSize?: number; sortField?: string; - sortOrder?: string; + sortOrder?: 'ascend' | 'descend'; username?: string; nickname?: string; email?: string;