import React, { Component } from 'react';
import { Form } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.css';
import { Layout, Spin, Button, message } from 'antd';
import CommonListEvent from '@/components/Common/CommonListEvent';/* 继承销售模块业务功能 */
import * as commonFunc from '@/components/Common/commonFunc';/* 通用单据方法 */ /* 通用单据方法 */
import StaticEditTable from '@/components/Common/CommonTable';/* 可编辑表格 */
import CommonBase from '@/components/Common/CommonBase';/* 获取配置及数据 */
import * as commonBusiness from '@/components/Common/commonBusiness';/* 单据业务功能 */
import SearchComponent from '@/components/Common/SearchComponent';/* 搜索组件 */
import * as config from '@/utils/config';
import * as commonUtils from '@/utils/utils';
import Eject from '@/assets/eject.svg';
import StaticEditTree from '@/components/Common/Tree/StaticTree';
import Close from '@/assets/close.svg';
import styles from "./index.less";

const { Content } = Layout;
/**
 此组件是选择材料通用窗体
 */

class CommonList extends Component {
  constructor(props) {
    super(props);
    this.state = {
      btnList: [],
      openFlag: false,
    };
    this.pathname = location.pathname;
  }
  componentWillReceiveProps(nextProps) {
    const {
      masterConfig, gdsjurisdiction,
    } = nextProps;
    if (masterConfig) {
      // 过滤存储需要展示的按钮
      let btnList = masterConfig.gdsconfigformslave.filter(item => item.bVisible && !item.sName && item.showName && item.sControlName);
      btnList = btnList.filter(item => gdsjurisdiction.findIndex(child => item.sControlName === child.sAction) < 0 && (item.sControlName.includes('BtnAdd') || item.sControlName.includes('BtnCopyTo')));
      // 过滤权限
      this.setState({ btnList });
    }
    if (this.state.openFlag && this.pathname === location.pathname) {
      let dom = {};
      if (commonUtils.isNotEmptyArr(document.getElementsByClassName('modalMaterials')) && document.getElementsByClassName('modalMaterials').length > 0) {
        // eslint-disable-next-line prefer-destructuring
        dom = document.getElementsByClassName('modalMaterials')[0];
        dom.parentElement.parentElement.style.display = 'block';
        this.setState({ openFlag: false });
      } else {
        this.setState({ openFlag: false }, () => {
          this.props.onButtonClick('BtnRefresh');
        });
      }
    }
  }

  // onOpenNewTab = () => {
  //   this.setState({ openFlag: true });
  //   this.props.onOpenNewTab();
  // }

  onOpenNewTab = () => {
    let dom = {};
    if (commonUtils.isNotEmptyArr(document.getElementsByClassName('modalMaterials')) && document.getElementsByClassName('modalMaterials').length > 0) {
      // eslint-disable-next-line prefer-destructuring
      dom = document.getElementsByClassName('modalMaterials')[0];
      dom.parentElement.parentElement.style.display = 'none';
      this.setState({ openFlag: true });
    } else { /* BtnPopup自定义按钮弹窗 */
      this.setState({ openFlag: true });
      this.props.onOpenNewTab();
    }
  }

  // ----------------------------数据修改回带end  ---------------------------- //
  handleEject = (e) => {
    const filterTree = e.currentTarget.parentNode;/* 获取当前页签下的树组件 */
    if (filterTree.attributes.class.value.indexOf('xly-eject') > -1) {
      // eslint-disable-next-line no-unused-expressions
      filterTree.nextSibling.style.display = 'block';
    } else if (filterTree.attributes.class.value.indexOf('xly-tree-close') > -1) {
      // eslint-disable-next-line no-unused-expressions
      filterTree.parentNode.style.display = 'none';
    }
  };

  /**   树节点选中   */
  handleTreeSelect = (name, checkedKeys, e) => {
    this.props.onSelect(name, checkedKeys, e); /* 调用CommonListEvent通用处理 */
  };

  /**   确认下单   */
  handleSelect = () => {
    const {
      slaveSelectedData, app, slaveSelectedRowKeys, slaveData,
    } = this.props;
    let newSlaveSelectedData = [];
    if (commonUtils.isNotEmptyArr(slaveSelectedData)) {
      newSlaveSelectedData = slaveSelectedData;
    } else if (commonUtils.isNotEmptyArr(slaveData) && commonUtils.isNotEmptyArr(slaveSelectedRowKeys)) {
      newSlaveSelectedData = slaveData.filter(item => slaveSelectedRowKeys.includes(item.sSlaveId));
    }
    this.props.app.currentPane.select(app.currentPane.name, app.currentPane.config, newSlaveSelectedData);
    this.props.app.currentPane.selectCancel(app.currentPane.name);
  };
  handleDoubleClickSelect = () => {
    const { slaveConfig } = this.props;
    if (commonUtils.isNotEmptyObject(slaveConfig) && !slaveConfig.bMutiSelect) {
      this.handleSelect();
    }
  }
  /**   关闭   */
  handleCancelModal = () => {
    const { app } = this.props;
    this.props.app.currentPane.selectCancel(app.currentPane.name);
  };
  // ----------------------------数据修改回带end  ---------------------------- //

