salary-management-front/pc4mobx/hrmSalary/pages/declareDetail/index.js

/*
 * Author: 黎永顺
 * name: 个税查看详情页面
 * Description:
 * Date: 2023/8/18
 */
import React, { Component } from "react";
import { WeaLocaleProvider, WeaTab, WeaTable } from "ecCom";
import { Button, message } from "antd";
import TaxDeclarationInfo from "./components/taxDeclarationInfo";
import { apiflowBillingConfigStatus } from "../../apis/intelligentCalculateSalarySettings";
import PaymentBtn from "./components/paymentBtn";
import PaymentFeedbackBtn from "./components/paymentFeedbackBtn";
import {
  getDeclareInfo,
  getDetailList,
  getTaxDeclarationTab,
  taxdeclaratioGetCancelFeedback,
  taxdeclarationDeclare,
  taxdeclarationGetDeclareFeedback,
  taxdeclarationGetRate,
  taxdeclarationRefreshData,
  taxdeclaratioUpdateCancel,
  taxdeclaratioUpdateDeclare,
  taxPaymentVoucherStatusSync,
  taxPaymentWithheldVoucherGet
} from "../../apis/declare";
import { convertToUrlString, getQueryString } from "../../util/url";
import "./index.less";

const { getLabel } = WeaLocaleProvider;

const APIFox = {
  refresh: taxdeclarationRefreshData, //刷新数据
  declare: taxdeclarationDeclare, //在线申报
  feedback: taxdeclarationGetDeclareFeedback,//申报反馈
  correct: taxdeclaratioUpdateDeclare,//更正申报
  cancel: taxdeclaratioUpdateCancel,//作废申报
  cancelFeedback: taxdeclaratioGetCancelFeedback//作废反馈
};

class Index extends Component {
  constructor(props) {
    super(props);
    this.state = {
      tabs: [], selectedKey: "", columns: [], dataSource: [],
      loading: {
        query: false, refresh: false, declare: false, feedback: false,
        correct: false, cancel: false, cancelFeedback: false, refreshingPay: false,
        issuance: false
      },
      intelCalcSalaryStatus: false, //智能算薪 总开关是否开启
      declareInfo: {}, pageInfo: { current: 0, pageSize: 10, total: 0 }
    };
    this.timer = null;
  }

  componentDidMount() {
    const promise = this.init();
  }

