feature/2.9.42310.02-社保福利档案页面重构
This commit is contained in:
parent
b2dda3a728
commit
121d82d379
|
|
@ -5,8 +5,8 @@
|
|||
* Date: 2023/10/31
|
||||
*/
|
||||
import React, { Component } from "react";
|
||||
import { WeaLocaleProvider, WeaTable } from "ecCom";
|
||||
import {Table} from "antd"
|
||||
import { WeaLocaleProvider } from "ecCom";
|
||||
import { Spin } from "antd";
|
||||
import { inject, observer } from "mobx-react";
|
||||
import { getExtTable, queryList } from "../../../../../apis/welfareArchive";
|
||||
|
||||
|
|
@ -22,19 +22,43 @@ class Index extends Component {
|
|||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
dataSource: [], columns: [], loading: false, pageInfo: { current: 0, pageSize: 10, total: 0 },
|
||||
dataSource: [], columns: [], loading: false, pageInfo: { current: 1, pageSize: 10, total: 0 },
|
||||
selectedRowKeys: []
|
||||
};
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.getWelfareList(this.props);
|
||||
window.addEventListener("message", this.handleReceive, false);
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
window.removeEventListener("message", this.handleReceive, false);
|
||||
}
|
||||
|
||||
componentWillReceiveProps(nextProps, nextContext) {
|
||||
if ((nextProps.runStatuses !== this.props.runStatuses) || (nextProps.isQuery !== this.props.isQuery)) this.getWelfareList(nextProps);
|
||||
if ((nextProps.runStatuses !== this.props.runStatuses) || (nextProps.isQuery !== this.props.isQuery)) {
|
||||
this.setState({
|
||||
pageInfo: { ...this.state.pageInfo, current: 1, pageSize: 10, total: 0 }
|
||||
}, () => this.getWelfareList(nextProps));
|
||||
}
|
||||
}
|
||||
|
||||
handleReceive = async ({ data }) => {
|
||||
const { type, payload: { id, params } = {} } = data;
|
||||
if (type === "init") {
|
||||
this.getWelfareList(this.props);
|
||||
} else if (type === "turn") {
|
||||
switch (id) {
|
||||
case "PAGEINFO":
|
||||
this.setState({
|
||||
pageInfo: { ...this.state.pageInfo, ...params }
|
||||
}, () => this.getWelfareList(this.props));
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
};
|
||||
getWelfareList = (props) => {
|
||||
const { pageInfo } = this.state;
|
||||
const { archivesStore: { welfareForm }, runStatuses, onChangeTopTabCount } = props;
|
||||
|
|
@ -54,52 +78,46 @@ class Index extends Component {
|
|||
const { column: dataIndex, text: title, width } = o;
|
||||
if (dataIndex === "employeeName") {
|
||||
return {
|
||||
dataIndex, title, width, fixed: "left",
|
||||
render: (txt) => (<span title={txt}>{txt}</span>)
|
||||
dataIndex, title, width, fixed: "left", ellipsis: true
|
||||
};
|
||||
}
|
||||
return {
|
||||
dataIndex, title, width,
|
||||
render: (txt) => (<span title={txt}>{txt}</span>)
|
||||
dataIndex, title, width, ellipsis: true
|
||||
};
|
||||
})
|
||||
}, () => onChangeTopTabCount(runStatuses, total));
|
||||
}, () => {
|
||||
const { pageInfo, selectedRowKeys, columns, dataSource } = this.state;
|
||||
onChangeTopTabCount(runStatuses, total);
|
||||
this.postMessageToChild({
|
||||
dataSource, pageInfo, selectedRowKeys, runStatuses,
|
||||
columns
|
||||
});
|
||||
});
|
||||
}
|
||||
}).catch(() => this.setState({ loading: false }));
|
||||
};
|
||||
postMessageToChild = (payload = {}) => {
|
||||
const i18n = {
|
||||
"操作": getLabel(30585, "操作"),
|
||||
"共": getLabel(18609, "共"), "条": getLabel(18256, "条")
|
||||
};
|
||||
const childFrameObj = document.getElementById("atdTable");
|
||||
childFrameObj.contentWindow.postMessage(JSON.stringify({ ...payload, i18n }), "*");
|
||||
};
|
||||
|
||||
render() {
|
||||
const { dataSource, columns, loading, pageInfo, selectedRowKeys } = this.state;
|
||||
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.getWelfareList(this.props));
|
||||
},
|
||||
onChange: current => {
|
||||
this.setState({
|
||||
pageInfo: { ...pageInfo, current }
|
||||
}, () => this.getWelfareList(this.props));
|
||||
}
|
||||
};
|
||||
const rowSelection = {
|
||||
selectedRowKeys,
|
||||
onChange: (selectedRowKeys) => this.setState({ selectedRowKeys })
|
||||
};
|
||||
const { loading, dataSource } = this.state;
|
||||
return (
|
||||
<Table
|
||||
dataSource={dataSource} pagination={pagination} loading={loading}
|
||||
scroll={{ x: 1200, y: `calc(100vh - 220px)` }}
|
||||
columns={[...columns, {
|
||||
dataIndex: "operate", title: "操作", fixed: "right", width: 175,
|
||||
render: () => (<span>123</span>)
|
||||
}]}
|
||||
/>
|
||||
<div className="table-layout" style={{ height: dataSource.length * 38 + "px" }}>
|
||||
<Spin spinning={loading}>
|
||||
<iframe
|
||||
style={{ border: 0, width: "100%", height: "100%" }}
|
||||
src="http://localhost:7607/#/welfareArchiveTable"
|
||||
// src="/spa/hrmSalary/hrmSalaryCalculateDetail/index.html#/welfareArchiveTable"
|
||||
id="atdTable"
|
||||
/>
|
||||
</Spin>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,9 +11,15 @@ const getLabel = WeaLocaleProvider.getLabel;
|
|||
|
||||
class Index extends Component {
|
||||
render() {
|
||||
const { dataSource } = this.props;
|
||||
return (
|
||||
<div>
|
||||
|
||||
<div className="tip-info-area">
|
||||
<div className="title">{getLabel(543177, "小提示")}</div>
|
||||
<div className="tip-detail">
|
||||
{
|
||||
_.map(dataSource, item => (<div className="tip-item">{getLabel(item.lanId, item.title)}</div>))
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,3 +5,81 @@ export const tabList = [
|
|||
{ viewcondition: "4,5", lanId: 542505, title: "停缴员工", showcount: true, groupid: "stopPay" },
|
||||
{ viewcondition: "ext", lanId: 542679, title: "非系统人员", showcount: true, groupid: "ext" }
|
||||
];
|
||||
export const welfareTipList = [
|
||||
{
|
||||
viewcondition: "1",
|
||||
list: [
|
||||
{
|
||||
lanId: 544349,
|
||||
title: "1、个税扣缴义务人变更进入【待增员】的，保留所有最新版本数据；若修改了数据再增员则修改的数据作为新版本保存；"
|
||||
},
|
||||
{
|
||||
lanId: 544350,
|
||||
title: "2、维护好员工的社保福利档案数据后，点击【增员】，数据会进入【在缴员工】；"
|
||||
},
|
||||
{
|
||||
lanId: 544351,
|
||||
title: "3、若不需给该员工缴纳，可点击【删除待办】进入【停缴员工】；进入【停缴员工】后，可以点击【取消停缴】再次进入【待增员】；"
|
||||
},
|
||||
{
|
||||
lanId: 544352,
|
||||
title: "4、不管起始缴纳月维护到哪个月，都可以进行增员，不影响核算判断；若维护了最后缴纳月，且小于等于当前月，则增员失败；"
|
||||
},
|
||||
{
|
||||
lanId: 544353,
|
||||
title: "5、增员失败情况：①终止缴纳月小于等于当前月；②方案或起始缴纳月未维护；"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
viewcondition: "2,3",
|
||||
list: [
|
||||
{
|
||||
lanId: 544358,
|
||||
title: "1、需缴纳社保福利的员工维护在【在缴员工】；"
|
||||
},
|
||||
{
|
||||
lanId: 544359,
|
||||
title: "2、可使用更新导入，调整档案数据；"
|
||||
},
|
||||
{
|
||||
lanId: 544360,
|
||||
title: "3、若维护了最后缴纳月且小于等于当前月，则自动进入【待减员】；"
|
||||
},
|
||||
{
|
||||
lanId: 544361,
|
||||
title: "4、核算人员范围为，【在缴员工】中的起始缴纳月和最后缴纳月区间包含当前月的人员；"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
viewcondition: "3",
|
||||
list: [
|
||||
{
|
||||
lanId: 544355,
|
||||
title: "1、数据进入【待减员】规则：①员工的人事状态属性从在职变成非在职，且在【在缴员工】里；②【在缴员工】里档案维护了缴纳终止月且小于等于当前月；③个税扣缴义务人发生调整；"
|
||||
},
|
||||
{
|
||||
lanId: 544356,
|
||||
title: "2、【待减员】为是否不再缴纳的待办状态，数据是从【在缴员工】中复制的，若不处理列表中的待办数据，也不影响社保福利核算；【待减员】维护的数据和【在缴员工】数据是同步的；"
|
||||
},
|
||||
{
|
||||
lanId: 544357,
|
||||
title: "3、点击【减员】前先维护最后缴纳月，所有有起始缴纳月的福利项的最后缴纳月都小于等于当前月且无未归档的核算数据的档案才能减员成功，减员成功后数据进入【停缴员工】；"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
viewcondition: "4,5",
|
||||
list: [
|
||||
{
|
||||
lanId: 544354,
|
||||
title: "1、不需要缴纳社保福利的员工，保存在【停缴员工】；"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
viewcondition: "ext",
|
||||
list: []
|
||||
}
|
||||
];
|
||||
|
|
|
|||
|
|
@ -10,10 +10,11 @@ import { inject, observer } from "mobx-react";
|
|||
import AdvanceInputBtn from "./components/advanceInputBtn";
|
||||
import WelfareAdvanceSearchPannel from "./components/welfareAdvanceSearchPannel";
|
||||
import WelfareTableList from "./components/welfareTableList";
|
||||
import WelfareTip from "./components/welfareTip";
|
||||
import { queryInsuranceTabTotal } from "../../../apis/welfareArchive";
|
||||
import { tabList, welfareTipList } from "./config";
|
||||
import { Button } from "antd";
|
||||
import cs from "classnames";
|
||||
import { tabList } from "./config";
|
||||
import "./index.less";
|
||||
|
||||
const getLabel = WeaLocaleProvider.getLabel;
|
||||
|
|
@ -68,6 +69,7 @@ class Index extends Component {
|
|||
render() {
|
||||
const { selectedKey, topTabCount, showSearchAd, isQuery } = this.state;
|
||||
const { taxAgentStore: { showOperateBtn } } = this.props;
|
||||
const tipList = _.find(welfareTipList, o => o.viewcondition === selectedKey).list;
|
||||
return (
|
||||
<div className="salary-welfare-archive">
|
||||
<WeaReqTop
|
||||
|
|
@ -94,6 +96,8 @@ class Index extends Component {
|
|||
runStatuses={selectedKey}
|
||||
onChangeTopTabCount={this.queryInsuranceTabTotal}
|
||||
/>
|
||||
{/*提示*/}
|
||||
{!_.isEmpty(tipList) && <WelfareTip dataSource={tipList}/>}
|
||||
</div>
|
||||
</WeaReqTop>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -15,18 +15,14 @@
|
|||
|
||||
.salary-welfare-archive-content {
|
||||
padding: 8px 16px;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.wea-new-table {
|
||||
background: #ffffff;
|
||||
.table-layout {
|
||||
min-height: 220px;
|
||||
|
||||
.ant-table-tbody {
|
||||
td {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.ant-spin-nested-loading, .ant-spin-container {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -74,4 +70,29 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tip-info-area {
|
||||
margin-top: 16px;
|
||||
width: 100%;
|
||||
border: 1px solid #e5e5e5;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
|
||||
.title {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
padding: 0 16px;
|
||||
}
|
||||
|
||||
.tip-detail {
|
||||
padding: 16px;
|
||||
background: #fff;
|
||||
|
||||
.tip-item {
|
||||
line-height: 24px;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue