import React from 'react';
import {
  WeaDialog,
  WeaLocaleProvider, 
  WeaRightMenu
} from 'ecCom';
import {Button, Spin} from 'antd';
import {
  getForm,
  onCheck,
} from '../util/IntegrationUtil';

const {getLabel} = WeaLocaleProvider;

export default class ParamTemplate extends React.Component {
  constructor(props) {
    super(props);
  }

  componentDidMount() {
  }

  cleanState = () => {
    if(this.props.onCancel && typeof(this.props.onCancel) === "function") {
      this.props.onCancel();
    }
  }

  getBtns = () => {
    return [
      <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@ekym6e@publicautomappingpageok`} type="primary" onClick={v => this.handleSave()}>{getLabel('826','确定')}</Button>,
      <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@l6q50j@publicautomappingpagecancel`} onClick={this.cleanState}>{getLabel('31129','取消')}</Button>,
    ]
  }

  getRightMenus = () => {
    return [{
      key: "save",
      content: getLabel('826','确定'),
      icon: <i className="icon-coms-Preservation" />,
      onClick: () => this.handleSave()
    }, {
      key: "cancel",
      content: getLabel('31129','取消'),
      icon: <i className="icon-coms-Preservation" />,
      onClick: this.cleanState
    }]
  }

  hasValue = (data, datas) => {
    let flag = true;
    let dataIdLength = data.id.split('.').length, idx = -1;
    if(["xml", "json", "xml_string"].includes(data.paramType) && data.arrs) {
      idx = -1;
    }else {
      idx = datas && datas.findIndex(v => ((v.id.split('.').length > dataIdLength) && (v.id.split('.').slice(0, dataIdLength).join('.') === data.id)));
    }
    if(data) {
      if(idx == -1) {
        if(!data.assignType || !data.assignValue) {
          flag = false;
        }else {
          if(data.assign && data.assign[1] && data.assign[1].replaceDatas && data.assign[1].replaceDatas[0]) {
            let value = data.assign[1].replaceDatas[0];
            if(data.assignType == "3") {
              if(!value.id || !value.paramKey || !value.paramName || !value.selectedId) {
                flag = false;
              }
            }else if(data.assignType == "4") {
              if(!value.id || !value.name || !value.transformCode) {
                flag = false;
              }
            }else {
              if(!value.id || !value.name) {
                flag = false;
              }
            }
          }else {
            if(data.assignType == '1' && data.assignValue && data.assignValue.trim()) {
            }else {
              flag = false;
            }
          }
        }
      }
    }
    return flag;
  }

  refreshMappingDatas = (datas) => {
    const {esbApplicationManage} = this.props;
    const {autoMappingForm} = esbApplicationManage;
    const {matchType, matchAll} = autoMappingForm.getFormParams();
    let mappingDatas = [], mappingName = "", hasValue = true;

    mappingDatas && mappingDatas.forEach((v, index) => {
      if(matchAll == 1) {
        hasValue = false;
      }else if(matchAll == 0){
        hasValue = this.hasValue(v, mappingDatas);
      }
      if(!hasValue) {
        let item = "";
        if(matchType == '1') {
          item = datas && datas.find(data => data.paramName === v.paramName);
        }else if(matchType == '2') {
          item = datas && datas.find(data => data.showName === v.description);
        }
        if(item) {
          let assignValue = {
            paramKey: item.paramKey || "", 
            paramName: item.selectedShowName || item.paramName || "", 
            id: item.id || "", 
            selectedId: item.detail ? item.detail.selectedId || "" : "", 
          } 
          let assign = ["3", {replaceDatas: [assignValue]}];
          mappingDatas[index] = {
            ...mappingDatas[index],
            assignType: '3',
            assignValue: JSON.stringify(assignValue),
            assign
          }
        }
      }
    })
    esbApplicationManage.setState({[mappingName]: mappingDatas});
    if(this.props.saveCallBack && typeof(this.props.saveCallBack) === "function") {
      this.props.saveCallBack();
    }
  }

  handleSave = () => {
    const {
      form,
      onSave
    } = this.props;
    onCheck(form, () => {
      if(onSave && typeof(onSave) === "function") {
        onSave({...form.getFormParams()});
      }
    });
  }

  render() {
    const {
      visible=false,
      form,
      condition=[]
    } = this.props;
    
    return (
      <WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@hmhq3d`}
        title={getLabel('512734','自动映射')}
        moduleName="integration"
        visible={visible}
        style={{height: 400, width: 600}}
        onCancel={this.cleanState}
        buttons={this.getBtns()}
        hasScroll       
      >
        <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@uhukkd`}
          datas={this.getRightMenus()}
          collectParams={[]}
        >
          {form ? getForm(form, condition) : null}
        </WeaRightMenu>
      </WeaDialog>
    )
  }
}