import { PureComponent, Fragment } from 'react';
import { DownOutlined, SearchOutlined, EditOutlined, DeleteOutlined, PlusOutlined } from '@ant-design/icons';
import { history, connect } from 'umi';

import {
  Card,
  Button,
  Dropdown,
  Menu,
  message,
  DatePicker,
  Divider,
  Popconfirm,
  Tooltip
} from 'antd';

import { initTreeSelect, userInfo } from '@/utils/globalCommon'
import { XQ, AE, AX, _09, AB, OR, BG, AT, HC, OC, OD, RF, X4 } from '@/utils/pr_new_datadictionary';
import Aa01VipCreateForm from './form/Aa01VipCreateForm'; //新增表单
import Aa01VipUpdateForm from './form/Aa01VipUpdateForm'; //修改表单
import Aa01VipViewForm from './form/Aa01VipViewForm'; //查看表单
import Aa01VipRenderSimpleForm from './form/Aa01VipRenderSimpleForm'; //简单查询表单
import Aa01VipRenderAdvancedForm from './form/Aa01VipRenderAdvancedForm'; //高级查询表单
import moment from 'moment';

import StandardTable from '@/components/StandardTable';

import style from '@/global.less';
import styles from './index.less';

const { RangePicker } = DatePicker;


/* eslint react/no-multi-comp:0 */
@connect(({ baseinfodata, loading }) => ({
  baseinfodata,
  loading: loading.models.baseinfodata,
}))
class Aa01VipTable extends PureComponent {

  state = {
    modalVisible: false,
    updateModalVisible: false,
    viewModalVisible: false,
    expandForm: false,
    selectedRows: [],
    formValues: {},
    updateFormValues: {},
    viewFormValues: {},
  };

  columns = [
    {
      title: '姓名',
      dataIndex: 'za0101',
      key: 'za0101',
      width: 80,
      fixed: 'left',
    },
    {
      title: '性别',
      dataIndex: 'aa0107',
      key: 'aa0107',
      render: val => {
        const list = AX || [];
        if (val) {
          return (
            <Tooltip title={initTreeSelect(list, val)}>
              <span className={style.nowrapper} style={{ width: '150px' }}>
                {initTreeSelect(list, val)}</span>
            </Tooltip>
          )
        }
      }
    },
    {
      title: '民族',
      dataIndex: 'aa0121',
      key: 'aa0121',
      render: val => {
        const list = AE || [];
        if (val) {
          return (
            <Tooltip title={initTreeSelect(list, val)}>
              <span className={style.nowrapper} style={{ width: '150px' }}>
                {initTreeSelect(list, val)}</span>
            </Tooltip>
          )
        }
      }
    },
    {
      title: '出生年月',
      dataIndex: 'aa0111',
      key: 'aa0111',
      render: val => (<span>{moment(val).format("YYYY-MM")}</span>)
    },
    {
      title: '籍贯',
      dataIndex: 'aa0114',
      key: 'aa0114',
      render: val => {
        const list = AB || [];
        if (val) {
          return (
            <Tooltip title={initTreeSelect(list, val)}>
              <span className={style.nowrapper} style={{ width: '150px' }}>
                {initTreeSelect(list, val)}</span>
            </Tooltip>
          )
        }
      }
    },
    {
      title: '参加工作时间',
      dataIndex: 'aa0141',
      key: 'aa0141',
    },
    {
      title: '职称',
      dataIndex: 'v_aa011a',
      key: 'v_aa011a',
    },
    {
      title: '婚姻状况',
      dataIndex: 'aa0127',
      key: 'aa0127',
      render: val => {
        const list = BG || [];
        if (val) {
          return (
            <Tooltip title={initTreeSelect(list, val)}>
              <span className={style.nowrapper} style={{ width: '150px' }}>
                {initTreeSelect(list, val)}</span>
            </Tooltip>
          )
        }
      }
    },
    {
      title: '健康状况',
      dataIndex: 'v_aa011b',
      key: 'v_aa011b',
    },
    {
      title: '身份证号码',
      dataIndex: 'aa0177',
      key: 'aa0177',
    },
    {
      title: '操作',
      width: 220,
      fixed: 'right',
      render: (text, record) => (
        <Fragment>
          <a onClick={() => this.handleViewModalVisible(true, record)}> <SearchOutlined style={{ color: '#00FFFF' }} />查看 </a>
          <Divider type="vertical" />
          <a onClick={() => this.handleUpdateModalVisible(true, record)}> <EditOutlined style={{ color: '#FF4500' }} />编辑 </a>
          <Divider type="vertical" />
          <Popconfirm title="你确定要删除吗?" okText="确定" cancelText="取消" onConfirm={() => this.handleDeleteRecord(record)} >
            <a href={"javascript"} > <DeleteOutlined style={{ color: '#40E0D0' }} /> 删除</a>
          </Popconfirm>
        </Fragment>
      ),
    },
  ];


