118 lines
3.9 KiB
JavaScript
118 lines
3.9 KiB
JavaScript
import React from 'react'
|
|
import { WeaInputSearch } from 'ecCom'
|
|
import { Table, Icon, message, Modal } from 'antd'
|
|
import { dataSource, slideStep5Columns} from './columns'
|
|
import ValidRuleEditModal from './step5/ValidRuleEditModal'
|
|
import { inject, observer } from 'mobx-react';
|
|
|
|
@inject('ledgerStore')
|
|
@observer
|
|
export default class ValidRulesForm extends React.Component {
|
|
constructor(props) {
|
|
super(props)
|
|
this.state = {
|
|
modalVisible: false,
|
|
selectedRowKeys: [],
|
|
searchValue: ""
|
|
}
|
|
}
|
|
|
|
componentWillMount() {
|
|
const { ledgerStore: {getLedgerRuleList} } = this.props;
|
|
getLedgerRuleList()
|
|
}
|
|
|
|
handleItemDelete(record) {
|
|
const { ledgerStore: {deleteLedgerRule}} = this.props;
|
|
deleteLedgerRule([record.id])
|
|
}
|
|
|
|
onSelectChange(selectedRowKeys) {
|
|
this.setState({ selectedRowKeys });
|
|
};
|
|
|
|
handleBatchDelete() {
|
|
const { ledgerStore: { deleteLedgerRule } } = this.props;
|
|
const { selectedRowKeys } = this.state;
|
|
if(selectedRowKeys.length == 0) {
|
|
message.warning("未选择条目")
|
|
return
|
|
}
|
|
Modal.confirm({
|
|
title: '信息确认',
|
|
content: '确认删除',
|
|
onOk:() => {
|
|
deleteLedgerRule(selectedRowKeys)
|
|
},
|
|
onCancel: () => {
|
|
|
|
},
|
|
});
|
|
}
|
|
|
|
handeSearch() {
|
|
const { ledgerStore: { getLedgerRuleList } } = this.props;
|
|
const { searchValue } = this.state;
|
|
getLedgerRuleList(searchValue)
|
|
}
|
|
|
|
render() {
|
|
const { ledgerStore } = this.props;
|
|
const { ledgerRuleList } = ledgerStore
|
|
const { selectedRowKeys } = this.state;
|
|
let columns = ledgerRuleList.columns ? ledgerRuleList.columns.filter(item => item.dataIndex != "id") : []
|
|
|
|
if(columns.length > 0) {
|
|
columns.push({
|
|
title: "操作",
|
|
key: 'cz',
|
|
render: (text, record) => (
|
|
<a onClick={() => {this.handleItemDelete(record)}}>删除</a>
|
|
)
|
|
})
|
|
}
|
|
|
|
|
|
let dataSource = ledgerRuleList.list ? ledgerRuleList.list : []
|
|
dataSource.map(item => item.key = item.id)
|
|
|
|
const rowSelection = {
|
|
selectedRowKeys,
|
|
onChange: this.onSelectChange.bind(this),
|
|
};
|
|
return (
|
|
<div className="validRulesForm">
|
|
<div className="headerBar">
|
|
<WeaInputSearch className="inputSearch" value={this.state.searchValue} onChange={(value) => {this.setState({searchValue: value})}}
|
|
onSearch={(value) => {this.handeSearch(value)}}/>
|
|
<span className="btnsWrapper">
|
|
{
|
|
dataSource.length > 0 && <Icon className="iconItem" type="minus-square" onClick={() => {this.handleBatchDelete()}}/>
|
|
}
|
|
<Icon className="iconItem" type="plus-square" onClick={() => {this.setState({
|
|
modalVisible: true
|
|
})}}/>
|
|
</span>
|
|
</div>
|
|
<div className="tableWrapper">
|
|
{
|
|
ledgerRuleList.list && <Table rowSelection={rowSelection} dataSource={ledgerRuleList.list} columns={columns} pagination={{
|
|
total: ledgerRuleList.total,
|
|
showTotal: (total) => `共 ${total} 条`,
|
|
current: ledgerRuleList.pageNum
|
|
}}/>
|
|
}
|
|
|
|
</div>
|
|
{
|
|
this.state.modalVisible &&
|
|
<ValidRuleEditModal
|
|
visible={this.state.modalVisible}
|
|
onCancel={() => {this.setState({modalVisible: false})}}
|
|
/>
|
|
}
|
|
</div>
|
|
)
|
|
|
|
}
|
|
} |