148 lines
3.6 KiB
JavaScript
148 lines
3.6 KiB
JavaScript
import React from 'react'
|
||
import { connect } from 'dva'
|
||
import { Modal, Form, Checkbox, Row, Col, Input, message } from 'antd'
|
||
|
||
class EnergySystemSettingModal extends React.Component {
|
||
constructor(props) {
|
||
super(props)
|
||
this.state = {
|
||
visible: false,
|
||
loading: false,
|
||
boxData: [],
|
||
showBoxData: [],
|
||
boxDefaultValue: [],
|
||
}
|
||
}
|
||
|
||
componentDidMount() {
|
||
if (this.props.onRef) {
|
||
this.props.onRef(this)
|
||
}
|
||
}
|
||
|
||
showModal = () => {
|
||
this.getCheckboxData()
|
||
this.setState({
|
||
visible: true
|
||
})
|
||
}
|
||
getCheckboxData = () => {
|
||
const json = {
|
||
OrgId: this.props.login.OrgId
|
||
};
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
url: 'KR/Statistics/GetMeterNodeCheckbox',
|
||
payload: json,
|
||
onlyData: false,
|
||
onComplete: (re) => {
|
||
if (re.IsSuccessful && re.Data) {
|
||
const { boxData,boxDefaultValue } = re.Data
|
||
this.setState({
|
||
boxData,
|
||
boxDefaultValue,
|
||
showBoxData: boxData
|
||
})
|
||
}
|
||
}
|
||
})
|
||
};
|
||
|
||
handleCancel = e => {
|
||
this.setState({
|
||
visible: false,
|
||
})
|
||
}
|
||
|
||
onCheck = (checkedValues) => {
|
||
this.setState({
|
||
boxDefaultValue: checkedValues
|
||
});
|
||
}
|
||
|
||
handleOk = () => {
|
||
if (this.state.boxDefaultValue.length == 0) {
|
||
message.error("至少选中1个节点！");
|
||
return
|
||
}
|
||
if (this.state.boxDefaultValue.length > 20) {
|
||
message.error("最多选中20个变量！");
|
||
return
|
||
}
|
||
const json = {
|
||
OrgId: this.props.login.OrgId,
|
||
Keyword: this.state.boxDefaultValue.join(','),
|
||
};
|
||
this.props.dispatch({
|
||
type: 'app/getDataByPost',
|
||
url: 'KR/Statistics/EnergySystemSave',
|
||
payload: json,
|
||
onlyData: false,
|
||
onComplete: (re) => {
|
||
if (re.IsSuccessful && re.Data) {
|
||
if (re.Data.IsSucceed) {
|
||
message.success(re.Data.Msg);
|
||
this.setState({
|
||
visible: false,
|
||
}, () => { this.props.onLoadData()});
|
||
}
|
||
else
|
||
message.error(re.Data.Msg);
|
||
}
|
||
}
|
||
})
|
||
}
|
||
|
||
InputOnChange = (e) => {
|
||
const { boxData, boxDefaultValue } = this.state
|
||
if (e.target.value) {
|
||
let tmp = []
|
||
boxData.forEach(item => {
|
||
if (item.NAME.indexOf(e.target.value) != -1 || boxDefaultValue.indexOf(item.ID) != -1) {
|
||
tmp.push(item);
|
||
}
|
||
});
|
||
this.setState({ showBoxData: tmp })
|
||
}
|
||
else {
|
||
this.setState({ showBoxData: boxData })
|
||
}
|
||
}
|
||
|
||
|
||
render() {
|
||
const { visible, boxDefaultValue, showBoxData } = this.state
|
||
return (
|
||
<Modal
|
||
title='节点配置'
|
||
visible={visible}
|
||
onOk={this.handleOk}
|
||
onCancel={this.handleCancel}
|
||
>
|
||
<Form.Item
|
||
label='节点名称'
|
||
labelCol={{ span: 4 }}
|
||
wrapperCol={{ span: 20 }}
|
||
style={{ marginBottom: 0 }}
|
||
>
|
||
<Input onChange={this.InputOnChange} />
|
||
</Form.Item>
|
||
|
||
<Checkbox.Group style={{ width: '100%', fontSize: "24px" }} value={boxDefaultValue} onChange={this.onCheck}>
|
||
<Row>
|
||
{
|
||
showBoxData.map(item => {
|
||
return (
|
||
<Col span={24} key={item.ID}>
|
||
<Checkbox value={item.ID}>{item.NAME}</Checkbox>
|
||
</Col>
|
||
);
|
||
})
|
||
}
|
||
</Row>
|
||
</Checkbox.Group>
|
||
</Modal>
|
||
)
|
||
}
|
||
}
|
||
export default connect(({ app, editPage, loading, login }) => ({ app, editPage, loading, login }))(Form.create()(EnergySystemSettingModal)) |