import { Table, TableProps, Tag } from "antd"
import React, { useContext } from "react"
import { DispatchContext } from ".";

const NewTable: React.FC<TableProps<any>> = (props) => {

    /************************************/
    const { total, page: current, pageSize, pageChange } = useContext(DispatchContext)!;
    let ww = document.body.clientWidth < 415
    /************************************/

    return <Table
        rowKey={(a: any) => {
            return (JSON.stringify(a?.id) || JSON.stringify(a?.key))
        }}
        {...props}
        pagination={
            {
                total,//总共多少条数据,服务器给,设置后分页自动计算页数
                current,//当前页数,需state控制配合翻页
                pageSize,
                defaultCurrent: 1,//默认初始的当前页数
                defaultPageSize: 20,//默认初始的每页条数
                pageSizeOptions: ['10', '20', '30', '40', '50', '60', '70', '80', '90', '100'],
                showTotal: (total) => <Tag color="cyan">总共{total}数据</Tag>,
                showSizeChanger: true, //手动开启条数筛选器，默认超过50条开启
                onChange: pageChange, //点击页码或条数筛选时触发获取当前页数和每页条数
                simple: ww ? true : false,//开启简单分页
                hideOnSinglePage: true,//只有一页数据隐藏分页
                showLessItems: true
            }
        }
    />
}

export default React.memo(NewTable)