2018-10-09 02:23:32 +00:00
|
|
|
import React from 'react';
|
|
|
|
import ReactDOM from 'react-dom';
|
|
|
|
import NoticeContainer from './notice-container';
|
|
|
|
import './toast.css';
|
|
|
|
|
|
|
|
function createNotieContainer() {
|
2018-10-16 10:19:51 +00:00
|
|
|
const div = document.createElement('div');
|
|
|
|
document.body.appendChild(div);
|
|
|
|
const noticeContainer = ReactDOM.render(<NoticeContainer />, div);
|
2018-10-09 02:23:32 +00:00
|
|
|
return {
|
2018-10-16 10:19:51 +00:00
|
|
|
addNotice(notice) {
|
|
|
|
return noticeContainer.addNotice(notice);
|
|
|
|
},
|
|
|
|
destroy() {
|
|
|
|
ReactDOM.unmountComponentAtNode(div);
|
|
|
|
document.body.removeChild(div);
|
|
|
|
}
|
|
|
|
};
|
2018-10-09 02:23:32 +00:00
|
|
|
}
|
|
|
|
|
2018-10-16 10:19:51 +00:00
|
|
|
let noticeContainer = null;
|
2018-10-09 02:23:32 +00:00
|
|
|
const notice = (type, content, duration = 2000, onClose) => {
|
2018-10-16 10:19:51 +00:00
|
|
|
if (!noticeContainer) noticeContainer = createNotieContainer();
|
|
|
|
return noticeContainer.addNotice({ type, content, duration, onClose });
|
|
|
|
};
|
2018-10-09 02:23:32 +00:00
|
|
|
|
|
|
|
export default {
|
|
|
|
info(content, duration, onClose) {
|
2018-10-16 10:19:51 +00:00
|
|
|
return notice('info', content, duration, onClose);
|
2018-10-09 02:23:32 +00:00
|
|
|
},
|
|
|
|
success(content, duration, onClose) {
|
2018-10-16 10:19:51 +00:00
|
|
|
return notice('success', content, duration, onClose);
|
2018-10-09 02:23:32 +00:00
|
|
|
},
|
|
|
|
warning(content, duration, onClose) {
|
2018-10-16 10:19:51 +00:00
|
|
|
return notice('warning', content, duration, onClose);
|
2018-10-09 02:23:32 +00:00
|
|
|
},
|
|
|
|
error(content, duration, onClose) {
|
2018-10-16 10:19:51 +00:00
|
|
|
return notice('danger', content, duration, onClose);
|
2018-10-09 02:23:32 +00:00
|
|
|
}
|
2018-10-16 10:19:51 +00:00
|
|
|
};
|