384 lines
14 KiB
JavaScript
384 lines
14 KiB
JavaScript
/*
|
||
* Author: 黎永顺
|
||
* name: 薪资账套基本设置
|
||
* Description:
|
||
* Date: 2022/12/9
|
||
*/
|
||
import React, { Component } from "react";
|
||
import { WeaCheckbox, WeaFormItem, WeaHelpfulTip, WeaInput, WeaSelect, WeaTextarea } from "ecCom";
|
||
import { Col, Row } from "antd";
|
||
import { inject, observer } from "mobx-react";
|
||
import { baseSettingFormItem } from "../config";
|
||
import { getLedgerBasicForm } from "../../../apis/ledger";
|
||
import {
|
||
generateBasicInfo,
|
||
getAddMonthYearMonth,
|
||
getCurrentYearMonth,
|
||
getMonthDays,
|
||
getSubtractMonthYearMonth,
|
||
prefixAddZero
|
||
} from "../../../util/date";
|
||
import { commonEnumList } from "../../../apis/ruleconfig";
|
||
import moment from "moment";
|
||
import "./index.less";
|
||
|
||
@inject("taxAgentStore")
|
||
@observer
|
||
class LedgerBaseSetting extends Component {
|
||
constructor(props) {
|
||
super(props);
|
||
this.state = {
|
||
baseForm: [],
|
||
settingBaseInfo: {
|
||
name: "",
|
||
taxAgentId: "",
|
||
taxableItems: "1",
|
||
salaryCycleType: "3",
|
||
salaryCycleFromDay: "1",
|
||
taxCycleType: "3",
|
||
attendCycleType: "3",
|
||
attendCycleFromDay: "1",
|
||
socialSecurityCycleType: "3",
|
||
description: "",
|
||
canEdit: false
|
||
}
|
||
};
|
||
}
|
||
|
||
componentWillMount() {
|
||
this.getTaxAgentSelectListAsAdmin();
|
||
}
|
||
|
||
componentDidMount() {
|
||
// this.getTaxAgentSelectListAsAdmin();
|
||
// this.commonEenumList();
|
||
if (this.props.visible && this.props.editId) {
|
||
this.getLedgerBasicForm(this.props.editId);
|
||
}
|
||
}
|
||
|
||
componentWillReceiveProps(nextProps, nextContext) {
|
||
if (nextProps.visible !== this.props.visible && nextProps.editId) {
|
||
this.getLedgerBasicForm(nextProps.editId);
|
||
}
|
||
if (nextProps.visible !== this.props.visible && !nextProps.editId) {
|
||
this.handleResetBaseInfo();
|
||
}
|
||
}
|
||
|
||
handleResetBaseInfo = () => {
|
||
this.setState({
|
||
settingBaseInfo: {
|
||
name: "",
|
||
taxAgentId: "",
|
||
taxableItems: "1",
|
||
salaryCycleType: "3",
|
||
salaryCycleFromDay: "1",
|
||
taxCycleType: "3",
|
||
attendCycleType: "3",
|
||
attendCycleFromDay: "1",
|
||
socialSecurityCycleType: "3",
|
||
description: "",
|
||
canEdit: "true"
|
||
}
|
||
}, () => this.props.onTaxableItemsChange(this.state.settingBaseInfo.taxableItems));
|
||
};
|
||
getLedgerBasicForm = (id) => {
|
||
getLedgerBasicForm({ id }).then(({ status, data }) => {
|
||
if (status) {
|
||
const { basicForm } = data;
|
||
const { settingBaseInfo } = this.state;
|
||
let tmpV = {};
|
||
_.map(Object.keys(settingBaseInfo), key => {
|
||
tmpV[key] = !_.isNil(basicForm[key]) ? basicForm[key].toString() : "";
|
||
});
|
||
this.setState({
|
||
settingBaseInfo: {
|
||
...settingBaseInfo,
|
||
...tmpV
|
||
}
|
||
}, () => {
|
||
this.props.onSaveParams(this.state.settingBaseInfo);
|
||
this.props.onTaxableItemsChange(this.state.settingBaseInfo.taxableItems);
|
||
});
|
||
}
|
||
});
|
||
};
|
||
getTaxAgentSelectListAsAdmin = () => {
|
||
const { taxAgentStore } = this.props;
|
||
const { getTaxAgentSelectListAsAdmin } = taxAgentStore;
|
||
getTaxAgentSelectListAsAdmin().then(({ status, data }) => {
|
||
if (status) {
|
||
this.setState({
|
||
baseForm: _.map(baseSettingFormItem, it => {
|
||
if (it.key === "taxAgentId") {
|
||
return {
|
||
...it,
|
||
options: _.map(data, it => ({ key: it.id, showname: it.content }))
|
||
};
|
||
}
|
||
return { ...it };
|
||
})
|
||
}, () => this.commonEenumList());
|
||
}
|
||
});
|
||
};
|
||
commonEenumList = () => {
|
||
const payload = {
|
||
enumClass: "com.engine.salary.enums.salarysob.IncomeCategoryEnum"
|
||
};
|
||
commonEnumList(payload).then(({ status, data }) => {
|
||
if (status) {
|
||
const { baseForm } = this.state;
|
||
this.setState({
|
||
baseForm: _.map(baseForm, it => {
|
||
if (it.key === "taxableItems") {
|
||
return {
|
||
...it,
|
||
options: _.map(data, it => ({ key: it.value.toString(), showname: it.defaultLabel }))
|
||
};
|
||
}
|
||
return { ...it };
|
||
})
|
||
});
|
||
}
|
||
});
|
||
};
|
||
handleChangeField = (key, value) => {
|
||
const { onSaveParams } = this.props;
|
||
const { settingBaseInfo } = this.state;
|
||
this.setState({
|
||
settingBaseInfo: {
|
||
...settingBaseInfo,
|
||
[key]: value
|
||
}
|
||
}, () => {
|
||
onSaveParams(this.state.settingBaseInfo);
|
||
this.props.onTaxableItemsChange(this.state.settingBaseInfo.taxableItems);
|
||
});
|
||
};
|
||
|
||
render() {
|
||
const { editId, taxAgentStore: { taxAgentOption } } = this.props;
|
||
const { baseForm, settingBaseInfo } = this.state;
|
||
const { canEdit, taxAgentId } = settingBaseInfo;
|
||
let taxAgentIdDisabled = false, taxableItemsDisabled = false;
|
||
return (
|
||
<div className="baseSettingWrapper">
|
||
<Row gutter={20}>
|
||
<Col span={18} className="baseSettingLeft">
|
||
{
|
||
_.map(baseForm, item => {
|
||
const { key, label, type, options = [], children = [] } = item;
|
||
taxAgentIdDisabled = key === "taxAgentId" && editId && taxAgentId;
|
||
taxableItemsDisabled = key === "taxableItems" && editId;
|
||
return <WeaFormItem
|
||
key={key} label={label}
|
||
labelCol={{ span: 6 }} wrapperCol={{ span: 12 }}
|
||
>
|
||
{
|
||
type === "INPUT" ?
|
||
<WeaInput value={settingBaseInfo[key]} viewAttr={3} disabled={canEdit !== "true"}
|
||
onChange={(v) => this.handleChangeField(key, v)}/> :
|
||
type === "TEXTAREA" ?
|
||
<WeaTextarea value={settingBaseInfo[key]} disabled={canEdit !== "true"}
|
||
onChange={(v) => this.handleChangeField(key, v)}/> :
|
||
type === "CHECKBOX" ?
|
||
<React.Fragment>
|
||
<WeaCheckbox value={true} viewAttr={1}
|
||
content="【起薪日期≤薪资周期止】且【最后发薪日期≥薪资周期起】"/>
|
||
<WeaHelpfulTip width={200} title="提示：最后发薪日期为空，默认为无穷大" placement="topLeft"/>
|
||
</React.Fragment> :
|
||
type === "SELECT" ?
|
||
<WeaSelect value={settingBaseInfo[key]}
|
||
options={((canEdit !== "true" || taxAgentIdDisabled || taxableItemsDisabled) && key === "taxAgentId") ? taxAgentOption : options}
|
||
viewAttr={3}
|
||
disabled={canEdit !== "true" || taxAgentIdDisabled || taxableItemsDisabled}
|
||
onChange={(v) => this.handleChangeField(key, v)}/> :
|
||
type === "CUSTOM" ?
|
||
<CustomSelect list={children} baseInfo={settingBaseInfo} inputStr={key}
|
||
onChange={(key, v) => this.handleChangeField(key, v)}/> : null
|
||
}
|
||
</WeaFormItem>;
|
||
})
|
||
}
|
||
</Col>
|
||
<Col span={6}><MonthCycleDesc {...settingBaseInfo}/></Col>
|
||
</Row>
|
||
</div>
|
||
);
|
||
}
|
||
}
|
||
|
||
export default LedgerBaseSetting;
|
||
|
||
const CustomSelect = (props) => {
|
||
const { list, baseInfo, onChange, inputStr } = props;
|
||
const { canEdit } = baseInfo;
|
||
const selectInfo = buildEditBasicInfo(baseInfo);
|
||
return <Row gutter={10} key={inputStr}>
|
||
{
|
||
_.map(list, item => {
|
||
const { key, options = [] } = item;
|
||
return <Col span={6}>
|
||
<WeaSelect value={baseInfo[key]} options={options} viewAttr={3}
|
||
disabled={canEdit !== "true"}
|
||
onChange={(v) => onChange(key, v)}/>
|
||
</Col>;
|
||
})
|
||
}
|
||
<Col span={12}
|
||
className="desc">{inputStr === "salaryCycleStrObj" ? selectInfo.salaryCycleInfo.salaryPeriodTip : selectInfo.attendCycleInfo.attendancePeriodTip}</Col>
|
||
</Row>;
|
||
};
|
||
const MonthCycleDesc = (props) => {
|
||
const { taxCycleType, socialSecurityCycleType } = props;
|
||
const selectInfo = buildEditBasicInfo({ ...props });
|
||
return <div className="baseSettingRight">
|
||
<div className="title">月份周期说明</div>
|
||
<div className="descContent">
|
||
<div>
|
||
例：薪资所属月是<span className="notice">{moment().format("YYYY-MM")}</span>（即核算员工<span
|
||
className="notice">{moment().format("MM")}</span>月的工资）
|
||
</div>
|
||
<div>根据您当前的选择，相应的周期为：</div>
|
||
<div className="descTitle">薪资周期</div>
|
||
<div>
|
||
<span className="notice">{selectInfo.salaryCycleInfo.salaryPeriodStart}</span>至
|
||
<span className="notice">{selectInfo.salaryCycleInfo.salaryPeriodEnd}</span>
|
||
</div>
|
||
<div className="descTitle">税款所属期</div>
|
||
<div className="notice">{getMonth(taxCycleType)}</div>
|
||
<div className="descTitle">考勤取值周期</div>
|
||
<div>
|
||
<span className="notice">{selectInfo.attendCycleInfo.attendancePeriodStart}</span>至
|
||
<span className="notice">{selectInfo.attendCycleInfo.attendancePeriodEnd}</span>
|
||
</div>
|
||
<div className="descTitle">福利台账月份</div>
|
||
<div>引用<span className="notice">{getMonth(socialSecurityCycleType)}</span>的福利台账数据</div>
|
||
</div>
|
||
</div>;
|
||
};
|
||
const buildEditBasicInfo = (editBasicInfo) => {
|
||
const { attendCycleType, salaryCycleType } = editBasicInfo;
|
||
const now = new Date();
|
||
let nowYear = now.getFullYear();
|
||
let nowMonth = now.getMonth() + 1;
|
||
let tmpV = {};
|
||
// 薪资联动
|
||
switch (salaryCycleType) {
|
||
case "1" :
|
||
tmpV["salaryCycleInfo"] = buildSalaryInfo(editBasicInfo, -2, nowYear, nowMonth);
|
||
break;
|
||
case "2" :
|
||
tmpV["salaryCycleInfo"] = buildSalaryInfo(editBasicInfo, -1, nowYear, nowMonth);
|
||
break;
|
||
case "3" :
|
||
tmpV["salaryCycleInfo"] = buildSalaryInfo(editBasicInfo, 0, nowYear, nowMonth);
|
||
break;
|
||
case "4" :
|
||
tmpV["salaryCycleInfo"] = buildSalaryInfo(editBasicInfo, 1, nowYear, nowMonth);
|
||
break;
|
||
}
|
||
// 考勤联动
|
||
switch (attendCycleType) {
|
||
case "1" :
|
||
tmpV["attendCycleInfo"] = buildAttendanceInfo(editBasicInfo, -2, nowYear, nowMonth);
|
||
break;
|
||
case "2" :
|
||
tmpV["attendCycleInfo"] = buildAttendanceInfo(editBasicInfo, -1, nowYear, nowMonth);
|
||
break;
|
||
case "3" :
|
||
tmpV["attendCycleInfo"] = buildAttendanceInfo(editBasicInfo, 0, nowYear, nowMonth);
|
||
break;
|
||
case "4" :
|
||
tmpV["attendCycleInfo"] = buildAttendanceInfo(editBasicInfo, 1, nowYear, nowMonth);
|
||
break;
|
||
}
|
||
return tmpV;
|
||
};
|
||
/*
|
||
* Author: 黎永顺
|
||
* Description:构建薪资周期联动信息
|
||
* Params:
|
||
* Date: 2023/4/17
|
||
*/
|
||
const buildSalaryInfo = (editBasicInfo, monthCal, nowYear, nowMonth) => {
|
||
const { salaryCycleFromDay } = editBasicInfo;
|
||
let salaryCycleFromDayNum = Number(salaryCycleFromDay), customInfo = {};
|
||
const basicInfo = generateBasicInfo(monthCal, nowYear, nowMonth);
|
||
const { nowMonthStr, nextMonthStr, year, month } = basicInfo;
|
||
customInfo.salaryYear = year;
|
||
customInfo.salaryMonth = month;
|
||
|
||
if (salaryCycleFromDayNum === 1) {
|
||
customInfo.salaryPeriodTip = "至" + nowMonthStr + "最后一天";
|
||
customInfo.salaryPeriodStart = customInfo.salaryYear + "-"
|
||
+ prefixAddZero(customInfo.salaryMonth, 2) + "-01";
|
||
customInfo.salaryPeriodEnd = customInfo.salaryYear + "-"
|
||
+ prefixAddZero(customInfo.salaryMonth, 2) + "-"
|
||
+ prefixAddZero(getMonthDays(customInfo.salaryYear, customInfo.salaryMonth), 2);
|
||
} else {
|
||
customInfo.salaryPeriodTip = "至" + nextMonthStr + (salaryCycleFromDayNum - 1) + "号";
|
||
customInfo.salaryPeriodStart = customInfo.salaryYear + "-"
|
||
+ prefixAddZero(customInfo.salaryMonth, 2) + "-" + prefixAddZero(salaryCycleFromDayNum, 2);
|
||
let year = customInfo.salaryYear;
|
||
let month = customInfo.salaryMonth;
|
||
if (month === "12") {
|
||
year = Number(year) + 1;
|
||
month = 1;
|
||
} else {
|
||
month = Number(month) + 1;
|
||
}
|
||
customInfo.salaryPeriodEnd = year + "-"
|
||
+ prefixAddZero(month, 2) + "-"
|
||
+ prefixAddZero(salaryCycleFromDayNum - 1, 2);
|
||
}
|
||
return customInfo;
|
||
};
|
||
const buildAttendanceInfo = (editBasicInfo, monthCal, nowYear, nowMonth) => {
|
||
const { attendCycleFromDay } = editBasicInfo;
|
||
let attendCycleFromDayNum = Number(attendCycleFromDay), customInfo = {};
|
||
|
||
const basicInfo = generateBasicInfo(monthCal, nowYear, nowMonth);
|
||
const { nowMonthStr, nextMonthStr } = basicInfo;
|
||
let year = basicInfo.year;
|
||
let month = basicInfo.month;
|
||
|
||
if (attendCycleFromDayNum === 1) {
|
||
customInfo.attendancePeriodTip = "至" + nowMonthStr + "最后一天";
|
||
|
||
customInfo.attendancePeriodStart = year + "-"
|
||
+ prefixAddZero(month, 2) + "-01";
|
||
customInfo.attendancePeriodEnd = year + "-"
|
||
+ prefixAddZero(month, 2) + "-"
|
||
+ prefixAddZero(getMonthDays(year, month), 2);
|
||
} else {
|
||
customInfo.attendancePeriodTip = "至" + nextMonthStr + (attendCycleFromDayNum - 1) + "号";
|
||
customInfo.attendancePeriodStart = year + "-"
|
||
+ prefixAddZero(month, 2) + "-" + prefixAddZero(attendCycleFromDayNum, 2);
|
||
if (month === "12") {
|
||
year = (Number(year) + 1).toString();
|
||
month = "1";
|
||
} else {
|
||
month = (Number(month) + 1).toString();
|
||
}
|
||
customInfo.attendancePeriodEnd = year + "-"
|
||
+ prefixAddZero(month, 2) + "-"
|
||
+ prefixAddZero(attendCycleFromDayNum - 1, 2);
|
||
}
|
||
return customInfo;
|
||
};
|
||
const getMonth = (salaryCycleType) => {
|
||
switch (salaryCycleType) {
|
||
case "1": // 上上月
|
||
return getSubtractMonthYearMonth(2);
|
||
case "2": // 上月
|
||
return getSubtractMonthYearMonth(1);
|
||
case "3": // 本月
|
||
return getCurrentYearMonth();
|
||
case "4": // 下月
|
||
return getAddMonthYearMonth(1);
|
||
}
|
||
};
|