113 lines
3.0 KiB
JavaScript
113 lines
3.0 KiB
JavaScript
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>
|
|
);
|
|
}
|
|
}
|