105 lines
2.4 KiB
TypeScript
105 lines
2.4 KiB
TypeScript
import {
|
|
Button,
|
|
Pagination,
|
|
PaginationProps,
|
|
Popconfirm,
|
|
PopconfirmProps,
|
|
Space,
|
|
Table,
|
|
} from "antd";
|
|
import { useState } from "react";
|
|
const BTable = (props: any) => {
|
|
const {
|
|
store,
|
|
dataSource,
|
|
selectCallback,
|
|
scroll,
|
|
editCallback,
|
|
deleteCallback,
|
|
actionCloumn,
|
|
} = props;
|
|
const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([]);
|
|
const onSelectChange = (newSelectedRowKeys: React.Key[]) => {
|
|
setSelectedRowKeys(newSelectedRowKeys);
|
|
selectCallback(newSelectedRowKeys);
|
|
};
|
|
|
|
const rowSelection = {
|
|
selectedRowKeys,
|
|
onChange: onSelectChange,
|
|
};
|
|
const onShowSizeChange = (current, pageSize) => {
|
|
store.setPages({
|
|
Offset: current,
|
|
Size: pageSize,
|
|
});
|
|
};
|
|
const onChange: PaginationProps["onChange"] = (page) => {
|
|
store.setPages({
|
|
Offset: page,
|
|
Size: 20,
|
|
});
|
|
};
|
|
const cancel: PopconfirmProps["onCancel"] = (e) => {};
|
|
|
|
const actionDefultColumn = {
|
|
title: "操作",
|
|
fixed: "right",
|
|
with: 200,
|
|
render: (any, record) => (
|
|
<Space wrap>
|
|
<Button
|
|
type="dashed"
|
|
size="small"
|
|
onClick={() => {
|
|
editCallback(record);
|
|
}}
|
|
>
|
|
编辑
|
|
</Button>
|
|
{actionCloumn ? actionCloumn(record) : null}
|
|
<Popconfirm
|
|
title="删除确认"
|
|
description="您是否需要删除该数据?"
|
|
onConfirm={() => {
|
|
deleteCallback(record.identity);
|
|
}}
|
|
onCancel={cancel}
|
|
okText="Yes"
|
|
cancelText="No"
|
|
>
|
|
<Button type="dashed" danger size="small">
|
|
删除
|
|
</Button>
|
|
</Popconfirm>
|
|
</Space>
|
|
),
|
|
};
|
|
return (
|
|
<>
|
|
<Table
|
|
style={{ height: "100%", overflow: "auto" }}
|
|
pagination={false}
|
|
scroll={scroll}
|
|
loading={store.listStatus}
|
|
rowSelection={rowSelection}
|
|
columns={[...props.columns, actionDefultColumn]}
|
|
dataSource={dataSource}
|
|
/>
|
|
<div style={{ textAlign: "right", padding: "10px" }}>
|
|
<Pagination
|
|
size="small"
|
|
defaultCurrent={1}
|
|
pageSize={20}
|
|
showSizeChanger={true}
|
|
total={store.total}
|
|
onShowSizeChange={onShowSizeChange}
|
|
onChange={onChange}
|
|
/>
|
|
</div>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default BTable;
|