import React from 'react';
import { Form, Button, Table } from 'antd';
import { BorderInnerOutlined } from "@ant-design/icons"
import { getItemProps } from "../../utils"
import schema from "./schema"
import styles from "./table.module.less"

const TableWapper = (item: any) => {
  const data: any = getItemProps(schema, item)
  const { ControlProps, FormItemProps, FooterProps } = data
  const { columns, dataSource = [], rowKey } = ControlProps
  const { ishidden: FooterIsHidden, onClick } = FooterProps
  const TableBox = () => {
    return <>
      <Table
        pagination={false}
        className="kx_table_Wapper"
        dataSource={dataSource}
        columns={columns}
        rowKey={rowKey}
        footer={() => {
          if (FooterIsHidden) {
            return null
          } else {
            return <div className={styles.footer}>
              <Button type="dashed" onClick={() => {
                onClick && onClick()
              }} className={styles.button_self}>
                <BorderInnerOutlined /> 添加
              </Button>
            </div>
          }
        }}
      />
    </>
  }

  return <Form.Item {...FormItemProps} noStyle >
    <TableBox />
  </Form.Item>
}

export default TableWapper