2017-02-28 21:32:23 +00:00
|
|
|
import React, {PureComponent} from 'react';
|
2017-03-03 01:44:07 +00:00
|
|
|
import autobind from 'autobind-decorator';
|
2017-03-08 05:52:17 +00:00
|
|
|
import Modal from '../base/modal';
|
|
|
|
import ModalBody from '../base/modal-body';
|
|
|
|
import ModalHeader from '../base/modal-header';
|
|
|
|
import ModalFooter from '../base/modal-footer';
|
2016-07-19 16:59:26 +00:00
|
|
|
|
2017-03-03 01:44:07 +00:00
|
|
|
@autobind
|
2017-02-28 21:32:23 +00:00
|
|
|
class AlertModal extends PureComponent {
|
2017-03-03 01:44:07 +00:00
|
|
|
constructor (props) {
|
|
|
|
super(props);
|
|
|
|
|
|
|
|
this.state = {
|
|
|
|
title: '',
|
2017-03-23 22:10:42 +00:00
|
|
|
message: '',
|
|
|
|
addCancel: false
|
2017-03-03 01:44:07 +00:00
|
|
|
};
|
|
|
|
}
|
2016-11-29 20:55:31 +00:00
|
|
|
|
2017-03-03 01:44:07 +00:00
|
|
|
_setModalRef (m) {
|
|
|
|
this.modal = m;
|
|
|
|
}
|
2017-02-28 21:32:23 +00:00
|
|
|
|
2017-03-03 01:44:07 +00:00
|
|
|
_handleOk () {
|
2016-11-29 20:55:31 +00:00
|
|
|
this.hide();
|
|
|
|
this._okCallback();
|
2017-03-03 20:09:08 +00:00
|
|
|
}
|
2016-11-29 20:55:31 +00:00
|
|
|
|
|
|
|
hide () {
|
|
|
|
this.modal.hide();
|
|
|
|
}
|
2016-07-19 16:59:26 +00:00
|
|
|
|
2016-11-20 07:43:22 +00:00
|
|
|
show (options = {}) {
|
2017-03-23 22:10:42 +00:00
|
|
|
const {title, message, addCancel} = options;
|
|
|
|
this.setState({title, message, addCancel});
|
2016-11-29 20:55:31 +00:00
|
|
|
|
2017-08-12 21:56:24 +00:00
|
|
|
this.modal.show();
|
|
|
|
|
2017-03-03 20:09:08 +00:00
|
|
|
return new Promise(resolve => {
|
|
|
|
this._okCallback = resolve;
|
|
|
|
});
|
2016-07-19 16:59:26 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
render () {
|
2017-03-23 22:10:42 +00:00
|
|
|
const {message, title, addCancel} = this.state;
|
2016-07-19 16:59:26 +00:00
|
|
|
|
|
|
|
return (
|
2017-03-08 05:52:17 +00:00
|
|
|
<Modal ref={this._setModalRef} closeOnKeyCodes={[13]}>
|
2016-11-07 20:24:38 +00:00
|
|
|
<ModalHeader>{title || 'Uh Oh!'}</ModalHeader>
|
2016-07-19 16:59:26 +00:00
|
|
|
<ModalBody className="wide pad">
|
|
|
|
{message}
|
|
|
|
</ModalBody>
|
|
|
|
<ModalFooter>
|
2017-03-23 22:10:42 +00:00
|
|
|
<div>
|
|
|
|
{addCancel ? <button className="btn" onClick={this.hide}>Cancel</button> : null}
|
|
|
|
<button className="btn" onClick={this._handleOk}>
|
|
|
|
Ok
|
|
|
|
</button>
|
|
|
|
</div>
|
2016-07-19 16:59:26 +00:00
|
|
|
</ModalFooter>
|
|
|
|
</Modal>
|
2017-03-03 20:09:08 +00:00
|
|
|
);
|
2016-07-19 16:59:26 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
AlertModal.propTypes = {};
|
|
|
|
|
|
|
|
export default AlertModal;
|