import React from 'react';
import { Button, Form, Modal, Table, } from 'antd';

const modal =
  ({
    mode,
    domain,
    readOnly,
    record,
    onOk,
    onCancel,
    dispatch,
    loading,
    ...modalProps
  }) => {

    const handleCancel = () => {
      onCancel();
    };

    const modalOpts = {
      ...modalProps,
      onCancel: handleCancel,
      footer: [
        <Button key="back" onClick={handleCancel}>取消</Button>,
      ],
    };

    const tableProps = {
      scroll: { x: '100%', y: 400 },
      indentSize: 30,
      rowKey: 'id',
      dataSource: record,
      bordered: true,
      defaultExpandAllRows: true,
      columns: [{
        title: '供货品类',
        dataIndex: 'items',
        className: 'alignLeft',
        width: '20%',
      }, {
        title: '姓名',
        dataIndex: 'name',
        className: 'alignCenter',
        width: '10%',
      }, {
        title: '邮箱',
        dataIndex: 'email',
        className: 'alignCenter',
        width: '28%',
      }, {
        title: '联系电话',
        dataIndex: 'phone',
        className: 'alignCenter',
        width: '12%',
      }, {
        title: '所属公司',
        dataIndex: 'ouName',
        className: 'alignLeft',
        width: '30%',
      }],
    };

    return (
      <Modal {...modalOpts}>
        <Table loading={loading.effects[`${domain}/query`]} pagination={false} size="small" {...tableProps} />
      </Modal>
    );
  };

export default Form.create()(modal);
