import React from 'react';
import { connect } from 'dva';
import { Tabs } from 'antd';

import Modal from './Modal';
import DpowerModal from './DpowerModal';
import PasswordModal from './PasswordModal';

import EntUserPane from './EntUserPane';
import SuppUserPane from './SuppUserPane';

const { TabPane } = Tabs;

const User = ({ dispatch, users, suppUserModel, entUserModel, dpowerModalModel, loading }) => {
  const { currentItem, modalVisible, mode } = users;

  const domain = 'users';
  const domainCN = '用户';

  const modalProps = {
    dispatch,
    loading,
    mode,
    domain,
    record: currentItem,
    visible: modalVisible,
    maskClosable: false,
    width: '60%',
    confirmLoading: mode === 'create' ? loading.effects[`${domain}/create`] : loading.effects[`${domain}/update`],
    readOnly: mode === 'view',
    title: mode === 'create' ? `新增${domainCN}` : (mode === 'update' ? `修改${domainCN}` : `查看${domainCN}`),
    wrapClassName: 'vertical-center-modal',
    onOk(data) {
      dispatch({
        type: `${domain}/${mode}`,
        payload: data,
      });
    },
    onCancel() {
      dispatch({
        type: `${domain}/hideModal`,
      });
    },
  };

  const dpowerModalProps = {
    ...dpowerModalModel,
    // itemPowerFlag,
    // regPowerFlag,
    // itemList,
    // regList,
    dispatch,
    loading,
    mode,
    domain: 'dpowerModalModel',
    record: dpowerModalModel.currentItem,
    visible: dpowerModalModel.modalVisible,
    maskClosable: false,
    width: '80%',
    confirmLoading: mode === 'create' ? loading.effects[`${domain}/create`] : loading.effects[`${domain}/update`],
    readOnly: mode === 'view',
    title: '数据权限设置',
    wrapClassName: 'vertical-center-modal',
    onOk(data) {
      dispatch({ type: `dpowerModalModel/closeAndRefresh` });
    },
    onCancel() {
      dispatch({ type: `dpowerModalModel/hideModal` });
    },
  };

  const passwordModalProps = {
    dispatch,
    loading,
    mode,
    domain: 'users',
    record: users.currentItem,
    visible: !!users.pwModalVisible,
    maskClosable: false,
    width: '50%',
    confirmLoading: mode === 'create' ? loading.effects[`${domain}/create`] : loading.effects[`${domain}/update`],
    readOnly: mode === 'view',
    title: '修改用户密码',
    wrapClassName: 'vertical-center-modal',
    onOk(data) {
      dispatch({ type: `users/updatePW`, payload: { id: users.pwModalVisible, ...data } });
    },
    onCancel() {
      dispatch({ type: `users/hidePWModal` });
    },
  };

  return (
    <div className="content-inner">
      <Tabs>
        <TabPane tab="企业用户" key="EntUserPane">
          <EntUserPane dispatch={dispatch} total={entUserModel.total} list={entUserModel.list} loading={loading}/>
        </TabPane>

        <TabPane tab="供应商用户" key="SuppUserPane">
          <SuppUserPane dispatch={dispatch} total={suppUserModel.total} list={suppUserModel.list} loading={loading}/>
        </TabPane>
      </Tabs>
      <TabPane>
      </TabPane>
      {modalVisible && <Modal {...modalProps} />}
      {dpowerModalModel.modalVisible && <DpowerModal {...dpowerModalProps} />}
      {users.pwModalVisible && <PasswordModal {...passwordModalProps} />}
    </div>
  );
};

export default connect(({ users, suppUserModel, entUserModel, dpowerModalModel, loading }) => ({
  users,
  suppUserModel,
  entUserModel,
  dpowerModalModel,
  loading
}))(User);
