feature/2.9.42310.02-社保福利档案页面重构
This commit is contained in:
parent
8162e02796
commit
1eac37cd38
|
|
@ -11,7 +11,7 @@ import * as API from "../../../../../apis/welfareArchive";
|
|||
import { getTaxAgentSelectList } from "../../../../../apis/taxAgent";
|
||||
import { getWelfareSearchsForm, welfareConditions } from "../../config";
|
||||
import { getConditionDomkeys } from "../../../../../util";
|
||||
import { Button } from "antd";
|
||||
import { Button, Modal } from "antd";
|
||||
|
||||
const getKey = WeaTools.getKey;
|
||||
const getLabel = WeaLocaleProvider.getLabel;
|
||||
|
|
@ -22,7 +22,7 @@ class Index extends Component {
|
|||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
loading: false, conditions: []
|
||||
loading: false, conditions: [], formData: {}
|
||||
};
|
||||
}
|
||||
|
||||
|
|
@ -31,7 +31,7 @@ class Index extends Component {
|
|||
document.querySelector(".salary-welfare-archive").classList.add("zIndex0-welfare-archive");
|
||||
this.getBaseForm(nextProps);
|
||||
} else if (nextProps.visible !== this.props.visible && !nextProps.visible) {
|
||||
const { archivesStore: { initWelfareProfileForm } } = nextProps;
|
||||
const { archivesStore: { initWelfareProfileForm, setHasBeenModify } } = nextProps;
|
||||
document.querySelector(".salary-welfare-archive").classList.remove("zIndex0-welfare-archive");
|
||||
initWelfareProfileForm();
|
||||
}
|
||||
|
|
@ -39,12 +39,17 @@ class Index extends Component {
|
|||
|
||||
getBaseForm = async (props) => {
|
||||
const { data: taxAgentList } = await getTaxAgentSelectList();
|
||||
const { employeeId, paymentOrganization, socialItems } = props;
|
||||
const {
|
||||
archivesStore: { welfareProfileForm },
|
||||
employeeId, paymentOrganization, socialBaseData, fundBaseData, othersBaseData
|
||||
} = props;
|
||||
const payload = { employeeId, paymentOrganization, welfareTypeEnum: "" };
|
||||
API.getBaseForm(payload).then(({ status, data }) => {
|
||||
if (status) {
|
||||
const { data: result } = data;
|
||||
const formData = { ...result, ...socialBaseData, ...fundBaseData, ...othersBaseData };
|
||||
this.setState({
|
||||
formData,
|
||||
conditions: _.map(welfareConditions, o => {
|
||||
if (o.title === "basic") {
|
||||
return {
|
||||
|
|
@ -63,15 +68,16 @@ class Index extends Component {
|
|||
};
|
||||
})
|
||||
};
|
||||
} else if (o.title === "social") {
|
||||
console.log(props);
|
||||
} else if (o.title === "social" || o.title === "fund" || o.title === "others") {
|
||||
const title = o.title === "social" ? getLabel(543194, "社保基础信息") : o.title === "fund" ? getLabel(543197, "公积金基础信息") : getLabel(543198, "其他福利基础信息");
|
||||
return {
|
||||
...o, title: getLabel(543194, "社保基础信息"),
|
||||
...o, title,
|
||||
items: _.map(o.items, g => {
|
||||
if (getKey(g) === "socialSchemeId" || getKey(g) === "underTake") {
|
||||
if (getKey(g) === "socialSchemeId" || getKey(g) === "fundSchemeId" || getKey(g) === "otherSchemeId" || _.lowerCase(getKey(g)).indexOf("take") !== -1) {
|
||||
const key = _.lowerCase(getKey(g)).indexOf("take") !== -1 ? "underTake" : getKey(g);
|
||||
return {
|
||||
...g, label: getLabel(g.lanId, g.label),
|
||||
options: _.find(socialItems, j => j.domkey[0] === getKey(g)).options
|
||||
options: _.find(props[`${o.title}Items`], j => j.domkey[0] === key).options
|
||||
};
|
||||
}
|
||||
return { ...g, label: getLabel(g.lanId, g.label) };
|
||||
|
|
@ -85,20 +91,31 @@ class Index extends Component {
|
|||
};
|
||||
})
|
||||
}, () => {
|
||||
const { archivesStore: { welfareProfileForm } } = props;
|
||||
console.log(this.state.conditions);
|
||||
console.log(this.state.conditions, props, formData);
|
||||
welfareProfileForm.initFormFields(this.state.conditions);
|
||||
_.map(getConditionDomkeys(this.state.conditions), k => {
|
||||
if (k === "paymentOrganization") {
|
||||
welfareProfileForm.updateFields({ [k]: paymentOrganization.toString() });
|
||||
} else if (_.lowerCase(k).indexOf("social") !== -1 || k === "schemeAccount") {
|
||||
welfareProfileForm.updateFields({ [k]: formData["SOCIAL_SECURITY"][k] ? formData["SOCIAL_SECURITY"][k].toString() : "" });
|
||||
} else if (_.lowerCase(k).indexOf("fund") !== -1) {
|
||||
welfareProfileForm.updateFields({ [k]: formData["ACCUMULATION_FUND"][k] ? formData["ACCUMULATION_FUND"][k].toString() : "" });
|
||||
} else if (_.lowerCase(k).indexOf("other") !== -1) {
|
||||
welfareProfileForm.updateFields({ [k]: formData["OTHER"][k] ? formData["OTHER"][k].toString() : "" });
|
||||
} else {
|
||||
welfareProfileForm.updateFields({ [k]: result[k] || "" });
|
||||
welfareProfileForm.updateFields({ [k]: formData[k] || "" });
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
handleFormChange = (val) => {
|
||||
const changeKey = _.keys(val)[0];
|
||||
const { archivesStore: { setHasBeenModify } } = this.props;
|
||||
console.log(val, changeKey);
|
||||
setHasBeenModify(true);
|
||||
};
|
||||
renderTitle = () => {
|
||||
const { loading } = this.state;
|
||||
return <div className="titleDialog">
|
||||
|
|
@ -111,17 +128,31 @@ class Index extends Component {
|
|||
</div>
|
||||
</div>;
|
||||
};
|
||||
handleClose = () => {
|
||||
const { archivesStore: { hasBeenModify }, onClose } = this.props;
|
||||
if (hasBeenModify) {
|
||||
Modal.confirm({
|
||||
title: getLabel(131329, "信息确认"),
|
||||
content: getLabel(111, "确定放弃填写吗?放弃后数据将不会被保存!"),
|
||||
onOk: () => {
|
||||
onClose();
|
||||
}
|
||||
});
|
||||
} else {
|
||||
onClose();
|
||||
}
|
||||
};
|
||||
|
||||
render() {
|
||||
const { archivesStore: { welfareProfileForm } } = this.props;
|
||||
const { conditions } = this.state;
|
||||
const { conditions, formData } = this.state;
|
||||
return (
|
||||
<WeaSlideModal
|
||||
className="salary-welfare-archive-edit-layout" {...this.props}
|
||||
top={0} width={760} height={100} measureT={"%"} measureX={"px"} measureY={"%"}
|
||||
direction={"right"} title={this.renderTitle()}
|
||||
top={0} width={800} height={100} measureT={"%"} measureX={"px"} measureY={"%"}
|
||||
direction={"right"} title={this.renderTitle()} onClose={this.handleClose}
|
||||
content={<div className="salary-welfare-archive-edit-area">
|
||||
{getWelfareSearchsForm(welfareProfileForm, conditions)}
|
||||
{getWelfareSearchsForm(welfareProfileForm, conditions, this.handleFormChange, formData)}
|
||||
</div>}
|
||||
/>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -92,8 +92,15 @@ class Index extends Component {
|
|||
...this.state.welfareEditSlide, visible: true,
|
||||
employeeId, paymentOrganization,
|
||||
socialItems: socialItems.data.items[0].items,
|
||||
socialBaseData: {
|
||||
SOCIAL_SECURITY: { ...socialItems.data.data, socialUnderTake: socialItems.data.data.underTake }
|
||||
},
|
||||
fundItems: fundItems.data.items[0].items,
|
||||
othersItems: othersItems.data.items[0].items
|
||||
fundBaseData: {
|
||||
ACCUMULATION_FUND: { ...fundItems.data.data, fundUnderTake: fundItems.data.data.underTake }
|
||||
},
|
||||
othersItems: othersItems.data.items[0].items,
|
||||
othersBaseData: { OTHER: { ...othersItems.data.data, otherUnderTake: othersItems.data.data.underTake } }
|
||||
}
|
||||
});
|
||||
break;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import React from "react";
|
||||
import { WeaFormItem, WeaHelpfulTip, WeaLocaleProvider, WeaSearchGroup, WeaTools } from "ecCom";
|
||||
import { WeaCheckbox, WeaFormItem, WeaHelpfulTip, WeaLocaleProvider, WeaSearchGroup, WeaTools } from "ecCom";
|
||||
import { WeaSwitch } from "comsMobx";
|
||||
import { Button } from "antd";
|
||||
import AdvanceInputBtn from "./components/advanceInputBtn";
|
||||
|
|
@ -451,8 +451,8 @@ export const welfareConditions = [
|
|||
},
|
||||
{
|
||||
defaultshow: true,
|
||||
title: "social",
|
||||
col: 2,
|
||||
title: "social", typename: "SOCIAL_SECURITY",
|
||||
col: 2, showPaid: true,
|
||||
items: [
|
||||
{
|
||||
colSpan: 3,
|
||||
|
|
@ -469,7 +469,7 @@ export const welfareConditions = [
|
|||
{
|
||||
colSpan: 3,
|
||||
conditionType: "SELECT",
|
||||
domkey: ["underTake"],
|
||||
domkey: ["socialUnderTake"],
|
||||
fieldcol: 14,
|
||||
label: "社保个人实际承担方",
|
||||
lanId: 111,
|
||||
|
|
@ -514,9 +514,145 @@ export const welfareConditions = [
|
|||
viewAttr: 2
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
defaultshow: true,
|
||||
title: "fund", typename: "ACCUMULATION_FUND",
|
||||
col: 2, showPaid: true,
|
||||
items: [
|
||||
{
|
||||
colSpan: 3,
|
||||
conditionType: "SELECT",
|
||||
domkey: ["fundSchemeId"],
|
||||
fieldcol: 14,
|
||||
label: "公积金方案名称",
|
||||
lanId: 111,
|
||||
labelcol: 10,
|
||||
value: "",
|
||||
options: [],
|
||||
viewAttr: 2
|
||||
},
|
||||
{
|
||||
colSpan: 3,
|
||||
conditionType: "SELECT",
|
||||
domkey: ["fundUnderTake"],
|
||||
fieldcol: 14,
|
||||
label: "公积金个人实际承担方",
|
||||
lanId: 111,
|
||||
labelcol: 10,
|
||||
value: "",
|
||||
options: [],
|
||||
viewAttr: 2
|
||||
},
|
||||
{
|
||||
colSpan: 3,
|
||||
conditionType: "MONTHPICKER",
|
||||
domkey: ["fundStartTime"],
|
||||
fieldcol: 14,
|
||||
label: "公积金起始缴纳月",
|
||||
lanId: 542509,
|
||||
labelcol: 10,
|
||||
value: "",
|
||||
options: [],
|
||||
viewAttr: 2
|
||||
},
|
||||
{
|
||||
colSpan: 3,
|
||||
conditionType: "INPUT",
|
||||
domkey: ["fundAccount"],
|
||||
fieldcol: 14,
|
||||
label: "公积金账号",
|
||||
lanId: 542268,
|
||||
labelcol: 10,
|
||||
value: "",
|
||||
viewAttr: 2
|
||||
},
|
||||
{
|
||||
colSpan: 3,
|
||||
conditionType: "MONTHPICKER",
|
||||
domkey: ["fundEndTime"],
|
||||
fieldcol: 14,
|
||||
label: "公积金最后缴纳月",
|
||||
lanId: 542510,
|
||||
labelcol: 10,
|
||||
value: "",
|
||||
options: [],
|
||||
viewAttr: 2
|
||||
},
|
||||
{
|
||||
colSpan: 3,
|
||||
conditionType: "INPUT",
|
||||
domkey: ["supplementFundAccount"],
|
||||
fieldcol: 14,
|
||||
label: "补充公积金账号",
|
||||
lanId: 542270,
|
||||
labelcol: 10,
|
||||
value: "",
|
||||
viewAttr: 2
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
defaultshow: true,
|
||||
title: "others", typename: "OTHER",
|
||||
col: 2, showPaid: true,
|
||||
items: [
|
||||
{
|
||||
colSpan: 3,
|
||||
conditionType: "SELECT",
|
||||
domkey: ["otherSchemeId"],
|
||||
fieldcol: 14,
|
||||
label: "其它福利名称",
|
||||
lanId: 111,
|
||||
labelcol: 10,
|
||||
value: "",
|
||||
options: [],
|
||||
viewAttr: 2
|
||||
},
|
||||
{
|
||||
colSpan: 3,
|
||||
conditionType: "SELECT",
|
||||
domkey: ["otherUnderTake"],
|
||||
fieldcol: 14,
|
||||
label: "其它福利个人实际承担方",
|
||||
lanId: 111,
|
||||
labelcol: 10,
|
||||
value: "",
|
||||
options: [],
|
||||
viewAttr: 2
|
||||
},
|
||||
{
|
||||
colSpan: 3,
|
||||
conditionType: "MONTHPICKER",
|
||||
domkey: ["otherStartTime"],
|
||||
fieldcol: 14,
|
||||
label: "其他福利起始缴纳月",
|
||||
lanId: 542511,
|
||||
labelcol: 10,
|
||||
value: "",
|
||||
options: [],
|
||||
viewAttr: 2
|
||||
},
|
||||
{
|
||||
colSpan: 3,
|
||||
conditionType: "MONTHPICKER",
|
||||
domkey: ["otherEndTime"],
|
||||
fieldcol: 14,
|
||||
label: "其他福利最后缴纳月",
|
||||
lanId: 542512,
|
||||
labelcol: 10,
|
||||
value: "",
|
||||
options: [],
|
||||
viewAttr: 2
|
||||
}
|
||||
]
|
||||
}
|
||||
];
|
||||
export const getWelfareSearchsForm = (form, condition, onSearch = () => void (0)) => {
|
||||
export const getWelfareSearchsForm = (form, condition, onChange = () => void (0), payload) => {
|
||||
const CustomComponent = ({ type }) => {
|
||||
const value = payload[type].nonPayment ? payload[type].nonPayment.toString() : "";
|
||||
return <WeaCheckbox value={value} content={getLabel(543196, "暂不缴纳")}/>;
|
||||
};
|
||||
const { isFormInit } = form;
|
||||
const formParams = form.getFormParams();
|
||||
let group = [];
|
||||
|
|
@ -530,15 +666,16 @@ export const getWelfareSearchsForm = (form, condition, onSearch = () => void (0)
|
|||
wrapperCol={{ span: `${fields.fieldcol}` }} error={form.getError(fields)}
|
||||
tipPosition="bottom"
|
||||
>
|
||||
<WeaSwitch fieldConfig={fields} form={form} formParams={formParams}/>
|
||||
<WeaSwitch fieldConfig={fields} form={form} formParams={formParams} onChange={onChange}/>
|
||||
</WeaFormItem>),
|
||||
colSpan: 1,
|
||||
hide: fields.hide
|
||||
});
|
||||
});
|
||||
group.push(
|
||||
<WeaSearchGroup col={c.col} needTigger={true} title={c.title} showGroup={c.defaultshow} items={items}
|
||||
center={false}
|
||||
<WeaSearchGroup col={c.col} needTigger={true} showGroup={c.defaultshow} items={items} center={false}
|
||||
title={c.title}
|
||||
customComponent={c.showPaid ? <CustomComponent type={c.typename}/> : <span></span>}
|
||||
className={c.col === 3 ? "basic-welfare-info-wrapper" : c.col === 2 ? "twoColumns-welfare-info-wrapper" : ""}
|
||||
/>);
|
||||
});
|
||||
|
|
|
|||
|
|
@ -172,6 +172,23 @@
|
|||
}
|
||||
}
|
||||
|
||||
.twoColumns-welfare-info-wrapper {
|
||||
.wea-form-cell-wrapper {
|
||||
& > div:nth-child(1), & > div:nth-child(3) {
|
||||
border-right: 1px solid #e5e5e5;
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
}
|
||||
|
||||
& > div:nth-child(2), & > div:nth-child(4) {
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
}
|
||||
|
||||
& > div:nth-child(5) {
|
||||
border-right: 1px solid #e5e5e5;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.wea-search-group, .wea-form-cell {
|
||||
padding: 0;
|
||||
|
||||
|
|
|
|||
|
|
@ -11,7 +11,12 @@ export class ArchivesStore {
|
|||
@observable logForm = new WeaForm(); // 社保福利档案重构-日志查询条件log
|
||||
@observable welfareForm = new WeaForm(); // 社保福利档案重构-列表查询form
|
||||
@observable welfareProfileForm = new WeaForm(); // 社保福利档案重构-员工薪资档案form
|
||||
@action initWelfareProfileForm = () => this.welfareProfileForm = new WeaForm();
|
||||
@action initWelfareProfileForm = () => {
|
||||
this.hasBeenModify = false;
|
||||
this.welfareProfileForm = new WeaForm();
|
||||
};
|
||||
@observable hasBeenModify = false; //社保福利档案-员工薪资档数据-是否修改过
|
||||
@action setHasBeenModify = (v) => this.hasBeenModify = v;//设置社保福利档案-员工薪资档数据
|
||||
|
||||
|
||||
@observable tableStore = new TableStore(
|
||||
|
|
|
|||
Loading…
Reference in New Issue