qt
/
salary-management-front
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

社保福利档案页面编辑页面组件样式的修改以及数据回填失败的bug处理

This commit is contained in:
liyongshun 2022-07-07 17:58:00 +08:00
parent 561900ae49
commit e22fa6429f
5 changed files with 549 additions and 514 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

346
pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/accumulationFundForm.js
View File

@ -1,178 +1,188 @@
import React from 'react'
import { inject, observer } from 'mobx-react';
import { Row, Col, Select } from 'antd'
import { WeaDatePicker, WeaInput, WeaCheckbox } from 'ecCom'
import GroupCard from '../../../components/groupCard'
import "./index.less"
import React from "react";
import { inject, observer } from "mobx-react";
import { Col, Row, Select } from "antd";
import { WeaCheckbox, WeaDatePicker, WeaInput } from "ecCom";
import GroupCard from "../../../components/groupCard";
import cs from "classnames";
import "./index.less";
@inject('archivesStore')
@inject("archivesStore")
@observer
export default class AccumulationFundForm extends React.Component {
componentWillMount() {
const { archivesStore: { getBaseForm, getPaymentForm }} = this.props;
getBaseForm(this.props.employeeId, "ACCUMULATION_FUND");
getPaymentForm(this.props.employeeId, "ACCUMULATION_FUND", this.props.record.fundSchemeId)
}
// 表单变化
handleFormChange(params) {
const { archivesStore: { accumulationFundForm, setAccumulationFundForm, getPaymentForm }} = this.props;
const { data } = accumulationFundForm
let request = {...data, ...params}
request.fundName = request.fundSchemeId
let form = {...accumulationFundForm}
form.data = request
setAccumulationFundForm(form)
}
componentWillMount() {
const { archivesStore: { getBaseForm, getPaymentForm } } = this.props;
getBaseForm(this.props.employeeId, "ACCUMULATION_FUND");
getPaymentForm(this.props.employeeId, "ACCUMULATION_FUND", this.props.record.fundSchemeId);
}
// 获取基数表单
handleFetchPaymentForm(fundName) {
const { archivesStore: { getPaymentForm }} = this.props;
getPaymentForm(this.props.employeeId, "ACCUMULATION_FUND", fundName)
}
// 表单变化
handleFormChange(params) {
const { archivesStore: { accumulationFundForm, setAccumulationFundForm, getPaymentForm } } = this.props;
const { data } = accumulationFundForm;
let request = { ...data, ...params };
request.fundName = request.fundSchemeId;
let form = { ...accumulationFundForm };
form.data = request;
setAccumulationFundForm(form);
}
// 获取基数表单
handleFetchPaymentForm(fundName) {
const { archivesStore: { getPaymentForm } } = this.props;
getPaymentForm(this.props.employeeId, "ACCUMULATION_FUND", fundName);
}
//基数变化
handlePaymentChange(params) {
const { archivesStore: { accumulationFundPaymentForm, setAccumulationFundPaymentForm }} = this.props;
const { data } = accumulationFundPaymentForm
let request = {...data, ...params}
let form = {...accumulationFundPaymentForm}
form.data = request
setAccumulationFundPaymentForm(form)
}
//基数变化
handlePaymentChange(params) {
const { archivesStore: { accumulationFundPaymentForm, setAccumulationFundPaymentForm } } = this.props;
const { data } = accumulationFundPaymentForm;
let request = { ...data, ...params };
let form = { ...accumulationFundPaymentForm };
form.data = request;
setAccumulationFundPaymentForm(form);
}
render() {
const { archivesStore: { accumulationFundForm, accumulationFundPaymentForm }} = this.props;
const { items } = accumulationFundForm
let baseData = accumulationFundForm.data
let paymentData = accumulationFundPaymentForm.data
let paymentItems = accumulationFundPaymentForm.items
let data = {...baseData}
// Integer数据转为string
if(data) {
Object.keys(data).map(key => {
if(data[key]) {
data[key] = data[key].toString()
}
})
render() {
const { archivesStore: { accumulationFundForm, accumulationFundPaymentForm } } = this.props;
const { items } = accumulationFundForm;
let baseData = accumulationFundForm.data;
let paymentData = accumulationFundPaymentForm.data;
let paymentItems = accumulationFundPaymentForm.items;
let data = { ...baseData };
// Integer数据转为string
if (data) {
Object.keys(data).map(key => {
if (data[key]) {
data[key] = data[key].toString();
}
return (
<div className="socialFormWrapper">
<div style={{overflow: "hidden"}}>
<WeaCheckbox style={{float: "right", marginRight: "10px", marginTop: "10px"}} value={data && data.nonPayment} id="nonPayment" content="暂不缴纳" onChange={(value) => {this.handleFormChange({nonPayment: value})}} />
</div>
<GroupCard title="公积金基础信息" >
<Row>
<Col span={6} className="formItem">公积金起始缴纳月：</Col>
<Col span={6} className="formItem">
<WeaDatePicker
format="yyyy-MM"
value={data && data.fundStartTime}
onChange={value => this.handleFormChange({fundStartTime: value})}
/>
</Col>
<Col span={6} className="formItem">公积金最后缴纳月：</Col>
<Col span={6} className="formItem">
<WeaDatePicker
format="yyyy-MM"
value={data && data.fundEndTime}
onChange={value => this.handleFormChange({fundEndTime: value})}
/>
</Col>
</Row>
<Row>
<Col span={6} className="formItem">公积金方案名称：</Col>
<Col span={6} className="formItem">
<Select defaultValue={data && data.fundSchemeId}
notFoundContent="暂无数据" value={data && data.fundSchemeId} style={{ width: "100%" }} onChange={(value) => {
this.handleFormChange({fundSchemeId: value})
this.handleFetchPaymentForm(value);
}}>
{
items && items[0].items &&items[0].items[0] && items[0].items[0].options.map(item => (
<Option value={item.key}>{item.showname}</Option>
))
}
</Select>
</Col>
</Row>
<Row>
<Col span={6} className="formItem">公积金账号：</Col>
<Col span={6} className="formItem">
<WeaInput value={data && data.fundAccount} onChange={(value) => this.handleFormChange({fundAccount: value})} />
</Col>
<Col span={6} className="formItem">补充公积金账号：</Col>
<Col span={6} className="formItem">
<WeaInput value={data && data.supplementFundAccount} onChange={(value) => this.handleFormChange({supplementFundAccount: value})} />
</Col>
</Row>
<Row>
<Col span={6} className="formItem">公积金缴纳组织：</Col>
<Col span={6} className="formItem">
<Select defaultValue={data && data.paymentOrganization}
notFoundContent="暂无数据" value={data && data.paymentOrganization} style={{ width: "100%" }} onChange={(value) => this.handleFormChange({paymentOrganization: value})}>
{
items && items[0].items &&items[0].items[1] && items[0].items[1].options.map(item => (
<Option value={item.key}>{item.showname}</Option>
))
}
</Select>
</Col>
<Col span={6} className="formItem">公积金个人实际承担方：</Col>
<Col span={6} className="formItem">
<Select defaultValue={data && data.underTake}
notFoundContent="暂无数据" value={data && data.underTake} style={{ width: "100%" }} onChange={(value) => {
this.handleFormChange({underTake: value})
}}>
{
items && items[0].items &&items[0].items[2] && items[0].items[2].options.map(item => (
<Option value={item.key}>{item.showname}</Option>
))
}
</Select>
</Col>
</Row>
</GroupCard>
{
paymentItems && paymentItems.map(group => (
<div>
{
group.items && group.items.length > 0 && <GroupCard title={group.title}>
<Row>
{
group.items && group.items.map(item => (
<Col span={12}>
<Row>
<Col span={12} className="formItem">{item.label}：</Col>
<Col span={12} className="formItem">
<WeaInput
type="number"
value={ paymentData && paymentData[item.domkey[0]]} onChange={(value) => {
this.handlePaymentChange({[item.domkey[0]]: value})
}}
/>
</Col>
</Row>
</Col>
))
}
</Row>
</GroupCard>
}
</div>
))
}
</div>
)
});
}
}
return (
<div className="socialFormWrapper">
<div style={{ overflow: "hidden" }}>
<WeaCheckbox style={{ float: "right", marginRight: "10px", marginTop: "10px" }}
value={data && data.nonPayment} id="nonPayment" content="暂不缴纳" onChange={(value) => {
this.handleFormChange({ nonPayment: value });
}}/>
</div>
<GroupCard title="公积金基础信息">
<Row>
<Col span={6} className="formItem borderR-none borderB-none">公积金起始缴纳月：</Col>
<Col span={6} className="formItem borderR-none borderB-none">
<WeaDatePicker
format="yyyy-MM"
value={data && data.fundStartTime}
onChange={value => this.handleFormChange({ fundStartTime: value })}
/>
</Col>
<Col span={6} className="formItem borderR-none borderB-none">公积金最后缴纳月：</Col>
<Col span={6} className="formItem borderB-none">
<WeaDatePicker
format="yyyy-MM"
value={data && data.fundEndTime}
onChange={value => this.handleFormChange({ fundEndTime: value })}
/>
</Col>
</Row>
<Row>
<Col span={6} className="formItem borderR-none borderB-none">公积金方案名称：</Col>
<Col span={6} className="formItem borderR-none borderB-none">
<Select defaultValue={data && data.fundSchemeId}
notFoundContent="暂无数据" value={data && data.fundSchemeId} style={{ width: "100%" }}
onChange={(value) => {
this.handleFormChange({ fundSchemeId: value });
this.handleFetchPaymentForm(value);
}}>
{
items && items[0].items && items[0].items[0] && items[0].items[0].options.map(item => (
<Option value={item.key}>{item.showname}</Option>
))
}
</Select>
</Col>
<Col span={6} className="formItem borderR-none borderB-none">公积金账号：</Col>
<Col span={6} className="formItem borderB-none">
<WeaInput value={data && data.fundAccount}
onChange={(value) => this.handleFormChange({ fundAccount: value })}/>
</Col>
</Row>
<Row>
<Col span={6} className="formItem borderR-none">补充公积金账号：</Col>
<Col span={6} className="formItem borderR-none">
<WeaInput value={data && data.supplementFundAccount}
onChange={(value) => this.handleFormChange({ supplementFundAccount: value })}/>
</Col>
<Col span={6} className="formItem borderR-none">公积金个人实际承担方：</Col>
<Col span={6} className="formItem">
<Select defaultValue={data && data.underTake}
notFoundContent="暂无数据" value={data && data.underTake} style={{ width: "100%" }}
onChange={(value) => {
this.handleFormChange({ underTake: value });
}}>
{
items && items[0].items && items[0].items[2] && items[0].items[2].options.map(item => (
<Option value={item.key}>{item.showname}</Option>
))
}
</Select>
</Col>
</Row>
{/*<Row>*/}
{/*<Col span={6} className="formItem">公积金缴纳组织：</Col>*/}
{/*<Col span={6} className="formItem">*/}
{/* <Select defaultValue={data && data.paymentOrganization}*/}
{/* notFoundContent="暂无数据" value={data && data.paymentOrganization} style={{ width: "100%" }}*/}
{/* onChange={(value) => this.handleFormChange({ paymentOrganization: value })}>*/}
{/* {*/}
{/* items && items[0].items && items[0].items[1] && items[0].items[1].options.map(item => (*/}
{/* <Option value={item.key}>{item.showname}</Option>*/}
{/* ))*/}
{/* }*/}
{/* </Select>*/}
{/*</Col>*/}
{/*</Row>*/}
</GroupCard>
{
paymentItems && paymentItems.map(group => (
<div>
{
group.items && group.items.length > 0 && <GroupCard title={group.title}>
<Row>
{
group.items && group.items.map((item, idx) => (
<Col span={12}>
<Row>
<Col span={12}
className={cs("formItem", "borderR-none")}>{item.label}：</Col>
<Col span={12}
className={cs("formItem", { "borderR-none": idx === 0 })}>
<WeaInput
type="number"
value={paymentData && paymentData[item.domkey[0]]} onChange={(value) => {
this.handlePaymentChange({ [item.domkey[0]]: value });
}}
/>
</Col>
</Row>
</Col>
))
}
</Row>
</GroupCard>
}
</div>
))
}
</div>
);
}
}

28
pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/baseForm.js
View File

@ -12,31 +12,31 @@ export default class BaseForm extends React.Component {
const {archivesStore: {getBaseForm}} = this.props;
getBaseForm(this.props.employeeId)
}
render() {
const { archivesStore: {baseFormData}} = this.props;
return (
<div className="socialFormWrapper">
<GroupCard title="基本信息" >
<Row>
<Col span={4} className="formItem">姓名:</Col>
<Col span={4} className="formItem">{baseFormData.username}</Col>
<Col span={4} className="formItem">部门:</Col>
<Col span={4} className="formItem">{baseFormData.department}</Col>
<Col span={4} className="formItem">岗位:</Col>
<Col span={4} className="formItem">{baseFormData.position}</Col>
<Col span={4} className="formItem borderR-none borderB-none">姓名:</Col>
<Col span={4} className="formItem borderR-none borderB-none">{baseFormData.username}</Col>
<Col span={4} className="formItem borderR-none borderB-none">部门:</Col>
<Col span={4} className="formItem borderR-none borderB-none">{baseFormData.department}</Col>
<Col span={4} className="formItem borderR-none borderB-none">岗位:</Col>
<Col span={4} className="formItem borderB-none">{baseFormData.position}</Col>
</Row>
<Row>
<Col span={4} className="formItem">入职日期:</Col>
<Col span={4} className="formItem">{baseFormData.hiredate}</Col>
<Col span={4} className="formItem">手机号:</Col>
<Col span={4} className="formItem">{baseFormData.telephone}</Col>
<Col span={4} className="formItem">离职时间:</Col>
<Col span={4} className="formItem borderR-none">入职日期:</Col>
<Col span={4} className="formItem borderR-none">{baseFormData.hiredate}</Col>
<Col span={4} className="formItem borderR-none">手机号:</Col>
<Col span={4} className="formItem borderR-none">{baseFormData.telephone}</Col>
<Col span={4} className="formItem borderR-none">离职时间:</Col>
<Col span={4} className="formItem">{baseFormData.dimissionDate}</Col>
</Row>
</GroupCard>
</div>
)
}
}
}

