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

programme

This commit is contained in:
MustangDeng 2022-03-21 17:43:26 +08:00
parent 1e13b98152
commit be4051e5ea
9 changed files with 399 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
pc4mobx/hrmSalary/apis/welfareScheme.js
View File

@ -7,7 +7,14 @@ export const getTable = params => {
return WeaTools.callApi('/api/bs/hrmsalary/scheme/getTable', 'get', params);
};
export const createScheme = params => {
return WeaTools.callApi('/api/bs/hrmsalary/scheme/insert', 'post', params);
return fetch('/api/bs/hrmsalary/scheme/insert', {
method: 'POST',
mode: 'cors',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(params)
}).then(res => res.json())
};
export const updateScheme = params => {
return WeaTools.callApi('/api/bs/hrmsalary/scheme/update', 'post', params);

24
pc4mobx/hrmSalary/components/smallTab/index.js Normal file
View File

@ -0,0 +1,24 @@
import React from 'react'
import "./index.less"
export default class SmallTab extends React.Component {
constructor(props) {
super(props)
this.state = {
selectedItem: this.props.items[0]
}
}
render() {
const { selectedItem } = this.state
return (
<div className="smallTab">
{
this.props.items.map(item => (
<span className={selectedItem.title == item.title ? "tabItem tabItemSelected": "tabItem"} onClick={() => {this.setState({selectedItem: item}); this.props.onChange(item)}}>{item.title}</span>
))
}
</div>
)
}
}

13
pc4mobx/hrmSalary/components/smallTab/index.less Normal file
View File

@ -0,0 +1,13 @@
.smallTab {
.tabItem {
font-size: 12px;
margin-right: 10px;
padding-bottom: 5px;
cursor: pointer;
}
.tabItemSelected {
color: #2db7f5;
border-bottom: 1px solid #2db7f5;
}
}

2
pc4mobx/hrmSalary/pages/payroll/index.js
View File

@ -14,7 +14,7 @@ import ContentWrapper from '../../components/contentWrapper';
import { columns, dataSource, tempateColumns } from './columns';
import StepSlide from '../../components/stepSlide'
import ItemMangeFormModal from '../dataAcquisition/attendance/itemMangeFormModal';
import BaseInformForm from './stepForm/BaseInformForm'
import BaseInformForm from './stepForm/baseInformForm'
import ShowSettingForm from './stepForm/showSettingForm'
import SlideModalTitle from "../../components/slideModalTitle"

38
pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/columns.js
View File

@ -102,6 +102,44 @@ export const CustomBenefitsColumns = [
}
]
export const insertUpdateColumns = [
{
title: "类型名称",
dataIndex: "insuranceName",
key: "insuranceName"
},
{
title: "是否缴费",
dataIndex: "isPayment",
key: "isPayment"
},
{
title: "缴纳对象",
dataIndex: "paymentScope",
key: "paymentScope"
},
{
title: "缴纳比例%",
dataIndex: "paymentProportion",
key: "paymentProportion"
},
{
title: "固定费用",
dataIndex: "fixedCost",
key: "fixedCost"
},
{
title: "有效小数位",
dataIndex: "paymentScopeValue",
key: "paymentScopeValue"
},
{
title: "进位规则",
dataIndex: "rententionRule",
key: "rententionRule"
},
]
export const dataSource = [];

233
pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/defaultSlideForm.js Normal file
View File