  componentDidMount() {
    const { dispatch } = this.props;
    dispatch({
      type: 'baseinfodata/query_page_for_aa01',
    });
  }



  handleStandardTableChange = (pagination, filtersArg, sorter) => {

    const { dispatch } = this.props;
    const { formValues } = this.state;

    const params = {
      currentPage: pagination.current,
      pageSize: pagination.pageSize,
      ...formValues,
    };

    if (sorter.field) {
      params.sorter = `${sorter.field}_${sorter.order}`;
    }

    dispatch({
      type: 'baseinfodata/query_page_for_aa01',
      payload: params,
    });


  };

  previewItem = record => {
    const id = record.id;
    //history.push(`/baseinfodata/basic/${id}{id}`);
  };

  handleFormReset = () => {
    const { dispatch } = this.props;
    this.setState({
      formValues: {},
    });
    dispatch({
      type: 'baseinfodata/query_page_for_aa01',
      payload: {},
    });

  };

  toggleForm = () => {

    const { expandForm } = this.state;
    this.setState({
      expandForm: !expandForm,
    });
  };



  handleSelectRows = rows => {
    this.setState({
      selectedRows: rows,
    });
  };

  handleSearch = values => {
    const { dispatch } = this.props;
    this.setState({
      formValues: values,
    });

    dispatch({
      type: 'baseinfodata/query_page_for_aa01',
      payload: values,
    });

  };




  handleModalVisible = flag => {
    this.setState({
      modalVisible: !!flag,
    });
  };

  handleUpdateModalVisible = (flag, record) => {
    this.setState({
      updateModalVisible: !!flag,
      updateFormValues: record || {},
    });
  };

  handleViewModalVisible = (flag, record) => {

    this.setState({
      viewModalVisible: !!flag,
      viewFormValues: record || {},
    });

  };