  init = async () => {
    const [tabsResult, infoResult, calcResult] = await Promise.all([this.getTaxDeclarationTab(), this.getDeclareInfo(), this.apiflowBillingConfigStatus()]);
    const { data: tabDataSource, status: tabStatus } = tabsResult;
    const { data: infoDataSource, status: infoStatus } = infoResult;
    const { data: calcSalaryStatus, status: calcStatus } = calcResult;
    this.setState({
      tabs: tabStatus ? _.map(tabDataSource, it => ({
        viewcondition: `${it.incomeCategory}%%${it.taxDeclarationId}`,
        title: it.tabName
      })) : this.state.tabs,
      selectedKey: tabStatus ? `${_.take(tabDataSource)[0].incomeCategory}%%${_.take(tabDataSource)[0].taxDeclarationId}` : this.state.selectedKey,
      declareInfo: infoStatus ? infoDataSource : this.state.declareInfo,
      intelCalcSalaryStatus: calcStatus && calcSalaryStatus
    });
    this.getDetailList();
  };
  declare = async () => {
    const [infoResult] = await Promise.all([this.getDeclareInfo()]);
    const { data: infoDataSource, status: infoStatus } = infoResult;
    this.setState({
      declareInfo: infoStatus ? infoDataSource : this.state.declareInfo
    });
    this.getDetailList();
  };
  getTaxDeclarationTab = () => {
    return getTaxDeclarationTab({ id: getQueryString("id") });
  };
  getDeclareInfo = () => {
    return getDeclareInfo({ id: getQueryString("id") });
  };
  apiflowBillingConfigStatus = () => {
    return apiflowBillingConfigStatus();
  };
  taxdeclarationGetRate = (index) => {
    return taxdeclarationGetRate({ index });
  };
  getDetailList = () => {
    const { loading, pageInfo, selectedKey } = this.state;
    const [incomeCategory, taxDeclarationId] = selectedKey.split("%%");
    const payload = {
      ...pageInfo, incomeCategory, taxDeclarationId,
      taxDeclareRecordId: getQueryString("id")
    };
    this.setState({ loading: { ...loading, query: true } });
    getDetailList(payload).then(({ status, data }) => {
      this.setState({ loading: { ...loading, query: false } });
      if (status) {
        const { columns, list: dataSource, pageNum: current, pageSize, total } = data;
        this.setState({
          dataSource, pageInfo: { ...pageInfo, current, pageSize, total },
          columns: _.map(columns, (it, idx) => {
            if (idx <= 1) {
              return { ...it, width: 150, fixed: "left" };
            }
            return { ...it, width: 150 };
          })
        });
      }
    }).catch(() => this.setState({ loading: { ...loading, query: false } }));
  };
  handleOperateDeclare = (type) => {
    const loadingTxt = {
      refresh: getLabel(111, "刷新中..."), //刷新数据
      declare: getLabel(111, "申报中..."), //在线申报
      feedback: getLabel(111, "反馈中..."),//申报反馈
      correct: getLabel(111, "更正申报中..."),//更正申报
      cancel: getLabel(111, "作废申报中..."),//作废申报
      cancelFeedback: getLabel(111, "作废反馈中...")//作废反馈
    }, successTxt = {
      refresh: getLabel(111, "刷新数据成功！"), //刷新数据
      declare: getLabel(111, "在线申报成功！"), //在线申报
      feedback: getLabel(111, "申报反馈成功！"),//申报反馈
      correct: getLabel(111, "更正申报成功！"),//更正申报
      cancel: getLabel(111, "作废申报成功！"),//作废申报
      cancelFeedback: getLabel(111, "作废反馈成功！")//作废反馈
    }, failTxt = {
      refresh: getLabel(111, "刷新数据失败！"), //刷新数据
      declare: getLabel(111, "在线申报失败！"), //在线申报
      feedback: getLabel(111, "申报反馈失败！"),//申报反馈
      correct: getLabel(111, "更正申报失败！"),//更正申报
      cancel: getLabel(111, "作废申报失败！"),//作废申报
      cancelFeedback: getLabel(111, "作废反馈失败！")//作废反馈
    };
    this.setState({ loading: { ...this.state.loading, [type]: true } });
    APIFox[type]({ taxDeclareRecordId: getQueryString("id") })
      .then(async ({ status, data, errormsg }) => {
        if (status) {
          message.destroy();
          message.loading(loadingTxt[type], 0);
          this.timer = setInterval(async () => {
            const { status: resStatus, data: result } = await this.taxdeclarationGetRate(data);
            const { status: rateStatus, finish, msg } = result;
            if (resStatus && rateStatus) {
              if (finish) {
                this.setState({ loading: { ...this.state.loading, [type]: false } });
                clearInterval(this.timer);
                message.destroy();
                message.success(successTxt[type]);
                const promise = type === "refresh" ? await this.init() : await this.declare();
              }
            } else {
              this.setState({ loading: { ...this.state.loading, [type]: false } });
              clearInterval(this.timer);
              message.destroy();
              message.warning(msg || failTxt[type]);
              const promise = type === "refresh" ? await this.init() : await this.declare();
            }
          }, 1000);
        } else {
          this.setState({ loading: { ...this.state.loading, [type]: false } });
          clearInterval(this.timer);
          message.destroy();
          message.warning(errormsg);
        }
      }).catch(() => {
      message.destroy();
      clearInterval(this.timer);
      this.setState({ loading: { ...this.state.loading, [type]: false } });
    });
  };
  taxPaymentVoucherStatusSync = () => {
    const { taxAgentId, taxCycle: taxYearMonth } = this.state.declareInfo;
    const payload = {
      taxDeclareRecordId: getQueryString("id"),
      taxAgentId, taxYearMonth
    };
    this.setState({ loading: { ...this.state.loading, refreshingPay: true } });
    taxPaymentVoucherStatusSync(payload).then(({ status, errormsg }) => {
      this.setState({ loading: { ...this.state.loading, refreshingPay: false } });
      if (status) {
        message.success(getLabel(111, "刷新成功！"));
        const promise = this.declare();
      } else {
        message.error(errormsg || getLabel(111, "刷新失败！"));
      }
    }).catch(() => this.setState({ loading: { ...this.state.loading, refreshingPay: false } }));
  };
  getEnterprisePayCertificate = () => {
    const { taxAgentId, taxCycle: taxYearMonth } = this.state.declareInfo;
    const payload = {
      taxDeclareRecordId: getQueryString("id"),
      taxAgentId, taxYearMonth
    };
    this.setState({ loading: { ...this.state.loading, issuance: true } });
    taxPaymentWithheldVoucherGet(payload).then(({ status, data, errormsg }) => {
      this.setState({ loading: { ...this.state.loading, issuance: false } });
      if (status && !_.isEmpty(data.vouchers)) {
        window.open(`${window.ecologyContentPath || ""}/spa/hrmSalary/static/index.html#/main/hrmSalary/enterprisePayCertificationDetail?${convertToUrlString(payload)}`);
      } else {
        message.error(errormsg || "");
      }
    }).catch(() => this.setState({ loading: { ...this.state.loading, issuance: false } }));
  };
  export = () => {
    const [incomeCategory, taxDeclarationId] = this.state.selectedKey.split("%%");
    const payload = {
      taxDeclareRecordId: getQueryString("id"),
      taxDeclarationId: taxDeclarationId.toString(),
      incomeCategory
    };
    window.open(`${window.ecologyContentPath || ""}/api/bs/hrmsalary/taxdeclaration/detail/export?${convertToUrlString(payload)}`, "_blank");
  };

