feat(admin-v2): wire Accounts table search to API params
- Add searchParams state connected to useQuery queryKey/queryFn - Enable role and status columns as searchable select dropdowns - Map username search field to backend 'search' param - Add onSubmit/onReset callbacks on ProTable
This commit is contained in:
@@ -40,10 +40,11 @@ export default function Accounts() {
|
||||
const [form] = Form.useForm()
|
||||
const [modalOpen, setModalOpen] = useState(false)
|
||||
const [editingId, setEditingId] = useState<string | null>(null)
|
||||
const [searchParams, setSearchParams] = useState<Record<string, string>>({})
|
||||
|
||||
const { data, isLoading } = useQuery({
|
||||
queryKey: ['accounts'],
|
||||
queryFn: ({ signal }) => accountService.list(signal),
|
||||
queryKey: ['accounts', searchParams],
|
||||
queryFn: ({ signal }) => accountService.list(searchParams, signal),
|
||||
})
|
||||
|
||||
const updateMutation = useMutation({
|
||||
@@ -68,21 +69,31 @@ export default function Accounts() {
|
||||
})
|
||||
|
||||
const columns: ProColumns<AccountPublic>[] = [
|
||||
{ title: '用户名', dataIndex: 'username', width: 120 },
|
||||
{ title: '用户名', dataIndex: 'username', width: 120, tooltip: '搜索用户名、邮箱或显示名' },
|
||||
{ title: '显示名', dataIndex: 'display_name', width: 120, hideInSearch: true },
|
||||
{ title: '邮箱', dataIndex: 'email', width: 180 },
|
||||
{
|
||||
title: '角色',
|
||||
dataIndex: 'role',
|
||||
width: 120,
|
||||
hideInSearch: true,
|
||||
valueType: 'select',
|
||||
valueEnum: {
|
||||
super_admin: { text: '超级管理员' },
|
||||
admin: { text: '管理员' },
|
||||
user: { text: '用户' },
|
||||
},
|
||||
render: (_, record) => <Tag color={roleColors[record.role]}>{roleLabels[record.role] || record.role}</Tag>,
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'status',
|
||||
width: 100,
|
||||
hideInSearch: true,
|
||||
valueType: 'select',
|
||||
valueEnum: {
|
||||
active: { text: '正常', status: 'Success' },
|
||||
disabled: { text: '已禁用', status: 'Default' },
|
||||
suspended: { text: '已封禁', status: 'Error' },
|
||||
},
|
||||
render: (_, record) => <Tag color={statusColors[record.status]}>{statusLabels[record.status] || record.status}</Tag>,
|
||||
},
|
||||
{
|
||||
@@ -154,6 +165,21 @@ export default function Accounts() {
|
||||
rowKey="id"
|
||||
search={{}}
|
||||
toolBarRender={() => []}
|
||||
onSubmit={(values) => {
|
||||
const filtered: Record<string, string> = {}
|
||||
for (const [k, v] of Object.entries(values)) {
|
||||
if (v !== undefined && v !== null && v !== '') {
|
||||
// Map 'username' search field to backend 'search' param
|
||||
if (k === 'username') {
|
||||
filtered.search = String(v)
|
||||
} else {
|
||||
filtered[k] = String(v)
|
||||
}
|
||||
}
|
||||
}
|
||||
setSearchParams(filtered)
|
||||
}}
|
||||
onReset={() => setSearchParams({})}
|
||||
pagination={{
|
||||
total: data?.total ?? 0,
|
||||
pageSize: data?.page_size ?? 20,
|
||||
|
||||
Reference in New Issue
Block a user