122 lines
3.6 KiB
JavaScript
122 lines
3.6 KiB
JavaScript
import React from "react";
|
||
import { Button } from 'antd';
|
||
import { WeaTable } from "ecCom";
|
||
import { slideStep4Columns } from "./columns";
|
||
import "./index.less";
|
||
import RuleEditModal from "./step4/RuleEditModal";
|
||
import { inject, observer } from "mobx-react";
|
||
import { toJS } from 'mobx';
|
||
|
||
@inject("ledgerStore")
|
||
@observer
|
||
export default class CalRulesForm extends React.Component {
|
||
constructor(props) {
|
||
super(props);
|
||
this.state = {
|
||
modalVisible: false,
|
||
slideStep4Columns: slideStep4Columns.map(item => {
|
||
item = { ...item };
|
||
if (item.key == "cz") {
|
||
item.render = (text, record) => {
|
||
return (
|
||
<a onClick={() => {
|
||
this.handleDeleteItem(record);
|
||
}}>删除</a>
|
||
);
|
||
};
|
||
}
|
||
return item;
|
||
})
|
||
};
|
||
}
|
||
|
||
componentWillMount() {
|
||
const { ledgerStore: { listAdjustmentRule } } = this.props;
|
||
listAdjustmentRule();
|
||
}
|
||
|
||
handleSave(params) {
|
||
const { ledgerStore: { sobItemRuleDataSource, setSobItemRuleDataSource } } = this.props;
|
||
let dataSource = [...sobItemRuleDataSource];
|
||
dataSource.push(params);
|
||
setSobItemRuleDataSource(dataSource);
|
||
}
|
||
|
||
handleDeleteItem(record) {
|
||
const { ledgerStore: { sobItemRuleDataSource, setSobItemRuleDataSource } } = this.props;
|
||
let dataSource = [...sobItemRuleDataSource];
|
||
setSobItemRuleDataSource(dataSource.filter(item => item.salaryItemId != record.key));
|
||
}
|
||
|
||
convertAdjustmentType(index) {
|
||
let nameList = {
|
||
1: '取调薪前薪资',
|
||
2: '取调薪后薪资',
|
||
3: '平均值',
|
||
4: '分段计薪',
|
||
};
|
||
return nameList[Number(index)];
|
||
}
|
||
|
||
getSalaryItemName(salaryItemId) {
|
||
const { ledgerStore: { ruleOptionList } } = this.props;
|
||
let result = "";
|
||
ruleOptionList.map(item => {
|
||
if (item.key == salaryItemId) {
|
||
result = item.showname;
|
||
}
|
||
});
|
||
return result;
|
||
}
|
||
|
||
convertDataSource(dataSoruce) {
|
||
let result = [...dataSoruce];
|
||
return result.map(item => {
|
||
let resultStr = "";
|
||
resultStr += `${item.dayOfMonth}号（含）之前调薪，${this.convertAdjustmentType(item.beforeAdjustmentType)}；${item.dayOfMonth}号之后调薪，${this.convertAdjustmentType(item.afterAdjustmentType)}`;
|
||
return {
|
||
key: item.salaryItemId,
|
||
salaryItemId: item.salaryItemId,
|
||
salaryItemName: item.salaryItemName ? item.salaryItemName : this.getSalaryItemName(item.salaryItemId),
|
||
rule: resultStr
|
||
};
|
||
});
|
||
}
|
||
|
||
render() {
|
||
const { ledgerStore: { sobItemRuleDataSource, baseInfoRequest } } = this.props;
|
||
const { canEdit = "true" } = baseInfoRequest;
|
||
let datas = this.convertDataSource(sobItemRuleDataSource);
|
||
return (
|
||
<div className="calRulesForm">
|
||
<div className="headerIcon">
|
||
{
|
||
canEdit === "true" &&
|
||
<Button
|
||
type="primary"
|
||
size="small"
|
||
style={{ marginRight: 10 }}
|
||
onClick={() => {
|
||
this.setState({ modalVisible: true });
|
||
}}
|
||
><span className="icon-coms-Add-to-hot" title="添加"></span></Button>
|
||
}
|
||
</div>
|
||
<div className="tableWrapper">
|
||
<WeaTable dataSource={datas} columns={this.state.slideStep4Columns} pagination={false}/>
|
||
</div>
|
||
|
||
{
|
||
this.state.modalVisible && <RuleEditModal
|
||
visible={this.state.modalVisible}
|
||
onCancel={() => this.setState({ modalVisible: false })}
|
||
onSave={(params) => {
|
||
this.handleSave(params);
|
||
}}
|
||
/>
|
||
}
|
||
</div>
|
||
);
|
||
}
|
||
}
|