  copyTo = (sActiveId) => {
    const {
      dispatch, masterConfig, masterData, contactData, addressData, slavePagination,
      sisproductclassifyProcessClassifyData, machineData, assortData, outsideData, processstyleData, processApsRuleData,
      eleemployeeData, elemachineData, eleknifemouldproductData, eleknifemouldfileData, eleteststandarditemData,
      slaveSelectedData,
    } = this.props;
    const copyTo = {};
    copyTo.name = 'BtnCopyTo';
    const copyToConfig = masterConfig.gdsconfigformslave.filter(item => item.sControlName.includes(copyTo.name));
    copyTo.config = copyToConfig;
    copyTo.masterData = slaveSelectedData[0] || masterData;
    copyTo.slaveData = slaveSelectedData;
    copyTo.supplyData = [];
    copyTo.stockData = [];
    copyTo.contactData = contactData;
    copyTo.addressData = addressData;
    copyTo.picFileData = [];
    copyTo.customerInfoData = [];
    copyTo.sisproductclassifyProcessClassifyData = sisproductclassifyProcessClassifyData;
    copyTo.machineData = machineData;
    copyTo.assortData = assortData;
    copyTo.outsideData = outsideData;
    copyTo.processstyleData = processstyleData;
    copyTo.processApsRuleData = processApsRuleData;
    copyTo.eleemployeeData = eleemployeeData;
    copyTo.elemachineData = elemachineData;
    copyTo.eleknifemouldproductData = eleknifemouldproductData;
    copyTo.eleknifemouldfileData = eleknifemouldfileData;
    copyTo.eleteststandarditemData = eleteststandarditemData;
    dispatch({
      type: 'content/onRouter',
      payload: {
        url: `${config.server_host}gdsmodule/getGdsmoduleById/${sActiveId}?sModelsId=${sActiveId}`, /*   接口地址   */
        copyTo,
        pages: slavePagination,
        newRecordFlag: `NewRecord_${sActiveId}`,
      },
    });
  }

  render() {
    const { pageLoading } = this.props;
    return (
      <div style={{ height: '100%' }}>
        <Spin spinning={pageLoading}>
          <div style={{ height: '100%' }}>
            <CommonListComponent
              {...this.props}
              {...this.state}
              onOpenNewTab={this.onOpenNewTab}
              onSelect={this.handleSelect}
              onCancel={this.handleCancelModal}
              onDoubleClick={this.handleDoubleClickSelect}
              onEject={this.handleEject.bind(this)}
              onSelectTree={this.handleTreeSelect}
              onCopyTo={this.copyTo}
            />
          </div>
        </Spin>
      </div>
    );
  }
}