@ -0,0 +1,233 @@
import React from 'react'
import { WeaSelect, WeaInput } from 'ecCom'
import { Table, Row, Col, Switch } from 'antd'
import { insertUpdateColumns } from './columns'
import { inject, observer } from 'mobx-react';
import SmallTab from '../../../components/smallTab'
import "./index.less"
@inject('programmeStore')
@observer
export default class DefaultSlideForm extends React.Component {
constructor(props) {
super(props)
this.state = {
value: "SCHEME_TOWN",
selectItem: "个人",
dataSource: {}
}
insertUpdateColumns.map(item => {
if(item.dataIndex == "isPayment") {
item.render = (text, record) => {
return (<Switch checked={text} onChange={(e) => {
this.updateDataSource(record, e, "isPayment")
}}/>)
}
} else if(item.dataIndex == "paymentScopeValue") {
let options = [
{
key: "0",
selected: false,
showname: "0"
},
{
key: "1",
selected: false,
showname: "1"
},
{
key: "2",
selected: true,
showname: "2"
}
]
item.render = (text, record) => {
return (
<WeaSelect
options={options}
value={text}
onChange={v => {
this.updateDataSource(record, v, "paymentScopeValue")
}}
/>
)
}
} else if(item.dataIndex == "rententionRule") {
let options = [
{
key: "1",
selected: false,
showname: "原始数据"
},
{
key: "2",
selected: false,
showname: "四舍五入"
},
{
key: "3",
selected: false,
showname: "向上舍入"
},
{
key: "4",
selected: false,
showname: "向下舍入"
},
]
item.render = (text, record) => {
return (
<WeaSelect
options={options}
value={text}
onChange={v => {
this.updateDataSource(record, v, "rententionRule")
}}
/>
)
}
} else if(item.dataIndex == "paymentProportion") {
item.render = (text, record) => {
return (
<WeaInput value={text} onChange={(v) => {
this.updateDataSource(record, v, "paymentProportion")
}}/>
)
}
} else if(item.dataIndex == "fixedCost") {
item.render = (text, record) => {
return (
<WeaInput value={text} onChange={(v) => {
this.updateDataSource(record, v, "fixedCost")
}} />
)
}
}
})
}
updateDataSource(record, e, key) {
const { programmeStore: {defaultCompanyDataSource, defaultPersonDataSource, setDefaultPersonDataSource, setDefaultCompanyDataSource}} = this.props;
let result = {...record}
result[key] = e
if(this.state.selectItem == "个人") {
let dataSource = [...defaultPersonDataSource];
dataSource = dataSource.map(item => {
if(item.id == result.id)
return result;
else
return item;
})
setDefaultPersonDataSource(dataSource)
} else {
let dataSource = [...defaultCompanyDataSource];
dataSource = dataSource.map(item => {
if(item.id == result.id)
return result;
else
return item;
})
setDefaultCompanyDataSource(dataSource)
}
}
componentWillMount() {
const { programmeStore } = this.props;
const { getForm, selectedKey, defaultPersonDataSource } = programmeStore
getForm({welfareTypeEnum: selectedKey})
}
render() {
const { programmeStore } = this.props;
const { defaultPersonDataSource, defaultCompanyDataSource, selectedKey } = programmeStore
const { dataSource } = this.state;
const options = [
{
key: "SCHEME_TOWN",
selected: true,
showname: "城镇"
},
{
key: "SCHEME_VILLAGE",
selected: false,
showname: "农村"
}
]
const handleSmallTabChange = (item) => {
let paymentArea = item == "paymentArea" ? "1": "2"
let requestParams = {...this.props.requestParams}
requestParams.paymentArea = paymentArea
this.setState({
selectItem: item.value,
})
this.props.onChange(requestParams)
}
return (
<div className="defaultSlideForm">
<div>
<Row style={{lineHeight: "40px"}}>
<Col span={6}>
缴纳类型
</Col>
<Col span={18}>
<WeaSelect
style={{width: "200px"}}
options={options}
value={this.state.value}
onChange={(v, showname) => {
this.setState({ value: v });
console.log("v", v, "showname:", showname);
}}
/>
</Col>
</Row>
<Row style={{lineHeight: "40px"}}>
<Col span={6}>
方案名称
</Col>
<Col span={18}>
<WeaInput value={this.props.requestParams.schemeName} onChange={(value) => {
let requestParams = {...this.props.requestParams}
requestParams.schemeName = value
this.props.onChange(requestParams)
}}/>
</Col>
</Row>
<Row style={{lineHeight: "40px"}}>
<Col span={6}>
备注
</Col>
<Col span={18}>
<WeaInput value={this.props.requestParams.remarks} onChange={(value) => {
let requestParams = {...this.props.requestParams}
requestParams.remarks = value
this.props.onChange(requestParams)
}}/>
</Col>
</Row>
</div>
<div className="tableBar">
<div>
<SmallTab items={[{title: "个人", value: "个人"}, {title: '公司', value: '公司'}]} onChange={(item) => {handleSmallTabChange(item)}} />
</div>
<div className="tableWrapper">
{
this.state.selectItem == "个人" ?
<Table dataSource={defaultPersonDataSource} columns={insertUpdateColumns} />
:
<Table dataSource={defaultCompanyDataSource} columns={insertUpdateColumns} />
}
</div>
</div>
</div>
)
}
}

42
pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.js
View File

