/* eslint-disable */
/* eslint no-dupe-keys: 0, no-mixed-operators: 0 */
import React from 'react';
// import * as commonConfig from '../../utils/config';
// import * as commonServices from '../../services/services';
import { Menu, Dropdown } from 'antd';
import { CaretUpOutlined } from '@ant-design/icons';
import * as commonUtils from '../../utils/utils';
import ShowType from '../../components/Common/CommonComponent';


class OeeSearchComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      onChangeValue: '',
    };
    this.bFilterCondition = true;
    this.textInput = null;
  }
  // componentWillReceiveProps(nextProps) {
  //   const { slaveConfig } = nextProps;
  //   const iIndex = slaveConfig.gdsconfigformslave.findIndex(item => item.bFind);
  //   if (iIndex > -1) {
  //     this.setState({ filterName: slaveConfig.gdsconfigformslave[iIndex].showName });
  //   }
  // }

  handleSearch = (name, sFieldName, changeValue) => {
    let { slaveFilterCondition } = this.state;
    !slaveFilterCondition && (slaveFilterCondition = []);
    const conIndex = slaveFilterCondition.findIndex(item => item.bFilterName === sFieldName);
    if (conIndex !== -1) {
      slaveFilterCondition.splice(conIndex, 1);
    }
    slaveFilterCondition.push({ bFilterName: sFieldName, bFilterCondition: 'like', bFilterValue: changeValue[sFieldName] });

    this.setState({
      [`onChangeValue${sFieldName}`]: changeValue[sFieldName],
      slaveFilterCondition,
    });
  }

  /* 点按钮搜索 */
  handleBtnSearch = () => {
    let { slaveFilterCondition } = this.state;
    const { slaveConfig } = this.props;
    if (commonUtils.isEmpty(slaveFilterCondition)) {
      slaveFilterCondition = [];
    }
    this.props.onGetData(slaveConfig, slaveFilterCondition);
  }

  render() {
    const {
      slaveConfig, app, sModelsId,
    } = this.props;
    const searchConfig = commonUtils.isNotEmptyObject(slaveConfig) ? slaveConfig.gdsconfigformslave.filter(item => item.bFind && item.bVisible) : [];
    

    let item, showTypeProps, searchConfig1;
    if (searchConfig.length) {
      item = searchConfig[0];
      item.placeholder = item.showName;
      showTypeProps = {
        app,
        record: {},
        sId: item.sId, /*   修改当前编号(数据格式:字符串)   */
        name: 'slave',
        form: this.props.form,
        formId: sModelsId,
        getSqlDropDownData: this.props.getSqlDropDownData,
        getSqlCondition: this.props.getSqlCondition,
        handleSqlDropDownNewRecord: this.props.handleSqlDropDownNewRecord,
        getFloatNum: this.props.getFloatNum,
        getDateFormat: this.props.getDateFormat,
        onChange: this.handleSearch,
        showConfig: item,
        formItemLayout: {},
        textArea: false,
        enabled: true,
        dataValue: this.state[`onChangeValue${item.sName}`],
        bTable: true,
        onFilterDropDownData: this.props.onFilterDropDownData,
        onSaveState: this.props.onSaveState,
        formRoute: this.props.formRoute,
      };
      searchConfig1 = [...searchConfig];
      searchConfig1.shift();
    }

    return (
      <div style={{ height: '100%' }}>
        <div style={{
          height: '100%',
          display: 'flex',
          justifyContent: 'center',
          alignItems: 'center',
        }}
        className="oeeSearchComponent"
        >
          {
            searchConfig1 && searchConfig1.length ? (<><Dropdown open={true} trigger={['click']} overlayStyle={{
              background: 'red'
            }} overlay={<Menu
              onClick={()=>{}}
            >
              {searchConfig1.map((item) => {
                item.placeholder = item.showName;
                const showTypeProps = {
                  app,
                  record: {},
                  sId: item.sId, /*   修改当前编号(数据格式:字符串)   */
                  name: 'slave',
                  form: this.props.form,
                  formId: sModelsId,
                  getSqlDropDownData: this.props.getSqlDropDownData,
                  getSqlCondition: this.props.getSqlCondition,
                  handleSqlDropDownNewRecord: this.props.handleSqlDropDownNewRecord,
                  getFloatNum: this.props.getFloatNum,
                  getDateFormat: this.props.getDateFormat,
                  onChange: this.handleSearch,
                  showConfig: item,
                  formItemLayout: {},
                  textArea: false,
                  enabled: true,
                  dataValue: this.state[`onChangeValue${item.sName}`],
                  bTable: true,
                  onFilterDropDownData: this.props.onFilterDropDownData,
                  onSaveState: this.props.onSaveState,
                  formRoute: this.props.formRoute,
                  iColValue: 24,
                };
                return (
                  <div className="oeeSearchInput" style={{ flex: 1, fontSize: '1.1rem', padding: '0 2px 2px 2px' }}>
                    <ShowType {...showTypeProps} />
                  </div>
                );
              })}
            </Menu>}
            >
              <div style={{
                height: '110%',
                display: 'flex',
                alignItems: 'center',
                justifyContent: 'center',
                fontSize: '26px',
                color: '#177ddc',
                width: '30px'
              }}>
                <CaretUpOutlined />
              </div>
            </Dropdown>
            <div className="oeeSearchInput" style={{ flex: 1, fontSize: '1.1rem' }}>
              <ShowType {...showTypeProps} />
              <div className="oeeSearch">
                {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
                <a key={0} style={{ background: 'rgb(23, 125, 220)' }} onClick={() => this.handleBtnSearch()}>
                  查询
                </a>
              </div>
            </div>
            </>) : commonUtils.isNotEmptyArr(searchConfig) ?
              searchConfig.map((item) => {
                item.placeholder = item.showName;
                const showTypeProps = {
                  app,
                  record: {},
                  sId: item.sId, /*   修改当前编号(数据格式:字符串)   */
                  name: 'slave',
                  form: this.props.form,
                  formId: sModelsId,
                  getSqlDropDownData: this.props.getSqlDropDownData,
                  getSqlCondition: this.props.getSqlCondition,
                  handleSqlDropDownNewRecord: this.props.handleSqlDropDownNewRecord,
                  getFloatNum: this.props.getFloatNum,
                  getDateFormat: this.props.getDateFormat,
                  onChange: this.handleSearch,
                  showConfig: item,
                  formItemLayout: {},
                  textArea: false,
                  enabled: true,
                  dataValue: this.state[`onChangeValue${item.sName}`],
                  bTable: true,
                  onFilterDropDownData: this.props.onFilterDropDownData,
                  onSaveState: this.props.onSaveState,
                  formRoute: this.props.formRoute,
                };
                return (
                  <div className="oeeSearchInput" style={{ flex: 1, fontSize: '1.1rem' }}>
                    <ShowType {...showTypeProps} />
                    <div className="oeeSearch">
                      {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
                      <a key={0} style={{ background: 'rgb(23, 125, 220)' }} onClick={() => this.handleBtnSearch()}>
                        查询
                      </a>
                    </div>
                  </div>
                );
              }) : ''
          }
        </div>
      </div>
    );
  }
}
export default OeeSearchComponent;