/*
 * Author: 黎永顺
 * name: 薪资核算查看
 * Description:
 * Date: 2023/12/7
 */
import React, { Component } from "react";
import { inject, observer } from "mobx-react";
import { WeaLocaleProvider, WeaTop } from "ecCom";
import { Dropdown, Menu, message } from "antd";
import Layout from "../doCalc/layout";
import SalaryEditCalc from "../doCalc/components/salaryEditCalc";
import AdvanceInputBtn from "../doCalc/components/advanceInputBtn";
import { convertToUrlString } from "../../../util/url";
import { getExportField } from "../../../apis/calculate";
import CustomCalcExportDialog from "../doCalc/components/customCalcExportDialog";
import "./index.less";

const getLabel = WeaLocaleProvider.getLabel;

@inject("calculateStore")
@observer
class Index extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showChildren: false,
      customExpDialog: { visible: false, salaryAcctRecordId: "", checkItems: [], itemsByGroup: [] }
    };
    this.calc = null;
  }

  init = () => this.setState({ showChildren: true });

  handleMenuClick = ({ key }) => {
    const { calculateStore: { ECSearchForm }, routeParams: { salaryAcctRecordId } } = this.props;
    const { consolidatedTaxation, ...extra } = ECSearchForm.getFormParams();
    const payload = { ...extra, consolidatedTaxation: consolidatedTaxation === "0" ? "" : consolidatedTaxation };
    switch (key) {
      case "exportAll":
        const url = `/api/bs/hrmsalary/salaryacct/acctresult/export?salaryAcctRecordId=${salaryAcctRecordId}&ids=&${convertToUrlString(payload)}`;
        window.open(`${window.ecologyContentPath || ""}${url}`, "_blank");
        break;
      case "export_selected":
        const { calcTableRef: { wrappedInstance: { state: { selectedRowKeys } } } } = this.calc;
        if (selectedRowKeys.length === 0) {
          message.warning(getLabel(543306, "未选择条目"));
          return;
        }
        const url1 = `/api/bs/hrmsalary/salaryacct/acctresult/export?salaryAcctRecordId=${salaryAcctRecordId}&ids=${selectedRowKeys.join(",")}&${convertToUrlString(payload)}`;
        window.open(`${window.ecologyContentPath || ""}${url1}`, "_blank");
        break;
      case "export_custom":
        getExportField({ salaryAcctRecordId }).then(({ status, data }) => {
          if (status) {
            const { checkItems, itemsByGroup } = data;
            this.setState({
              customExpDialog: {
                ...this.state.customExpDialog, visible: true, salaryAcctRecordId,
                checkItems, itemsByGroup
              }
            });
          }
        });
        break;
      default:
        break;
    }
  };

  render() {
    const { showChildren, customExpDialog } = this.state;
    const btns = [
      <Dropdown.Button type="primary" style={{ marginRight: "10px" }}
                       onClick={() => this.handleMenuClick({ key: "exportAll" })}
                       overlay={<Menu onClick={(e) => this.handleMenuClick(e)}>
                         <Menu.Item key="export_selected">{getLabel(543715, "导出所选")}</Menu.Item>
                         <Menu.Item key="export_custom">{getLabel(544270, "自定义导出")}</Menu.Item>
                       </Menu>}>{getLabel(81272, "导出全部")}</Dropdown.Button>,
      <AdvanceInputBtn onOpenAdvanceSearch={() => this.calc.openAdvanceSearch()}
                       onAdvanceSearch={() => this.calc.onAdSearch(false)}
      />
    ];
    return (
      <Layout {...this.props} init={this.init}>
        <WeaTop title={getLabel(111, "薪资核算详情")} icon={<i className="icon-coms-fa"/>} iconBgcolor="#F14A2D"
                showDropIcon={false} buttons={btns}
        >
          <div className="salary-calculate-view">
            {showChildren && <SalaryEditCalc {...this.props} calcDetail ref={dom => this.calc = dom}/>}
            {/*  薪资核算-自定义导出*/}
            <CustomCalcExportDialog
              {...customExpDialog}
              onCancel={() => {
                this.setState({
                  customExpDialog: { ...customExpDialog, visible: false }
                });
              }}
            />
          </div>
        </WeaTop>
      </Layout>
    );
  }
}

export default Index;
