import React, { Component, Fragment } from 'react';
import { observer, inject } from 'mobx-react';
import { WeaDialog, WeaLocaleProvider } from 'ecCom';
import { WeaTableNew, WeaLogView } from 'comsMobx';
import { Button } from 'antd';
import { toJS } from 'mobx';


import './style/publicGroup.less';

const { getLabel } = WeaLocaleProvider;
const { WeaTable } = WeaTableNew;
const WeaLogViewComp = WeaLogView.Component;

@inject('odoc_privateGroupStore')
@observer
class PrivateGroupSetingComponent extends Component {
  constructor(props) {
    super(props);
    this.getDropMenuDatas = this.getDropMenuDatas.bind(this);
    this.getTopBtn = this.getTopBtn.bind(this);
  }

  componentDidMount () {
    const { odoc_privateGroupStore } = this.props;
    odoc_privateGroupStore.getTableData();
    // odoc_privateGroupStore.getCommReceiveItems();
    // odoc_privateGroupStore.getPrivateReceiveLogType();

    // 高级搜索
    odoc_privateGroupStore.getPanelForm();
    odoc_privateGroupStore.odoConditionForm.reset();
  }
  componentWillUnmount () {
    const { odoc_privateGroupStore } = this.props;
    odoc_privateGroupStore.rowSelection([]);
  }

  render () {
    const { odoc_privateGroupStore } = this.props;
    const { tableStore, selectedRowKeys, logVisible, logStore, logType, logSmallType, creatDialogVisible, odocForm,
      loading, isCreat, onOperatesClick, creatDialogHide, onCheck, rowSelection,
      logHide, clickRowKey } = odoc_privateGroupStore;
    const dialogTitle = isCreat ? getLabel(390079, '新建私人组') : getLabel(390315, '编辑私人组');
    return (
      <div>
        <Fragment ecId={`${this && this.props && this.props.ecId || ''}_Fragment@j8rfz6`}>
          <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@g8gfly`}
            hasOrder={true}
            needScroll={true}
            comsWeaTableStore={tableStore}
            getColumns={cols => this.getColumns(cols)}
            rowSelection={{
              selectedRowKeys,
              onChange: rowSelection,
            }}
            onOperatesClick={onOperatesClick}
          />
          <WeaLogViewComp ecId={`${this && this.props && this.props.ecId || ''}_WeaLogViewComp@pkgvhj`}
            visible={logVisible}
            onCancel={() => logHide()}
            logStore={logStore}
            logType={logType}
            logSmallType={logSmallType}
            targetId={clickRowKey}
          />

          <WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@l8us84`}
            title={dialogTitle}
            icon="icon-coms-official"
            visible={creatDialogVisible}
            onCancel={() => creatDialogHide()}
            draggable={true}
            maskClosable={true}
            style={{ width: 500 }}
            className="publicGroupDialogForm"
            buttons={[<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@g3ukle@save`} type="primary" disabled={loading} onClick={() => onCheck()}>{getLabel(30986, '保存')}</Button>]}
          >
            {odocForm.render()}
          </WeaDialog>


        </Fragment>
      </div>
    );
  }

  getTopBtn () {
    const { creatDialogShow, selectedRowKeys, loading, showConfirm } = this.props.odoc_privateGroupStore;
    const disabled = !(toJS(selectedRowKeys).length > 0);
    const btns = [
      <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@u3pwaw@create`} type="primary" onClick={() => creatDialogShow()} >{getLabel(365, '新建')}</Button>,
      <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@c4odpr@batchDelete`} type="primary" disabled={!loading && disabled} onClick={() => showConfirm()} >{getLabel(32136, '批量删除')}</Button>,
    ];
    return btns;
  }

  getDropMenuDatas () {
    const { creatDialogShow, selectedRowKeys, logShow, showConfirm } = this.props.odoc_privateGroupStore;
    const disabled = !(selectedRowKeys.length > 0);
    const dropMenuDatas = [
      {
        key: '1',
        disabled: false,
        icon: <i className="icon-coms-Add-to" />,
        content: getLabel('365', '新建'),
        onClick: () => creatDialogShow(),
      },
      {
        key: '2',
        disabled,
        icon: <i className="icon-coms-odocForm-delete" />,
        content: getLabel(32136, '批量删除'),
        onClick: () => showConfirm(),
      },
      {
        key: '3',
        disabled: false,
        icon: <i className="icon-coms-Print-log" />,
        content: '日志',
        onClick: () => logShow(),
      },
    ];
    return dropMenuDatas;
  }

  // 自定义列
  getColumns (columns) {
    const { onOperatesClick } = this.props.odoc_privateGroupStore;
    return columns.map((col) => {
      if (col.dataIndex == 'receiveunitname') {
        return {
          ...col,
          title: col.title,
          render (text, record) {
            return (
              <a style={{ color: '#00a9ff' }} onClick={() => onOperatesClick(record, '', '', '0')}>{text}</a>
            );
          },
        };
      }
      return col;
    });
  }
}

export default PrivateGroupSetingComponent;