122 lines
4.4 KiB
JavaScript
122 lines
4.4 KiB
JavaScript
import React from "react";
|
|
import { Icon, Modal } from "antd";
|
|
import { WeaSearchGroup } from "ecCom";
|
|
import { inject, observer } from "mobx-react";
|
|
import { toJS } from "mobx";
|
|
import "./index.less";
|
|
|
|
|
|
@inject("payrollStore")
|
|
@observer
|
|
export default class TemplateSettingForm extends React.Component {
|
|
|
|
handleDownClick = (index) => {
|
|
const { payrollStore: { replenishSalaryTemplateSalaryItemSet, setReplenishSalaryTemplateSalaryItemSet } } = this.props;
|
|
let downItem = replenishSalaryTemplateSalaryItemSet[index + 1];
|
|
let thisItem = replenishSalaryTemplateSalaryItemSet[index];
|
|
let resultSet = [...replenishSalaryTemplateSalaryItemSet];
|
|
resultSet[index] = downItem;
|
|
resultSet[index + 1] = thisItem;
|
|
setReplenishSalaryTemplateSalaryItemSet(resultSet);
|
|
};
|
|
|
|
handleUpClick = (index) => {
|
|
const { payrollStore: { replenishSalaryTemplateSalaryItemSet, setReplenishSalaryTemplateSalaryItemSet } } = this.props;
|
|
let upItem = replenishSalaryTemplateSalaryItemSet[index - 1];
|
|
let thisItem = replenishSalaryTemplateSalaryItemSet[index];
|
|
let resultSet = [...replenishSalaryTemplateSalaryItemSet];
|
|
resultSet[index] = upItem;
|
|
resultSet[index - 1] = thisItem;
|
|
setReplenishSalaryTemplateSalaryItemSet(resultSet);
|
|
};
|
|
|
|
handleDeleteItem = (group, item) => {
|
|
const { payrollStore: { replenishSalaryTemplateSalaryItemSet, setReplenishSalaryTemplateSalaryItemSet } } = this.props;
|
|
let resultSalaryItemSet = [...replenishSalaryTemplateSalaryItemSet];
|
|
resultSalaryItemSet.map(sourceGroup => {
|
|
if (sourceGroup.id === group.id) {
|
|
sourceGroup.items.map((sourceItem, index) => {
|
|
if (sourceItem.id === item.id) {
|
|
sourceGroup.items.splice(index, 1);
|
|
}
|
|
});
|
|
}
|
|
});
|
|
setReplenishSalaryTemplateSalaryItemSet(resultSalaryItemSet);
|
|
};
|
|
|
|
handleDeleteClick = (index) => {
|
|
Modal.confirm({
|
|
title: "信息确认",
|
|
content: "确认删除",
|
|
onOk: () => {
|
|
const { payrollStore: { replenishSalaryTemplateSalaryItemSet, setReplenishSalaryTemplateSalaryItemSet } } = this.props;
|
|
let resultSalaryItemSet = [...replenishSalaryTemplateSalaryItemSet];
|
|
resultSalaryItemSet.splice(index, 1);
|
|
setReplenishSalaryTemplateSalaryItemSet(resultSalaryItemSet);
|
|
},
|
|
onCancel: () => {
|
|
}
|
|
});
|
|
};
|
|
|
|
render() {
|
|
const { payrollStore } = this.props;
|
|
const { replenishSalaryTemplateSalaryItemSet } = payrollStore;
|
|
return (
|
|
<div className="showSettingForm">
|
|
<WeaSearchGroup title="薪资项目设置" items={[]} needTigger showGroup>
|
|
{
|
|
!_.isEmpty(toJS(replenishSalaryTemplateSalaryItemSet)) &&
|
|
replenishSalaryTemplateSalaryItemSet.map((group, index) => (
|
|
<div className="configItemWrapper">
|
|
<div className="configTitle">{group.groupName}
|
|
{
|
|
index < replenishSalaryTemplateSalaryItemSet.length - 1 &&
|
|
<Icon
|
|
type="caret-down"
|
|
style={{ marginLeft: "10px", cursor: "pointer", color: "#666" }}
|
|
onClick={() => {
|
|
this.handleDownClick(index);
|
|
}}
|
|
/>
|
|
}
|
|
{
|
|
index > 0 &&
|
|
<Icon
|
|
type="caret-up"
|
|
style={{ marginLeft: "10px", cursor: "pointer", color: "#666" }}
|
|
onClick={() => {
|
|
this.handleUpClick(index);
|
|
}}
|
|
/>
|
|
}
|
|
<i
|
|
className="icon-coms-Delete"
|
|
style={{ cursor: "pointer", color: "#666", marginLeft: "10px" }}
|
|
onClick={() => {
|
|
this.handleDeleteClick(index);
|
|
}}
|
|
/>
|
|
</div>
|
|
<div className="configContent">
|
|
{group.items.map(item => (
|
|
<span className="editItem">{item.name}
|
|
<Icon
|
|
type="cross" style={{ cursor: "pointer" }}
|
|
onClick={() => {
|
|
this.handleDeleteItem(group, item);
|
|
}}
|
|
/>
|
|
</span>
|
|
))}
|
|
</div>
|
|
</div>
|
|
))
|
|
}
|
|
</WeaSearchGroup>
|
|
</div>
|
|
);
|
|
}
|
|
}
|