  handleAdd = (fields, form, loading) => {

    const { dispatch } = this.props;
    const params = {
      za0101: fields.za0101, // 姓  名	
      aa0107: fields.aa0107, // 性  别	aa0107
      aa0121: fields.aa0121, // 民  族	aa0121
      aa0111: fields.aa0111, // 出  生  年  月	aa0111
      aa0114: fields.aa0114, // 籍  贯	aa0114
      aa0117: fields.aa0117, // 出生地	aa0117
      aa0141: fields.aa0141, // 参加工作时间	aa0141
      v_aa011n: fields.v_aa011n, // 党派交叉情况	v_aa011n	
      v_aa011a: fields.v_aa011a, // 职  称	v_aa011a  
      aa0127: fields.aa0127, // 婚  姻  状  况	aa0127
      v_aa011b: fields.v_aa011b, // 健  康  状  况	v_aa011b
      aa0177: fields.aa0177, // 身份证号  码	aa0177
      v_aa011c: fields.v_aa011c, // 工作单位  v_aa011c
      v_aa011d: fields.v_aa011d, // 职 务  v_aa011d
      v_aa011h: fields.v_aa011h, // 职务层次	v_aa011h
      v_aa011f: fields.v_aa011f, // 任现职务层次时间	v_aa011f
      v_aa011e: fields.v_aa011e, // 职    级	v_aa011e
      v_aa011g: fields.v_aa011g, // 任 现 职 级 时 间	v_aa011g
      v_aa011i: fields.v_aa011i, // 单位地址	v_aa011i
      v_aa011j: fields.v_aa011j, // 固定电话	v_aa011j
      v_aa011k: fields.v_aa011k, // 家庭地址	v_aa011k
      ak010g: fields.ak010g, // 邮政编码	ak010g
      ak010b: fields.ak010b, // 手机号码	ak010b
      v_aa011l: fields.v_aa011l, // 电子邮箱	v_aa011l
      v_aa011m: fields.v_aa011m, // 专业专长	v_aa011m
      // za9998: fields.za9998, // 头像
    }
    if(fields.file) {
      const formData = new FormData();
      formData.append('file', fields.file);
      dispatch({
        type: 'baseinfodata/upload_single_file',
        payload: formData,
        callback: ({ success, datarecord}) => {
          loading(false);
          if (success == true) {
            params.za9998 = datarecord.id
            dispatch({
              type: 'baseinfodata/insert_for_aa01',
              payload: params,
              callback: (res) => {
                loading(false);
                if (res.success == true) {
                  message.success('添加成功');
                  form.resetFields();
                  this.handleModalVisible();
                }
              }
            });
          }
          else {
            message.error('照片上传失败');
          }
        }
      });
    } else {
      dispatch({
        type: 'baseinfodata/insert_for_aa01',
        payload: params,
        callback: (res) => {
          loading(false);
          if (res.success == true) {
            message.success('添加成功');
            form.resetFields();
            this.handleModalVisible();
          }
        }
      });
    }
    
  };


  handleDeleteRecord = record => {

    const { dispatch } = this.props;

    dispatch({
      type: 'baseinfodata/delete_by_primarykey_for_aa01',
      payload: {
        recordid: record.id,
      },
      callback: () => {
        this.setState({
          selectedRows: [],
        });
      },
    });

    message.success('删除成功');


  };

  handleUpdate = (fields, form, loading) => {

    const { dispatch } = this.props;
    const params = {
      id: fields.id,
      za0101: fields.za0101, // 姓  名	
      aa0107: fields.aa0107, // 性  别	aa0107
      aa0121: fields.aa0121, // 民  族	aa0121
      aa0111: fields.aa0111, // 出  生  年  月	aa0111
      aa0114: fields.aa0114, // 籍  贯	aa0114
      aa0117: fields.aa0117, // 出生地	aa0117
      aa0141: fields.aa0141, // 参加工作时间	aa0141
      v_aa011n: fields.v_aa011n, // 党派交叉情况	v_aa011n	
      v_aa011a: fields.v_aa011a, // 职  称	v_aa011a  
      aa0127: fields.aa0127, // 婚  姻  状  况	aa0127
      v_aa011b: fields.v_aa011b, // 健  康  状  况	v_aa011b
      aa0177: fields.aa0177, // 身份证号  码	aa0177
      v_aa011c: fields.v_aa011c, // 工作单位  v_aa011c
      v_aa011d: fields.v_aa011d, // 职 务  v_aa011d
      v_aa011h: fields.v_aa011h, // 职务层次	v_aa011h
      v_aa011f: fields.v_aa011f, // 任现职务层次时间	v_aa011f
      v_aa011e: fields.v_aa011e, // 职    级	v_aa011e
      v_aa011g: fields.v_aa011g, // 任 现 职 级 时 间	v_aa011g
      v_aa011i: fields.v_aa011i, // 单位地址	v_aa011i
      v_aa011j: fields.v_aa011j, // 固定电话	v_aa011j
      v_aa011k: fields.v_aa011k, // 家庭地址	v_aa011k
      ak010g: fields.ak010g, // 邮政编码	ak010g
      ak010b: fields.ak010b, // 手机号码	ak010b
      v_aa011l: fields.v_aa011l, // 电子邮箱	v_aa011l
      v_aa011m: fields.v_aa011m, // 专业专长	v_aa011m
      // za9998: fields.za9998, // 头像
    }
    if(fields.file) {
      const formData = new FormData();
      formData.append('file', fields.file);
      dispatch({
        type: 'baseinfodata/upload_single_file',
        payload: formData,
        callback: ({ success, datarecord}) => {
          loading(false);
          if (success == true) {
            params.za9998 = datarecord.id
            dispatch({
              type: 'baseinfodata/update_for_aa01',
              payload: params,
              callback: (res) => {
                loading(false);
                if (res.success == true) {
                  message.success('修改成功');
                  form.resetFields();
                  this.handleUpdateModalVisible();
                }
              }
            });
          }
          else {
            message.error('照片上传失败');
          }
        }
      });
    } else {
      dispatch({
        type: 'baseinfodata/update_for_aa01',
        payload: params,
        callback: (res) => {
          loading(false);
          if (res.success == true) {
            message.success('修改成功');
            form.resetFields();
            this.handleUpdateModalVisible();
          }
        }
      });
    }
    
  };

