import React from "react";
import ImportModal from "../../components/importModal";
import { inject, observer } from "mobx-react";
import { convertToUrlString, getQueryString } from "../../util/url";

@inject("calculateStore", "standingBookStore")
@observer
export default class CompareDetailImportModal extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      step: 0,
      modalParam: {
        salaryAcctRecordId: ""
      }
    };
  }

  componentWillMount() {
    const { id } = this.props;
    let modalParam = { ...this.state.modalParam };
    modalParam.salaryAcctRecordId = id;
    this.setState({
      modalParam
    });
  }

  // 设置步骤
  setStep(step) {
    this.setState({ step });
  }

  handleTemplateLink() {
    let url = "";
    if (this.props.id) {
      url = "/api/bs/hrmsalary/salaryacct/comparisonresult/importtemplate/export?salaryAcctRecordId=" + this.props.id;
    } else {
      const payload = {
        billMonth: getQueryString("billMonth"),
        paymentOrganization: getQueryString("paymentOrganization"),
        paymentStatus: 0
      };
      url = `/api/bs/hrmsalary/siaccount/comparisonwelfare/importtemplate/export?${convertToUrlString(payload)}`;
    }
    window.open(url);
  }

  // 初始化导入参数
  handleInitImportModal() {
    const {
      calculateStore: {
        setComparisonPreviewColumns,
        setComparisonPreviewDataSource,
        setComparisonImportAcctResult
      }
    } = this.props;
    setComparisonPreviewColumns([]);
    setComparisonPreviewDataSource([]);
    setComparisonImportAcctResult({});
  }

  render() {
    const { step, modalParam } = this.state;
    const { visiable, id, calculateStore, standingBookStore } = this.props;
    const {
      previewComparisonResult,
      comparisonPreviewColumns,
      comparisonPreviewDataSource,
      importComparisonExcelAcctResult,
      comparisonImportAcctResult
    } = calculateStore;
    const {
      welfarePreview,
      previewStandingBookAcctResultColumns,
      previewStandingBookAcctResultDataSource,
      importComparisonExcelStandingBookResult,
      importOCStandingBookAcctResult
    } = standingBookStore;
    return (
      <div>
        {
          visiable && <ImportModal
            init={() => {
              this.handleInitImportModal();
            }}
            params={modalParam}
            columns={id ? comparisonPreviewColumns : previewStandingBookAcctResultColumns}
            step={step}
            setStep={this.setStep.bind(this)}
            slideDataSource={id ? comparisonPreviewDataSource : previewStandingBookAcctResultDataSource}
            importResult={id ? comparisonImportAcctResult : importOCStandingBookAcctResult}
            onFinish={() => {
              this.props.onCancel();
              this.props.onFinish();
            }}
            previewImport={(params) => {
              id ? previewComparisonResult(params) : welfarePreview(params);
            }}
            importFile={(params) => {
              //id: 有值代表薪资核算页面的线下对比页面， 无值代表社保福利台账页面的线下对比页面
              id ? importComparisonExcelAcctResult(params) : importComparisonExcelStandingBookResult({
                ...params,
                billMonth: getQueryString("billMonth")
              });
            }}
            templateLink={() => {
              this.handleTemplateLink();
            }}
            visiable={visiable}
            onCancel={() => {
              this.props.onCancel();
            }}
          />
        }
      </div>
    );
  }
}
