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

87 lines
2.7 KiB
JavaScript

/*
* Author: 黎永顺
* name: 在线申报-个税开具证明查看页面
* Description:
* Date: 2023/8/23
*/
import React, { Component } from "react";
import { Icon, Menu, message, Spin } from "antd";
import { WeaLocaleProvider } from "ecCom";
import { getQueryString } from "../../util/url";
import { taxPaymentWithheldVoucherGet } from "../../apis/declare";
import "./index.less";
const { getLabel } = WeaLocaleProvider;
class Index extends Component {
constructor(props) {
super(props);
this.state = {
loading: false, current: "",
enterprisePayCertifiTipMsg: "",
dataSource: []
};
}
componentDidMount() {
this.getEnterprisePayCertificate();
}
getEnterprisePayCertificate = () => {
const payload = {
taxDeclareRecordId: getQueryString("taxDeclareRecordId"),
taxAgentId: getQueryString("taxAgentId"),
taxYearMonth: getQueryString("taxYearMonth")
};
this.setState({ loading: true });
taxPaymentWithheldVoucherGet(payload).then(({ status, data, errormsg }) => {
this.setState({ loading: false });
if (status && !_.isEmpty(data.vouchers)) {
this.setState({
dataSource: data.vouchers,
enterprisePayCertifiTipMsg: data.msg || "",
current: _.head(data.vouchers).name
});
} else {
message.error(errormsg || "");
}
}).catch(() => this.setState({ loading: false }));
};
render() {
const { dataSource, loading, enterprisePayCertifiTipMsg, current } = this.state;
if (loading) {
return <div className="loading-layout">
<Spin spinning={loading} tip={getLabel(111, "获取企业完税证明中...")}/>
</div>;
}
if (_.isEmpty(dataSource)) {
return <div className="pay-certification-detail empty">
<p className="iconEmpty"><Icon type="inbox"/></p>
<p className="empty-title">{getLabel(83553, "暂无数据")}</p>
<p
className="empty-subTitle">{enterprisePayCertifiTipMsg || getLabel(111, "暂无企业完税证明相关信息")}</p>
</div>;
}
return (
<div className="pay-certification-detail">
<div className="left">
<Menu selectedKeys={[current]} mode="inline" onClick={({ key: current }) => this.setState({ current })}>
{
_.map(dataSource, item => {
return <Menu.Item key={item.name}>{item.name}</Menu.Item>;
})
}
</Menu>
</div>
<div className="right">
<iframe src={`data:application/pdf;base64,${_.find(dataSource, it => it.name === current).content}`}
style={{ border: 0, width: "100%", height: "100%" }}/>
</div>
</div>
);
}
}
export default Index;