import { Button, Table } from "antd";
import React, { useMemo, useRef, useState } from "react";
function LookObject2Log() {
  const pageNumRef = useRef(1);
  const pagePageRef = useRef(10);
  const [tableSelect, setTableSelect] = useState({
    pageNum: 1,
    pageSize: 10,
  });
  const paginationChange = (pageNum: number, pageSize: number) => {
    pageNumRef.current = pageNum;
    pagePageRef.current = pageSize;
    setTableSelect({ pageNum, pageSize });
  };
  const logResults = {
    list: [
      { id: 1, name: "123" },
      { id: 2, name: "123" },
      { id: 3, name: "123" },
      { id: 4, name: "123" },
      { id: 5, name: "123" },
      { id: 6, name: "123" },
      { id: 7, name: "123" },
      { id: 8, name: "123" },
      { id: 9, name: "123" },
      { id: 10, name: "123" },
      { id: 11, name: "123" },
    ],
    total: 11,
  };

  const columns = useMemo(() => {
    return [
      {
        title: "序号",
        render: (text: any, record: any, index: any) =>
          index + 1 + (pageNumRef.current - 1) * pagePageRef.current,
      },
      {
        title: "业务单号",
        dataIndex: "name",
      },
      {
        title: "业务类型",
        dataIndex: "name",
      },

      {
        title: "完成时间",
        dataIndex: "name",
      },
      {
        title: "操作",
        render: (item: any) => (
          <Button type="text" danger>
            查看
          </Button>
        ),
      },
    ];
  }, []);

  return (
    <Table
      size="small"
      scroll={{ y: 300 }}
      dataSource={logResults.list}
      columns={columns}
      rowKey="id"
      pagination={{
        showQuickJumper: true,
        position: ["bottomCenter"],
        showSizeChanger: true,
        current: tableSelect.pageNum,
        pageSize: tableSelect.pageSize,
        total: logResults.total,
        onChange: paginationChange,
      }}
    />
  );
}

const MemoLookObject2Log = React.memo(LookObject2Log);

export default MemoLookObject2Log;