32
pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/index.less
View File

@ -1,13 +1,21 @@
.socialFormWrapper {
.formItem {
height: 40px;
line-height: 40px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding-left: 10px;
padding-right: 10px;
border: 1px solid #e2e2e2;
margin-bottom: 0!important;
}
}
.formItem {
height: 40px;
line-height: 40px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding-left: 10px;
padding-right: 10px;
border: 1px solid #e2e2e2;
margin-bottom: 0 !important;
}
.borderR-none {
border-right: none;
}
.borderB-none {
border-bottom: none;
}
}

322
pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/otherForm.js
View File

@ -1,167 +1,173 @@
import React from 'react'
import { inject, observer } from 'mobx-react';
import { Row, Col, Select } from 'antd'
import { WeaDatePicker, WeaInput, WeaCheckbox } from "ecCom";
import GroupCard from '../../../components/groupCard'
import "./index.less"
const { Option } = Select
import React from "react";
import { inject, observer } from "mobx-react";
import { Col, Row, Select } from "antd";
import { WeaCheckbox, WeaDatePicker, WeaInput } from "ecCom";
import GroupCard from "../../../components/groupCard";
import "./index.less";
@inject('archivesStore')
const { Option } = Select;
@inject("archivesStore")
@observer
export default class OtherForm extends React.Component {
constructor(props) {
super(props)
this.state = {
inited: false
constructor(props) {
super(props);
this.state = {
inited: false
};
}
componentWillMount() {
const { archivesStore: { getBaseForm, getPaymentForm } } = this.props;
getBaseForm(this.props.employeeId, "OTHER");
getPaymentForm(this.props.employeeId, "OTHER", this.props.record.otherSchemeId);
}
// 获取基数表单
handleFetchPaymentForm(value) {
const { archivesStore: { getPaymentForm } } = this.props;
getPaymentForm(this.props.employeeId, "OTHER", value);
}
// 表单变化
handleFormChange(params) {
const { archivesStore: { otherForm, setOtherForm } } = this.props;
const { data } = otherForm;
let request = { ...data, ...params };
let form = { ...otherForm };
form.data = request;
setOtherForm(form);
}
//基数变化
handlePaymentChange(params) {
const { archivesStore: { otherPaymentForm, setOtherPaymentForm } } = this.props;
const { data } = otherPaymentForm;
let request = { ...data, ...params };
let form = { ...otherPaymentForm };
form.data = request;
setOtherPaymentForm(form);
}
render() {
const { archivesStore: { otherForm, otherPaymentForm } } = this.props;
const { items } = otherForm;
let baseData = otherForm.data;
let data = { ...baseData };
let paymentData = otherPaymentForm.data;
let paymentItems = otherPaymentForm.items;
// Integer数据转为string
if (data) {
Object.keys(data).map(key => {
if (data[key]) {
data[key] = data[key].toString();
}
}
componentWillMount() {
const { archivesStore: { getBaseForm, getPaymentForm}} = this.props;
getBaseForm(this.props.employeeId, "OTHER");
getPaymentForm(this.props.employeeId, "OTHER", this.props.record.otherSchemeId)
});
}
// 获取基数表单
handleFetchPaymentForm(value) {
const { archivesStore: { getPaymentForm }} = this.props;
getPaymentForm(this.props.employeeId, "OTHER", value)
}
// 表单变化
handleFormChange(params) {
const { archivesStore: { otherForm, setOtherForm }} = this.props;
const { data } = otherForm
let request = {...data, ...params}
let form = {...otherForm}
form.data = request
setOtherForm(form)
}
//基数变化
handlePaymentChange(params) {
const { archivesStore: { otherPaymentForm, setOtherPaymentForm }} = this.props;
const { data } = otherPaymentForm
let request = {...data, ...params}
let form = {...otherPaymentForm}
form.data = request
setOtherPaymentForm(form)
}
render() {
const { archivesStore: { otherForm, otherPaymentForm }} = this.props;
const { items } = otherForm
let baseData = otherForm.data
let data = {...baseData}
let paymentData = otherPaymentForm.data
let paymentItems = otherPaymentForm.items
// Integer数据转为string
if(data) {
Object.keys(data).map(key => {
if(data[key]) {
data[key] = data[key].toString()
return (
<div className="socialFormWrapper">
<div style={{ overflow: "hidden" }}>
<WeaCheckbox style={{ float: "right", marginRight: "10px", marginTop: "10px" }}
value={data && data.nonPayment} id="nonPayment" content="暂不缴纳" onChange={(value) => {
this.handleFormChange({ nonPayment: value });
}}/>
</div>
<GroupCard title="其他福利基础信息">
<Row>
<Col span={6} className="formItem borderR-none borderB-none">其他福利起始缴纳月：</Col>
<Col span={6} className="formItem borderR-none borderB-none">
<WeaDatePicker
format="yyyy-MM"
value={data && data.otherStartTime}
onChange={value => this.handleFormChange({ otherStartTime: value })}
/>
</Col>
<Col span={6} className="formItem borderR-none borderB-none">其他福利最后缴纳月：</Col>
<Col span={6} className="formItem borderB-none">
<WeaDatePicker
format="yyyy-MM"
value={data && data.otherEndTime}
onChange={value => this.handleFormChange({ otherEndTime: value })}
/>
</Col>
</Row>
<Row>
<Col span={6} className="formItem borderR-none">其他福利方案名称：</Col>
<Col span={6} className="formItem borderR-none">
<Select defaultValue={data && data.otherName}
notFoundContent="暂无数据" value={data && data.otherName} style={{ width: "100%" }}
onChange={(value) => {
this.handleFormChange({ otherName: value });
this.handleFetchPaymentForm(value);
}}>
{
items && items[0].items && items[0].items[0] && items[0].items[0].options.map(item => (
<Option value={item.key}>{item.showname}</Option>
))
}
})
}
return (
<div className="socialFormWrapper">
<div style={{overflow: "hidden"}}>
<WeaCheckbox style={{float: "right", marginRight: "10px", marginTop: "10px"}} value={data && data.nonPayment} id="nonPayment" content="暂不缴纳" onChange={(value) => {this.handleFormChange({nonPayment: value})}} />
</div>
<GroupCard title="其他福利基础信息" >
<Row>
<Col span={6} className="formItem">其他福利起始缴纳月：</Col>
<Col span={6} className="formItem">
<WeaDatePicker
format="yyyy-MM"
value={data && data.otherStartTime}
onChange={value => this.handleFormChange({otherStartTime: value})}
/>
</Col>
<Col span={6} className="formItem">其他福利最后缴纳月：</Col>
<Col span={6} className="formItem">
<WeaDatePicker
format="yyyy-MM"
value={data && data.otherEndTime}
onChange={value => this.handleFormChange({otherEndTime: value})}
/>
</Col>
</Row>
<Row>
<Col span={6} className="formItem">其他福利方案名称：</Col>
<Col span={6} className="formItem">
<Select defaultValue={data && data.otherName}
notFoundContent="暂无数据" value={data && data.otherName} style={{ width: "100%" }} onChange={(value) => {
this.handleFormChange({otherName: value})
this.handleFetchPaymentForm(value);
}}>
{
items && items[0].items &&items[0].items[0] && items[0].items[0].options.map(item => (
<Option value={item.key}>{item.showname}</Option>
))
}
</Select>
</Col>
</Row>
<Row>
<Col span={6} className="formItem">社保缴纳组织：</Col>
<Col span={6} className="formItem">
<Select defaultValue={data && data.paymentOrganization}
notFoundContent="暂无数据" value={data && data.paymentOrganization} style={{ width: "100%" }} onChange={(value) => this.handleFormChange({paymentOrganization: value})}>
{
items && items[0].items &&items[0].items[1] && items[0].items[1].options.map(item => (
<Option value={item.key}>{item.showname}</Option>
))
}
</Select>
</Col>
<Col span={6} className="formItem">社保个人实际承担方：</Col>
<Col span={6} className="formItem">
<Select defaultValue={data && data.underTake} value={data && data.underTake} style={{ width: "100%" }} onChange={(value) => this.handleFormChange({underTake: value})}>
{
items && items[0].items &&items[0].items[2] && items[0].items[2].options.map(item => (
<Option value={item.key}>{item.showname}</Option>
))
}
</Select>
</Col>
</Row>
{
paymentItems && paymentItems.map(group => (
<div>
{
group.items && group.items.length > 0 && <GroupCard title={group.title} >
<Row>
{
group.items && group.items.map(item => (
<Col span={12}>
<Row>
<Col span={12} className="formItem">{item.label}：</Col>
<Col span={12} className="formItem">
<WeaInput
type="number"
value={ paymentData && paymentData[item.domkey[0]]} onChange={(value) => {
this.handlePaymentChange({[item.domkey[0]]: value})
}}
/>
</Col>
</Row>
</Col>
))
}
</Row>
</GroupCard>
}
</div>
))
</Select>
</Col>
<Col span={6} className="formItem borderR-none">社保个人实际承担方：</Col>
<Col span={6} className="formItem">
<Select defaultValue={data && data.underTake} value={data && data.underTake} style={{ width: "100%" }}
onChange={(value) => this.handleFormChange({ underTake: value })}>
{
items && items[0].items && items[0].items[2] && items[0].items[2].options.map(item => (
<Option value={item.key}>{item.showname}</Option>
))
}
</GroupCard>
</div>
)
}
}
</Select>
</Col>
</Row>
{/*<Row>*/}
{/*<Col span={6} className="formItem">社保缴纳组织：</Col>*/}
{/*<Col span={6} className="formItem">*/}
{/* <Select defaultValue={data && data.paymentOrganization} */}
{/* notFoundContent="暂无数据" value={data && data.paymentOrganization} style={{ width: "100%" }} onChange={(value) => this.handleFormChange({paymentOrganization: value})}>*/}
{/* {*/}
{/* items && items[0].items &&items[0].items[1] && items[0].items[1].options.map(item => (*/}
{/* <Option value={item.key}>{item.showname}</Option>*/}
{/* ))*/}
{/* }*/}
{/* </Select>*/}
{/* */}
{/*</Col>*/}
{/*</Row>*/}
{
paymentItems && paymentItems.map(group => (
<div>
{
group.items && group.items.length > 0 && <GroupCard title={group.title}>
<Row>
{
group.items && group.items.map(item => (
<Col span={12}>
<Row>
<Col span={12} className="formItem">{item.label}：</Col>
<Col span={12} className="formItem">
<WeaInput
type="number"
value={paymentData && paymentData[item.domkey[0]]} onChange={(value) => {
this.handlePaymentChange({ [item.domkey[0]]: value });
}}
/>
</Col>
</Row>
</Col>
))
}
</Row>
</GroupCard>
}
</div>
))
}
</GroupCard>
</div>
);
}
}

335
pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/socialSecurityForm.js
View File

@ -1,172 +1,183 @@
import React from 'react'
import GroupCard from '../../../components/groupCard'
import { Row, Col, Select } from 'antd';
import { WeaDatePicker, WeaInput, WeaCheckbox } from 'ecCom';
import { inject, observer } from 'mobx-react';
import "./index.less"
import ItemMangeFormModal from '../../dataAcquisition/attendance/itemMangeFormModal';
import React from "react";
import GroupCard from "../../../components/groupCard";
import { Col, Row, Select } from "antd";
import { WeaCheckbox, WeaDatePicker, WeaInput } from "ecCom";
import { inject, observer } from "mobx-react";
import cs from "classnames";
import "./index.less";
const { Option } = Select
const { Option } = Select;
@inject('archivesStore')
@inject("archivesStore")
@observer
export default class SocialSecurityForm extends React.Component {
componentWillMount() {
const { archivesStore } = this.props;
const { getBaseForm, getPaymentForm } = archivesStore
getBaseForm(this.props.employeeId, "SOCIAL_SECURITY")
getPaymentForm(this.props.employeeId, "SOCIAL_SECURITY", this.props.record.siSchemeId)
}
componentWillMount() {
const { archivesStore } = this.props;
const { getBaseForm, getPaymentForm } = archivesStore;
getBaseForm(this.props.employeeId, "SOCIAL_SECURITY");
getPaymentForm(this.props.employeeId, "SOCIAL_SECURITY", this.props.record.siSchemeId);
}
// 表单变化
handleFormChange(params) {
const { archivesStore: { socialSecurityForm, setSocialSecurityForm }} = this.props;
const { data } = socialSecurityForm
let request = {...data, ...params}
let form = {...socialSecurityForm}
form.data = request
setSocialSecurityForm(form)
}
// 表单变化
handleFormChange(params) {
const { archivesStore: { socialSecurityForm, setSocialSecurityForm } } = this.props;
const { data } = socialSecurityForm;
let request = { ...data, ...params };
let form = { ...socialSecurityForm };
form.data = request;
setSocialSecurityForm(form);
}
// 获取基数表单
handleFetchPaymentForm(value) {
console.log("SOCIAL_SECURITY:", value);
const { archivesStore: { getPaymentForm }} = this.props;
getPaymentForm(this.props.employeeId, "SOCIAL_SECURITY", value)
}
// 获取基数表单
handleFetchPaymentForm(value) {
const { archivesStore: { getPaymentForm } } = this.props;
getPaymentForm(this.props.employeeId, "SOCIAL_SECURITY", value);
}
//基数变化
handlePaymentChange(params) {
const { archivesStore: { socialSecurityPaymentForm, setSocialSecurityPaymentForm }} = this.props;
const { data } = socialSecurityPaymentForm
let request = {...data, ...params}
let form = {...socialSecurityPaymentForm}
form.data = request
setSocialSecurityPaymentForm(form)
}
//基数变化
handlePaymentChange(params) {
const { archivesStore: { socialSecurityPaymentForm, setSocialSecurityPaymentForm } } = this.props;
const { data } = socialSecurityPaymentForm;
let request = { ...data, ...params };
let form = { ...socialSecurityPaymentForm };
form.data = request;
setSocialSecurityPaymentForm(form);
}
render() {
const { archivesStore: { socialSecurityForm, socialSecurityPaymentForm }} = this.props;
const { items } = socialSecurityForm
let baseData = socialSecurityForm.data
let paymentData = socialSecurityPaymentForm.data
let paymentItems = socialSecurityPaymentForm.items
// Integer数据转为string
let data = {...baseData}
if(data) {
Object.keys(data).map(key => {
if(data[key]) {
data[key] = data[key].toString()
}
})
render() {
const { archivesStore: { socialSecurityForm, socialSecurityPaymentForm } } = this.props;
const { items } = socialSecurityForm;
let baseData = socialSecurityForm.data;
let paymentData = socialSecurityPaymentForm.data;
let paymentItems = socialSecurityPaymentForm.items;
// Integer数据转为string
let data = { ...baseData };
if (data) {
Object.keys(data).map(key => {
if (data[key]) {
data[key] = data[key].toString();
}
return (
<div className="socialFormWrapper">
<div style={{overflow: "hidden"}}>
<WeaCheckbox style={{float: "right", marginRight: "10px", marginTop: "10px"}} value={data && data.nonPayment} id="nonPayment" content="暂不缴纳" onChange={(value) => {this.handleFormChange({nonPayment: value})}} />
</div>
<GroupCard title="社保基础信息" >
<Row>
<Col span={6} className="formItem">社保起始缴纳月：</Col>
<Col span={6} className="formItem">
<WeaDatePicker
format="yyyy-MM"
value={data && data.socialStartTime}
onChange={value => this.handleFormChange({socialStartTime: value})}
/>
</Col>
<Col span={6} className="formItem">社保最后缴纳月：</Col>
<Col span={6} className="formItem">
<WeaDatePicker
format="yyyy-MM"
value={data && data.socialEndTime}
onChange={value => this.handleFormChange({socialEndTime: value})}
/>
</Col>
</Row>
<Row>
<Col span={6} className="formItem">社保方案名称：</Col>
<Col span={6} className="formItem">
<Select defaultValue={data && data.socialName}
notFoundContent="暂无数据" value={data && data.socialName} style={{ width: "100%" }} onChange={(value) => {
this.handleFormChange({socialName: value})
this.handleFetchPaymentForm(value)
}}>
{
items && items[0].items &&items[0].items[0] && items[0].items[0].options.map(item => (
<Option value={item.key}>{item.showname}</Option>
))
}
</Select>
</Col>
<Col span={6} className="formItem">社保账号：</Col>
<Col span={6} className="formItem">
<WeaInput value={data && data.schemeAccount} onChange={(value) => {this.handleFormChange({schemeAccount: value})}}/>
</Col>
</Row>
<Row>
<Col span={6} className="formItem">社保缴纳组织：</Col>
<Col span={6} className="formItem">
<Select defaultValue={data && data.paymentOrganization} value={data && data.paymentOrganization} style={{ width: "100%" }} onChange={(value) => this.handleFormChange({paymentOrganization: value})}>
{
items && items[0].items &&items[0].items[1] && items[0].items[1].options.map(item => (
<Option value={item.key}>{item.showname}</Option>
))
}
</Select>
</Col>
<Col span={6} className="formItem">社保个人实际承担方：</Col>
<Col span={6} className="formItem">
<Select defaultValue={data && data.underTake}
notFoundContent="暂无数据" value={data && data.underTake} style={{ width: "100%" }} onChange={
(value) => {
this.handleFormChange({underTake: value})
this.handleFetchPaymentForm(value)
}}>
{
items && items[0].items &&items[0].items[2] && items[0].items[2].options.map(item => (
<Option value={item.key}>{item.showname}</Option>
))
}
</Select>
</Col>
</Row>
</GroupCard>
{
paymentItems && paymentItems.map(group => (
<div>
{
group.items && group.items.length > 0 && <GroupCard title={group.title} >
<Row>
{
group.items && group.items.map(item => (
<Col span={12}>
<Row>
<Col span={12} className="formItem">{item.label}：</Col>
<Col span={12} className="formItem">
<WeaInput
type="number"
value={ paymentData && paymentData[item.domkey[0]]} onChange={(value) => {
this.handlePaymentChange({[item.domkey[0]]: value})
}}
/>
</Col>
</Row>
</Col>
))
}
</Row>
</GroupCard>
}
</div>
))
}
</div>
)
});
}
}
return (
<div className="socialFormWrapper">
<div style={{ overflow: "hidden" }}>
<WeaCheckbox style={{ float: "right", marginRight: "10px", marginTop: "10px" }}
value={data && data.nonPayment} id="nonPayment" content="暂不缴纳" onChange={(value) => {
this.handleFormChange({ nonPayment: value });
}}/>
</div>
<GroupCard title="社保基础信息">
<Row>
<Col span={6} className="formItem borderR-none borderB-none">社保起始缴纳月：</Col>
<Col span={6} className="formItem borderR-none borderB-none">
<WeaDatePicker
format="yyyy-MM"
value={data && data.socialStartTime}
onChange={value => this.handleFormChange({ socialStartTime: value })}
/>
</Col>
<Col span={6} className="formItem borderR-none borderB-none">社保最后缴纳月：</Col>
<Col span={6} className="formItem borderB-none">
<WeaDatePicker
format="yyyy-MM"
value={data && data.socialEndTime}
onChange={value => this.handleFormChange({ socialEndTime: value })}
/>
</Col>
</Row>
<Row>
<Col span={6} className="formItem borderR-none borderB-none">社保方案名称：</Col>
<Col span={6} className="formItem borderR-none borderB-none">
<Select defaultValue={data && data.socialName}
notFoundContent="暂无数据" value={data && data.socialName} style={{ width: "100%" }}
onChange={(value) => {
this.handleFormChange({ socialName: value });
this.handleFetchPaymentForm(value);
}}>
{
items && items[0].items && items[0].items[0] && items[0].items[0].options.map(item => (
<Option value={item.key}>{item.showname}</Option>
))
}
</Select>
</Col>
<Col span={6} className="formItem borderR-none borderB-none">社保账号：</Col>
<Col span={6} className="formItem borderB-none">
<WeaInput value={data && data.schemeAccount} onChange={(value) => {
this.handleFormChange({ schemeAccount: value });
}}/>
</Col>
</Row>
<Row>
<Col span={6} className="formItem borderR-none">缴纳组织：</Col>
<Col span={6} className="formItem borderR-none">
<Select defaultValue={data && data.paymentOrganization} value={data && data.paymentOrganization}
style={{ width: "100%" }}
onChange={(value) => this.handleFormChange({ paymentOrganization: value })}>
{
items && items[0].items && items[0].items[1] && items[0].items[1].options.map(item => (
<Option value={item.key}>{item.showname}</Option>
))
}
</Select>
</Col>
<Col span={6} className="formItem borderR-none">社保个人实际承担方：</Col>
<Col span={6} className="formItem">
<Select defaultValue={data && data.underTake}
notFoundContent="暂无数据" value={data && data.underTake} style={{ width: "100%" }} onChange={
(value) => {
this.handleFormChange({ underTake: value });
this.handleFetchPaymentForm(value);
}}>
{
items && items[0].items && items[0].items[2] && items[0].items[2].options.map(item => (
<Option value={item.key}>{item.showname}</Option>
))
}
</Select>
</Col>
</Row>
</GroupCard>
{
paymentItems && paymentItems.map(group => (
<div>
{
group.items && group.items.length > 0 && <GroupCard title={group.title}>
<Row>
{
group.items && group.items.map((item, idx) => (
<Col span={12}>
<Row>
<Col span={12}
className={cs("formItem", "borderR-none", { "borderB-none": idx !== group.items.length - 1 && idx !== group.items.length - 2 })}>{item.label}：</Col>
<Col span={12} className={cs("formItem", {
"borderR-none": idx === 0 || idx === 2,
"borderB-none": idx === 0 || idx === 2 || idx === 1
})}>
<WeaInput
type="number"
value={paymentData && paymentData[item.domkey[0]]} onChange={(value) => {
this.handlePaymentChange({ [item.domkey[0]]: value });
}}
/>
</Col>
</Row>
</Col>
))
}
</Row>
</GroupCard>
}
</div>
))
}
</div>
);
}
}