薪资项目管理页面重构
This commit is contained in:
parent
b72dcc3e6b
commit
28dd4faf13
|
|
@ -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: ''
|
||||
},
|
||||
];
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -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}>
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
@ -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
|
||||
|
|
|
|||
Loading…
Reference in New Issue