个税在线申报-申报表导出功能的完成
This commit is contained in:
parent
c4d0dbf296
commit
89b28b1d2e
|
|
@ -218,4 +218,19 @@ export const taxPaymentWithheldVoucherGet = (params) => {
|
||||||
return postFetch("/api/bs/hrmsalary/taxPayment/withheldVoucher/get", params);
|
return postFetch("/api/bs/hrmsalary/taxPayment/withheldVoucher/get", params);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
//个税申报表申报数据-作废缴款凭证
|
||||||
|
export const taxPaymentVoucherCancel = (params) => {
|
||||||
|
return postFetch("/api/bs/hrmsalary/taxPayment/voucher/cancel", params);
|
||||||
|
};
|
||||||
|
|
||||||
|
//个税申报表申报数据-缴款凭证打印
|
||||||
|
export const taxPaymentVoucherPrint = (params) => {
|
||||||
|
return postFetch("/api/bs/hrmsalary/taxPayment/voucher/print", params);
|
||||||
|
};
|
||||||
|
|
||||||
|
//个税申报表申报数据-缴款凭证打印反馈
|
||||||
|
export const taxPaymentVoucherPrintFeedback = (params) => {
|
||||||
|
return postFetch("/api/bs/hrmsalary/taxPayment/voucher/print/feedback", params);
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -23,6 +23,7 @@ import Declare from "./pages/declare";
|
||||||
import DeclareDetail from "./pages/declareDetail";
|
import DeclareDetail from "./pages/declareDetail";
|
||||||
import Employeedeclare from "./pages/employeedeclare";
|
import Employeedeclare from "./pages/employeedeclare";
|
||||||
import EnterprisePayCertificationDetail from "./pages/enterprisePayCertificationDetail";
|
import EnterprisePayCertificationDetail from "./pages/enterprisePayCertificationDetail";
|
||||||
|
import BankVoucherDetail from "./pages/bankVoucherDetail";
|
||||||
import EmployeedeclareDetail from "./pages/employeedeclareDetail";
|
import EmployeedeclareDetail from "./pages/employeedeclareDetail";
|
||||||
import TaxRate from "./pages/taxRate";
|
import TaxRate from "./pages/taxRate";
|
||||||
import TaxAgents from "./pages/taxAgent";
|
import TaxAgents from "./pages/taxAgent";
|
||||||
|
|
@ -163,6 +164,8 @@ const Routes = (
|
||||||
<Route key="employeedeclare" path="employeedeclare" component={Employeedeclare}/>
|
<Route key="employeedeclare" path="employeedeclare" component={Employeedeclare}/>
|
||||||
<Route key="enterprisePayCertificationDetail" path="enterprisePayCertificationDetail"
|
<Route key="enterprisePayCertificationDetail" path="enterprisePayCertificationDetail"
|
||||||
component={EnterprisePayCertificationDetail}/>
|
component={EnterprisePayCertificationDetail}/>
|
||||||
|
<Route key="bankVoucherDetail" path="bankVoucherDetail"
|
||||||
|
component={BankVoucherDetail}/>
|
||||||
<Route key="employeedeclareDetail" path="employeedeclareDetail" component={EmployeedeclareDetail}/>
|
<Route key="employeedeclareDetail" path="employeedeclareDetail" component={EmployeedeclareDetail}/>
|
||||||
<Route
|
<Route
|
||||||
key="generateDeclarationDetail"
|
key="generateDeclarationDetail"
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,494 @@
|
||||||
|
/*
|
||||||
|
* Author: 黎永顺
|
||||||
|
* name: 个税在线申报-银行端缴款凭证打印查看页面
|
||||||
|
* Description:
|
||||||
|
* Date: 2023/8/24
|
||||||
|
*/
|
||||||
|
import React, { Component } from "react";
|
||||||
|
import { Button, message, Spin } from "antd";
|
||||||
|
import { WeaLocaleProvider } from "ecCom";
|
||||||
|
import { printDom } from "../../util";
|
||||||
|
import { getQueryString } from "../../util/url";
|
||||||
|
import { taxPaymentVoucherPrintFeedback } from "../../apis/declare";
|
||||||
|
import "./index.less";
|
||||||
|
|
||||||
|
const { getLabel } = WeaLocaleProvider;
|
||||||
|
|
||||||
|
class Index extends Component {
|
||||||
|
constructor(props) {
|
||||||
|
super(props);
|
||||||
|
this.state = {
|
||||||
|
loading: false,
|
||||||
|
bankVoucherDetail: {}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
componentDidMount() {
|
||||||
|
this.taxPaymentVoucherPrintFeedback();
|
||||||
|
}
|
||||||
|
|
||||||
|
taxPaymentVoucherPrintFeedback = () => {
|
||||||
|
const payload = {
|
||||||
|
taxDeclareRecordId: getQueryString("taxDeclareRecordId"),
|
||||||
|
taxAgentId: getQueryString("taxAgentId"),
|
||||||
|
taxYearMonth: getQueryString("taxYearMonth"),
|
||||||
|
checkFeedback: 0
|
||||||
|
};
|
||||||
|
this.setState({ loading: true });
|
||||||
|
taxPaymentVoucherPrintFeedback(payload).then(({ status, data, errormsg }) => {
|
||||||
|
this.setState({ loading: false });
|
||||||
|
if (status) {
|
||||||
|
this.setState({ bankVoucherDetail: data });
|
||||||
|
} else {
|
||||||
|
message.error(errormsg || "");
|
||||||
|
}
|
||||||
|
}).catch(() => this.setState({ loading: false }));
|
||||||
|
};
|
||||||
|
print = () => {
|
||||||
|
printDom({
|
||||||
|
hideDomId: "header_print_btn"
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const { loading, bankVoucherDetail } = this.state;
|
||||||
|
if (loading) {
|
||||||
|
return <div className="loading-layout">
|
||||||
|
<Spin spinning={loading}/>
|
||||||
|
</div>;
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
<div className="printBankLayout">
|
||||||
|
<div className="print-bank-voucher-container">
|
||||||
|
<div id="header_print_btn">
|
||||||
|
<Button type="primary" onClick={this.print}>{getLabel(111, "打印")}</Button>
|
||||||
|
</div>
|
||||||
|
<div className="content">
|
||||||
|
<div id="bank_voucher_detail_area" style={{
|
||||||
|
display: "flex",
|
||||||
|
flexDirection: "column",
|
||||||
|
width: "1000px"
|
||||||
|
}}>
|
||||||
|
<div style={{
|
||||||
|
"height": " calc(36 * 1px)",
|
||||||
|
"fontSize": "calc(20 * 1px)",
|
||||||
|
"textAlign": "center",
|
||||||
|
"lineHeight": " calc(32 * 1px)",
|
||||||
|
"fontWeight": "900"
|
||||||
|
}}>{getLabel(111, "银行端查询缴税凭证")}</div>
|
||||||
|
<div style={{
|
||||||
|
height: "calc(28 * 1px)",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
justifyContent: "space-between"
|
||||||
|
}}>
|
||||||
|
<div style={{ display: "flex" }}>
|
||||||
|
<div className="label">{getLabel(111, "银行端查询缴税凭证号：")}</div>
|
||||||
|
<div className="value">{bankVoucherDetail.voucherNo || ""}</div>
|
||||||
|
</div>
|
||||||
|
<div className="time">{bankVoucherDetail.firstPrintDate}</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style={{
|
||||||
|
borderLeft: "calc(2 * 1px) solid #999",
|
||||||
|
borderRight: "calc(2 * 1px) solid #999"
|
||||||
|
}}>
|
||||||
|
<div style={{
|
||||||
|
width: "100%",
|
||||||
|
minHeight: "calc(50 * 1px)",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
flexGrow: "0",
|
||||||
|
flexShrink: "0",
|
||||||
|
borderTop: "calc(2 * 1px) solid #999"
|
||||||
|
}}>
|
||||||
|
<div style={{
|
||||||
|
width: "50%",
|
||||||
|
alignSelf: "stretch",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center"
|
||||||
|
}}>
|
||||||
|
<div className="label" style={{
|
||||||
|
height: "100%",
|
||||||
|
padding: "calc(16 * 1px)",
|
||||||
|
flexBasis: "40%",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
borderRight: "calc(2 * 1px) solid #999",
|
||||||
|
flexShrink: "0",
|
||||||
|
flexGrow: "0"
|
||||||
|
}}>{getLabel(111, "纳税人识别码")}</div>
|
||||||
|
<div className="value" style={{
|
||||||
|
flexBasis: "60%",
|
||||||
|
flexShrink: "0",
|
||||||
|
flexGrow: "0",
|
||||||
|
padding: "calc(16 * 1px)"
|
||||||
|
}}>{bankVoucherDetail.taxCode || ""}</div>
|
||||||
|
</div>
|
||||||
|
<div style={{
|
||||||
|
width: "50%",
|
||||||
|
alignSelf: "stretch",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center"
|
||||||
|
}}>
|
||||||
|
<div className="label" style={{
|
||||||
|
height: "100%",
|
||||||
|
padding: "calc(16 * 1px)",
|
||||||
|
borderLeft: "calc(2 * 1px) solid #999",
|
||||||
|
flexBasis: "40%",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
borderRight: "calc(2 * 1px) solid #999",
|
||||||
|
flexShrink: "0",
|
||||||
|
flexGrow: "0"
|
||||||
|
}}>{getLabel(111, "税务机关代码")}</div>
|
||||||
|
<div className="value" style={{
|
||||||
|
width: "50%",
|
||||||
|
alignSelf: "stretch",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
padding: "calc(16 * 1px)"
|
||||||
|
}}>{bankVoucherDetail.taxAuthoritiesNo || ""}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style={{
|
||||||
|
width: "100%",
|
||||||
|
minHeight: "calc(50 * 1px)",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
flexGrow: "0",
|
||||||
|
flexShrink: "0",
|
||||||
|
borderTop: "calc(2 * 1px) solid #999"
|
||||||
|
}}>
|
||||||
|
<div style={{
|
||||||
|
width: "50%",
|
||||||
|
alignSelf: "stretch",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center"
|
||||||
|
}}>
|
||||||
|
<div className="label" style={{
|
||||||
|
height: "100%",
|
||||||
|
padding: "calc(16 * 1px)",
|
||||||
|
flexBasis: "40%",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
borderRight: "calc(2 * 1px) solid #999",
|
||||||
|
flexShrink: "0",
|
||||||
|
flexGrow: "0"
|
||||||
|
}}>{getLabel(111, "纳税人名称")}</div>
|
||||||
|
<div className="value" style={{
|
||||||
|
flexBasis: "60%",
|
||||||
|
flexShrink: "0",
|
||||||
|
flexGrow: "0",
|
||||||
|
padding: "calc(16 * 1px)"
|
||||||
|
}}>{bankVoucherDetail.taxAgentName || ""}</div>
|
||||||
|
</div>
|
||||||
|
<div style={{
|
||||||
|
width: "50%",
|
||||||
|
alignSelf: "stretch",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center"
|
||||||
|
}}>
|
||||||
|
<div className="label" style={{
|
||||||
|
height: "100%",
|
||||||
|
padding: "calc(16 * 1px)",
|
||||||
|
borderLeft: "calc(2 * 1px) solid #999",
|
||||||
|
flexBasis: "40%",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
borderRight: "calc(2 * 1px) solid #999",
|
||||||
|
flexShrink: "0",
|
||||||
|
flexGrow: "0"
|
||||||
|
}}>{getLabel(111, "税务机关名称")}</div>
|
||||||
|
<div className="value" style={{
|
||||||
|
width: "50%",
|
||||||
|
alignSelf: "stretch",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
padding: "calc(16 * 1px)"
|
||||||
|
}}>{bankVoucherDetail.taxAuthoritiesName}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style={{
|
||||||
|
width: "100%",
|
||||||
|
minHeight: "calc(50 * 1px)",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
flexGrow: "0",
|
||||||
|
flexShrink: "0",
|
||||||
|
borderTop: "calc(2 * 1px) solid #999"
|
||||||
|
}}>
|
||||||
|
<div style={{
|
||||||
|
width: "50%",
|
||||||
|
alignSelf: "stretch",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center"
|
||||||
|
}}>
|
||||||
|
<div className="label" style={{
|
||||||
|
height: "100%",
|
||||||
|
padding: "calc(16 * 1px)",
|
||||||
|
flexBasis: "40%",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
borderRight: "calc(2 * 1px) solid #999",
|
||||||
|
flexShrink: "0",
|
||||||
|
flexGrow: "0"
|
||||||
|
}}>{getLabel(111, "付款人名称")}</div>
|
||||||
|
<div className="value" style={{
|
||||||
|
flexBasis: "60%",
|
||||||
|
flexShrink: "0",
|
||||||
|
flexGrow: "0",
|
||||||
|
padding: "calc(16 * 1px)"
|
||||||
|
}}>{}</div>
|
||||||
|
</div>
|
||||||
|
<div style={{
|
||||||
|
width: "50%",
|
||||||
|
alignSelf: "stretch",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center"
|
||||||
|
}}>
|
||||||
|
<div className="label" style={{
|
||||||
|
height: "100%",
|
||||||
|
padding: "calc(16 * 1px)",
|
||||||
|
borderLeft: "calc(2 * 1px) solid #999",
|
||||||
|
flexBasis: "40%",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
borderRight: "calc(2 * 1px) solid #999",
|
||||||
|
flexShrink: "0",
|
||||||
|
flexGrow: "0"
|
||||||
|
}}>{getLabel(111, "开户银行名称")}</div>
|
||||||
|
<div className="value" style={{
|
||||||
|
width: "50%",
|
||||||
|
alignSelf: "stretch",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
padding: "calc(16 * 1px)"
|
||||||
|
}}>{}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style={{
|
||||||
|
width: "100%",
|
||||||
|
minHeight: "calc(50 * 1px)",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
flexGrow: "0",
|
||||||
|
flexShrink: "0",
|
||||||
|
borderTop: "calc(2 * 1px) solid #999"
|
||||||
|
}}>
|
||||||
|
<div style={{
|
||||||
|
width: "50%",
|
||||||
|
alignSelf: "stretch",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center"
|
||||||
|
}}>
|
||||||
|
<div className="label" style={{
|
||||||
|
height: "100%",
|
||||||
|
padding: "calc(16 * 1px)",
|
||||||
|
flexBasis: "40%",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
borderRight: "calc(2 * 1px) solid #999",
|
||||||
|
flexShrink: "0",
|
||||||
|
flexGrow: "0"
|
||||||
|
}}>{getLabel(111, "付款人账号")}</div>
|
||||||
|
<div className="value" style={{
|
||||||
|
flexBasis: "60%",
|
||||||
|
flexShrink: "0",
|
||||||
|
flexGrow: "0",
|
||||||
|
padding: "calc(16 * 1px)"
|
||||||
|
}}>{}</div>
|
||||||
|
</div>
|
||||||
|
<div style={{
|
||||||
|
width: "50%",
|
||||||
|
alignSelf: "stretch",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center"
|
||||||
|
}}>
|
||||||
|
<div className="label" style={{
|
||||||
|
height: "100%",
|
||||||
|
padding: "calc(16 * 1px)",
|
||||||
|
borderLeft: "calc(2 * 1px) solid #999",
|
||||||
|
flexBasis: "40%",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
borderRight: "calc(2 * 1px) solid #999",
|
||||||
|
flexShrink: "0",
|
||||||
|
flexGrow: "0"
|
||||||
|
}}>{getLabel(111, "税款限缴日期")}</div>
|
||||||
|
<div className="value" style={{
|
||||||
|
width: "50%",
|
||||||
|
alignSelf: "stretch",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
padding: "calc(16 * 1px)"
|
||||||
|
}}>{bankVoucherDetail.deadline || ""}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="table" style={{
|
||||||
|
display: "flex",
|
||||||
|
flexDirection: "column",
|
||||||
|
borderBottom: "calc(2 * 1px) solid #999",
|
||||||
|
width: "100%"
|
||||||
|
}}>
|
||||||
|
<div className="thead" style={{
|
||||||
|
borderTop: "calc(2 * 1px) solid #999",
|
||||||
|
display: "flex",
|
||||||
|
width: "100%",
|
||||||
|
justifyContent: "space-between"
|
||||||
|
}}>
|
||||||
|
<div style={{
|
||||||
|
width: "calc(100%/ 3)",
|
||||||
|
padding: "calc(16 * 1px)",
|
||||||
|
minHeight: "calc(50 * 1px)",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
flexGrow: "0",
|
||||||
|
flexShrink: "0"
|
||||||
|
}}>{getLabel(111, "征收顶目名称")}</div>
|
||||||
|
<div style={{
|
||||||
|
width: "calc(100%/ 3)",
|
||||||
|
padding: "calc(16 * 1px)",
|
||||||
|
minHeight: "calc(50 * 1px)",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
borderLeft: "calc(2 * 1px) solid #999",
|
||||||
|
flexGrow: "0",
|
||||||
|
flexShrink: "0"
|
||||||
|
}}>{getLabel(111, "征收品目名称")}</div>
|
||||||
|
<div style={{
|
||||||
|
width: "calc(100%/ 3)",
|
||||||
|
padding: "calc(16 * 1px)",
|
||||||
|
minHeight: "calc(50 * 1px)",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
borderLeft: "calc(2 * 1px) solid #999",
|
||||||
|
flexGrow: "0",
|
||||||
|
flexShrink: "0"
|
||||||
|
}}>{getLabel(111, "应繳税额")}</div>
|
||||||
|
</div>
|
||||||
|
<div className="tbody" style={{
|
||||||
|
display: "flex",
|
||||||
|
flexDirection: "column",
|
||||||
|
width: "100%"
|
||||||
|
}}>
|
||||||
|
{
|
||||||
|
!_.isEmpty(bankVoucherDetail.details) ? bankVoucherDetail.details.map((row, index) => (
|
||||||
|
<div className="tr" key={index} style={{
|
||||||
|
display: "flex",
|
||||||
|
borderTop: " calc(2 * 1px) solid #999",
|
||||||
|
justifyContent: "space-between"
|
||||||
|
}}>
|
||||||
|
<div style={{
|
||||||
|
width: "calc(100%/ 3)",
|
||||||
|
padding: "calc(16 * 1px)",
|
||||||
|
minHeight: " calc(50 * 1px)",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
flexGrow: "0",
|
||||||
|
flexShrink: "0"
|
||||||
|
}}>{row.paymentCode}</div>
|
||||||
|
<div style={{
|
||||||
|
width: "calc(100%/ 3)",
|
||||||
|
padding: "calc(16 * 1px)",
|
||||||
|
minHeight: " calc(50 * 1px)",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
borderLeft: "calc(2 * 1px) solid #999",
|
||||||
|
flexGrow: "0",
|
||||||
|
flexShrink: "0"
|
||||||
|
}}>{row.paymentItem}</div>
|
||||||
|
<div style={{
|
||||||
|
width: "calc(100%/ 3)",
|
||||||
|
padding: "calc(16 * 1px)",
|
||||||
|
minHeight: " calc(50 * 1px)",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
borderLeft: "calc(2 * 1px) solid #999",
|
||||||
|
flexGrow: "0",
|
||||||
|
flexShrink: "0"
|
||||||
|
}}>{row.payAmount}</div>
|
||||||
|
</div>
|
||||||
|
)) : null
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div style={{
|
||||||
|
minHeight: "calc(50 * 1px)",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
padding: "calc(16 * 1px)",
|
||||||
|
borderBottom: "calc(2 * 1px) solid #999"
|
||||||
|
}}>{getLabel(111, "金额合计（小写）：")} {bankVoucherDetail.lowerFormatAmount}</div>
|
||||||
|
<div style={{
|
||||||
|
minHeight: "calc(50 * 1px)",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
padding: "calc(16 * 1px)",
|
||||||
|
borderBottom: "calc(2 * 1px) solid #999"
|
||||||
|
}}>{getLabel(111, "金额合计（大写）：")} {bankVoucherDetail.upperFormatAmount}</div>
|
||||||
|
|
||||||
|
<div className="signet" style={{
|
||||||
|
minHeight: "calc(140 * 1px)",
|
||||||
|
width: "100%",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
borderBottom: " calc(2 * 1px) solid #999",
|
||||||
|
justifyContent: "space-between"
|
||||||
|
}}>
|
||||||
|
<div className="item one" style={{
|
||||||
|
alignSelf: "stretch",
|
||||||
|
width: "calc(100%/ 3)",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "flex-start",
|
||||||
|
justifyContent: "center",
|
||||||
|
flexDirection: "column",
|
||||||
|
padding: "calc(16 * 1px)"
|
||||||
|
|
||||||
|
}}>
|
||||||
|
<div className="drawee" style={{
|
||||||
|
marginBottom: "calc(16 * 1px)"
|
||||||
|
}}>{getLabel(111, "付款人 （签章）")}</div>
|
||||||
|
<div className="operator">{getLabel(111, "经办人 （签章）")}</div>
|
||||||
|
</div>
|
||||||
|
<div style={{
|
||||||
|
alignSelf: "stretch",
|
||||||
|
borderLeft: "calc(2 * 1px) solid #999",
|
||||||
|
width: "calc(100%/ 3)",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "flex-start",
|
||||||
|
justifyContent: "center",
|
||||||
|
flexDirection: "column",
|
||||||
|
padding: "calc(16 * 1px)"
|
||||||
|
}}>
|
||||||
|
<div>{getLabel(111, "银行记账员")}</div>
|
||||||
|
<div> {getLabel(111, "（签章）")}</div>
|
||||||
|
</div>
|
||||||
|
<div style={{
|
||||||
|
alignSelf: "stretch",
|
||||||
|
borderLeft: "calc(2 * 1px) solid #999",
|
||||||
|
width: "calc(100%/ 3)",
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "flex-start",
|
||||||
|
justifyContent: "center",
|
||||||
|
flexDirection: "column",
|
||||||
|
padding: "calc(16 * 1px)"
|
||||||
|
}}>
|
||||||
|
<div>{getLabel(111, "备注：")}</div>
|
||||||
|
<div> {bankVoucherDetail.remark}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Index;
|
||||||
|
|
@ -0,0 +1,30 @@
|
||||||
|
.loading-layout {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.printBankLayout {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
overflow-y: auto;
|
||||||
|
|
||||||
|
.print-bank-voucher-container {
|
||||||
|
font-size: 14px;
|
||||||
|
|
||||||
|
#header_print_btn {
|
||||||
|
display: flex;
|
||||||
|
padding: calc(16 * 1px) calc(32 * 1px) 0;
|
||||||
|
justify-content: flex-end;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
padding: calc(32 * 1px) 0 calc(16 * 1px);
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -12,7 +12,7 @@ import {
|
||||||
taxdeclarationEmployeeList4NotDeclare,
|
taxdeclarationEmployeeList4NotDeclare,
|
||||||
taxdeclarationEmployeeList4NoValue
|
taxdeclarationEmployeeList4NoValue
|
||||||
} from "../../../apis/declare";
|
} from "../../../apis/declare";
|
||||||
import { getQueryString } from "../../../util/url";
|
import { convertToUrlString, getQueryString } from "../../../util/url";
|
||||||
|
|
||||||
const { getLabel } = WeaLocaleProvider;
|
const { getLabel } = WeaLocaleProvider;
|
||||||
const APIFox = {
|
const APIFox = {
|
||||||
|
|
@ -59,6 +59,25 @@ class DeclareResultDialog extends Component {
|
||||||
}
|
}
|
||||||
}).catch(() => this.setState({ loading: false }));
|
}).catch(() => this.setState({ loading: false }));
|
||||||
};
|
};
|
||||||
|
errorExport = () => {
|
||||||
|
let exportUrl = "";
|
||||||
|
const { selectedKey, keyword } = this.state;
|
||||||
|
const payload = {
|
||||||
|
taxDeclareRecordId: getQueryString("id"), keyword
|
||||||
|
};
|
||||||
|
if (selectedKey === "list4NotDeclare") {
|
||||||
|
exportUrl = "/api/bs/hrmsalary/taxdeclaration/employee/export4NotDeclare";
|
||||||
|
} else if (selectedKey === "list4NoValue") {
|
||||||
|
exportUrl = "/api/bs/hrmsalary/taxdeclaration/employee/export4NoValue";
|
||||||
|
}
|
||||||
|
window.open(`${window.ecologyContentPath || ""}${exportUrl}?${convertToUrlString(payload)}`, "_blank");
|
||||||
|
};
|
||||||
|
failExport = () => {
|
||||||
|
const payload = {
|
||||||
|
taxDeclareRecordId: getQueryString("id")
|
||||||
|
};
|
||||||
|
window.open(`${window.ecologyContentPath || ""}/api/bs/hrmsalary/taxdeclaration/employee/export4Fail?${convertToUrlString(payload)}`, "_blank");
|
||||||
|
};
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { type } = this.props;
|
const { type } = this.props;
|
||||||
|
|
@ -91,13 +110,13 @@ class DeclareResultDialog extends Component {
|
||||||
<span className="title">{this.props.title}</span>
|
<span className="title">{this.props.title}</span>
|
||||||
</Col>
|
</Col>
|
||||||
<Col span={12} className="declareResultDialogTitle-right">
|
<Col span={12} className="declareResultDialogTitle-right">
|
||||||
<Button type="primary">{getLabel(17416, "导出")}</Button>
|
<Button type="primary" onClick={this.failExport}>{getLabel(17416, "导出")}</Button>
|
||||||
</Col>
|
</Col>
|
||||||
</Row>) :
|
</Row>) :
|
||||||
<WeaReqTop
|
<WeaReqTop
|
||||||
title={this.props.title} buttonSpace={10} tabDatas={type} selectedKey={selectedKey}
|
title={this.props.title} buttonSpace={10} tabDatas={type} selectedKey={selectedKey}
|
||||||
buttons={[
|
buttons={[
|
||||||
<Button type="primary">{getLabel(17416, "导出")}</Button>
|
<Button type="primary" onClick={this.errorExport}>{getLabel(17416, "导出")}</Button>
|
||||||
]}
|
]}
|
||||||
onChange={key => this.setState({ selectedKey: key }, () => this.queryList())}
|
onChange={key => this.setState({ selectedKey: key }, () => this.queryList())}
|
||||||
/>
|
/>
|
||||||
|
|
|
||||||
|
|
@ -13,7 +13,9 @@ import {
|
||||||
taxPaymentAgreemenPay,
|
taxPaymentAgreemenPay,
|
||||||
taxPaymentgetAgreement,
|
taxPaymentgetAgreement,
|
||||||
taxPaymentgetAgreementFeedback,
|
taxPaymentgetAgreementFeedback,
|
||||||
taxPaymentTaxAmount
|
taxPaymentTaxAmount,
|
||||||
|
taxPaymentVoucherCancel,
|
||||||
|
taxPaymentVoucherPrint
|
||||||
} from "../../../apis/declare";
|
} from "../../../apis/declare";
|
||||||
import { getQueryString } from "../../../util/url";
|
import { getQueryString } from "../../../util/url";
|
||||||
import { paymentBankConditions, paymentTripartiteConditions } from "./constants";
|
import { paymentBankConditions, paymentTripartiteConditions } from "./constants";
|
||||||
|
|
@ -221,6 +223,99 @@ class PaymentBtn extends Component {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
handleMenuChange = ({ key }) => {
|
||||||
|
if (key === "bank_voucher_payment") {
|
||||||
|
taxPaymentTaxAmount({ taxDeclareRecordId: getQueryString("id") })
|
||||||
|
.then(({ status, data, errormsg }) => {
|
||||||
|
if (status) {
|
||||||
|
const { paymentDialog } = this.state;
|
||||||
|
this.setState({
|
||||||
|
paymentDialog: {
|
||||||
|
...paymentDialog, visible: true, title: getLabel(111, "应缴纳"),
|
||||||
|
buttons: [
|
||||||
|
<Button type="primary" onClick={this.taxPaymentVoucherPrint}>{getLabel(111, "确认缴款")}</Button>
|
||||||
|
],
|
||||||
|
conditions: _.map(paymentTripartiteConditions, item => {
|
||||||
|
return {
|
||||||
|
...item,
|
||||||
|
items: _.map(item.items, it => {
|
||||||
|
const key = it["domkey"][0];
|
||||||
|
return {
|
||||||
|
...it,
|
||||||
|
value: data[key]
|
||||||
|
};
|
||||||
|
})
|
||||||
|
};
|
||||||
|
})
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
message.error(errormsg);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} else if (key === "destory_voucher") {
|
||||||
|
Modal.confirm({
|
||||||
|
title: getLabel(131329, "信息确认"),
|
||||||
|
content: getLabel(111, "确定作废缴款凭证吗？作废后可重新获取。"),
|
||||||
|
onOk: () => {
|
||||||
|
const { taxAgentId, taxCycle: taxYearMonth } = this.props.declareInfo;
|
||||||
|
const payload = {
|
||||||
|
taxDeclareRecordId: getQueryString("id"),
|
||||||
|
taxAgentId, taxYearMonth
|
||||||
|
};
|
||||||
|
taxPaymentVoucherCancel(payload).then(({ status, errormsg }) => {
|
||||||
|
if (status) {
|
||||||
|
message.success(getLabel(111, "作废缴款凭证成功！"));
|
||||||
|
} else {
|
||||||
|
message.error(errormsg || getLabel(111, "作废失败！"));
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
taxPaymentVoucherPrint = () => {
|
||||||
|
const { taxCycle: taxYearMonth, taxAgentId } = this.props.declareInfo;
|
||||||
|
const payload = {
|
||||||
|
taxDeclareRecordId: getQueryString("id"),
|
||||||
|
taxAgentId, taxYearMonth
|
||||||
|
};
|
||||||
|
this.setState({
|
||||||
|
paymentDialog: {
|
||||||
|
...this.state.paymentDialog,
|
||||||
|
buttons: [
|
||||||
|
<Button type="primary" loading={true}>{getLabel(111, "确认缴款")}</Button>
|
||||||
|
]
|
||||||
|
}
|
||||||
|
});
|
||||||
|
taxPaymentVoucherPrint(payload).then(({ status, errormsg }) => {
|
||||||
|
if (status) {
|
||||||
|
message.success(getLabel(111, "处理中，请稍后点击缴款反馈！"));
|
||||||
|
this.handleCancel();
|
||||||
|
} else {
|
||||||
|
this.setState({
|
||||||
|
paymentDialog: {
|
||||||
|
...this.state.paymentDialog,
|
||||||
|
buttons: [
|
||||||
|
<Button type="primary" onClick={() => this.taxPaymentVoucherPrint()}
|
||||||
|
loading={false}>{getLabel(111, "确认缴款")}</Button>
|
||||||
|
]
|
||||||
|
}
|
||||||
|
});
|
||||||
|
message.error(errormsg || getLabel(111, "缴款反馈失败！"));
|
||||||
|
}
|
||||||
|
}).catch(() => {
|
||||||
|
this.setState({
|
||||||
|
paymentDialog: {
|
||||||
|
...this.state.paymentDialog,
|
||||||
|
buttons: [
|
||||||
|
<Button type="primary" onClick={() => this.taxPaymentVoucherPrint()}
|
||||||
|
loading={false}>{getLabel(111, "确认缴款")}</Button>
|
||||||
|
]
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
};
|
||||||
handleCancel = () => {
|
handleCancel = () => {
|
||||||
const { paymentDialog } = this.state;
|
const { paymentDialog } = this.state;
|
||||||
this.setState({
|
this.setState({
|
||||||
|
|
@ -238,7 +333,7 @@ class PaymentBtn extends Component {
|
||||||
<Dropdown.Button
|
<Dropdown.Button
|
||||||
onClick={this.handleTripartiteContributions}
|
onClick={this.handleTripartiteContributions}
|
||||||
overlay={
|
overlay={
|
||||||
<Menu>
|
<Menu onClick={this.handleMenuChange}>
|
||||||
<Menu.Item key="bank_voucher_payment">{getLabel(111, "银行端凭证缴款")}</Menu.Item>
|
<Menu.Item key="bank_voucher_payment">{getLabel(111, "银行端凭证缴款")}</Menu.Item>
|
||||||
<Menu.Item key="destory_voucher">{getLabel(111, "作废缴款凭证")}</Menu.Item>
|
<Menu.Item key="destory_voucher">{getLabel(111, "作废缴款凭证")}</Menu.Item>
|
||||||
</Menu>
|
</Menu>
|
||||||
|
|
|
||||||
|
|
@ -11,8 +11,8 @@ import { inject, observer } from "mobx-react";
|
||||||
import PaymentDialog from "./paymentDialog";
|
import PaymentDialog from "./paymentDialog";
|
||||||
import PaymentFeedBackDetail from "./paymentFeedBackDetail";
|
import PaymentFeedBackDetail from "./paymentFeedBackDetail";
|
||||||
import { paymentFeedbackConditions } from "./constants";
|
import { paymentFeedbackConditions } from "./constants";
|
||||||
import { getQueryString } from "../../../util/url";
|
import { convertToUrlString, getQueryString } from "../../../util/url";
|
||||||
import { taxPaymentAgreementPayFeedback } from "../../../apis/declare";
|
import { taxPaymentAgreementPayFeedback, taxPaymentVoucherPrintFeedback } from "../../../apis/declare";
|
||||||
|
|
||||||
const { getLabel } = WeaLocaleProvider;
|
const { getLabel } = WeaLocaleProvider;
|
||||||
|
|
||||||
|
|
@ -42,6 +42,7 @@ class PaymentFeedbackBtn extends Component {
|
||||||
// 三方缴款 弹窗，打印新开页面
|
// 三方缴款 弹窗，打印新开页面
|
||||||
this.taxPaymentAgreementPayFeedback();
|
this.taxPaymentAgreementPayFeedback();
|
||||||
} else {
|
} else {
|
||||||
|
this.taxPaymentVoucherPrintFeedback();
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
f.showErrors();
|
f.showErrors();
|
||||||
|
|
@ -94,6 +95,46 @@ class PaymentFeedbackBtn extends Component {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
taxPaymentVoucherPrintFeedback = () => {
|
||||||
|
const { taxCycle: taxYearMonth, taxAgentId } = this.props.declareInfo;
|
||||||
|
const payload = {
|
||||||
|
taxDeclareRecordId: getQueryString("id"),
|
||||||
|
taxAgentId, taxYearMonth, checkFeedback: 1
|
||||||
|
};
|
||||||
|
this.setState({
|
||||||
|
paymentDialog: {
|
||||||
|
...this.state.paymentDialog,
|
||||||
|
buttons: [
|
||||||
|
<Button type="primary" loading={true}>{getLabel(111, "获取反馈")}</Button>
|
||||||
|
]
|
||||||
|
}
|
||||||
|
});
|
||||||
|
taxPaymentVoucherPrintFeedback(payload).then(({ status, data, errormsg }) => {
|
||||||
|
this.setState({
|
||||||
|
paymentDialog: {
|
||||||
|
...this.state.paymentDialog,
|
||||||
|
buttons: [
|
||||||
|
<Button type="primary" loading={false} onClick={this.getFeedback}>{getLabel(111, "获取反馈")}</Button>
|
||||||
|
]
|
||||||
|
}
|
||||||
|
});
|
||||||
|
if (status) {
|
||||||
|
this.handleCancel();
|
||||||
|
window.open(`${window.ecologyContentPath || ""}/spa/hrmSalary/static/index.html#/main/hrmSalary/bankVoucherDetail?${convertToUrlString(payload)}`);
|
||||||
|
} else {
|
||||||
|
message.error(errormsg || getLabel(111, "缴款反馈失败！"));
|
||||||
|
}
|
||||||
|
}).catch(() => {
|
||||||
|
this.setState({
|
||||||
|
paymentDialog: {
|
||||||
|
...this.state.paymentDialog,
|
||||||
|
buttons: [
|
||||||
|
<Button type="primary" loading={false} onClick={this.getFeedback}>{getLabel(111, "获取反馈")}</Button>
|
||||||
|
]
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
};
|
||||||
handlePaymentFeedback = () => {
|
handlePaymentFeedback = () => {
|
||||||
const { paymentDialog } = this.state;
|
const { paymentDialog } = this.state;
|
||||||
this.setState({
|
this.setState({
|
||||||
|
|
|
||||||
|
|
@ -212,20 +212,23 @@ class Index extends Component {
|
||||||
}
|
}
|
||||||
}).catch(() => this.setState({ loading: { ...this.state.loading, issuance: false } }));
|
}).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() {
|
render() {
|
||||||
const {
|
const {
|
||||||
tabs,
|
tabs, selectedKey, columns, pageInfo,
|
||||||
selectedKey,
|
dataSource, loading, declareInfo, intelCalcSalaryStatus
|
||||||
columns,
|
|
||||||
pageInfo,
|
|
||||||
dataSource,
|
|
||||||
loading,
|
|
||||||
declareInfo,
|
|
||||||
intelCalcSalaryStatus
|
|
||||||
} = this.state;
|
} = this.state;
|
||||||
let btns = [
|
let btns = [
|
||||||
<Button type="primary">{getLabel(17416, "导出")}</Button>,
|
<Button type="primary" onClick={this.export}>{getLabel(17416, "导出")}</Button>,
|
||||||
<Button type="ghost" onClick={() => this.handleOperateDeclare("declare")}
|
<Button type="ghost" onClick={() => this.handleOperateDeclare("declare")}
|
||||||
loading={loading.declare}>{getLabel(111, "在线申报")}</Button>,
|
loading={loading.declare}>{getLabel(111, "在线申报")}</Button>,
|
||||||
<Button type="ghost" onClick={() => this.handleOperateDeclare("refresh")}
|
<Button type="ghost" onClick={() => this.handleOperateDeclare("refresh")}
|
||||||
|
|
@ -289,8 +292,10 @@ class Index extends Component {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
if (intelCalcSalaryStatus && (declareInfo.declareStatus === "DECLARE_SUCCESS_UNPAID")) {
|
if (intelCalcSalaryStatus && (declareInfo.declareStatus === "DECLARE_SUCCESS_UNPAID")) {
|
||||||
btns.push(<PaymentBtn declareInfo={declareInfo}/>, <PaymentFeedbackBtn declareInfo={declareInfo}
|
btns.push(
|
||||||
updateDeclare={this.declare}/>);
|
<PaymentBtn declareInfo={declareInfo} updateDeclare={this.declare}/>,
|
||||||
|
<PaymentFeedbackBtn declareInfo={declareInfo} updateDeclare={this.declare}/>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
if (intelCalcSalaryStatus && declareInfo.taxPaidAmount && parseFloat(declareInfo.taxPaidAmount) > 0) {
|
if (intelCalcSalaryStatus && declareInfo.taxPaidAmount && parseFloat(declareInfo.taxPaidAmount) > 0) {
|
||||||
btns.push(<Button type="ghost" loading={loading.issuance}
|
btns.push(<Button type="ghost" loading={loading.issuance}
|
||||||
|
|
|
||||||
|
|
@ -5,15 +5,20 @@
|
||||||
* Date: 2023/8/23
|
* Date: 2023/8/23
|
||||||
*/
|
*/
|
||||||
import React, { Component } from "react";
|
import React, { Component } from "react";
|
||||||
import { message } from "antd";
|
import { Icon, Menu, message, Spin } from "antd";
|
||||||
|
import { WeaLocaleProvider } from "ecCom";
|
||||||
import { getQueryString } from "../../util/url";
|
import { getQueryString } from "../../util/url";
|
||||||
import { taxPaymentWithheldVoucherGet } from "../../apis/declare";
|
import { taxPaymentWithheldVoucherGet } from "../../apis/declare";
|
||||||
|
import "./index.less";
|
||||||
|
|
||||||
|
const { getLabel } = WeaLocaleProvider;
|
||||||
|
|
||||||
class Index extends Component {
|
class Index extends Component {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
this.state = {
|
this.state = {
|
||||||
loading: false,
|
loading: false, current: "",
|
||||||
|
enterprisePayCertifiTipMsg: "",
|
||||||
dataSource: []
|
dataSource: []
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
@ -33,7 +38,9 @@ class Index extends Component {
|
||||||
this.setState({ loading: false });
|
this.setState({ loading: false });
|
||||||
if (status && !_.isEmpty(data.vouchers)) {
|
if (status && !_.isEmpty(data.vouchers)) {
|
||||||
this.setState({
|
this.setState({
|
||||||
dataSource: data.vouchers
|
dataSource: data.vouchers,
|
||||||
|
enterprisePayCertifiTipMsg: data.msg || "",
|
||||||
|
current: _.head(data.vouchers).name
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
message.error(errormsg || "");
|
message.error(errormsg || "");
|
||||||
|
|
@ -42,14 +49,35 @@ class Index extends Component {
|
||||||
};
|
};
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { dataSource, loading } = this.state;
|
const { dataSource, loading, enterprisePayCertifiTipMsg, current } = this.state;
|
||||||
return (
|
if (loading) {
|
||||||
<div style={{ width: "100%", height: "100%" }}>
|
return <div className="loading-layout">
|
||||||
{
|
<Spin spinning={loading} tip={getLabel(111, "获取企业完税证明中...")}/>
|
||||||
!_.isEmpty(dataSource) &&
|
</div>;
|
||||||
<iframe src={`data:application/pdf;base64,${dataSource[0].content}`}
|
|
||||||
style={{ border: 0, width: "100%", height: "100%" }}/>
|
|
||||||
}
|
}
|
||||||
|
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>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,54 @@
|
||||||
|
.loading-layout {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pay-certification-detail {
|
||||||
|
display: flex;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
|
||||||
|
.left {
|
||||||
|
width: 220px;
|
||||||
|
flex-grow: 0;
|
||||||
|
flex-shrink: 0;
|
||||||
|
height: 100vh;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right {
|
||||||
|
width: calc(100vw - 220px);
|
||||||
|
height: 100vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.empty {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
p {
|
||||||
|
line-height: 36px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.empty-title {
|
||||||
|
color: #111;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.empty-subTitle {
|
||||||
|
color: #666;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.iconEmpty {
|
||||||
|
i {
|
||||||
|
color: #5d9cec;
|
||||||
|
font-size: 43px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -107,3 +107,18 @@ export const format_with_regex = (number) => {
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 打印指定dom内容
|
||||||
|
* @param printParams
|
||||||
|
*/
|
||||||
|
export const printDom = (printParams) => {
|
||||||
|
const { hideDomId } = printParams;
|
||||||
|
let hideDom = document.getElementById(hideDomId);
|
||||||
|
if (hideDom) {
|
||||||
|
hideDom.style.display = "none";
|
||||||
|
}
|
||||||
|
window.print();
|
||||||
|
if (hideDom) {
|
||||||
|
hideDom.style.display = "";
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue