import React from 'react';
import {
  inject,
  observer
} from 'mobx-react';
import {
  WeaSearchGroup,
  WeaFormItem,
  WeaNewScroll,
  WeaDialog,
} from 'ecCom';
import {
  Spin,
  Button,
} from 'antd'
import * as mobx from 'mobx';
const toJS = mobx.toJS;
import {
  WeaSwitch
} from 'comsMobx';
import NewAndEditDialog from '../../coms/NewAndEditDialog';
import {
  i18n
} from '../../public/i18n';

@inject('hrmOrganization')
@observer
class ResourceAddToVirtual extends React.Component {
  constructor(props) {
    super(props);
  }

  componentDidMount() {

  }

  getForm() {
    const {
      hrmOrganization
    } = this.props;
    const {
      form,
      formField
    } = hrmOrganization;
    let formParams = form.getFormParams();
    let virtualtype = formParams.virtualtype || '';
    let arr = [];
    const {
      isFormInit
    } = form;

    isFormInit && formField.map(c => {
      c.items.map((field, index) => {
        if (field.domkey[0] == 'departmentid' && virtualtype == '') {

        } else {
          if (field.domkey[0] == 'departmentid') {
            field.hideVirtualOrg = true;
            field.browserConditionParam.dataParams.virtualtype = virtualtype;
            field.browserConditionParam.completeParams.virtualtype = virtualtype;
          }
          arr.push(<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@gxcu3q@${index}`}
              label={`${field.label}`}
              labelCol={{span: `${field.labelcol}`}}
              error={form.getError(field)}
              wrapperCol={{span: `${field.fieldcol}`}}>
                  {<WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@mqfv44@${index}`} fieldConfig={field} form={form} formParams={formParams} />}
            </WeaFormItem>)
        }
      })
    })
    return <div className="wea-form-item-group">{arr}</div>
  }

  save() {
    const {
      hrmOrganization
    } = this.props;
    hrmOrganization.saveResourceVirtualDepartmentSet();
  }

  onCancel() {
    const {
      hrmOrganization
    } = this.props;
    hrmOrganization.visibleAddToVirtual = false;
  }

  render() {
    const {
      hrmOrganization
    } = this.props;
    const {
      loading,
      visibleAddToVirtual,
      date
    } = hrmOrganization;

    const buttons = [
      (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@wnrykf`} type="primary" onClick={() => this.save()}>{i18n.button.save()}</Button>),
      (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@ydilv0`} disabled>{i18n.button.more()}</Button>)
    ];

    return (
      <WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@dhuv1l`}
            title={i18n.button.resourceAddToVirtual()}
            icon="icon-coms-hrm"
            iconBgcolor="#217346"
            visible={visibleAddToVirtual}
            closable={true}
            onCancel={() => this.onCancel() }
            buttons={buttons}
            style={{width: 600, height: 160}}
        >
            <Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@5o4n30`} spinning={loading}>
                <WeaNewScroll ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScroll@qpx37z`} height={400} ref="scrollBar">
                    <div style={{padding: '27px 8% 25px'}}>
                        {this.getForm()}
                    </div>
                </WeaNewScroll>
            </Spin>
        </WeaDialog>
    );
  }
}

export default ResourceAddToVirtual