import { useMemo } from 'react';
|
import { ProTable } from '@ant-design/pro-components';
|
import { customerColumns } from './columns';
|
import { getCustomerList } from './server';
|
import type { CustomerListQuery, CustomerVO } from './types';
|
|
const CustomerList = () => {
|
const columns = useMemo(() => customerColumns, []);
|
|
return (
|
<div className="customer-list-page">
|
<ProTable<CustomerVO, CustomerListQuery>
|
rowKey="id"
|
columns={columns}
|
cardProps={{ className: 'table-card' }}
|
search={{ labelWidth: 'auto', defaultCollapsed: false }}
|
scroll={{ x: 1510 }}
|
options={false}
|
pagination={{
|
defaultPageSize: 10,
|
showSizeChanger: true,
|
hideOnSinglePage: false,
|
showTotal: (total) => `共 ${total} 条`,
|
}}
|
request={async (params) => {
|
const result = await getCustomerList({
|
page: params.current,
|
size: params.pageSize,
|
ownerId: params.ownerId,
|
});
|
|
return {
|
data: result.records ?? [],
|
total: result.total ?? 0,
|
success: true,
|
};
|
}}
|
/>
|
</div>
|
);
|
};
|
|
export default CustomerList;
|