const CommonListComponent = Form.create({
  mapPropsToFields(props) {
    const { masterData } = props;
    const obj = commonFunc.mapPropsToFields(masterData, Form);
    return obj;
  },
})((props) => {
  const {
    form, onReturnForm, slavePagination, sModelsType, onCopyTo, slaveSelectedData, slaveConfig,
  } = props;
  /*   回带表单   */
  onReturnForm(form);
  const pagination = {
    size: 'large',
    pageSize: sModelsType === 'modal/logView' ? 9999 : commonUtils.isNotEmptyNumber(props.iPageSize) && props.iPageSize !== 0 ? props.iPageSize : config.pageSize,
    ...slavePagination,
    showQuickJumper: true,
    hideOnSinglePage: true,
  };
  const tableProps = {
    ...commonBusiness.getTableTypes('slave', props),
    enabled: false,
    tableProps: {
      rowKey: 'sSlaveId', pagination, onChange: props.onTitleChange, AutoTableHeight: 350,
    },
  };
  const name = 'filterTree';
  const treeProps = {
    ...commonBusiness.getTreeTypes('tree', props),
    isSearch: false,
    checkable: false,
    disabled: false,
    checkedAll: false,
    unChecked: false,
    [`${name}Column`]: props[`${name}Column`],
    [`${name}Config`]: props[`${name}Config`],
    [`${name}Data`]: props[`${name}Data`],
    getFloatNum: props.getFloatNum,
    getSqlDropDownData: props.getSqlDropDownData,
    getSqlCondition: props.getSqlCondition,
    handleSqlDropDownNewRecord: props.handleSqlDropDownNewRecord,
    getDateFormat: props.getDateFormat,
    onDoubleClick: props.onDoubleClick,
    onSelect: props.onSelectTree,
    expandedKeys: props.expandedKeys,
  };
  let rowSelectionProps = {};
  if (props.rowSelection !== undefined) {
    rowSelectionProps = {
      rowSelection: props.rowSelection,
    };
  }

  const realizeHeight = commonUtils.isNotEmptyNumber(props.realizeHeight) ? props.realizeHeight : 0;
  const btnClick = (btn) => {
    const { sControlName } = btn;
    const picArr = slaveConfig.gdsconfigformslave.filter(item => (item.sName === 'picArr'));
    if (picArr.length) {
      const sActiveId = picArr[0] ? picArr[0].sActiveId : '';
      if (sControlName === 'BtnAdd') {
        const params = {
          newRecordFlag: `NewRecord_${sActiveId}`,
        };
        if (props.outerMasterData && props.outerMasterData.sCustomerId) {
          params.newRecordRelation = {
            sCustomerId: props.outerMasterData.sCustomerId,
            sCustomerNo: props.outerMasterData.sCustomerNo,
            sCustomerName: props.outerMasterData.sCustomerName,
          };
        }
        props.onAdd(params);
        props.onOpenNewTab();
      } else if (sControlName === 'BtnCopyTo') {
        if (!Array.isArray(slaveSelectedData) || slaveSelectedData.length !== 1) {
          message.warn('请选择一例单据'); // 请选择数据
        } else {
          onCopyTo(sActiveId);
          props.onOpenNewTab();
        }
      }
    }
  };

  const bPadPop =
    props.sModelsId === "12710101117211852461310" ||
    props.sModelsId === "12710101117218031681520";
  
  if (bPadPop) {
    tableProps.fixedHeight = "325px";
  }

  return (
    <Form >
      <Layout>
        <Layout>
          <div id="modalChooseProcess" className={bPadPop ? styles.padTable : ""}>
            <div style={{ maxHeight: '100%', zIndex: 20, display: bPadPop ? "none" : "" }}>
              <SearchComponent {...props} />
            </div>
            <Content
              className={`${realizeHeight <= 0 ? 'xly-normal-list' : 'xly-normal-list resize-container-select'}`}
              style={{ height: realizeHeight > 0 ? `${500 + realizeHeight}px` : 'auto', paddingLeft: '10px' }}
            >
              <StaticEditTable {...tableProps} footer="hidden" showConfig={props.showConfig} {...rowSelectionProps} />
            </Content>
          </div>
        </Layout>
        {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
        {commonUtils.isEmptyArr(treeProps.treeData) || !commonUtils.isEmpty(props.routing) ? '' : <div className="xly-eject" style={{ position: 'absolute', right: '0px' }}> <a onClick={props.onEject}> <img src={Eject} alt="eject" /></a> </div>}
        {commonUtils.isEmptyArr(treeProps.treeData) || !commonUtils.isEmpty(props.routing) ? '' :
        <div className="xly-filter-tree">
          <StaticEditTree {...treeProps} />
          <div className="xly-tree-close" >
            {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
            <a onClick={props.onEject}> <img src={Close} alt="close" /></a>
          </div>
        </div>
        }
        {sModelsType !== 'search/workSchedule' ?
          <div style={{ display: 'flex', justifyContent: 'space-between' }}>
            <div style={{ textAlign: 'right', marginLeft: '9px', marginBottom: '9px' }}>
              {
                commonUtils.isNotEmptyArr(props.btnList) && props.btnList.map(btn => (
                  <Button
                    style={{ marginRight: '8px' }}
                    onClick={() => btnClick(btn)}
                    type="primary"
                    key={btn.sControlName}
                  >
                    { btn.showName }
                  </Button>
                ))
              }
            </div>
            <div style={{ textAlign: 'right', marginRight: '9px', marginBottom: '9px' }}>
              <Button key="back" style={{ marginRight: '8px' }} size='large' onClick={props.onCancel}>取消</Button>
              <Button type="primary" size='large' onClick={props.onSelect}>确认</Button>
            </div>
          </div> : ''
        }
      </Layout>
    </Form>
  );
});

export default CommonBase(CommonListEvent(CommonList));