薪资项目管理页面重构

This commit is contained in:
黎永顺 2023-02-09 13:05:22 +08:00
parent b72dcc3e6b
commit 28dd4faf13
4 changed files with 82 additions and 273 deletions

View File

@ -1,96 +1,65 @@
export const columns = [
{
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',
}
]
export const systemItemColumns = [
{
title: "薪资项目",
dataIndex: 'title',
key: 'title'
},
{
title: "属性",
dataIndex: 'title',
key: 'title'
},
{
title: "类型",
dataIndex: 'title',
key: 'title'
},
{
title: "舍入规则",
dataIndex: 'title',
key: 'title'
},
{
title: "保留小数位",
dataIndex: 'title',
key: 'title'
},
{
title: "取值方式",
dataIndex: 'title',
key: 'title'
}
]
export const dataSource = [
{
title: "测试"
}
{
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"
}
];
export const salaryItemFields = [
{
key: '',
label: '名称',
type: 'INPUT',
viewAttr: 3,
tip: ''
},
];

View File

@ -65,26 +65,26 @@ export default class CustomSalaryItemSlide extends React.Component {
/>
</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={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}>

View File

@ -1,112 +0,0 @@
import React from "react";
import { WeaDialog, WeaInputSearch } from "ecCom";
import { Button } from "antd";
import { inject, observer } from "mobx-react";
import CustomTable from "../../components/customTable";
@inject("salaryItemStore")
@observer
export default class DeleteSalaryItemModal extends React.Component {
constructor(props) {
super(props);
this.state = {
selectedRowKeys: [],
searchValue: ""
};
this.page = 1;
}
componentWillMount() {
const { salaryItemStore: { listCanDelete } } = this.props;
listCanDelete();
}
getColumns() {
const { salaryItemStore } = this.props;
const { canDeleteList } = salaryItemStore;
let columns = canDeleteList.columns ? canDeleteList.columns : [];
columns = [...columns];
return columns;
}
// 分页
handleDataPageChange(value) {
const { salaryItemStore: { listCanDelete } } = this.props;
this.page = value;
listCanDelete({ name: this.state.searchValue, current: value });
}
// 选择框选中事件
onSelectChange(selectedRowKeys) {
this.setState({ selectedRowKeys });
}
handleSearchChange(value) {
this.setState({ searchValue: value });
}
// 搜索
handleSearch(value) {
const { salaryItemStore: { listCanDelete } } = this.props;
listCanDelete({ name: value, current: this.page });
}
render() {
const { selectedRowKeys, searchValue } = this.state;
const { salaryItemStore } = this.props;
const { canDeleteList, modalLoading } = salaryItemStore;
const rowSelection = {
selectedRowKeys,
onChange: this.onSelectChange.bind(this)
};
const handleDelete = () => {
const { salaryItemStore: { deleteItem } } = this.props;
deleteItem(this.state.selectedRowKeys);
};
return (
<WeaDialog
title="批量删除"
visible={this.props.visible}
onCancel={() => {
this.props.onCancel();
}}
buttons={[
<Button
type="primary"
onClick={() => {
handleDelete();
}}>批量删除</Button>
]}
style={{ width: "80vw" }}
>
<div style={{ display: "flex", justifyContent: "flex-end", alignItems: "center", margin: 10 }}>
<WeaInputSearch value={searchValue} onChange={(value) => {
this.handleSearchChange(value);
}} onSearch={(value) => {
this.handleSearch(value);
}}/>
</div>
<div style={{ maxHeight: "500px", overflowY: "scroll" }}>
<CustomTable
loadding={modalLoading}
rowSelection={rowSelection}
columns={this.getColumns()}
dataSource={canDeleteList.list ? canDeleteList.list : []}
pagination={{
onChange: (value) => {
this.handleDataPageChange(value);
},
total: canDeleteList.total,
showTotal: (total) => `${total}`,
current: canDeleteList.pageNum
}}
/>
</div>
</WeaDialog>
);
}
}

View File

@ -8,7 +8,6 @@ import SystemSalaryItemModal from "./systemSalaryItemModal";
import { columns } from "./columns";
import SlideModalTitle from "../../components/slideModalTitle";
import CustomSalaryItemSlide from "./customSalaryItemSlide";
import DeleteSalaryItemModal from "./deleteSalaryItemModal";
import CustomPaginationTable from "../../components/customPaginationTable";
import "../socialSecurityBenefits/programme/index.less";
@ -210,20 +209,12 @@ export default class SalaryItem extends React.Component {
} = this.props;
const { userStatusList } = salaryFileStore;
const { selectedRowKeys } = this.state;
const {
loading,
form,
doSearch,
setShowSearchAd,
deleteItemRequest, getTableDatas
} = salaryItemStore;
const { loading, deleteItemRequest, getTableDatas } = salaryItemStore;
const {
tableDataSource,
tableColumns,
systemItemVisible,
setSystemItemVisible,
deleteItemVisible,
setDeleteItemVisible,
editSlideVisible,
setEditSlideVisible,
request
@ -231,43 +222,13 @@ export default class SalaryItem extends React.Component {
if (this.getColumns().length === 2) { // 无权限处理
return renderLoading();
}
const batchDelete = () => {
setDeleteItemVisible(true);
};
const rightMenu = [// 右键菜单
// {
// key: "BTN_COLUMN",
// icon: <i className="icon-coms-Custom"/>,
// content: "显示列定制",
// onClick: this.showColumn
// },
// {
// key: "BTN_DEL",
// icon: <i className="icon-coms-delete"/>,
// content: "批量删除",
// onClick: batchDelete
// }
];
const collectParams = { // 收藏功能配置
favname: "薪资项目管理",
favouritetype: 1,
objid: 0,
link: "wui/index.html#/ns_demo03/index",
importantlevel: 1
};
const adBtn = [ // 高级搜索内部按钮
<Button type="primary" onClick={doSearch}>搜索</Button>,
<Button type="ghost" onClick={() => form.resetForm()}>重置</Button>,
<Button type="ghost" onClick={() => setShowSearchAd(false)}>取消</Button>
];
const handleMenuClick = (e) => {
const { salaryItemStore: { getSysItemList, setEditSlideVisible, initRequest } } = this.props;
if (e.key == "1") {
if (e.key === "1") {
getSysItemList({});
setSystemItemVisible(true);
} else if (e.key == "2") {
} else if (e.key === "2") {
this.setState({ editable: true, isAdd: true });
initRequest();
setEditSlideVisible(true);
@ -381,8 +342,6 @@ export default class SalaryItem extends React.Component {
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
>
<CustomTab
searchOperationItem={
@ -421,13 +380,6 @@ export default class SalaryItem extends React.Component {
setSystemItemVisible(false);
}}/>
}
{
deleteItemVisible && <DeleteSalaryItemModal visible={deleteItemVisible} onCancel={() => {
setDeleteItemVisible(false);
}}/>
}
{
editSlideVisible &&
<WeaSlideModal