152 lines
7.3 KiB
JavaScript
152 lines
7.3 KiB
JavaScript
import React from 'react'
|
||
import GroupCard from '../../../components/groupCard'
|
||
import { Row, Col, Select } from 'antd';
|
||
import { WeaDatePicker, WeaInput } from 'ecCom';
|
||
import { inject, observer } from 'mobx-react';
|
||
import "./index.less"
|
||
import ItemMangeFormModal from '../../dataAcquisition/attendance/itemMangeFormModal';
|
||
|
||
const { Option } = Select
|
||
|
||
@inject('archivesStore')
|
||
@observer
|
||
export default class SocialSecurityForm extends React.Component {
|
||
componentWillMount() {
|
||
const { archivesStore } = this.props;
|
||
const { getBaseForm } = archivesStore
|
||
getBaseForm(this.props.employeeId, "SOCIAL_SECURITY")
|
||
}
|
||
|
||
// 表单变化
|
||
handleFormChange(params) {
|
||
const { archivesStore: { socialSecurityForm, setSocialSecurityForm }} = this.props;
|
||
const { data } = socialSecurityForm
|
||
let request = {...data, ...params}
|
||
let form = {...socialSecurityForm}
|
||
form.data = request
|
||
setSocialSecurityForm(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()
|
||
}
|
||
})
|
||
}
|
||
|
||
return (
|
||
<div className="socialFormWrapper">
|
||
<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} value={data && data.socialName} style={{ width: 150 }} onChange={(value) => { this.handleFormChange({socialName: 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: 150 }} 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: 150 }} 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>
|
||
)
|
||
}
|
||
} |