import React from 'react';
import {inject, observer} from 'mobx-react';
import {toJS} from 'mobx';
import {Button} from 'antd';
import {WeaSwitch} from 'comsMobx';
import {
  WeaTools,
  WeaFormItem,
  WeaSearchGroup,
  WeaRightMenu,
  WeaDialog,
  WeaNewScroll,
  WeaAlertPage,
  WeaLocaleProvider
} from 'ecCom';
const getLabel = WeaLocaleProvider.getLabel;

@inject('weesoRobotStore')
@observer
export default class WeesoRobotDialog extends React.Component {
  constructor (props) {
    super(props);
    this.state = {
    }
  }

  componentDidMount () {
  }

  getSearchs = (form, datas) => {
    const {isFormInit} = form;
    let group = [];
    const formParams = form.getFormParams();
    isFormInit && datas && datas.map((c, _index) =>{
      let items = [];
      c.items.map(fields => {
        items.push({
          com:(
            <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@6r8tz6@${fields.domkey[0]}`}
              label={`${fields.label}`}
              labelCol={{span: fields.labelcol}}
              wrapperCol={{span: fields.fieldcol}}
              error={form.getError(fields)}
              tipPosition="bottom"
            >
              <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@ro0xr0@${fields.domkey[0]}`} fieldConfig={fields} form={form} formParams={formParams}/>
            </WeaFormItem>),
          colSpan:1,
          hide: form.isHide(fields, (keys, allParams) => {
            let bool = false;
            keys[0] === 'url' && allParams.showDiv === '1' && (bool = true);
            keys[0] === 'width' && allParams.showDiv === '0' && (bool = true);
            keys[0] === 'height' && allParams.showDiv === '0' && (bool = true);
            keys[0] === 'iframeUrl' && allParams.showDiv === '0' && (bool = true);
            return bool;
          })
        })
      });
      group.push(<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@s19yxg@${_index}`} col={1} center needTigger={false} showGroup={c.defaultshow} items={items}/>)
    });
    return group;
  }

  getRightMenu() {
    let btnArr = [
      {
        key: 'BTN_SAVE',
        icon: <i className='icon-coms-Preservation'/>,
        content : `${getLabel(86,'保存')}`,
        onClick : () => this.doSave()
      }
    ]
    return btnArr;
  }

  trimSplace = (str) => {
    return typeof str === 'string' ? str.replace(/(^\s*) \ (\s*$)/g, '') : str;
  }

  doSave = () => {
    const {weesoRobotStore} = this.props;
    const {createForm, dialogStatus} = weesoRobotStore;
    let formParams = createForm && createForm.getFormParams();
    const func = () => dialogStatus.createOrEdit == 0 ? weesoRobotStore.addRobot({...formParams}) : weesoRobotStore.editRobot({...formParams, id: dialogStatus.editId});
    createForm && createForm.validateForm().then(f=>{
      if(f.isValid){
        func();
      }else{
        formParams.title = this.trimSplace(formParams.title);
        formParams.keywords = this.trimSplace(formParams.keywords);
        formParams.url = this.trimSplace(formParams.url);
        formParams.width = this.trimSplace(formParams.width);
        formParams.height = this.trimSplace(formParams.height);
        if(formParams.title !== '' && formParams.keywords !== '' && formParams.url !== '' && formParams.showDiv === '0'){
          func();
        }else if(formParams.title !== '' && formParams.keywords !== '' && formParams.iframeUrl !== '' && formParams.width !== '' && formParams.height!== '' && formParams.showDiv === '1'){
          func();
        }else {
          f.showErrors();
        }
      }
    });
  }

  render() {
    const {weesoRobotStore} = this.props;
    const {dialogStatus, createForm, status} = weesoRobotStore;
    const {collectParams} = toJS(status);
    const {showDialog, createFields, saveLoading} = toJS(dialogStatus);
    let title=getLabel(82832, '智能指令');
    return (
      <WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@060ezm`}
        className="wea-weeso-robot-dialog"
        title={title}
        icon='icon-coms-ws'
        iconBgcolor='#A0B0BA'
        visible={showDialog}
        style={{width: 640, height: 360}}
        onCancel={()=> {
          weesoRobotStore.setDialogState({showDialog : false});
          createForm.reset();
        }}
        buttons={[<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@4wh0xm@doSave`} type='primary' loading={saveLoading} onClick={() => this.doSave()}>{getLabel(86,'保存')}</Button>]}
        moreBtn={{
          datas : this.getRightMenu(),
          collectParams : collectParams
        }}
      >
        <WeaNewScroll ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScroll@kqpdf1`} height={'100%'}>
          <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@2iq4ca`}
            datas={this.getRightMenu()}
            collectParams={collectParams}
          >
          {this.getSearchs(createForm, createFields)}
          </WeaRightMenu>
        </WeaNewScroll>
      </WeaDialog>
    )
  }
}