salary-management-front/pc4mobx/hrmSalary/pages/mySalary/mySalaryView.js

/*
 * Author: 黎永顺
 * name: 查看我的薪资-工资单
 * Description:
 * Date: 2023/6/14
 */
import React, { Component } from "react";
import { inject, observer } from "mobx-react";
import { Button, message, Modal } from "antd";
import { WeaLocaleProvider } from "ecCom";
import Authority from "./authority";
import ComputerTemplate from "../payroll/templatePreview/computerTemplate";
import { confirmSalaryBill, feedBackSalaryBill, payrollCheckType } from "../../apis/payroll";
import CaptchaModal from "../../components/captchaModal";
import "../payroll/templatePreview/index.less";

const { getLabel } = WeaLocaleProvider;

@inject("mySalaryStore")
@observer
class MySalaryView extends Component {
  constructor(props) {
    super(props);
    this.state = {
      captchaVisible: false,
      mySalaryStore: {}
    };
  }

  async componentDidMount() {
    const { mySalaryStore: { init, getMySalaryBill }, params: { salaryInfoId } } = this.props;
    const { data, status } = await payrollCheckType();
    if (status && data === "PWD") {
      init(false, () => {
        getMySalaryBill(Number(salaryInfoId)).then(data => {
          this.setState({ mySalaryStore: data });
        });
      });
    } else {
      this.setState({ captchaVisible: true });
    }
  }

  confirmSalaryBill = () => {
    const { mySalaryStore: { getMySalaryBill }, params: { salaryInfoId } } = this.props;
    confirmSalaryBill({ salaryInfoId }).then(({ status, errormsg }) => {
      if (status) {
        message.success(getLabel(30700, "操作成功"));
        getMySalaryBill(Number(salaryInfoId)).then(data => {
          this.setState({ mySalaryStore: data });
        });
      } else {
        message.error(errormsg || getLabel(30651, "操作失败"));
      }
    });
  };
  handleGoFeedback = () => {
    Modal.confirm({
      title: getLabel(131329, "信息确认"),
      content: getLabel(111, "请确认薪资信息是有误，进行反馈并发起反馈流程。"),
      onOk: () => {
        const { params: { salaryInfoId }, mySalaryStore: { getMySalaryBill } } = this.props;
        feedBackSalaryBill({ salaryInfoId }).then(({ status, errorMsg }) => {
          if (status) {
            const { mySalaryStore } = this.state;
            const { salaryTemplate } = mySalaryStore;
            const { feedbackUrl } = salaryTemplate;
            getMySalaryBill(Number(salaryInfoId)).then(data => {
              this.setState({ mySalaryStore: data }, () => {
                window.open(`${window.ecologyContentPath || ""}${feedbackUrl}`);
              });
            });
          } else {
            message.error(errorMsg);
          }
        });
      }
    });
  };

  render() {
    const { captchaVisible, mySalaryStore } = this.state;
    const { params: { salaryInfoId } } = this.props;
    if (_.isEmpty(mySalaryStore)) {
      return <div></div>;
    }
    const employeeInformation = !_.isEmpty(mySalaryStore) && mySalaryStore.employeeInformation;
    const salaryGroups = !_.isEmpty(mySalaryStore) && mySalaryStore.salaryGroups;
    const salaryTemplateShowSet = !_.isEmpty(mySalaryStore) && mySalaryStore.salaryTemplate;
    return (
      <React.Fragment>
        <Authority ecId={`${this && this.props && this.props.ecId || ""}_Authority@lulowc`}
                   store={this.props.mySalaryStore}>
          <div style={{ height: "100%", overflow: "auto" }}>
            <div className="templatePreview">
              <ComputerTemplate
                isPreview isMsgPreview
                salaryTemplateShowSet={salaryTemplateShowSet ? JSON.stringify(salaryTemplateShowSet) : []}
                salaryItemSet={!_.isEmpty(salaryGroups) ? JSON.stringify([employeeInformation, ...salaryGroups]) : []}
              >
                {
                  (!_.isEmpty(salaryGroups) && (_.isNil(mySalaryStore.confirmStatus) || mySalaryStore.confirmStatus === "0")) &&
                  <ConfirmBtns
                    confirmSalaryBill={this.confirmSalaryBill}
                    goFeedback={this.handleGoFeedback}
                  />
                }
              </ComputerTemplate>
            </div>
          </div>
        </Authority>
        <CaptchaModal
          visible={captchaVisible} id={salaryInfoId}
          onCancel={() => this.setState({ captchaVisible: false })}
          onConfirm={() => mySalaryStore.setInitEmVerify()}
        />
      </React.Fragment>
    );
  }
}

export default MySalaryView;

export const ConfirmBtns = (props) => {
  return <div className="space">
    <Button type="primary" onClick={props.confirmSalaryBill}>{getLabel(111, "确认")}</Button>
    <Button type="ghost" onClick={props.goFeedback}>{getLabel(111, "反馈")}</Button>
  </div>;
};