diff --git a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/columns.js b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/columns.js index 2f45ede4..17240998 100644 --- a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/columns.js +++ b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/columns.js @@ -106,47 +106,68 @@ export const insertUpdateColumns = [ { title: "类型名称", dataIndex: "insuranceName", - key: "insuranceName" + key: "insuranceName", + width: 120 }, { title: "是否缴费", dataIndex: "isPayment", - key: "isPayment" + key: "isPayment", + width: 100 }, { title: "缴纳对象", dataIndex: "paymentScope", - key: "paymentScope" + key: "paymentScope", + width: 100 + }, + { + title: "缴纳周期", + dataIndex: "paymentCycle", + key: "paymentCycle", + width: 200 + }, + { + title: "核算方式", + dataIndex: "accountType", + key: "accountType", + width: 200 }, { title: "基数下限", dataIndex: "lowerLimit", - key: "lowerLimit" + key: "lowerLimit", + width: 100 }, { title: "基数上限", dataIndex: "upperLimit", - key: "upperLimit" + key: "upperLimit", + width: 100 }, { title: "缴纳比例%", dataIndex: "paymentProportion", - key: "paymentProportion" + key: "paymentProportion", + width: 100 }, { title: "固定费用", dataIndex: "fixedCost", - key: "fixedCost" + key: "fixedCost", + width: 100 }, { title: "有效小数位", dataIndex: "validNum", - key: "validNum" + key: "validNum", + width: 100 }, { title: "进位规则", dataIndex: "rententionRule", - key: "rententionRule" + key: "rententionRule", + width: 100 } ]; diff --git a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/defaultSlideForm.js b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/defaultSlideForm.js index f523d68f..2d28bd46 100644 --- a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/defaultSlideForm.js +++ b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/defaultSlideForm.js @@ -1,9 +1,10 @@ import React from "react"; -import { WeaInput, WeaInputNumber, WeaSelect, WeaTable } from "ecCom"; +import { WeaHelpfulTip, WeaInput, WeaInputNumber, WeaSelect, WeaTable } from "ecCom"; import { Col, Row, Switch } from "antd"; import { insertUpdateColumns } from "./columns"; import { inject, observer } from "mobx-react"; import SmallTab from "../../../components/smallTab"; +import PaymentPeriodModal from "./paymentPeriodModal"; import "./index.less"; @inject("programmeStore", "salaryFileStore", "taxAgentStore") @@ -14,7 +15,12 @@ export default class DefaultSlideForm extends React.Component { this.state = { value: "SCHEME_TOWN", selectItem: "个人", - dataSource: {} + dataSource: {}, + paymentPeriodModal: { + visible: false, + record: {}, + cycleSetting: "000000000000" + } }; insertUpdateColumns.map(item => { if (item.dataIndex == "isPayment") { @@ -153,11 +159,93 @@ export default class DefaultSlideForm extends React.Component { /> ); }; + } else if (item.dataIndex === "paymentCycle") { + item.title =
+ 缴纳周期 + +
例:养老保险缴纳周期选择3/6/9/12;
+
+
+ 若:核算方式选择基数求和*比例;则数据核算逻辑为: + 账单月1月2月时,养老保险不会被核算; + 账单月3月时,养老保险核算金额为:养老保险月缴纳基数*3*缴纳比例+固定费用*3 + (3代表1月2月3月 3个月,*3代表3个月基数相加和固定费用相加) +
+
+
+ 若:核算方式选择基数*比例再求和;则数据核算逻辑为: + 账单月1月2月时,养老保险不会被核算; + 账单月3月时,养老保险核算金额为: + 将1~3月算出来的【养老保险月缴纳基数*缴纳比例+固定费用】求和 +
+
+
+ 若:缴纳周期选择选择月缴,则核算方式默认为【基数*比例+固定费用】,不可修改 +
+
+ } + placement="topLeft" + /> + ; + item.render = (text, record) => { + return ( +
+ { + this.updateDataSource(record, v, "paymentCycle"); + }} + /> + { + record.paymentCycle === "1" && + this.setState({ + paymentPeriodModal: { + visible: true, + record: record, + cycleSetting: record.cycleSetting || "000000000000" + } + })}>设置 + } +
+ ); + }; + } else if (item.dataIndex === "accountType") { + item.render = (text, record) => { + if (record.paymentCycle === "0") { + return ( +
基数*比例+固定费用
+ ); + } else { + return ( + { + this.updateDataSource(record, v, "accountType"); + }} + /> + ); + } + }; } }); } - updateDataSource(record, e, key) { + updateDataSource = (record, e, key) => { const { programmeStore: { defaultCompanyDataSource, @@ -167,6 +255,11 @@ export default class DefaultSlideForm extends React.Component { } } = this.props; let result = { ...record }; + if (key === "paymentCycle" && e === "1") { + result["accountType"] = "1"; + } else if (key === "paymentCycle" && e === "0") { + result["accountType"] = record.accountType; + } result[key] = e; if (key === "upperLimit" || key === "lowerLimit") { let dataSource = [...defaultPersonDataSource], @@ -198,7 +291,44 @@ export default class DefaultSlideForm extends React.Component { setDefaultCompanyDataSource(dataSource); } } - } + }; + + handleSetPaymentPeriod = (cycleSetting) => { + let cycleObj = { + 1: "0", + 2: "0", + 3: "0", + 4: "0", + 5: "0", + 6: "0", + 7: "0", + 8: "0", + 9: "0", + 10: "0", + 11: "0", + 12: "0" + }; + if (!_.isEmpty(cycleSetting)) { + _.forEach(cycleSetting, item => { + _.assign(cycleObj, { [item]: "1" }); + }); + } else { + _.forEach(Object.keys(cycleObj), item => { + _.assign(cycleObj, { [item]: "0" }); + }); + } + const tmpVStr = _.reduce(Object.values(cycleObj), (pre, cur) => { + return pre + cur; + }, ""); + this.setState({ + paymentPeriodModal: { + ...this.state.paymentPeriodModal, + cycleSetting: tmpVStr + } + }, () => { + this.updateDataSource(this.state.paymentPeriodModal.record, tmpVStr, "cycleSetting"); + }); + }; componentDidMount() { const { taxAgentStore } = this.props; @@ -207,6 +337,7 @@ export default class DefaultSlideForm extends React.Component { } render() { + const { paymentPeriodModal } = this.state; const { programmeStore, salaryFileStore, taxAgentStore } = this.props; const { userStatusList } = salaryFileStore; const { taxAgentAdminOption, getTaxAgentSelectListAsAdmin } = taxAgentStore; @@ -284,7 +415,7 @@ export default class DefaultSlideForm extends React.Component { onChange={(visibleVal) => { let requestParams = { ...this.props.requestParams }; visibleVal === "1" && getTaxAgentSelectListAsAdmin(); - (visibleVal === "0" || visibleVal === "") && (requestParams.taxAgentIds = ''); + (visibleVal === "0" || visibleVal === "") && (requestParams.taxAgentIds = ""); requestParams.sharedType = visibleVal; this.props.onChange(requestParams); }} @@ -346,13 +477,26 @@ export default class DefaultSlideForm extends React.Component { dataSource={defaultPersonDataSource} columns={insertUpdateColumns} pagination={false} + scroll={{ x: "1000px" }} /> : } + this.setState({ + paymentPeriodModal: { + visible: false, + record: {}, + cycleSetting: "000000000000" + } + })} + onSetPaymentPeriod={this.handleSetPaymentPeriod} + /> ); diff --git a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.less b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.less index e3a59e8a..98d96ad4 100644 --- a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.less +++ b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.less @@ -71,3 +71,37 @@ } } } + +//设置缴纳周期 +.paymentPeriodWrapper { + .paymentPeriodContent { + padding: 16px; + + .paymentPeriodAll { + height: 48px; + display: flex; + align-items: center; + padding: 8px 8px 8px 45px; + border: 1px solid #e5e5e5; + } + + .ant-checkbox-group { + padding: 5px 16px; + width: 100%; + display: flex; + justify-content: space-between; + flex-wrap: wrap; + align-content: flex-start; + border: 1px solid #e5e5e5; + border-top: none; + + .ant-checkbox-group-item { + margin: 8px 0; + padding-left: 30px; + width: 33.3%; + max-width: 33.3%; + overflow: hidden; + } + } + } +} diff --git a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/paymentPeriodModal.js b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/paymentPeriodModal.js new file mode 100644 index 00000000..6621acd5 --- /dev/null +++ b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/paymentPeriodModal.js @@ -0,0 +1,101 @@ +/* + * Author: 黎永顺 + * name: 设置缴纳周期 + * Description: + * Date: 2023/2/1 + */ +import React, { Component } from "react"; +import { WeaDialog } from "ecCom"; +import { Button, Checkbox } from "antd"; +import "./index.less"; + +const CheckboxGroup = Checkbox.Group; + +class PaymentPeriodModal extends Component { + constructor(props) { + super(props); + this.state = { + allSelect: false, + monthList: [] + }; + } + + componentWillReceiveProps(nextProps, nextContext) { + if (nextProps.visible !== this.props.visible && nextProps.visible) { + this.setState({ + monthList: _.filter(_.map(nextProps.cycleSetting.split(""), (item, index) => { + return item === "1" ? (index + 1).toString() : ""; + }), child => !!child) + }, () => { + this.setState({ + allSelect: this.state.monthList.length === 12 + }); + }); + } + } + + handleChangeALl = (e) => { + this.setState({ allSelect: e.target.checked }, () => { + if (this.state.allSelect) { + this.setState({ + monthList: ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"] + }, () => this.props.onSetPaymentPeriod(this.state.monthList)); + } else { + this.setState({ + monthList: [] + }, () => this.props.onSetPaymentPeriod(this.state.monthList)); + } + }); + }; + handleChangeMonth = (monthList) => { + this.setState({ monthList }, () => { + this.props.onSetPaymentPeriod(this.state.monthList); + this.setState({ + allSelect: this.state.monthList.length === 12 + }); + }); + }; + + render() { + const { onCancel, visible } = this.props; + const { monthList, allSelect } = this.state; + const buttons = [ + , + + ]; + const options = [ + { label: "一月", value: "1" }, + { label: "二月", value: "2" }, + { label: "三月", value: "3" }, + { label: "四月", value: "4" }, + { label: "五月", value: "5" }, + { label: "六月", value: "6" }, + { label: "七月", value: "7" }, + { label: "八月", value: "8" }, + { label: "九月", value: "9" }, + { label: "十月", value: "10" }, + { label: "十一月", value: "11" }, + { label: "十二月", value: "12" } + ]; + return ( + +
+
+ 全选 +
+ +
+
+ ); + } +} + +export default PaymentPeriodModal;