320 lines
13 KiB
JavaScript
320 lines
13 KiB
JavaScript
/*
|
|
* 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 } }));
|
|
};
|
|
|
|
render() {
|
|
const {
|
|
tabs,
|
|
selectedKey,
|
|
columns,
|
|
pageInfo,
|
|
dataSource,
|
|
loading,
|
|
declareInfo,
|
|
intelCalcSalaryStatus
|
|
} = this.state;
|
|
let btns = [
|
|
<Button type="primary">{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}/>, <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}
|
|
/>
|
|
<WeaTable
|
|
loading={loading.query} bordered
|
|
columns={columns} dataSource={dataSource}
|
|
pagination={pagination}
|
|
scroll={{ x: 1200, y: `calc(100vh - 190px)` }}
|
|
/>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default Index;
|