Merge branch 'feature/2.16.1.2410.01-薪资项目管理页面重构' into feature/2.16.1.2410.01-数据采集重构
This commit is contained in:
commit
6993e5655a
|
|
@ -2,56 +2,240 @@ import { WeaLocaleProvider } from "ecCom";
|
|||
import { dataTypeOptions, patternOptions, roundingModeOptions } from "./options";
|
||||
|
||||
const getLabel = WeaLocaleProvider.getLabel;
|
||||
export const columns = [
|
||||
|
||||
|
||||
export const salaryItemConditions = [
|
||||
{
|
||||
title: "名称",
|
||||
dataIndex: "title",
|
||||
key: "title"
|
||||
},
|
||||
{
|
||||
title: "属性",
|
||||
dataIndex: "title",
|
||||
key: "title"
|
||||
},
|
||||
{
|
||||
title: "类型",
|
||||
dataIndex: "title",
|
||||
key: "title"
|
||||
},
|
||||
{
|
||||
title: "薪资档案引用",
|
||||
dataIndex: "refere",
|
||||
key: "refere"
|
||||
},
|
||||
{
|
||||
title: "默认使用",
|
||||
dataIndex: "refere",
|
||||
key: "refere"
|
||||
},
|
||||
{
|
||||
title: "进位规则",
|
||||
dataIndex: "title",
|
||||
key: "title"
|
||||
},
|
||||
{
|
||||
title: "保留小数位",
|
||||
dataIndex: "title",
|
||||
key: "title"
|
||||
},
|
||||
{
|
||||
title: "取值方式",
|
||||
dataIndex: "title",
|
||||
key: "title"
|
||||
},
|
||||
{
|
||||
title: "备注",
|
||||
dataIndex: "title",
|
||||
key: "title"
|
||||
},
|
||||
{
|
||||
title: "操作",
|
||||
dataIndex: "cz",
|
||||
key: "cz"
|
||||
items: [
|
||||
{
|
||||
conditionType: "INPUT",
|
||||
domkey: ["name"],
|
||||
fieldcol: 14,
|
||||
label: "名称",
|
||||
lanId: 111,
|
||||
labelcol: 8,
|
||||
value: "",
|
||||
rules: "required|string",
|
||||
viewAttr: 3
|
||||
},
|
||||
{
|
||||
conditionType: "SWITCH",
|
||||
domkey: ["useDefault"],
|
||||
fieldcol: 14,
|
||||
label: "默认使用",
|
||||
lanId: 111,
|
||||
labelcol: 8,
|
||||
value: "0",
|
||||
rules: "required|string",
|
||||
tipLanId: 111,
|
||||
tip: "提示：开启后，每个薪资方案都有该薪资项目，可在具体薪资方案中删除",
|
||||
viewAttr: 3
|
||||
},
|
||||
{
|
||||
conditionType: "SWITCH",
|
||||
domkey: ["hideDefault"],
|
||||
fieldcol: 14,
|
||||
label: "核算时隐藏",
|
||||
lanId: 111,
|
||||
labelcol: 8,
|
||||
value: "0",
|
||||
rules: "required|string",
|
||||
tipLanId: 111,
|
||||
tip: "提示：开启后，在薪资账套中添加该项目时，默认勾选隐藏且在核算时隐藏该薪资项目，可在具体薪资账套中设置是否隐藏",
|
||||
viewAttr: 3
|
||||
},
|
||||
{
|
||||
conditionType: "SELECT",
|
||||
domkey: ["sharedType"],
|
||||
fieldcol: 14,
|
||||
label: "可见性",
|
||||
lanId: 111,
|
||||
labelcol: 8,
|
||||
value: "",
|
||||
options: [],
|
||||
rules: "required|string",
|
||||
viewAttr: 3
|
||||
},
|
||||
{
|
||||
conditionType: "SELECT",
|
||||
domkey: ["taxAgentIds"],
|
||||
fieldcol: 14,
|
||||
label: "可见性范围",
|
||||
lanId: 111,
|
||||
labelcol: 8,
|
||||
value: "",
|
||||
options: [],
|
||||
multiple: true,
|
||||
rules: "",
|
||||
viewAttr: 2,
|
||||
hide: true
|
||||
},
|
||||
{
|
||||
conditionType: "SELECT",
|
||||
domkey: ["dataType"],
|
||||
fieldcol: 14,
|
||||
label: "字段类型",
|
||||
lanId: 111,
|
||||
labelcol: 8,
|
||||
value: "",
|
||||
options: [
|
||||
{ key: "number", showname: "数值", lanId: 111, selected: true },
|
||||
{ key: "string", showname: "字符", lanId: 111, selected: false }
|
||||
],
|
||||
rules: "required|string",
|
||||
viewAttr: 3
|
||||
},
|
||||
{
|
||||
conditionType: "SELECT",
|
||||
domkey: ["roundingMode"],
|
||||
fieldcol: 14,
|
||||
label: "舍入规则",
|
||||
lanId: 111,
|
||||
labelcol: 8,
|
||||
value: "",
|
||||
options: [
|
||||
{ key: "1", selected: true, showname: "原始数据", lanId: 111 },
|
||||
{ key: "2", selected: false, showname: "四舍五入", lanId: 111 },
|
||||
{ key: "3", selected: false, showname: "向上舍入", lanId: 111 },
|
||||
{ key: "4", selected: false, showname: "向下舍入", lanId: 111 },
|
||||
{ key: "5", selected: false, showname: "见分进角", lanId: 111 }
|
||||
],
|
||||
rules: "required|string",
|
||||
viewAttr: 3
|
||||
},
|
||||
{
|
||||
conditionType: "SELECT",
|
||||
domkey: ["pattern"],
|
||||
fieldcol: 14,
|
||||
label: "保留小数位",
|
||||
lanId: 111,
|
||||
labelcol: 8,
|
||||
value: "2",
|
||||
options: [
|
||||
{ key: "0", selected: false, showname: "0" },
|
||||
{ key: "1", selected: false, showname: "1" },
|
||||
{ key: "2", selected: true, showname: "2" },
|
||||
{ key: "3", selected: false, showname: "3" },
|
||||
{ key: "4", selected: false, showname: "4" },
|
||||
{ key: "5", selected: false, showname: "5" },
|
||||
{ key: "6", selected: false, showname: "6" },
|
||||
{ key: "7", selected: false, showname: "7" },
|
||||
{ key: "8", selected: false, showname: "8" },
|
||||
{ key: "9", selected: false, showname: "9" },
|
||||
{ key: "10", selected: false, showname: "10" }
|
||||
],
|
||||
rules: "required|string",
|
||||
viewAttr: 3
|
||||
},
|
||||
{
|
||||
conditionType: "SELECT",
|
||||
domkey: ["valueType"],
|
||||
fieldcol: 14,
|
||||
label: "取值方式",
|
||||
lanId: 111,
|
||||
labelcol: 8,
|
||||
value: "",
|
||||
otherParams: { detailtype: 3 },
|
||||
options: [
|
||||
{ key: "1", showname: "输入", selected: true, lanId: 111 },
|
||||
{ key: "2", showname: "公式", selected: false, lanId: 111 },
|
||||
{ key: "3", showname: "SQL", selected: false, lanId: 111 }
|
||||
],
|
||||
rules: "required|string",
|
||||
viewAttr: 3
|
||||
},
|
||||
{
|
||||
conditionType: "INPUTNUMBER",
|
||||
domkey: ["defaultValue"],
|
||||
fieldcol: 14,
|
||||
label: "默认值",
|
||||
lanId: 111,
|
||||
labelcol: 8,
|
||||
value: "",
|
||||
otherParams: { precision: 2 },
|
||||
viewAttr: 2
|
||||
},
|
||||
{
|
||||
conditionType: "INPUT",
|
||||
domkey: ["formulaContent"],
|
||||
fieldcol: 14,
|
||||
label: "公式",
|
||||
lanId: 111,
|
||||
labelcol: 8,
|
||||
value: "",
|
||||
viewAttr: 3,
|
||||
hide: true
|
||||
},
|
||||
{
|
||||
conditionType: "INPUT",
|
||||
domkey: ["formulaId"],
|
||||
fieldcol: 14,
|
||||
label: "公式",
|
||||
lanId: 111,
|
||||
labelcol: 8,
|
||||
value: "",
|
||||
viewAttr: 3,
|
||||
hide: true
|
||||
},
|
||||
{
|
||||
conditionType: "INPUTNUMBER",
|
||||
domkey: ["sortedIndex"],
|
||||
fieldcol: 14,
|
||||
label: "显示顺序",
|
||||
lanId: 111,
|
||||
labelcol: 8,
|
||||
value: "",
|
||||
viewAttr: 2
|
||||
},
|
||||
{
|
||||
conditionType: "INPUTNUMBER",
|
||||
domkey: ["width"],
|
||||
fieldcol: 14,
|
||||
label: "显示宽度",
|
||||
lanId: 111,
|
||||
labelcol: 8,
|
||||
value: "",
|
||||
viewAttr: 2
|
||||
},
|
||||
{
|
||||
conditionType: "TEXTAREA",
|
||||
domkey: ["description"],
|
||||
fieldcol: 14,
|
||||
label: "备注",
|
||||
lanId: 111,
|
||||
labelcol: 8,
|
||||
value: "",
|
||||
viewAttr: 2,
|
||||
otherParams: { minRows: 3 }
|
||||
},
|
||||
{
|
||||
conditionType: "SWITCH",
|
||||
domkey: ["useInEmployeeSalary"],
|
||||
fieldcol: 14,
|
||||
label: "薪资档案引用",
|
||||
lanId: 111,
|
||||
labelcol: 8,
|
||||
value: "0",
|
||||
viewAttr: 2,
|
||||
tipLanId: 111,
|
||||
tip: "提示：开启后，该薪资项目不可删除或设为无效，取值方式会默认置为输入",
|
||||
hide: true
|
||||
},
|
||||
{
|
||||
|
||||
conditionType: "SWITCH",
|
||||
domkey: ["systemType"],
|
||||
fieldcol: 14,
|
||||
label: "是否系统默认",
|
||||
lanId: 111,
|
||||
labelcol: 8,
|
||||
value: "0",
|
||||
viewAttr: 2,
|
||||
hide: true
|
||||
}
|
||||
],
|
||||
title: "",
|
||||
defaultshow: true
|
||||
}
|
||||
];
|
||||
export const salaryItemFields = [
|
||||
|
|
|
|||
|
|
@ -1,62 +1,211 @@
|
|||
import React from "react";
|
||||
import { inject, observer } from "mobx-react";
|
||||
import { WeaFormItem, WeaHelpfulTip, WeaLocaleProvider, WeaSearchGroup, WeaSlideModal, WeaTools } from "ecCom";
|
||||
import { WeaSwitch } from "comsMobx";
|
||||
import FormalFormModal from "./formalFormModal";
|
||||
import SalaryItemForm from "./salaryItemForm";
|
||||
import "./index.less";
|
||||
import { salaryItemConditions } from "./columns";
|
||||
import { commonEnumList } from "../../apis/archive";
|
||||
import { getItemForm } from "../../apis/item";
|
||||
import { getTaxAgentSelectList } from "../../apis/taxAgent";
|
||||
|
||||
|
||||
const getLabel = WeaLocaleProvider.getLabel;
|
||||
const getKey = WeaTools.getKey;
|
||||
|
||||
@inject("salaryItemStore")
|
||||
@observer
|
||||
export default class CustomSalaryItemSlide extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
showForm: false,
|
||||
formalModalVisible: false,
|
||||
salaryItemName: ""
|
||||
conditions: [], visible: false
|
||||
};
|
||||
}
|
||||
|
||||
handleChange = (params) => {
|
||||
this.props.onChange({ ...this.props.request, ...params });
|
||||
};
|
||||
componentWillReceiveProps(nextProps, nextContext) {
|
||||
if (nextProps.visible !== this.props.visible && nextProps.visible) {
|
||||
document.querySelector(".custom_salaryItemSlide").classList.add("zIndex0-weaslide-title");
|
||||
this.initForm(nextProps);
|
||||
} else if (nextProps.visible !== this.props.visible && !nextProps.visible) {
|
||||
document.querySelector(".custom_salaryItemSlide").classList.remove("zIndex0-weaslide-title");
|
||||
this.props.salaryItemStore.initItemsForm();
|
||||
}
|
||||
}
|
||||
|
||||
handleShowFormal = (salaryItemName) => {
|
||||
handleChange = (data) => {
|
||||
const { salaryItemStore: { itemsForm: form } } = this.props;
|
||||
form.updateFields({ formulaContent: { value: data["formula"] }, formulaId: { value: data["id"] } });
|
||||
};
|
||||
initForm = async (props) => {
|
||||
const { data: salaryItemForm } = props.id ?
|
||||
await getItemForm({ id: props.id }) :
|
||||
{
|
||||
data: { sharedType: "0", useDefault: "0", hideDefault: "0", pattern: 2, dataType: "number", valueType: "1" }
|
||||
};
|
||||
const [{ data: sharedTypeList }, { data: taxAgentList }] = await Promise.all([
|
||||
commonEnumList({ enumClass: "com.engine.salary.enums.sicategory.SharedTypeEnum" }),
|
||||
getTaxAgentSelectList()
|
||||
]);
|
||||
this.setState({
|
||||
formalModalVisible: true,
|
||||
salaryItemName
|
||||
conditions: _.map(salaryItemConditions, c => {
|
||||
return {
|
||||
...c, items: _.map(c.items, fields => {
|
||||
fields = {
|
||||
...fields, viewAttr: props.showOperateBtn ? fields.viewAttr : 1,
|
||||
label: getLabel(fields.lanId, fields.label),
|
||||
value: !_.isNil(salaryItemForm[getKey(fields)]) ? String(salaryItemForm[getKey(fields)]) : fields.value
|
||||
};
|
||||
switch (getKey(fields)) {
|
||||
case "sharedType":
|
||||
fields = {
|
||||
...fields, options: _.map(sharedTypeList, o => ({ key: o.value, showname: o.defaultLabel }))
|
||||
};
|
||||
break;
|
||||
case "taxAgentIds":
|
||||
fields = {
|
||||
...fields, options: _.map(taxAgentList, o => ({ key: o.id, showname: o.content })),
|
||||
hide: String(salaryItemForm["sharedType"]) === "0" || !_.isNil(salaryItemForm["sharedType"])
|
||||
};
|
||||
break;
|
||||
case "dataType":
|
||||
case "valueType":
|
||||
fields = {
|
||||
...fields, options: _.map(fields.options, o => ({ ...o, showname: getLabel(o.lanId, o.showname) }))
|
||||
};
|
||||
break;
|
||||
case "roundingMode":
|
||||
fields = {
|
||||
...fields, options: _.map(fields.options, o => ({ ...o, showname: getLabel(o.lanId, o.showname) })),
|
||||
hide: String(salaryItemForm["dataType"]) === "string"
|
||||
};
|
||||
break;
|
||||
case "pattern":
|
||||
fields = {
|
||||
...fields, hide: String(salaryItemForm["dataType"]) === "string"
|
||||
};
|
||||
break;
|
||||
case "defaultValue":
|
||||
const otherParams = String(salaryItemForm["dataType"]) === "number" ? { precision: Number(salaryItemForm["pattern"]) } : {};
|
||||
fields = {
|
||||
...fields, otherParams,
|
||||
conditionType: String(salaryItemForm["dataType"]) === "string" ? "INPUT" : "INPUTNUMBER",
|
||||
hide: String(salaryItemForm["valueType"]) !== "1"
|
||||
};
|
||||
break;
|
||||
case "formulaContent":
|
||||
fields = {
|
||||
...fields, hide: String(salaryItemForm["valueType"]) === "1",
|
||||
label: String(salaryItemForm["valueType"]) === "2" ? getLabel(111, "公式") : getLabel(111, "SQL")
|
||||
};
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
return fields;
|
||||
})
|
||||
};
|
||||
})
|
||||
}, () => {
|
||||
props.salaryItemStore.itemsForm.initFormFields(this.state.conditions);
|
||||
});
|
||||
};
|
||||
|
||||
// 保存公式成功回调
|
||||
handleSaveFormal = (data) => {
|
||||
this.handleChange({
|
||||
formulaId: data.id, formulaContent: data.formula,
|
||||
originFormulaContent: data.referenceType === "formula" ? data.formula : "",
|
||||
originSqlContent: data.referenceType === "sql" ? data.formula : ""
|
||||
handleChangeFormItem = (res) => {
|
||||
const { salaryItemStore: { itemsForm: form } } = this.props;
|
||||
const { conditions } = this.state, [key] = _.keys(res), value = res[key].value;
|
||||
this.setState({
|
||||
conditions: _.map(conditions, c => {
|
||||
return {
|
||||
...c, items: _.map(c.items, fields => {
|
||||
if (key === "sharedType" && getKey(fields) === "taxAgentIds") {
|
||||
fields = { ...fields, viewAttr: value === "0" ? 2 : 3, hide: value === "0" };
|
||||
} else if (key === "dataType" && (getKey(fields) === "roundingMode" || getKey(fields) === "pattern")) {
|
||||
fields = { ...fields, hide: value === "string" };
|
||||
} else if ((key === "dataType" || key === "pattern") && getKey(fields) === "defaultValue") {
|
||||
const otherParams = form.getFormParams().dataType === "number" ? { precision: Number(form.getFormParams().pattern) } : {};
|
||||
fields = {
|
||||
...fields, otherParams, conditionType: value === "string" ? "INPUT" : "INPUTNUMBER",
|
||||
hide: form.getFormParams().valueType !== "1"
|
||||
};
|
||||
} else if (key === "valueType" && (getKey(fields) === "formulaContent" || getKey(fields) === "defaultValue")) {
|
||||
fields = {
|
||||
...fields,
|
||||
label: getKey(fields) === "defaultValue" ? fields.label : form.getFormDatas().valueType.valueSpan,
|
||||
hide: (getKey(fields) === "formulaContent" && value === "1") || (getKey(fields) === "defaultValue" && value !== "1")
|
||||
};
|
||||
}
|
||||
return fields;
|
||||
})
|
||||
};
|
||||
})
|
||||
}, () => {
|
||||
form.getFormParams().valueType === "1" &&
|
||||
form.updateFields({ formulaContent: { value: "" }, formulaId: { value: "" } });
|
||||
(form.getFormParams().valueType === "2" || form.getFormParams().valueType === "3") &&
|
||||
form.updateFields({ defaultValue: { value: "" } });
|
||||
});
|
||||
};
|
||||
renderForm = () => {
|
||||
const { salaryItemStore: { itemsForm: form } } = this.props;
|
||||
const { conditions } = this.state, { isFormInit } = form, formParams = form.getFormParams();
|
||||
let group = [];
|
||||
isFormInit && conditions.map(c => {
|
||||
let items = [];
|
||||
c.items.map(fields => {
|
||||
items.push({
|
||||
com: (
|
||||
<WeaFormItem label={`${fields.label}`} labelCol={{ span: `${fields.labelcol}` }}
|
||||
wrapperCol={{ span: `${fields.fieldcol}` }} error={form.getError(fields)} tipPosition="bottom">
|
||||
<WeaSwitch fieldConfig={fields} form={form} formParams={formParams} onChange={this.handleChangeFormItem}/>
|
||||
{
|
||||
getKey(fields) === "formulaContent" && form.getFormParams().valueType !== "1" &&
|
||||
this.props.showOperateBtn &&
|
||||
<div className="formula_input_div" onClick={() => this.setState({ visible: true })}/>
|
||||
}
|
||||
{
|
||||
fields.tip && <WeaHelpfulTip
|
||||
style={{ marginLeft: 16 }} width={350} title={getLabel(fields.tipLanId, fields.tip)}
|
||||
placement="topLeft"/>
|
||||
}
|
||||
</WeaFormItem>),
|
||||
hide: fields.hide
|
||||
});
|
||||
});
|
||||
group.push(<WeaSearchGroup col={1} needTigger showGroup={c.defaultshow} items={items}/>);
|
||||
});
|
||||
return group;
|
||||
};
|
||||
renderTitle = () => {
|
||||
const { title, buttons } = this.props;
|
||||
return <div className="titleDialog">
|
||||
<div className="titleCol titleLeftBox">
|
||||
<div className="titleIcon"><i className="icon-coms-fa"/></div>
|
||||
<div className="title">{title}</div>
|
||||
</div>
|
||||
<div className="titleCol titleRightBox">{buttons}</div>
|
||||
</div>;
|
||||
};
|
||||
|
||||
render() {
|
||||
const { request } = this.props;
|
||||
const { valueType, dataType, formulaId } = request;
|
||||
const { formalModalVisible, salaryItemName } = this.state;
|
||||
return (
|
||||
<div className="customSalaryItemSlide">
|
||||
<SalaryItemForm {...this.props} onChangeFieldsItem={this.handleChange} onShowFormal={this.handleShowFormal}/>
|
||||
{formalModalVisible &&
|
||||
<FormalFormModal
|
||||
name={salaryItemName}
|
||||
formulaId={formulaId}
|
||||
visible={formalModalVisible}
|
||||
valueType={valueType}
|
||||
dataType={dataType}
|
||||
onSaveFormal={data => {
|
||||
this.handleSaveFormal(data);
|
||||
}}
|
||||
onCancel={() =>
|
||||
this.setState({
|
||||
formalModalVisible: false,
|
||||
salaryItemName: ""
|
||||
})}
|
||||
/>}
|
||||
</div>
|
||||
const { onClose, salaryItemStore: { itemsForm: form } } = this.props;
|
||||
const { visible } = this.state;
|
||||
return (<WeaSlideModal
|
||||
className="custom_salaryItemSlide"{...this.props}
|
||||
top={0} width={800} height={100} measureT="%" measureX="px" measureY="%"
|
||||
direction="right" title={this.renderTitle()} onClose={() => onClose()}
|
||||
content={<div className="form-dialog-layout">
|
||||
{this.renderForm()}
|
||||
{visible &&
|
||||
<FormalFormModal
|
||||
formulaId={form.getFormParams().formulaId}
|
||||
visible={visible}
|
||||
name={form.getFormParams().name}
|
||||
valueType={form.getFormParams().valueType}
|
||||
dataType={form.getFormParams().dataType}
|
||||
onSaveFormal={this.handleChange}
|
||||
onCancel={() => this.setState({ visible: false })}
|
||||
/>
|
||||
}
|
||||
</div>}/>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,18 +1,16 @@
|
|||
import React from "react";
|
||||
import { inject, observer } from "mobx-react";
|
||||
import { Button, Dropdown, Menu, message, Modal, Switch } from "antd";
|
||||
import { WeaInputSearch, WeaLoadingGlobal, WeaLocaleProvider, WeaNewScroll, WeaSlideModal, WeaTop } from "ecCom";
|
||||
import { renderLoading, toDecimal_n } from "../../util";
|
||||
import { Button, Dropdown, Menu, message, Modal } from "antd";
|
||||
import { WeaInputSearch, WeaLoadingGlobal, WeaLocaleProvider, WeaTop } from "ecCom";
|
||||
import * as API from "../../apis/item";
|
||||
import SalaryItemsTable from "./salaryItemsTable";
|
||||
import { toDecimal_n } from "../../util";
|
||||
import SystemSalaryItemModal from "./systemSalaryItemModal";
|
||||
import { columns } from "./columns";
|
||||
import SlideModalTitle from "../../components/slideModalTitle";
|
||||
import CustomSalaryItemSlide from "./customSalaryItemSlide";
|
||||
import CustomPaginationTable from "../../components/customPaginationTable";
|
||||
import SyncToSalaryAccountSetDialog from "./syncToSalaryAccountSetDialog";
|
||||
import "../socialSecurityBenefits/programme/index.less";
|
||||
import LogDialog from "../../components/logViewModal";
|
||||
import SalaryItemImportDialog from "./salaryItemImport";
|
||||
import * as API from "../../apis/item";
|
||||
import "./index.less";
|
||||
|
||||
const { getLabel } = WeaLocaleProvider;
|
||||
@inject("salaryItemStore", "taxAgentStore", "salaryFileStore")
|
||||
|
|
@ -21,192 +19,83 @@ export default class SalaryItem extends React.Component {
|
|||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
value: "",
|
||||
selectedKey: "0",
|
||||
editable: false,
|
||||
isAdd: false,
|
||||
searchValue: "",
|
||||
formalModalVisible: false,
|
||||
searchParams: { current: 1, pageSize: 10, total: 0 },
|
||||
selectedRowKeys: [],
|
||||
syncSalarySetDialog: { visible: false, title: "", id: "" },
|
||||
logDialogVisible: false, filterConditions: "[]",
|
||||
name: "", isQuery: false, loading: false, sysVisible: false,
|
||||
customItemDialog: { visible: false, title: "", buttons: [] },// 自定义薪资项弹窗
|
||||
syncSalarySetDialog: { visible: false, id: "" }, // 同步到薪资账套弹窗
|
||||
logDialogVisible: false, filterConditions: "[]", selectedRowKeys: [],
|
||||
salaryItemImpDialog: { visible: false, title: getLabel(24023, "数据导入") }
|
||||
};
|
||||
columns.map(item => {
|
||||
if (item.dataIndex == "refere") {
|
||||
item.render = () => {
|
||||
return (
|
||||
<Switch/>
|
||||
);
|
||||
};
|
||||
} else if (item.dataIndex == "cz") {
|
||||
item.render = () => {
|
||||
return (<div>
|
||||
<a style={{ marginRight: "10px" }}>编辑</a>
|
||||
<a style={{ marginRight: "10px" }}>删除</a>
|
||||
{/* <a>操作日志</a> */}
|
||||
</div>);
|
||||
};
|
||||
|
||||
}
|
||||
});
|
||||
this.record = {};
|
||||
}
|
||||
|
||||
|
||||
componentWillMount() { // 初始化渲染页面
|
||||
const { salaryItemStore: { getTableDatas }, salaryFileStore, taxAgentStore } = this.props;
|
||||
const { commonEnumList } = salaryFileStore;
|
||||
const { fetchTaxAgentOption } = taxAgentStore;
|
||||
fetchTaxAgentOption();
|
||||
commonEnumList("user", { enumClass: "com.engine.salary.enums.sicategory.SharedTypeEnum" });
|
||||
getTableDatas({}).then(res => {
|
||||
this.setState({
|
||||
searchParams: {
|
||||
...this.state.searchParams,
|
||||
current: res.pageNum,
|
||||
total: res.total
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
onEditItem = (record, isedit) => {
|
||||
this.record = record;
|
||||
const { salaryItemStore: { getItemForm, setEditSlideVisible } } = this.props;
|
||||
this.setState({
|
||||
editable: isedit, isAdd: false,
|
||||
syncSalarySetDialog: { ...this.state.syncSalarySetDialog, id: record.id }
|
||||
});
|
||||
getItemForm(record.id).then(() => {
|
||||
setEditSlideVisible(true);
|
||||
}).catch(({ errormsg }) => {
|
||||
message.error(errormsg || "");
|
||||
});
|
||||
};
|
||||
|
||||
// 删除列表项
|
||||
handleDeleteItem(record) {
|
||||
const { salaryItemStore: { deleteItemRequest, getTableDatas } } = this.props;
|
||||
handleDeleteItem = (recordId) => {
|
||||
const { selectedRowKeys, isQuery } = this.state;
|
||||
const params = recordId ? [recordId] : selectedRowKeys;
|
||||
if (_.isEmpty(params)) {
|
||||
message.warning(getLabel(111, "请勾选数据！"));
|
||||
return;
|
||||
}
|
||||
Modal.confirm({
|
||||
title: "信息确认",
|
||||
content: "确认删除该条数据吗？",
|
||||
title: getLabel(131329, "信息确认"),
|
||||
content: getLabel(111, "确认删除吗？"),
|
||||
onOk: () => {
|
||||
deleteItemRequest([record.id]).then(() => {
|
||||
getTableDatas({ ...this.state.searchParams }).then(res => {
|
||||
this.setState({
|
||||
searchParams: {
|
||||
...this.state.searchParams,
|
||||
total: res.total
|
||||
}
|
||||
});
|
||||
});
|
||||
API.deleteItem(params).then(({ status, errormsg }) => {
|
||||
if (status) {
|
||||
message.success(getLabel(111, "操作成功！"));
|
||||
this.setState({ isQuery: !isQuery });
|
||||
} else {
|
||||
message.error(errormsg);
|
||||
}
|
||||
});
|
||||
},
|
||||
onCancel: () => {
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
getColumns = () => {
|
||||
const { salaryItemStore, taxAgentStore: { showSalaryItemBtn, showOperateBtn } } = this.props;
|
||||
const { tableColumns } = salaryItemStore;
|
||||
let columns = tableColumns.map(column => {
|
||||
let newColumn = column;
|
||||
newColumn.render = (text, record, index) => { //前端元素转义
|
||||
let valueSpan = record[newColumn.dataIndex + "span"] !== undefined ? record[newColumn.dataIndex + "span"] : record[newColumn.dataIndex];
|
||||
switch (newColumn.dataIndex) {
|
||||
case "name":
|
||||
return <a onClick={() => {
|
||||
this.onEditItem(record, false);
|
||||
}}>{text}</a>;
|
||||
case "useDefault":
|
||||
case "hideDefault":
|
||||
case "useInEmployeeSalary":
|
||||
return <Switch checked={text === 1} disabled/>;
|
||||
default:
|
||||
return <div dangerouslySetInnerHTML={{ __html: valueSpan }}/>;
|
||||
}
|
||||
};
|
||||
return newColumn;
|
||||
});
|
||||
columns.push({
|
||||
key: "operate",
|
||||
title: "操作",
|
||||
width: 185,
|
||||
render: (text, record) => {
|
||||
return (
|
||||
<React.Fragment>
|
||||
<a
|
||||
onClick={() => this.onEditItem(record, true)}>{(showSalaryItemBtn || showOperateBtn) ? "编辑" : "查看"}</a>
|
||||
{
|
||||
(record.canDelete && (showSalaryItemBtn || showOperateBtn)) &&
|
||||
<a href="javascript:void(0)" style={{ marginLeft: 10 }}
|
||||
onClick={() => this.handleDeleteItem(record)}
|
||||
>{getLabel(535052, "删除")}</a>
|
||||
}
|
||||
<Dropdown
|
||||
overlay={
|
||||
<Menu>
|
||||
<Menu.Item>
|
||||
<a href="javascript:void(0);"
|
||||
onClick={() => this.onDropMenuClick("log", record.id)}>{getLabel(545781, "操作日志")}</a>
|
||||
</Menu.Item>
|
||||
</Menu>
|
||||
}>
|
||||
<a href="javascript:void(0)" style={{ marginLeft: 10 }}><i className="icon-coms-more"/></a>
|
||||
</Dropdown>
|
||||
</React.Fragment>
|
||||
);
|
||||
}
|
||||
});
|
||||
return [
|
||||
// {
|
||||
// title: "序号",
|
||||
// dataIndex: "index",
|
||||
// align: "left",
|
||||
// width: 60,
|
||||
// render: (text, record, index) => {
|
||||
// const { current, pageSize } = this.state.searchParams;
|
||||
// return (current - 1) * pageSize + index + 1;
|
||||
// }
|
||||
// },
|
||||
...columns];
|
||||
};
|
||||
handleValidateForm = () => {
|
||||
return new Promise((resolve) => {
|
||||
const { salaryItemStore: { itemsForm: form } } = this.props;
|
||||
const { formulaId, valueType, sharedType, taxAgentIds } = form.getFormParams();
|
||||
let taxAgentValidate = true, formulaValidate = true;
|
||||
if (sharedType === "1" && !taxAgentIds) taxAgentValidate = false;
|
||||
if (valueType !== "1" && !formulaId) formulaValidate = false;
|
||||
resolve({ taxAgentValidate, formulaValidate });
|
||||
});
|
||||
};
|
||||
handleSalaryItem = (type) => {
|
||||
const { customItemDialog: { id }, isQuery } = this.state;
|
||||
const { salaryItemStore: { itemsForm: form } } = this.props;
|
||||
Promise.all([form.validateForm(), this.handleValidateForm()])
|
||||
.then(([f1, f2]) => {
|
||||
if (f1.isValid && f2.taxAgentValidate && f2.formulaValidate) {
|
||||
const { formulaContent, valueType, dataType, defaultValue, pattern, ...formData } = form.getFormParams();
|
||||
const key = valueType === "2" ? "originFormulaContent" : valueType === "3" ? "originSqlContent" : "formulaContent";
|
||||
this.setState({ loading: true });
|
||||
API.saveItem({
|
||||
...formData, valueType, dataType, pattern, [key]: formulaContent, id,
|
||||
defaultValue: dataType === "number" ? toDecimal_n(defaultValue, parseInt(pattern)) : defaultValue
|
||||
}).then(({ status, errormsg }) => {
|
||||
this.setState({ loading: false });
|
||||
if (status) {
|
||||
this.setState({ isQuery: !isQuery }, () => {
|
||||
message.success(getLabel(111, "操作成功"));
|
||||
type === "SAVECREATE" && form.updateFields({
|
||||
name: { value: "" }, formulaContent: { value: "" }, formulaId: { value: "" }
|
||||
});
|
||||
type !== "SAVECREATE" && this.setState({
|
||||
customItemDialog: { ...this.state.customItemDialog, visible: false, id: "" }
|
||||
});
|
||||
});
|
||||
|
||||
handleSearch(value) {
|
||||
const { salaryItemStore: { getTableDatas } } = this.props;
|
||||
getTableDatas({ ...this.state.searchParams, current: 1, name: value }).then(res => {
|
||||
this.setState({
|
||||
searchParams: {
|
||||
...this.state.searchParams,
|
||||
current: 1,
|
||||
total: res.total
|
||||
} else {
|
||||
message.error(errormsg);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
!f1.isValid && f1.showErrors();
|
||||
!f2.taxAgentValidate && f1.showError("taxAgentIds", getLabel(111, "\"可见性范围\"未填写"));
|
||||
!f2.formulaValidate && f1.showError("formulaContent", getLabel(111, `\"${form.getFormDatas().valueType.valueSpan}\"未填写`));
|
||||
this.forceUpdate();
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
handlePageChange(value) {
|
||||
const { salaryItemStore: { getTableDatas } } = this.props;
|
||||
getTableDatas({ ...this.state.searchParams, name: this.state.searchValue, current: value }).then(res => {
|
||||
this.setState({
|
||||
searchParams: {
|
||||
...this.state.searchParams,
|
||||
current: value,
|
||||
total: res.total
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
handleShowSizeChange(searchParams) {
|
||||
const { salaryItemStore: { getTableDatas } } = this.props;
|
||||
getTableDatas({ ...searchParams });
|
||||
}
|
||||
|
||||
|
||||
};
|
||||
onDropMenuClick = (key, targetid = "") => {
|
||||
switch (key) {
|
||||
case "log":
|
||||
|
|
@ -228,206 +117,84 @@ export default class SalaryItem extends React.Component {
|
|||
}
|
||||
});
|
||||
break;
|
||||
case "customAdd":
|
||||
case "edit":
|
||||
const { taxAgentStore: { showOperateBtn } } = this.props;
|
||||
const { loading } = this.state;
|
||||
const editTitle = !showOperateBtn ? getLabel(111, "查看自定义薪资项目") : getLabel(111, "修改自定义薪资项目");
|
||||
const title = key === "edit" ? editTitle : getLabel(111, "新建自定义薪资项目");
|
||||
const buttons = key === "edit" ? [
|
||||
<Button type="ghost" onClick={() => this.setState({
|
||||
syncSalarySetDialog: { visible: true, id: targetid }
|
||||
})}>{getLabel(111, "同步到薪资账套")}</Button>,
|
||||
<Button type="primary" loading={loading}
|
||||
onClick={() => this.handleSalaryItem("SAVE")}>{getLabel(111, "保存")}</Button>
|
||||
] : [
|
||||
<Button type="primary" loading={loading}
|
||||
onClick={() => this.handleSalaryItem("SAVE")}>{getLabel(111, "保存")}</Button>,
|
||||
<Button type="ghost" loading={loading}
|
||||
onClick={() => this.handleSalaryItem("SAVECREATE")}>{getLabel(111, "保存并继续创建")}</Button>
|
||||
];
|
||||
this.setState({
|
||||
customItemDialog: {
|
||||
visible: true, title, buttons: showOperateBtn ? buttons : [], id: targetid
|
||||
}
|
||||
});
|
||||
break;
|
||||
case "delete":
|
||||
this.handleDeleteItem(targetid);
|
||||
break;
|
||||
case "sysAdd":
|
||||
this.setState({ sysVisible: true });
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
render() {
|
||||
const { taxAgentStore: { showOperateBtn } } = this.props;
|
||||
const {
|
||||
salaryItemStore, salaryFileStore, taxAgentStore: { showOperateBtn, showSalaryItemBtn, taxAgentOption }
|
||||
} = this.props;
|
||||
const { userStatusList } = salaryFileStore;
|
||||
const { selectedRowKeys, logDialogVisible, filterConditions, salaryItemImpDialog } = this.state;
|
||||
const { loading, deleteItemRequest, getTableDatas } = salaryItemStore;
|
||||
const {
|
||||
tableDataSource,
|
||||
tableColumns,
|
||||
systemItemVisible,
|
||||
setSystemItemVisible,
|
||||
editSlideVisible,
|
||||
setEditSlideVisible,
|
||||
request
|
||||
} = salaryItemStore;
|
||||
if (this.getColumns().length === 2) { // 无权限处理
|
||||
return renderLoading();
|
||||
}
|
||||
|
||||
const handleMenuClick = (e) => {
|
||||
const { salaryItemStore: { setEditSlideVisible, initRequest } } = this.props;
|
||||
if (e.key === "1") {
|
||||
this.setState({ editable: true, isAdd: true });
|
||||
initRequest();
|
||||
setEditSlideVisible(true);
|
||||
} else if (e.key === "2") {
|
||||
setSystemItemVisible(true);
|
||||
}
|
||||
};
|
||||
|
||||
selectedRowKeys, logDialogVisible, filterConditions, name, isQuery, customItemDialog, sysVisible,
|
||||
salaryItemImpDialog
|
||||
} = this.state;
|
||||
const menu = (
|
||||
<Menu onClick={handleMenuClick}>
|
||||
<Menu.Item key="2">{getLabel(111, "新增系统薪资项")}</Menu.Item>
|
||||
<Menu onClick={({ key }) => this.onDropMenuClick(key)}>
|
||||
<Menu.Item key="sysAdd">{getLabel(111, "新增系统薪资项")}</Menu.Item>
|
||||
</Menu>
|
||||
);
|
||||
|
||||
const buttons = [
|
||||
let buttons = [
|
||||
<Dropdown.Button overlay={menu} type="primary"
|
||||
onClick={() => handleMenuClick({ key: "1" })}>{getLabel(111, "新增自定义薪资项")}</Dropdown.Button>,
|
||||
<Button type="primary" onClick={() => {
|
||||
if (!selectedRowKeys.length) {
|
||||
message.info("未选中任何数据!");
|
||||
return;
|
||||
}
|
||||
Modal.confirm({
|
||||
title: "信息确认",
|
||||
content: `确定要将所选的薪资项（共${selectedRowKeys.length}条数据）删除吗？`,
|
||||
onOk: () => {
|
||||
deleteItemRequest(selectedRowKeys).then(() => {
|
||||
getTableDatas({ ...this.state.searchParams }).then(res => {
|
||||
this.setState({
|
||||
selectedRowKeys: [],
|
||||
searchParams: {
|
||||
...this.state.searchParams,
|
||||
total: res.total
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
}}>{getLabel(32136, "批量删除")}</Button>,
|
||||
<WeaInputSearch value={this.state.searchValue} placeholder={getLabel(111, "请输入名称")}
|
||||
onChange={value => this.setState({ searchValue: value })}
|
||||
onSearch={value => this.handleSearch(value)}/>
|
||||
onClick={() => this.onDropMenuClick("customAdd")}>{getLabel(111, "新增自定义薪资项")}</Dropdown.Button>,
|
||||
<Button type="ghost" onClick={() => this.handleDeleteItem()}>{getLabel(32136, "批量删除")}</Button>,
|
||||
<WeaInputSearch value={name} onChange={val => this.setState({ name: val })}
|
||||
placeholder={getLabel(111, "请输入名称")} onSearch={() => this.setState({ isQuery: !isQuery })}/>
|
||||
];
|
||||
// 新建和修改保存的回调
|
||||
const handleSlideSave = (continueFlag) => {
|
||||
const { salaryItemStore: { saveItem, request, getTableDatas } } = this.props;
|
||||
const payload = _.cloneDeep(request);
|
||||
const { name, sharedType, taxAgentIds } = request;
|
||||
if (!name || (sharedType === "1" && !taxAgentIds)) {
|
||||
Modal.warning({
|
||||
title: "信息确认",
|
||||
content: "必要信息不完整，红色*为必填项！"
|
||||
});
|
||||
return;
|
||||
}
|
||||
const { pattern, defaultValue, dataType, ...extra } = payload;
|
||||
saveItem({
|
||||
...extra, pattern, dataType,
|
||||
defaultValue: dataType === "number" ? toDecimal_n(defaultValue, parseInt(pattern)) : defaultValue
|
||||
}, continueFlag)
|
||||
.then(() => {
|
||||
getTableDatas({ ...this.state.searchParams }).then(res => {
|
||||
this.setState({
|
||||
searchParams: {
|
||||
...this.state.searchParams,
|
||||
total: res.total
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
const renderCustomOperate = () => {
|
||||
let arrList = [];
|
||||
if (this.state.isAdd) {
|
||||
arrList = [
|
||||
<Button type="primary" onClick={() => {
|
||||
handleSlideSave(false);
|
||||
}}>保存</Button>,
|
||||
<Button type="default" onClick={() => {
|
||||
handleSlideSave(true);
|
||||
}}>保存并继续创建</Button>
|
||||
];
|
||||
} else if (this.state.editable) {
|
||||
arrList = [
|
||||
<Button type="ghost"
|
||||
onClick={() => this.setState({
|
||||
syncSalarySetDialog: {
|
||||
...this.state.syncSalarySetDialog,
|
||||
visible: true,
|
||||
title: getLabel(111, "请选择薪资账套")
|
||||
}
|
||||
})}
|
||||
>{getLabel(111, "同步到薪资账套")}</Button>,
|
||||
<Button type="primary" onClick={() => {
|
||||
handleSlideSave(true);
|
||||
}}>保存</Button>
|
||||
];
|
||||
}
|
||||
return arrList;
|
||||
};
|
||||
|
||||
const handleSaveSlideChange = (value) => {
|
||||
const { salaryItemStore: { setRequest } } = this.props;
|
||||
setRequest(value);
|
||||
};
|
||||
const rowSelection = {
|
||||
selectedRowKeys,
|
||||
onChange: (selectedRowKeys) => this.setState({ selectedRowKeys })
|
||||
// getCheckboxProps: record => ({
|
||||
// disabled: !record.canDelete // Column configuration not to be checked
|
||||
// })
|
||||
};
|
||||
let dropMenuDatas = [
|
||||
{ key: "import", icon: <i className="icon-coms02-Template-import1"/>, content: getLabel(111, "导入") },
|
||||
{ key: "export", icon: <i className="iconfont icon-daochu"/>, content: getLabel(111, "导出") },
|
||||
{ key: "log", icon: <i className="iconfont icon-caozuorizhi32"/>, content: getLabel(545781, "操作日志") }
|
||||
];
|
||||
!showOperateBtn && (buttons = buttons.slice(-1));
|
||||
!showOperateBtn && (dropMenuDatas = dropMenuDatas.slice(-1));
|
||||
return (
|
||||
<div className="mySalaryBenefitsWrapper">
|
||||
<WeaTop title="薪资项目管理" icon={<i className="icon-coms-fa"/>} iconBgcolor="#F14A2D"
|
||||
showDropIcon onDropMenuClick={this.onDropMenuClick}
|
||||
dropMenuDatas={[
|
||||
{
|
||||
key: "import",
|
||||
icon: <i className="icon-coms02-Template-import1"/>,
|
||||
content: getLabel(111, "导入")
|
||||
},
|
||||
{
|
||||
key: "export",
|
||||
icon: <i className="iconfont icon-daochu"/>,
|
||||
content: getLabel(111, "导出")
|
||||
},
|
||||
{
|
||||
key: "log", icon: <i className="iconfont icon-caozuorizhi32"/>,
|
||||
content: getLabel(545781, "操作日志")
|
||||
}
|
||||
]} buttons={(showOperateBtn || showSalaryItemBtn) ? buttons : buttons.slice(-1)}>
|
||||
<div className="tableWrapper">
|
||||
<WeaNewScroll height="100%">
|
||||
<CustomPaginationTable
|
||||
rowKey={record => record.id}
|
||||
loading={loading}
|
||||
rowSelection={rowSelection}
|
||||
dataSource={tableDataSource}
|
||||
columns={this.getColumns(tableColumns)}
|
||||
total={this.state.searchParams.total}
|
||||
current={this.state.searchParams.current}
|
||||
pageSize={this.state.searchParams.pageSize}
|
||||
onPageChange={(value) => {
|
||||
this.handlePageChange(value);
|
||||
}}
|
||||
onShowSizeChange={(current, pageSize) => {
|
||||
this.setState({
|
||||
searchParams: {
|
||||
...this.state.searchParams,
|
||||
current,
|
||||
pageSize
|
||||
}
|
||||
}, () => {
|
||||
this.handleShowSizeChange({ name: this.state.searchValue, ...this.state.searchParams });
|
||||
});
|
||||
}}
|
||||
/>
|
||||
</WeaNewScroll>
|
||||
<React.Fragment>
|
||||
<WeaTop title={getLabel(111, "薪资项目管理")} icon={<i className="icon-coms-fa"/>} iconBgcolor="#F14A2D"
|
||||
buttons={buttons} showDropIcon onDropMenuClick={this.onDropMenuClick} dropMenuDatas={dropMenuDatas}
|
||||
className="salaryProjectManagement">
|
||||
<div className="salaryItems_content">
|
||||
<SalaryItemsTable {...this.props} name={name} isQuery={isQuery} showOperateBtn={showOperateBtn}
|
||||
selectedRowKeys={selectedRowKeys} onDropMenuClick={this.onDropMenuClick}
|
||||
onChange={val => this.setState({ selectedRowKeys: val })}/>
|
||||
</div>
|
||||
</WeaTop>
|
||||
{/*添加系统薪资项目*/}
|
||||
<SystemSalaryItemModal visible={sysVisible} onSearch={() => this.setState({ isQuery: !isQuery })}
|
||||
onCancel={(callback) => this.setState({ sysVisible: false }, () => callback && callback())}/>
|
||||
{/*同步薪资账套*/}
|
||||
<SyncToSalaryAccountSetDialog
|
||||
{...this.state.syncSalarySetDialog}
|
||||
onCancel={() => this.setState({
|
||||
syncSalarySetDialog: {
|
||||
...this.state.syncSalarySetDialog,
|
||||
visible: false, title: ""
|
||||
}
|
||||
})}
|
||||
/>
|
||||
onCancel={() => this.setState({ syncSalarySetDialog: { visible: false, id: "" } })}/>
|
||||
{/*操作日志*/}
|
||||
<LogDialog visible={logDialogVisible} logFunction="salaryitem" filterConditions={filterConditions}
|
||||
onCancel={() => this.setState({ logDialogVisible: false })}/>
|
||||
|
|
@ -436,61 +203,15 @@ export default class SalaryItem extends React.Component {
|
|||
onCancel={callback => {
|
||||
this.setState({
|
||||
salaryItemImpDialog: { ...salaryItemImpDialog, visible: false }
|
||||
}, () => callback && this.handleSearch(this.state.searchValue));
|
||||
}, () => callback && this.setState({ isQuery: !isQuery }));
|
||||
}}/>
|
||||
{
|
||||
systemItemVisible &&
|
||||
<SystemSalaryItemModal
|
||||
visible={systemItemVisible}
|
||||
onCancel={() => {
|
||||
setSystemItemVisible(false);
|
||||
}}
|
||||
onInitTableList={() => {
|
||||
getTableDatas({ ...this.state.searchParams, name: this.state.searchValue }).then(res => {
|
||||
this.setState({
|
||||
searchParams: {
|
||||
...this.state.searchParams,
|
||||
total: res.total
|
||||
}
|
||||
});
|
||||
});
|
||||
}}
|
||||
/>
|
||||
}
|
||||
{
|
||||
editSlideVisible &&
|
||||
<WeaSlideModal
|
||||
className="slideOuterWrapper"
|
||||
visible={editSlideVisible}
|
||||
top={0}
|
||||
measureT="%"
|
||||
width={800}
|
||||
measureX="px"
|
||||
height={100}
|
||||
measureY="%"
|
||||
direction={"right"}
|
||||
title={
|
||||
<SlideModalTitle
|
||||
subtitle={(this.state.isAdd ? "新建" : "修改") + "自定义薪资项目"}
|
||||
editable={false}
|
||||
showOperateBtn={(showSalaryItemBtn || showOperateBtn)}
|
||||
customOperate={(showSalaryItemBtn || showOperateBtn) ? renderCustomOperate() : []}
|
||||
/>
|
||||
}
|
||||
content={
|
||||
<CustomSalaryItemSlide
|
||||
record={this.record} editable={this.state.editable}
|
||||
isAdd={this.state.isAdd} request={request}
|
||||
userStatusList={userStatusList}
|
||||
taxAgentAdminOption={taxAgentOption}
|
||||
onChange={(value) => {
|
||||
handleSaveSlideChange(value);
|
||||
}}/>
|
||||
}
|
||||
onClose={() => setEditSlideVisible(false)}
|
||||
/>
|
||||
}
|
||||
</div>
|
||||
{/*新增编辑自定义薪资项目*/}
|
||||
<CustomSalaryItemSlide {...customItemDialog} onSearch={() => this.setState({ isQuery: !isQuery })}
|
||||
showOperateBtn={showOperateBtn}
|
||||
onClose={callback => this.setState({
|
||||
customItemDialog: { ...customItemDialog, visible: false, id: "" }
|
||||
}, () => callback && callback())}/>
|
||||
</React.Fragment>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,91 @@
|
|||
//薪资项目重构项
|
||||
.salaryProjectManagement {
|
||||
.wea-input-focus {
|
||||
height: 31.36px;
|
||||
line-height: 0;
|
||||
}
|
||||
|
||||
.salaryItems_content {
|
||||
height: 100%;
|
||||
padding: 8px 16px;
|
||||
background: #f6f6f6;
|
||||
|
||||
.wea-new-table {
|
||||
background: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.custom_salaryItemSlide {
|
||||
.wea-slide-modal-title {
|
||||
border-bottom: 1px solid #e5e5e5 !important;
|
||||
}
|
||||
|
||||
.wea-slide-modal-content {
|
||||
height: 100%;
|
||||
background: #f6f6f6;
|
||||
|
||||
.wea-form-item-wrapper {
|
||||
//display: block !important;
|
||||
|
||||
.formula_input_div {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 2;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.titleDialog {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 46px 0 16px;
|
||||
|
||||
.titleCol {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.titleLeftBox {
|
||||
.titleIcon {
|
||||
color: #fff;
|
||||
margin: 0;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
font-size: 22px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: #F14A2D;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
padding-left: 6px;
|
||||
}
|
||||
}
|
||||
|
||||
.titleRightBox {
|
||||
justify-content: flex-end;
|
||||
|
||||
button {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.customSalaryItemSlide {
|
||||
padding: 16px;
|
||||
|
||||
|
|
@ -62,20 +150,20 @@
|
|||
|
||||
//系统薪资项添加modal
|
||||
.sys-salary-wrapper {
|
||||
.wea-dialog-body {
|
||||
height: 50vh;
|
||||
overflow: hidden auto;
|
||||
.sys-item-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.headerSearchWrapper {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
padding: 16px 20px;
|
||||
.sys-item-table-box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #F6F6F6;
|
||||
padding: 8px 16px;
|
||||
|
||||
.wea-tab {
|
||||
width: 100%;
|
||||
border-bottom: none;
|
||||
}
|
||||
.wea-new-table {
|
||||
background: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -25,7 +25,6 @@ export const roundingModeOptions = [
|
|||
showname: "见分进角"
|
||||
}
|
||||
];
|
||||
|
||||
export const patternOptions = [
|
||||
{
|
||||
key: "0",
|
||||
|
|
@ -83,7 +82,6 @@ export const patternOptions = [
|
|||
selected: false
|
||||
}
|
||||
];
|
||||
|
||||
export const dataTypeOptions = [
|
||||
{
|
||||
key: "number",
|
||||
|
|
|
|||
|
|
@ -0,0 +1,111 @@
|
|||
/*
|
||||
* 薪资项目管理
|
||||
* 表格
|
||||
* @Author: 黎永顺
|
||||
* @Date: 2024/8/16
|
||||
* @Wechat:
|
||||
* @Email: 971387674@qq.com
|
||||
* @description:
|
||||
*/
|
||||
import React, { Component } from "react";
|
||||
import { WeaCheckbox, WeaLocaleProvider, WeaTable } from "ecCom";
|
||||
import { Dropdown, Menu, Spin } from "antd";
|
||||
import * as API from "../../apis/item";
|
||||
|
||||
const getLabel = WeaLocaleProvider.getLabel;
|
||||
|
||||
class SalaryItemsTable extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
loading: false, columns: [], dataSource: [],
|
||||
pageInfo: { current: 1, pageSize: 10, total: 0 }
|
||||
};
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.getItemList(this.props);
|
||||
}
|
||||
|
||||
componentWillReceiveProps(nextProps, nextContext) {
|
||||
if (nextProps.isQuery !== this.props.isQuery) this.setState({
|
||||
pageInfo: { ...this.state.pageInfo, current: 1 }
|
||||
}, () => this.getItemList(nextProps));
|
||||
}
|
||||
|
||||
getItemList = (props) => {
|
||||
const { name } = props;
|
||||
const { pageInfo } = this.state;
|
||||
const payload = { name, ...pageInfo };
|
||||
this.setState({ loading: true });
|
||||
API.getItemList(payload).then(({ status, data }) => {
|
||||
this.setState({ loading: false });
|
||||
if (status) {
|
||||
const { columns, list: dataSource, pageNum: current, pageSize, total } = data;
|
||||
this.setState({
|
||||
dataSource, pageInfo: { ...pageInfo, current, pageSize, total },
|
||||
columns: _.map(columns, o => {
|
||||
if (o.dataIndex === "useDefault" || o.dataIndex === "hideDefault" || o.dataIndex === "useInEmployeeSalary") {
|
||||
return { ...o, width: 80, render: text => <WeaCheckbox value={String(text)} disabled display="switch"/> };
|
||||
}
|
||||
return { ...o };
|
||||
})
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
render() {
|
||||
const { dataSource, columns, pageInfo, loading } = this.state;
|
||||
const { selectedRowKeys, onChange, onDropMenuClick, showOperateBtn } = this.props;
|
||||
const pagination = {
|
||||
...pageInfo,
|
||||
showTotal: total => `${getLabel(111, "共")} ${total} ${getLabel(111, "条")}`,
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
pageSizeOptions: ["10", "20", "50", "100"],
|
||||
onShowSizeChange: (current, pageSize) => {
|
||||
this.setState({
|
||||
pageInfo: { ...pageInfo, current, pageSize }
|
||||
}, () => this.getItemList(this.props));
|
||||
},
|
||||
onChange: current => {
|
||||
this.setState({ pageInfo: { ...pageInfo, current } }, () => this.getItemList(this.props));
|
||||
}
|
||||
};
|
||||
const rowSelection = {
|
||||
selectedRowKeys, onChange,
|
||||
getCheckboxProps: record => ({ disabled: !record.canDelete })
|
||||
};
|
||||
return (<Spin spinning={loading && pageInfo.total === 0}>
|
||||
<WeaTable rowKey="id" dataSource={dataSource} rowSelection={rowSelection} pagination={pagination}
|
||||
loading={loading} scroll={{ y: `calc(100vh - 180px)` }}
|
||||
columns={[
|
||||
...columns, {
|
||||
dataIndex: "opt", title: getLabel(111, "操作"), width: 140,
|
||||
render: (__, record) => (<React.Fragment>
|
||||
<a style={{ marginRight: 8 }} onClick={() => onDropMenuClick("edit", record.id)}
|
||||
href="javascript:void(0);">{showOperateBtn ? getLabel(111, "编辑") : getLabel(111, "查看")}</a>
|
||||
{
|
||||
showOperateBtn && record.canDelete &&
|
||||
<a style={{ marginRight: 8 }} href="javascript:void(0);"
|
||||
onClick={() => onDropMenuClick("delete", record.id)}>{getLabel(111, "删除")}</a>
|
||||
}
|
||||
<Dropdown overlay={
|
||||
<Menu>
|
||||
<Menu.Item>
|
||||
<a href="javascript:void(0);"
|
||||
onClick={() => onDropMenuClick("log", record.id)}>{getLabel(545781, "操作日志")}</a>
|
||||
</Menu.Item>
|
||||
</Menu>
|
||||
}>
|
||||
<a href="javascript:void(0)"><i className="icon-coms-more"/></a>
|
||||
</Dropdown>
|
||||
</React.Fragment>)
|
||||
}
|
||||
]}/>
|
||||
</Spin>);
|
||||
}
|
||||
}
|
||||
|
||||
export default SalaryItemsTable;
|
||||
|
|
@ -51,7 +51,6 @@ class SyncToSalaryAccountSetDialog extends Component {
|
|||
}
|
||||
});
|
||||
};
|
||||
|
||||
save = () => {
|
||||
const { salaryItemStore: { salarySetform }, id: salaryItemId } = this.props;
|
||||
salarySetform.validateForm().then(f => {
|
||||
|
|
@ -80,7 +79,7 @@ class SyncToSalaryAccountSetDialog extends Component {
|
|||
return (
|
||||
<WeaDialog
|
||||
{...this.props} className="salarySetDialog" initLoadCss
|
||||
style={{ width: 480 }}
|
||||
style={{ width: 480 }} title={getLabel(111, "请选择薪资账套")}
|
||||
buttons={[<Button type="primary" onClick={this.save}
|
||||
loading={this.state.loading}>{getLabel(537558, "确定")}</Button>]}
|
||||
>
|
||||
|
|
|
|||
|
|
@ -1,8 +1,7 @@
|
|||
import React from "react";
|
||||
import { WeaDialog, WeaLocaleProvider, WeaTab } from "ecCom";
|
||||
import { Button, message } from "antd";
|
||||
import { WeaDialog, WeaInputSearch, WeaLocaleProvider, WeaTable } from "ecCom";
|
||||
import { Button, message, Spin } from "antd";
|
||||
import { getSysItemList, saveSysItem } from "../../apis/item";
|
||||
import UnifiedTable from "../../components/UnifiedTable";
|
||||
import "./index.less";
|
||||
|
||||
const { getLabel } = WeaLocaleProvider;
|
||||
|
|
@ -10,20 +9,16 @@ export default class SystemSalaryItemModal extends React.Component {
|
|||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
dataSource: [],
|
||||
columns: [],
|
||||
name: "",
|
||||
loading: false,
|
||||
saveLoading: false,
|
||||
selectedRowKeys: [],
|
||||
pageInfo: {
|
||||
current: 1, pageSize: 10, total: 0
|
||||
}
|
||||
dataSource: [], columns: [], name: "", loading: false, saveLoading: false,
|
||||
selectedRowKeys: [], pageInfo: { current: 1, pageSize: 10, total: 0 }
|
||||
};
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.getSysItemList();
|
||||
componentWillReceiveProps(nextProps, nextContext) {
|
||||
if (nextProps.visible !== this.props.visible && nextProps.visible) this.getSysItemList();
|
||||
if (nextProps.visible !== this.props.visible && !nextProps.visible) this.setState({
|
||||
selectedRowKeys: [], name: ""
|
||||
});
|
||||
}
|
||||
|
||||
getSysItemList = () => {
|
||||
|
|
@ -33,41 +28,33 @@ export default class SystemSalaryItemModal extends React.Component {
|
|||
this.setState({ loading: false });
|
||||
if (status) {
|
||||
const { columns, list: dataSource, pageNum: current, pageSize, total } = data;
|
||||
this.setState({
|
||||
columns: _.map(columns, item => {
|
||||
return {
|
||||
...item,
|
||||
render: (text) => {
|
||||
return <span className="ellipsis" title={text}>{text}</span>;
|
||||
}
|
||||
};
|
||||
}),
|
||||
dataSource,
|
||||
pageInfo: { ...pageInfo, current, pageSize, total }
|
||||
});
|
||||
this.setState({ columns, dataSource, pageInfo: { ...pageInfo, current, pageSize, total } });
|
||||
}
|
||||
}).catch(() => this.setState({ loading: false }));
|
||||
};
|
||||
handleAdd = () => {
|
||||
const { selectedRowKeys } = this.state;
|
||||
if (_.isEmpty(selectedRowKeys)) {
|
||||
message.info(getLabel(111, "未选择任何条目"));
|
||||
return;
|
||||
}
|
||||
this.setState({ saveLoading: true });
|
||||
saveSysItem(selectedRowKeys).then(({ status, errormsg }) => {
|
||||
this.setState({ saveLoading: false });
|
||||
if (status) {
|
||||
message.success(getLabel(111, "添加成功"));
|
||||
this.setState({ selectedRowKeys: [] }, () => {
|
||||
this.props.onInitTableList();
|
||||
this.props.onCancel();
|
||||
});
|
||||
this.setState({ selectedRowKeys: [] }, () => this.props.onCancel(this.props.onSearch()));
|
||||
} else {
|
||||
message.error(errormsg);
|
||||
}
|
||||
}).catch(() => this.setState({ saveLoading: false }));
|
||||
};
|
||||
renderTitle = () => {
|
||||
const { name, pageInfo } = this.state;
|
||||
return <div className="sys-item-title">
|
||||
<span>{getLabel(111, "添加系统薪资项目")}</span>
|
||||
<WeaInputSearch value={name} onChange={val => this.setState({ name: val })} style={{ width: 200 }}
|
||||
placeholder={getLabel(111, "请输入薪资项目名称")} a onSearch={() => this.setState({
|
||||
pageInfo: { ...pageInfo, current: 1 }
|
||||
}, () => this.getSysItemList())}/>
|
||||
</div>;
|
||||
};
|
||||
|
||||
render() {
|
||||
const { selectedRowKeys, pageInfo, loading, columns, dataSource, saveLoading } = this.state;
|
||||
|
|
@ -95,33 +82,20 @@ export default class SystemSalaryItemModal extends React.Component {
|
|||
onChange: (selectedRowKeys) => this.setState({ selectedRowKeys })
|
||||
};
|
||||
return (
|
||||
<WeaDialog
|
||||
title="添加系统薪资项目"
|
||||
initLoadCss className="sys-salary-wrapper"
|
||||
visible={this.props.visible} onCancel={() => {
|
||||
this.setState({ selectedRowKeys: [] }, () => {
|
||||
this.props.onCancel();
|
||||
});
|
||||
}} style={{ width: "60vw" }} scalable
|
||||
buttons={[
|
||||
<Button type="primary" loading={saveLoading} onClick={this.handleAdd}>添加</Button>
|
||||
]}
|
||||
>
|
||||
<div className="headerSearchWrapper">
|
||||
<WeaTab datas={[]} keyParam="viewcondition" //主键
|
||||
searchType={["base"]} onSearchChange={name => this.setState({ name })}
|
||||
onSearch={this.getSysItemList}
|
||||
/>
|
||||
<WeaDialog {...this.props} initLoadCss className="sys-salary-wrapper" ref={dom => this.sysItemRef = dom}
|
||||
style={{
|
||||
width: "60vw", height: 600, minHeight: 200, minWidth: 380,
|
||||
maxHeight: "90%", maxWidth: "90%", overflow: "hidden", transform: "translate(0px, 0px)"
|
||||
}} title={this.renderTitle()}
|
||||
buttons={[<Button type="primary" loading={saveLoading} disabled={_.isEmpty(selectedRowKeys)}
|
||||
onClick={this.handleAdd}>{getLabel(111, "添加")}</Button>]}>
|
||||
<div className="sys-item-table-box">
|
||||
<Spin spinning={loading && pageInfo.total === 0}>
|
||||
<WeaTable columns={columns} dataSource={dataSource} pagination={pagination} rowSelection={rowSelection}
|
||||
loading={loading} scroll={{ y: this.importRef ? this.sysItemRef.state.height - 16 : 600 }}
|
||||
rowKey="id"/>
|
||||
</Spin>
|
||||
</div>
|
||||
<UnifiedTable
|
||||
loading={loading}
|
||||
rowKey="id"
|
||||
columns={columns}
|
||||
dataSource={dataSource}
|
||||
pagination={pagination}
|
||||
rowSelection={rowSelection}
|
||||
xWidth={columns.length * 120}
|
||||
/>
|
||||
</WeaDialog>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -9,6 +9,9 @@ const { TableStore } = WeaTableNew;
|
|||
|
||||
export class SalaryItemStore {
|
||||
@observable salarySetform = new WeaForm(); //同步薪资账套form
|
||||
@observable itemsForm = new WeaForm(); //自定义薪资项目form
|
||||
@action initItemsForm = () => this.itemsForm = new WeaForm();
|
||||
|
||||
|
||||
@observable tableStore = new TableStore(); // new table
|
||||
@observable sysListTableStore = new TableStore();
|
||||
|
|
|
|||
Loading…
Reference in New Issue