@ -2,7 +2,7 @@ import React from 'react';
import { inject, observer } from 'mobx-react';
import { toJS } from 'mobx';
import { Button, Table, DatePicker } from 'antd';
import { Button, Table, DatePicker, Row, Col } from 'antd';
import { WeaTop, WeaTab, WeaRightMenu, WeaRangePicker, WeaInputSearch, WeaSlideModal, WeaSelect } from 'ecCom';
import { WeaTableNew } from "comsMobx"
@ -15,6 +15,7 @@ import CustomTab from '../../../components/customTab';
import ContentWrapper from '../../../components/contentWrapper';
import SlideModalTitle from '../../../components/slideModalTitle';
import TipLabel from '../../../components/TipLabel'
import DefaultSlideForm from './defaultSlideForm'
import {
@ -36,7 +37,12 @@ export default class Programme extends React.Component {
this.state = {
value: "",
searchValue: "",
slideVisiable: false
slideVisiable: false,
requestParams: {
schemeName: "",
remarks: "",
paymentArea: "1"
}
}
}
@ -108,9 +114,13 @@ export default class Programme extends React.Component {
}
]
const handleNewClick = () => {
this.setState({ slideVisiable: true })
}
const renderSearchOperationItem = () => {
return <div>
<Button type="primary" style={{ marginRight: '10px' }} onClick={() => { this.setState({ slideVisiable: true }) }}>新增</Button>
<Button type="primary" style={{ marginRight: '10px' }} onClick={() => { handleNewClick() }}>新建</Button>
{
selectedKey == "custom" && <WeaSelect
@ -124,7 +134,24 @@ export default class Programme extends React.Component {
/>
}
</div>
}
const handleOnSave = () => {
let {requestParams} = this.state;
let { schemeName, remarks, paymentArea } = requestParams
const { programmeStore } = this.props
const { selectedKey, defaultPersonDataSource, defaultCompanyDataSource, createScheme } = programmeStore
let request = {
insuranceScheme: {
paymentType: paymentArea == "1" ? "SCHEME_TOWN": "SCHEME_VILLAGE",
welfareType: selectedKey,
schemeName,
remarks,
paymentArea
},
insuranceSchemeDetailList: [...defaultPersonDataSource, ...defaultCompanyDataSource]
}
createScheme(request)
}
const renderCustomRightContent = () => {
@ -155,10 +182,10 @@ export default class Programme extends React.Component {
renderSearchOperationItem()
}
onChange={(v) => {
setSelectedKey(v)
if(v == "custom") { // 自定义福利
getCustomCategoryList()
} else {
setSelectedKey(v)
getTableDatas(v)
}
}}
@ -196,9 +223,14 @@ export default class Programme extends React.Component {
<SlideModalTitle
subtitle="新增社保方案"
subTabs={[{title: "基础设置"}]}
onSave={() => {
handleOnSave();
}}
/>
}
content={(<div>Content</div>)}
content={(<DefaultSlideForm requestParams={this.state.requestParams} onChange={(requestParams) => {
this.setState({requestParams})
}}/>)}
onClose={() => this.setState({ slideVisiable: false })}
showMask={true}
closeMaskOnClick={() => this.setState({ slideVisiable: false })}

9
pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.less
View File

@ -0,0 +1,9 @@
.defaultSlideForm {
padding: 20px;
.tableBar {
margin-top: 10px;
}
.tableWrapper {
margin-top: 10px;
}
}

36
pc4mobx/hrmSalary/stores/programme.js
View File

@ -15,6 +15,22 @@ export class ProgrammeStore {
@observable loading = true; // 数据加载状态
@observable selectedKey = "SOCIAL_SECURITY";
@observable customSelectkey = ""
@observable defaultPersonDataSource = []; // 默认新增列表DataSource
@observable defaultCompanyDataSource = [];
@observable requestParams = {
schemeName: "",
remarks: "",
paymentArea: "1"
}
@action
setRequestParams = requestParams => this.requestParams;
@action
setDefaultPersonDataSource = defaultPersonDataSource => this.defaultPersonDataSource = defaultPersonDataSource;
@action
setDefaultCompanyDataSource = defaultCompanyDataSource => this.defaultCompanyDataSource = defaultCompanyDataSource;
@action
setCustomSelectkey = customSelectkey => this.customSelectkey = customSelectkey;
@ -86,4 +102,24 @@ export class ProgrammeStore {
this.showSearchAd = false;
}
// 获取form, 获取获取详情
@action getForm = (params) => {
API.getForm(params).then(res => {
if(res.status) {
let resultList = res.data.form.schemeDetailList;
this.defaultPersonDataSource = resultList.filter(item => item.paymentScope == "个人")
this.defaultCompanyDataSource = resultList.filter(item => item.paymentScope == "公司")
}
})
}
@action createScheme = (params) => {
API.createScheme(params).then(res => {
if(res.status) {
message.success("新建成功");
this.getTableDatas();
}
})
}
}