  renderSimpleForm() {

    const parentMethods = {
      handleSearch: this.handleSearch,
      handleFormReset: this.handleFormReset,
      toggleForm: this.toggleForm,
      submitButtons: styles.submitButtons,
    };

    return (

      <Aa01VipRenderSimpleForm {...parentMethods} />

    );

  }



  renderAdvancedForm() {

    const parentMethods = {
      handleSearch: this.handleSearch,
      handleFormReset: this.handleFormReset,
      toggleForm: this.toggleForm,
    };

    return (

      <Aa01VipRenderAdvancedForm  {...parentMethods} />
    );

  }

  renderForm() {
    const { expandForm } = this.state;
    return expandForm ? this.renderAdvancedForm() : this.renderSimpleForm();
  }

  render() {

    const {
      baseinfodata: { data },
      loading,
    } = this.props;


    const { selectedRows, modalVisible, updateModalVisible, viewModalVisible, updateFormValues, viewFormValues } = this.state;
    const menu = (
      <Menu onClick={this.handleMenuClick} selectedKeys={[]}>
        <Menu.Item key="remove">删除</Menu.Item>
        <Menu.Item key="approval">批量审批</Menu.Item>
      </Menu>
    );
    const parentMethods = {
      handleAdd: this.handleAdd,
      handleModalVisible: this.handleModalVisible,
    };
    const updateMethods = {
      handleUpdateModalVisible: this.handleUpdateModalVisible,
      handleUpdate: this.handleUpdate,
    };
    const viewMethods = {
      handleViewModalVisible: this.handleViewModalVisible
    };
    return (

      <>
        <Card bordered={false}>
          <div className={styles.aa01tableList}>

            <div className={styles.aa01tableListForm}>{this.renderForm()}</div>


            <div className={styles.aa01tableListOperator}>

              <Button type="primary" onClick={() => this.handleModalVisible(true)}>
                <PlusOutlined /> 新建
              </Button>
              {selectedRows.length > 0 && (
                <span>
                  <Button>批量操作</Button>
                  <Dropdown overlay={menu}>
                    <Button>
                      更多操作 <DownOutlined />
                    </Button>
                  </Dropdown>
                </span>
              )}
            </div>

            <StandardTable
              rowKey={"id"}
              selectedRows={selectedRows}
              loading={loading}
              data={data}
              columns={this.columns}
              scroll={{ x: 1500 }}
              onSelectRow={this.handleSelectRows}
              onChange={this.handleStandardTableChange}
            />
          </div>
        </Card>

        <Aa01VipCreateForm {...parentMethods} modalVisible={modalVisible} />


        {updateFormValues && Object.keys(updateFormValues).length ? (
          <Aa01VipUpdateForm
            {...updateMethods}
            updateModalVisible={updateModalVisible}
            values={updateFormValues}
          />
        ) : null}


        {viewFormValues && Object.keys(viewFormValues).length ? (
          <Aa01VipViewForm
            {...viewMethods}
            viewModalVisible={viewModalVisible}
            values={viewFormValues}
          />
        ) : null}

      </>

    );
  }
}


export default Aa01VipTable;

