/*
 * Author: 黎永顺
 * name: 导入弹框-步骤条
 * Description:
 * Date: 2023/8/11
 */
import React, { Component } from "react";
import { Button, message, Modal } from "antd";
import { WeaDialog, WeaLocaleProvider, WeaSteps } from "ecCom";
import ImpStep1 from "./components/impStep1";
import ImpStep2 from "./components/impStep2";
import ImpStep3 from "./components/impStep3";
import "./index.less";

const { getLabel } = WeaLocaleProvider;
const Step = WeaSteps.Step;

class Index extends Component {
  constructor(props) {
    super(props);
    this.state = {
      current: 0
    };
  }

  componentWillReceiveProps(nextProps, nextContext) {
    if (JSON.stringify(nextProps.importResult) !== JSON.stringify(this.props.importResult) && !_.isEmpty(nextProps.importResult)) {
      this.setState({
        current: this.state.current + 1
      });
    }
    if (nextProps.visible !== this.props.visible && !nextProps.visible) this.setState({ current: 0 });
  }

  renderChildren = () => {
    const { current } = this.state;
    const { importParams, link, excludeKey, importResult, exportDataDom = null } = this.props;
    let CurrentDom = null;
    switch (current) {
      case 0:
        CurrentDom = <ImpStep1 importParams={importParams} link={link} exportDataDom={exportDataDom}
                               ref={dom => this.step1Ref = dom}/>;
        break;
      case 1:
        CurrentDom = <ImpStep2 {...this.props}/>;
        if (excludeKey) {
          CurrentDom = <ImpStep3 importResult={importResult}/>;
        }
        break;
      case 2:
        CurrentDom = <ImpStep3 importResult={importResult}/>;
        break;
      default:
        CurrentDom = null;
        break;
    }
    return CurrentDom;
  };
  /*
   * Author: 黎永顺
   * Description: 上一步
   * Params:
   * Date: 2023/9/5
   */
  handlePreviousStep = () => {
    Modal.confirm({
      title: getLabel(131329, "信息确认"),
      content: getLabel(111, "是否放弃已上传的文件？"),
      onOk: () => this.setState({ current: this.state.current - 1 }, () => this.props.onResetImportResult())
    });
  };
  /*
   * Author: 黎永顺
   * Description: 下一步
   * Params:
   * Date: 2023/8/11
   */
  handleNext = () => {
    const { params, importResult } = this.props;
    if (_.isEmpty(importResult)) {
      const { fileList } = this.step1Ref.state;
      if (!_.isEmpty(params)) {
        if (!Object.values(params).every(o => !!o)) {
          Modal.warning({
            title: getLabel(131329, "信息确认"),
            content: getLabel(518702, "必要信息不完整，红色*为必填项！")
          });
          return;
        }
      }
      if (_.isEmpty(fileList)) {
        message.warning(getLabel(111, "请先上传EXCEL文件"));
        return;
      }
      const [file] = fileList;
      const { response } = file;
      this.props.nextCallback(response.data.fileid);
    } else {
      this.setState({ current: this.state.current + 1 });
    }
  };

  render() {
    const { current } = this.state;
    const stepData = [
      { key: 0, label: getLabel(543202, "上传EXCEL") },
      { key: 1, label: getLabel(543200, "数据预览") },
      { key: 2, label: getLabel(502835, "导入数据") }
    ];
    const btns = [
      <Button type="ghost" onClick={this.handlePreviousStep}>{getLabel(1876, "上一步")}</Button>,
      <Button type="primary" onClick={this.handleNext}
              loading={this.props.nextloading}>{getLabel(1402, "下一步")}</Button>,
      <Button type="primary" onClick={() => this.props.onCancel(true)}>{getLabel(555, "完成")}</Button>
    ];
    return (
      <WeaDialog
        {...this.props}
        scalable hasScroll className="importBox" initLoadCss
        buttons={current === 0 ? _.nth(btns, 1) : (!this.props.excludeKey && current === 1) ? _.take(btns, 2) : _.takeRight(btns)}
        style={{
          width: 800,
          height: 606.6,
          minHeight: 200,
          minWidth: 380,
          maxHeight: "90%",
          maxWidth: "90%",
          overflow: "hidden",
          transform: "translate(0px, 0px)"
        }}
      >
        <div className="importCont">
          <div className="weapp-batch-impsteps-picker-content-imp-steps">
            <WeaSteps current={current}>
              {/*this.props.key: 不需要展示的步骤*/}
              {
                _.map(_.filter(stepData, item => item.key !== this.props.excludeKey), it => (
                  <Step key={it.key} description={it.label}/>))
              }
            </WeaSteps>
          </div>
          <div className="weapp-batch-impsteps-picker">
            {
              this.renderChildren()
            }
          </div>
        </div>
      </WeaDialog>
    );
  }
}

export default Index;