import React from 'react';
import { Select, Switch, Tooltip } from 'antd';
import { DataTable, SuggestSelect } from '../../../components';

const Option = Select.Option;

export default ({ dispatch, total, list, loading }) => {
  const domain = 'entUserModel';

  const tableProps = {
    scroll: { x: '100%', y: '100%' },
    domain,
    dispatch,
    loading,
    total,
    showDelete: false,
    dataSource: list,
    filter: [{
      title: '用户',
      dataIndex: 'userLike',
    }, {
      title: '角色',
      dataIndex: 'iamRoleId',
      tag: <SuggestSelect apiName="authRoles" mode="multiple"/>,
    }, {
      title: '流程角色',
      dataIndex: 'bpmRoleId',
      tag: <SuggestSelect apiName="bpmRoles" mode="multiple"/>,
    }, {
      title: '状态',
      dataIndex: 'disabled',
      options: {
        initialValue: 0,
      },
      tag: <Select>
        <Option key={2} value={''}>全部</Option>
        <Option key={0} value={0}>有效</Option>
        <Option key={1} value={1}>无效</Option>
      </Select>,
    }],
    columns: [{
      title: '用户名称',
      dataIndex: 'name',
      width: '10%',
    }, {
      title: '企业编号',
      dataIndex: 'entCode',
      width: '10%',
    }, {
      title: '员工编号',
      dataIndex: 'empCode',
      width: '10%',
    }, {
      title: '角色',
      dataIndex: 'iamRoleNames',
      width: '16%',
      render: (value, record, index) => {
        const text = value.toString();
        return text.length > 20 ? <Tooltip placement="top" title={text}>
          <div>{text.substring(0, 20) + '...'}</div>
        </Tooltip> : text;
      }
    }, {
      title: '流程角色',
      dataIndex: 'bpmRoleNames',
      width: '16%',
      render: (value, record, index) => {
        const text = value.toString();
        return text.length > 20 ? <Tooltip placement="top" title={text}>
          <div>{text.substring(0, 20) + '...'}</div>
        </Tooltip> : text;
      }
    }, {
      title: '邮箱',
      dataIndex: 'email',
      width: '16%',
    }, {
      title: '电话',
      dataIndex: 'phone',
      width: '12%',
      // }, {
      //   title: '生效',
      //   dataIndex: 'deleteFlag',
      //   width: '3%',
      //   render: (value) => (value ? '否' : '是')
    }, {
      title: '有效',
      dataIndex: '',
      width: '5%',
      render: (value, record, index) =>
        <Switch
          size="small"
          disabled={record.empDeleteFlag}
          checked={!record.deleteFlag}
          onChange={(checked) => {
            dispatch({
              type: checked ? `${domain}/enable` : `${domain}/disable`,
              payload: {
                id: record.id,
              }
            });
          }}
        />
    }],
    buttons: [{
      key: 'dpower',
      type: 'primary',
      name: '数据权限',
      requiredSelected: 1,
      cb: (selectedKeys, selectedRows) => {
        dispatch({
          type: `dpowerModalModel/showDpowerModal`,
          payload: {
            id: selectedKeys[0],
            row: selectedRows,
          },
        });
      },
    }, {
      key: 'updatePassword',
      type: 'primary',
      name: '修改密码',
      requiredSelected: 1,
      cb: (selectedKeys, selectedRows) => {
        dispatch({
          type: `users/showPWModal`,
          payload: {
            id: selectedKeys[0],
          },
        });
      },
    }]
  };


  return (
    <DataTable {...tableProps} />
  );
}
