From be4051e5ea31d809e978375335ec452e49fb79e8 Mon Sep 17 00:00:00 2001 From: MustangDeng <670124965@qq.com> Date: Mon, 21 Mar 2022 17:43:26 +0800 Subject: [PATCH] programme --- pc4mobx/hrmSalary/apis/welfareScheme.js | 9 +- .../hrmSalary/components/smallTab/index.js | 24 ++ .../hrmSalary/components/smallTab/index.less | 13 + pc4mobx/hrmSalary/pages/payroll/index.js | 2 +- .../programme/columns.js | 38 +++ .../programme/defaultSlideForm.js | 233 ++++++++++++++++++ .../socialSecurityBenefits/programme/index.js | 42 +++- .../programme/index.less | 9 + pc4mobx/hrmSalary/stores/programme.js | 36 +++ 9 files changed, 399 insertions(+), 7 deletions(-) create mode 100644 pc4mobx/hrmSalary/components/smallTab/index.js create mode 100644 pc4mobx/hrmSalary/components/smallTab/index.less create mode 100644 pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/defaultSlideForm.js diff --git a/pc4mobx/hrmSalary/apis/welfareScheme.js b/pc4mobx/hrmSalary/apis/welfareScheme.js index 3fd87bfe..b9f851d3 100644 --- a/pc4mobx/hrmSalary/apis/welfareScheme.js +++ b/pc4mobx/hrmSalary/apis/welfareScheme.js @@ -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); diff --git a/pc4mobx/hrmSalary/components/smallTab/index.js b/pc4mobx/hrmSalary/components/smallTab/index.js new file mode 100644 index 00000000..dd3e00f3 --- /dev/null +++ b/pc4mobx/hrmSalary/components/smallTab/index.js @@ -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 ( +
+ { + this.props.items.map(item => ( + {this.setState({selectedItem: item}); this.props.onChange(item)}}>{item.title} + )) + } +
+ ) + } +} \ No newline at end of file diff --git a/pc4mobx/hrmSalary/components/smallTab/index.less b/pc4mobx/hrmSalary/components/smallTab/index.less new file mode 100644 index 00000000..5cc7f031 --- /dev/null +++ b/pc4mobx/hrmSalary/components/smallTab/index.less @@ -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; + } +} \ No newline at end of file diff --git a/pc4mobx/hrmSalary/pages/payroll/index.js b/pc4mobx/hrmSalary/pages/payroll/index.js index 411f2ba3..e788e292 100644 --- a/pc4mobx/hrmSalary/pages/payroll/index.js +++ b/pc4mobx/hrmSalary/pages/payroll/index.js @@ -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" diff --git a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/columns.js b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/columns.js index 1eef102b..25edd31a 100644 --- a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/columns.js +++ b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/columns.js @@ -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 = []; diff --git a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/defaultSlideForm.js b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/defaultSlideForm.js new file mode 100644 index 00000000..ba57dfed --- /dev/null +++ b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/defaultSlideForm.js @@ -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 ( { + 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 ( + { + 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 ( + { + this.updateDataSource(record, v, "rententionRule") + }} + /> + ) + } + } else if(item.dataIndex == "paymentProportion") { + item.render = (text, record) => { + return ( + { + this.updateDataSource(record, v, "paymentProportion") + }}/> + ) + } + } else if(item.dataIndex == "fixedCost") { + item.render = (text, record) => { + return ( + { + 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 ( +
+
+ + + 缴纳类型 + + + { + this.setState({ value: v }); + console.log("v", v, "showname:", showname); + }} + /> + + + + + + + 方案名称 + + + { + let requestParams = {...this.props.requestParams} + requestParams.schemeName = value + this.props.onChange(requestParams) + }}/> + + + + + + 备注 + + + { + let requestParams = {...this.props.requestParams} + requestParams.remarks = value + this.props.onChange(requestParams) + }}/> + + +
+ +
+
+ {handleSmallTabChange(item)}} /> +
+ +
+ { + this.state.selectItem == "个人" ? + + : +
+ } + + + + ) + } +} \ No newline at end of file diff --git a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.js b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.js index fa502551..79c82ed7 100644 --- a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.js +++ b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.js @@ -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
- + { selectedKey == "custom" && }
+ } + 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 { { + handleOnSave(); + }} /> } - content={(
Content
)} + content={( { + this.setState({requestParams}) + }}/>)} onClose={() => this.setState({ slideVisiable: false })} showMask={true} closeMaskOnClick={() => this.setState({ slideVisiable: false })} diff --git a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.less b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.less index e69de29b..056fe4c9 100644 --- a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.less +++ b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.less @@ -0,0 +1,9 @@ +.defaultSlideForm { + padding: 20px; + .tableBar { + margin-top: 10px; + } + .tableWrapper { + margin-top: 10px; + } +} \ No newline at end of file diff --git a/pc4mobx/hrmSalary/stores/programme.js b/pc4mobx/hrmSalary/stores/programme.js index 6d5f74c5..de215f46 100644 --- a/pc4mobx/hrmSalary/stores/programme.js +++ b/pc4mobx/hrmSalary/stores/programme.js @@ -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(); + } + }) + } + } \ No newline at end of file