qt
/
salary-management-front
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

薪资项目管理页面重构

This commit is contained in:
黎永顺 2023-02-10 10:47:18 +08:00
parent 7578c4b09e
commit d60d3db993
6 changed files with 75 additions and 279 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
pc4mobx/hrmSalary/pages/fieldManagement/components/fieldSlide.js
View File

@ -184,65 +184,62 @@ class FieldSlide extends Component {
}
content={
<div className="wea-form-item-group">
<WeaFormItem label="名称" labelCol={{ span: 6 }} wrapperCol={{ span: 18 }}>
<WeaFormItem label="名称" labelCol={{ span: 6 }} wrapperCol={{ span: 12 }}>
<WeaInput viewAttr={3} value={name}
onChange={value => this.handleChangeFields("name", value)}/>
</WeaFormItem>
<WeaFormItem label="默认使用" labelCol={{ span: 6 }} wrapperCol={{ span: 18 }}>
<WeaFormItem label="默认使用" labelCol={{ span: 6 }} wrapperCol={{ span: 12 }}>
<WeaCheckbox
value={useDefault}
display="switch"
onChange={value => this.handleChangeFields("useDefault", value)}
/>
<WeaHelpfulTip style={{ marginLeft: "10px" }} width={200}
<WeaHelpfulTip style={{ marginLeft: "10px" }}
title="提示：开启后，每个薪资方案都有该薪资项目，可在具体薪资方案中删除"
placement="topLeft"
/>
</WeaFormItem>
<WeaFormItem label="可见性" labelCol={{ span: 6 }} wrapperCol={{ span: 18 }}>
<WeaFormItem label="可见性" labelCol={{ span: 6 }} wrapperCol={{ span: 12 }}>
<WeaSelect
value={sharedType}
options={shareTypeList}
onChange={value => this.handleChangeFields("sharedType", value)}
style={{ width: 200 }}
/>
</WeaFormItem>
{
sharedType === "1" &&
<WeaFormItem label="可见性范围" labelCol={{ span: 6 }} wrapperCol={{ span: 18 }}>
<WeaFormItem label="可见性范围" labelCol={{ span: 6 }} wrapperCol={{ span: 12 }}>
<WeaSelect
multiple
viewAttr={3}
style={{ width: 200 }}
value={taxAgentIds}
options={taxAgentAdminOption}
onChange={value => this.handleChangeFields("taxAgentIds", value)}
/>
</WeaFormItem>
}
<WeaFormItem label="字段类型" labelCol={{ span: 6 }} wrapperCol={{ span: 18 }}>
<WeaFormItem label="字段类型" labelCol={{ span: 6 }} wrapperCol={{ span: 12 }}>
<WeaSelect
value={dataType}
options={dataTypeOptions}
onChange={value => this.handleChangeFields("dataType", value)}
style={{ width: 200 }}
/>
</WeaFormItem>
<WeaFormItem label="舍入规则" labelCol={{ span: 6 }} wrapperCol={{ span: 18 }}>
<WeaFormItem label="舍入规则" labelCol={{ span: 6 }} wrapperCol={{ span: 12 }}>
<WeaSelect
value={roundingMode}
options={roundingModeOptions}
onChange={value => this.handleChangeFields("roundingMode", value)}
/>
</WeaFormItem>
<WeaFormItem label="保留小数位" labelCol={{ span: 6 }} wrapperCol={{ span: 18 }}>
<WeaFormItem label="保留小数位" labelCol={{ span: 6 }} wrapperCol={{ span: 12 }}>
<WeaSelect
value={pattern}
options={patternOptions}
onChange={value => this.handleChangeFields("pattern", value)}
/>
</WeaFormItem>
<WeaFormItem label="备注" labelCol={{ span: 6 }} wrapperCol={{ span: 18 }}>
<WeaFormItem label="备注" labelCol={{ span: 6 }} wrapperCol={{ span: 12 }}>
<WeaTextarea
value={description}
onChange={value => this.handleChangeFields("description", value)}

13
pc4mobx/hrmSalary/pages/fieldManagement/index.less
View File

@ -1,7 +1,16 @@
.slideOuterWrapper {
.wea-form-item-group{
padding: 56px 80px;
.wea-form-item-group {
margin: 16px;
border: 1px solid #e5e5e5;
border-bottom: none;
.wea-form-item {
padding: 4px 16px;
margin-bottom: 0;
border-bottom: 1px solid #e5e5e5;
}
}
.wea-slide-modal-title {
height: initial;
line-height: initial;

241
pc4mobx/hrmSalary/pages/salaryItem/customSalaryItemSlide.js
View File

@ -29,247 +29,12 @@ export default class CustomSalaryItemSlide extends React.Component {
};
render() {
const { editable, request, isAdd, userStatusList, taxAgentAdminOption } = this.props;
const {
name,
systemType,
useDefault,
useInEmployeeSalary,
roundingMode,
pattern,
valueType,
description,
dataType,
formulaContent,
formulaId,
sharedType,
taxAgentIds
} = request;
const { request } = this.props;
const { valueType, dataType, formulaId } = request;
const { formalModalVisible } = this.state;
return (
<div className="customSalaryItemSlide">
<SalaryItemForm {...this.props} onChangeFieldsItem={this.handleChange}/>
{/*<div>*/}
{/* <Row className="formItem">*/}
{/* <Col span={4}>名称</Col>*/}
{/* <Col span={20}>*/}
{/* <WeaInput*/}
{/* viewAttr={*/}
{/* (editable && this.props.record.canEdit) || isAdd ? 3 : 1*/}
{/* }*/}
{/* value={name}*/}
{/* onChange={value => {*/}
{/* this.handleChange({ name: value });*/}
{/* }}*/}
{/* />*/}
{/* </Col>*/}
{/* </Row>*/}
{/* <Row className="formItem">*/}
{/* <Col span={4}>薪资档案引用</Col>*/}
{/* <Col span={20}>*/}
{/* <Switch*/}
{/* disabled={*/}
{/* !((editable && this.props.record.canEdit) || isAdd)*/}
{/* }*/}
{/* checked={useInEmployeeSalary == 1}*/}
{/* onChange={value => {*/}
{/* this.handleChange({ useInEmployeeSalary: value ? 1 : 0 });*/}
{/* }}*/}
{/* />*/}
{/* <WeaHelpfulTip*/}
{/* style={{ marginLeft: "10px" }}*/}
{/* width={200}*/}
{/* title="提示：开启后，该薪资项目不可删除或设为无效，取值方式会默认置为输入"*/}
{/* placement="topLeft"*/}
{/* />*/}
{/* </Col>*/}
{/* </Row>*/}
{/* <Row className="formItem">*/}
{/* <Col span={4}>默认使用</Col>*/}
{/* <Col span={20}>*/}
{/* <Switch*/}
{/* disabled={*/}
{/* !((editable && this.props.record.canEdit) || isAdd)*/}
{/* }*/}
{/* checked={useDefault == 1}*/}
{/* onChange={value => {*/}
{/* this.handleChange({ useDefault: value ? 1 : 0 });*/}
{/* }}*/}
{/* />*/}
{/* <WeaHelpfulTip*/}
{/* style={{ marginLeft: "10px" }}*/}
{/* width={200}*/}
{/* title="提示：开启后，每个薪资方案都有该薪资项目，可在具体薪资方案中删除"*/}
{/* placement="topLeft"*/}
{/* />*/}
{/* </Col>*/}
{/* </Row>*/}
{/* {*/}
{/* (systemType == 0 || isAdd) &&*/}
{/* <Row className="formItem">*/}
{/* <Col span={12}>*/}
{/* <Row>*/}
{/* <Col span={8}>可见性</Col>*/}
{/* <Col span={16}>*/}
{/* <WeaSelect*/}
{/* disabled={!((editable && this.props.record.canEdit) || isAdd)}*/}
{/* value={String(sharedType)}*/}
{/* options={userStatusList}*/}
{/* onChange={value => {*/}
{/* let payload = {};*/}
{/* (value === "0" || value === "") && (payload.taxAgentIds = "");*/}
{/* payload.sharedType = value;*/}
{/* this.handleChange(payload);*/}
{/* }}*/}
{/* style={{ width: "200px" }}*/}
{/* />*/}
{/* </Col>*/}
{/* </Row>*/}
{/* </Col>*/}
{/* </Row>*/}
{/* }*/}
{/* {*/}
{/* sharedType === "1" &&*/}
{/* <Row className="formItem">*/}
{/* <Col span={12}>*/}
{/* <Row>*/}
{/* <Col span={8}>可见性范围</Col>*/}
{/* <Col span={16}>*/}
{/* <WeaSelect*/}
{/* disabled={!((editable && this.props.record.canEdit) || isAdd)}*/}
{/* multiple*/}
{/* viewAttr={3}*/}
{/* style={{ width: "200px" }}*/}
{/* value={taxAgentIds}*/}
{/* options={taxAgentAdminOption}*/}
{/* onChange={(value) => {*/}
{/* this.handleChange({ taxAgentIds: value });*/}
{/* }}*/}
{/* />*/}
{/* </Col>*/}
{/* </Row>*/}
{/* </Col>*/}
{/* </Row>*/}
{/* }*/}
{/* <Row className="formItem">*/}
{/* <Col span={12}>*/}
{/* <Row>*/}
{/* <Col span={8}>字段类型</Col>*/}
{/* <Col span={16}>*/}
{/* <WeaSelect*/}
{/* disabled={isAdd ? false : true}*/}
{/* value={dataType}*/}
{/* viewAttr={3}*/}
{/* options={dataTypeOptions}*/}
{/* onChange={value => {*/}
{/* this.handleChange({ dataType: value });*/}
{/* }}*/}
{/* style={{ width: "200px" }}*/}
{/* />*/}
{/* </Col>*/}
{/* </Row>*/}
{/* </Col>*/}
{/* </Row>*/}
{/* <Row className="formItem">*/}
{/* <Col span={12}>*/}
{/* <Row>*/}
{/* <Col span={8}>舍入规则</Col>*/}
{/* <Col span={16}>*/}
{/* <WeaSelect*/}
{/* viewAttr={*/}
{/* (editable && this.props.record.canEdit) || isAdd ? 3 : 1*/}
{/* }*/}
{/* options={roundingModeOptions}*/}
{/* style={{ width: "200px" }}*/}
{/* value={roundingMode}*/}
{/* onChange={value => {*/}
{/* this.handleChange({ roundingMode: value });*/}
{/* }}*/}
{/* />*/}
{/* </Col>*/}
{/* </Row>*/}
{/* </Col>*/}
{/* <Col span={12}>*/}
{/* <Row>*/}
{/* <Col span={8}>保留小数位</Col>*/}
{/* <Col span={16}>*/}
{/* <WeaSelect*/}
{/* viewAttr={*/}
{/* (editable && this.props.record.canEdit) || isAdd ? 3 : 1*/}
{/* }*/}
{/* options={patternOptions}*/}
{/* onChange={value => {*/}
{/* this.handleChange({ pattern: value });*/}
{/* }}*/}
{/* value={pattern}*/}
{/* style={{ width: "200px" }}*/}
{/* />*/}
{/* </Col>*/}
{/* </Row>*/}
{/* </Col>*/}
{/* </Row>*/}
{/* <Row className="formItem">*/}
{/* <Col span={4}>取值方式</Col>*/}
{/* <Col span={20}>*/}
{/* <WeaSelect*/}
{/* disabled={isAdd ? false : true}*/}
{/* value={valueType}*/}
{/* viewAttr={3}*/}
{/* detailtype={3}*/}
{/* options={[*/}
{/* { key: "1", showname: "输入" },*/}
{/* { key: "2", showname: "公式" },*/}
{/* { key: "3", showname: "SQL" }*/}
{/* ]}*/}
{/* onChange={value => {*/}
{/* this.handleChange({*/}
{/* valueType: value,*/}
{/* formulaId: null,*/}
{/* formulaContent: ""*/}
{/* });*/}
{/* }}/>*/}
{/* </Col>*/}
{/* </Row>*/}
{/* {(valueType == 2 || valueType == 3) &&*/}
{/* <Row className="formItem">*/}
{/* <Col span={4}>*/}
{/* {valueType == 2 ? "公式" : "SQL"}*/}
{/* </Col>*/}
{/* <Col span={20}>*/}
{/* <div*/}
{/* style={{*/}
{/* width: "100%",*/}
{/* lineHeight: "30px",*/}
{/* minHeight: "30px",*/}
{/* border: "1px solid rgb(217, 217, 217)"*/}
{/* }}*/}
{/* onClick={() => {*/}
{/* if (this.props.record.canEdit || isAdd) {*/}
{/* editable && this.handleShowFormal();*/}
{/* }*/}
{/* }}>*/}
{/* {formulaContent}*/}
{/* </div>*/}
{/* </Col>*/}
{/* </Row>}*/}
{/* <Row className="formItem">*/}
{/* <Col span={4}>备注</Col>*/}
{/* <Col span={20}>*/}
{/* <WeaTextarea*/}
{/* viewAttr={*/}
{/* (editable && this.props.record.canEdit) || isAdd ? 2 : 1*/}
{/* }*/}
{/* value={description}*/}
{/* onChange={value => {*/}
{/* this.handleChange({ description: value });*/}
{/* }}*/}
{/* />*/}
{/* </Col>*/}
{/* </Row>*/}
{/*</div>*/}
<SalaryItemForm {...this.props} onChangeFieldsItem={this.handleChange} onShowFormal={this.handleShowFormal}/>
{formalModalVisible &&
<FormalFormModal
formulaId={formulaId}

14
pc4mobx/hrmSalary/pages/salaryItem/index.js
View File

@ -65,13 +65,14 @@ export default class SalaryItem extends React.Component {
});
}
onEditItem(record, isedit) {
onEditItem = (record, isedit) => {
this.record = record;
const { salaryItemStore: { getItemForm, setEditSlideVisible } } = this.props;
this.setState({ editable: isedit, isAdd: false });
getItemForm(record.id);
setEditSlideVisible(true);
}
getItemForm(record.id).then(() => {
setEditSlideVisible(true);
});
};
// 删除列表项
handleDeleteItem(record) {
@ -209,7 +210,7 @@ export default class SalaryItem extends React.Component {
} = this.props;
const { userStatusList } = salaryFileStore;
const { selectedRowKeys } = this.state;
const { loading, deleteItemRequest, getTableDatas } = salaryItemStore;
const { loading, deleteItemRequest, getTableDatas, initRequest } = salaryItemStore;
const {
tableDataSource,
tableColumns,
@ -419,8 +420,7 @@ export default class SalaryItem extends React.Component {
}}/>
}
onClose={() => setEditSlideVisible(false)}
showMask={true}
closeMaskOnClick={() => setEditSlideVisible(false)}/>
/>
}
</div>
);

37
pc4mobx/hrmSalary/pages/salaryItem/salaryItemForm.js
View File

@ -24,6 +24,12 @@ class SalaryItemForm extends Component {
salaryItemFieldsList: _.map(salaryItemFieldsList, item => {
const { key } = item;
switch (key) {
case "useInEmployeeSalary":
return {
...item,
viewAttr: (editable && record.canEdit) || isAdd ? 2 : 1,
display: !isAdd
};
case "sharedType":
return {
...item,
@ -31,12 +37,17 @@ class SalaryItemForm extends Component {
display: systemType.toString() === "0" || isAdd
};
case "taxAgentIds":
console.log('123',sharedType, !_.isNil(sharedType) && sharedType.toString() === "1");
return {
...item,
multiple: true,
viewAttr: (editable && record.canEdit) || isAdd ? 3 : 1,
display: !_.isNil(sharedType) && sharedType.toString() === "1",
options: [{ key: "", showname: "" }, ...taxAgentAdminOption]
display: (!_.isNil(sharedType) && sharedType.toString() === "1") && (!_.isNil(systemType) && systemType.toString() === "0"),
options: taxAgentAdminOption
};
case "valueType":
return {
...item,
viewAttr: isAdd ? 2 : 1
};
case "formulaContent":
return {
@ -63,29 +74,38 @@ class SalaryItemForm extends Component {
if (key === "sharedType" && item.key === "taxAgentIds") {
return { ...item, display: v === "1", viewAttr: 3 };
} else if (key === "valueType" && item.key === "formulaContent") {
return { ...item, display: v === "2" || v === "3" };
return {
...item,
label: v === "2" ? "公式" : v === "3" ? "SQL" : "",
display: v === "2" || v === "3"
};
}
return { ...item };
})
}, () => {
onChangeFieldsItem({ [key]: (key === "useDefault" || key === "useInEmployeeSalary") ? Number(v) : v });
if (key === "valueType") {
onChangeFieldsItem({ formulaContent: "", formulaId: 0, valueType: v });
} else {
onChangeFieldsItem({ [key]: (key === "useDefault" || key === "useInEmployeeSalary") ? Number(v) : v });
}
});
};
render() {
const { userStatusList, request } = this.props;
const { userStatusList, request, onShowFormal } = this.props;
const { salaryItemFieldsList } = this.state;
return (
<WeaSearchGroup showGroup needTigger={false}>
{
_.map(salaryItemFieldsList, item => {
const { key, label, type, viewAttr, tip, options, display = true } = item;
const { key, label, type, viewAttr, tip, options, display = true, multiple = false } = item;
const value = !_.isNil(request[key]) ? request[key].toString() : "";
return <React.Fragment>
{
(type === "INPUT" && display) ?
<WeaFormItem label={label} labelCol={{ span: 6 }} wrapperCol={{ span: 12 }}>
<WeaInput viewAttr={viewAttr} value={value}
onClick={() => key === "formulaContent" && onShowFormal()}
onChange={v => this.handleChangeSalaryFiledItems(key, v)}/></WeaFormItem> :
(type === "SWITCH" && display) ?
<WeaFormItem label={label} labelCol={{ span: 6 }} wrapperCol={{ span: 12 }}>
@ -95,7 +115,8 @@ class SalaryItemForm extends Component {
(type === "SELECT" && display) ?
<WeaFormItem label={label} labelCol={{ span: 6 }} wrapperCol={{ span: 12 }}>
<WeaSelect value={value} options={key !== "sharedType" ? options : userStatusList}
viewAttr={viewAttr} onChange={v => this.handleChangeSalaryFiledItems(key, v)}/>
multiple={multiple} viewAttr={viewAttr}
onChange={v => this.handleChangeSalaryFiledItems(key, v)}/>
</WeaFormItem> :
(type === "RADIO" && display) ?
<WeaFormItem label={label} labelCol={{ span: 6 }} wrapperCol={{ span: 12 }}>

28
pc4mobx/hrmSalary/stores/salaryItem.js
View File

@ -163,18 +163,22 @@ export class SalaryItemStore {
//薪资项目-薪资项目详情
@action
getItemForm = (id) => {
API.getItemForm({ id }).then(res => {
if (res.status) {
let data = res.data;
Object.keys(data).map(key => {
if (!_.isNil(data[key])) {
data[key] = data[key].toString();
}
});
this.request = data;
} else {
message.error(res.errormsg || "获取失败");
}
return new Promise((resolve, reject) => {
API.getItemForm({ id }).then(res => {
if (res.status) {
let data = res.data;
Object.keys(data).map(key => {
if (!_.isNil(data[key])) {
data[key] = data[key].toString();
}
});
this.setRequest(data);
resolve();
} else {
message.error(res.errormsg || "获取失败");
reject();
}
});
});
};