  render() {
    const {
      tabs, selectedKey, columns, pageInfo,
      dataSource, loading, declareInfo, intelCalcSalaryStatus
    } = this.state;
    let btns = [
      <Button type="primary" onClick={this.export}>{getLabel(17416, "导出")}</Button>,
      <Button type="ghost" onClick={() => this.handleOperateDeclare("declare")}
              loading={loading.declare}>{getLabel(111, "在线申报")}</Button>,
      <Button type="ghost" onClick={() => this.handleOperateDeclare("refresh")}
              loading={loading.refresh}>{getLabel(111, "刷新数据")}</Button>
    ];
    const pagination = {
      ...pageInfo,
      showTotal: total => `${getLabel(18609, "共")} ${total} ${getLabel(18256, "条")}`,
      showQuickJumper: true,
      showSizeChanger: true,
      pageSizeOptions: ["10", "20", "50", "100"],
      onShowSizeChange: (current, pageSize) => {
        this.setState({
          pageInfo: { ...pageInfo, current, pageSize }
        }, () => this.getDetailList());
      },
      onChange: current => {
        this.setState({
          pageInfo: { ...pageInfo, current }
        }, () => this.getDetailList());
      }
    };
    //申报状态：作废中
    declareInfo.declareStatus === "DECLARE_CANCELLING" && (btns.splice(1, 2, <Button
      type="ghost" loading={loading.cancelFeedback}
      onClick={() => this.handleOperateDeclare("cancelFeedback")}>{getLabel(111, "作废反馈")}</Button>));
    //申报状态：申报中
    declareInfo.declareStatus === "DECLARING" && (btns.splice(1, 2, <Button
      type="ghost" loading={loading.feedback}
      onClick={() => this.handleOperateDeclare("feedback")}>{getLabel(111, "申报反馈")}</Button>));
    //申报状态：缴款中
    declareInfo.declareStatus === "DECLARE_SUCCESS_PAYING" && (btns.splice(1, 2));
    //申报状态：已缴款
    declareInfo.declareStatus === "DECLARE_SUCCESS_PAID" && (btns.splice(1, 2,
      <Button type="ghost" loading={loading.correct}
              onClick={() => this.handleOperateDeclare("correct")}>{getLabel(111, "更正申报")}</Button>));
    //申报状态：申报成功，无需缴款
    declareInfo.declareStatus === "DECLARE_SUCCESS_NO_PAY" &&
    (btns.splice(1, 2,
      <Button type="ghost" loading={loading.correct}
              onClick={() => this.handleOperateDeclare("correct")}>{getLabel(111, "更正申报")}</Button>,
      <Button type="ghost"
              loading={loading.cancel}
              onClick={() => this.handleOperateDeclare("cancel")}>{getLabel(111, "作废申报")}</Button>
    ));
    //申报状态：申报成功，未缴款
    declareInfo.declareStatus === "DECLARE_SUCCESS_UNPAID" &&
    (btns.splice(1, 2,
      <Button type="ghost" loading={loading.correct}
              onClick={() => this.handleOperateDeclare("correct")}>{getLabel(111, "更正申报")}</Button>,
      <Button type="ghost"
              loading={loading.cancel}
              onClick={() => this.handleOperateDeclare("cancel")}>{getLabel(111, "作废申报")}</Button>,
      <Button type="ghost"
              loading={loading.refreshingPay}
              onClick={this.taxPaymentVoucherStatusSync}>{getLabel(111, "刷新缴款状态")}</Button>
    ));
    if (!intelCalcSalaryStatus) {
      if (["NOT_DECLARE", "DECLARE_FAIL"].includes(declareInfo.declareStatus)) {
        btns.splice(1, 1);
      }
    }
    if (intelCalcSalaryStatus && (declareInfo.declareStatus === "DECLARE_SUCCESS_UNPAID")) {
      btns.push(
        <PaymentBtn declareInfo={declareInfo} updateDeclare={this.declare}/>,
        <PaymentFeedbackBtn declareInfo={declareInfo} updateDeclare={this.declare}/>
      );
    }
    if (intelCalcSalaryStatus && declareInfo.taxPaidAmount && parseFloat(declareInfo.taxPaidAmount) > 0) {
      btns.push(<Button type="ghost" loading={loading.issuance}
                        onClick={this.getEnterprisePayCertificate}>{getLabel(111, "开具企业完税证明")}</Button>);
    }
    return (
      <div className="declareDetail-layout">
        <TaxDeclarationInfo declareInfo={declareInfo}/>
        <div className="declareDetail-layout-content">
          <WeaTab
            datas={tabs} keyParam="viewcondition" selectedKey={selectedKey}
            buttons={btns} onChange={(v) => this.setState({ selectedKey: v }, () => this.getDetailList())}
          />
          <WeaTable
            loading={loading.query} bordered
            columns={columns} dataSource={dataSource}
            pagination={pagination}
            scroll={{ x: 1200, y: `calc(100vh - 190px)` }}
          />
        </div>
      </div>
    );
  }
}

export default Index;