/*
 * Author: 黎永顺
 * name:数据采集四个基础项-导入
 * Description:
 * Date: 2024/3/14
 */
import React, { Component } from "react";
import { WeaCheckbox, WeaLocaleProvider } from "ecCom";
import ImportDialog from "../../components/importDialog";
import { convertToUrlString } from "../../util/url";

const getLabel = WeaLocaleProvider.getLabel;

class Index extends Component {
  constructor(props) {
    super(props);
    this.state = {
      hasData: false,
      importDialog: {
        nextloading: false, link: "", importResult: {}, imageId: "", params: {},
        previewUrl: ""
      }
    };
  }

  componentWillReceiveProps(nextProps, nextContext) {
    const { hasData, importDialog } = this.state;
    const { templateLink, importOpts, importResult, previewUrl } = nextProps;
    this.setState({
      importDialog: {
        ...importDialog, link: `${templateLink}?${convertToUrlString({ ...importOpts, hasData })}`,
        importResult, params: importOpts, previewUrl, extraPreview: importOpts
      }
    });
  }

  handleExportTemp = () => {
    const { hasData } = this.state;
    const { templateLink, importOpts } = this.props;
    if (!Object.values(importOpts).every(o => !!o)) {
      Modal.warning({
        title: getLabel(131329, "信息确认"),
        content: getLabel(518702, "必要信息不完整，红色*为必填项！")
      });
      return;
    }
    const payload = { ...importOpts, hasData };
    window.open(`${templateLink}?${convertToUrlString(payload)}`, "_blank");
  };
  handleImport = (payload) => {
    const { importDialog } = this.state, { onImportFile, importOpts } = this.props;
    this.setState({ importDialog: { ...importDialog, nextloading: true } });
    onImportFile({ ...payload, ...importOpts }).then(({ data, status }) => {
      this.setState({ importDialog: { ...importDialog, nextloading: false } });
      if (status) {
        this.setState({
          importDialog: { ...importDialog, ...payload, importResult: data }
        });
      }
    }).catch(() => this.setState({ importDialog: { ...importDialog, nextloading: false } }));
  };

  render() {
    const { importDialog, hasData } = this.state;
    const { visible, onCancel, importParams, templateLink, importOpts } = this.props;
    return (
      <ImportDialog
        visible={visible} onCancel={onCancel} {...importDialog} title={getLabel(24023, "数据导入")}
        importParams={importParams} onResetImportResult={() => this.setState({
        importDialog: { ...importDialog, importResult: {}, imageId: "", link: "" }
      })}
        exportDataDom={
          <WeaCheckbox
            value={hasData ? "1" : "0"}
            content={getLabel(543208, "导出现有数据")}
            helpfulTip={getLabel(111, "提示：建议先导出现有最新数据，修改后再导入")}
            onChange={val => this.setState({ hasData: val === "1" }, () => {
              this.setState({
                importDialog: {
                  ...importDialog,
                  link: `${templateLink}?${convertToUrlString({ ...importOpts, hasData: this.state.hasData })}`
                }
              });
            })}
          />
        }
        nextCallback={imageId => this.setState({ importDialog: { ...importDialog, imageId } })}
        nextUplaodCallback={imageId => this.handleImport({ imageId })}
      />
    );
  }
}

export default Index;