171 lines
3.5 KiB
JavaScript
171 lines
3.5 KiB
JavaScript
|
|
var Modal, ModalWrap, createModals;
|
||
|
|
window.Modal = Modal = class Modal extends React.Component {
|
||
|
|
constructor(props) {
|
||
|
|
var data, ref, ref1, ref2;
|
||
|
|
super(props);
|
||
|
|
console.log('modal', props);
|
||
|
|
data = (ref = props.data) != null ? ref : {};
|
||
|
|
this.state = {
|
||
|
|
closed: false,
|
||
|
|
content: (ref1 = data.content) != null ? ref1 : null,
|
||
|
|
scrollable: data.scrollable === true,
|
||
|
|
width: (ref2 = data.width) != null ? ref2 : null
|
||
|
|
};
|
||
|
|
this.close = this.close.bind(this);
|
||
|
|
this.wrap = null;
|
||
|
|
}
|
||
|
|
|
||
|
|
componentDidMount() {
|
||
|
|
if (this.state.scrollable) {
|
||
|
|
return $(this.wrap).perfectScrollbar();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
close() {
|
||
|
|
var base;
|
||
|
|
this.setState({
|
||
|
|
closed: true
|
||
|
|
});
|
||
|
|
return typeof (base = this.props).onClose === "function" ? base.onClose() : void 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
render() {
|
||
|
|
var _this = this;
|
||
|
|
|
||
|
|
var closed, content, style, width;
|
||
|
|
({
|
||
|
|
closed,
|
||
|
|
content,
|
||
|
|
width
|
||
|
|
} = this.state);
|
||
|
|
|
||
|
|
if (closed) {
|
||
|
|
return null;
|
||
|
|
}
|
||
|
|
|
||
|
|
style = {};
|
||
|
|
|
||
|
|
if (width != null) {
|
||
|
|
style.width = width + 'px';
|
||
|
|
}
|
||
|
|
|
||
|
|
return /*#__PURE__*/React.createElement("div", {
|
||
|
|
className: "background"
|
||
|
|
}, /*#__PURE__*/React.createElement("div", {
|
||
|
|
className: "background_click",
|
||
|
|
onClick: this.close
|
||
|
|
}), /*#__PURE__*/React.createElement("div", {
|
||
|
|
className: "modal",
|
||
|
|
ref: function (i) {
|
||
|
|
return _this.wrap = i;
|
||
|
|
},
|
||
|
|
style: style
|
||
|
|
}, /*#__PURE__*/React.createElement("div", {
|
||
|
|
className: "modal_content"
|
||
|
|
}, content)));
|
||
|
|
}
|
||
|
|
|
||
|
|
};
|
||
|
|
export default window.ModalWrap = ModalWrap = class ModalWrap extends React.Component {
|
||
|
|
constructor(props) {
|
||
|
|
super(props);
|
||
|
|
this.state = {
|
||
|
|
index: 0
|
||
|
|
};
|
||
|
|
this.modals = {};
|
||
|
|
this.rModals = {};
|
||
|
|
this.create = this.create.bind(this);
|
||
|
|
this.onClose = this.onClose.bind(this);
|
||
|
|
}
|
||
|
|
|
||
|
|
getBodyWrap() {
|
||
|
|
var res;
|
||
|
|
res = document.getElementById('background');
|
||
|
|
|
||
|
|
if (res === null) {
|
||
|
|
res = document.body;
|
||
|
|
}
|
||
|
|
|
||
|
|
return res;
|
||
|
|
}
|
||
|
|
|
||
|
|
onClose(index) {
|
||
|
|
delete this.modals[index];
|
||
|
|
|
||
|
|
if (Object.keys(this.modals).length === 0) {
|
||
|
|
return this.getBodyWrap().classList.remove('modaled');
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
create(data) {
|
||
|
|
var _this2 = this;
|
||
|
|
|
||
|
|
var index;
|
||
|
|
({
|
||
|
|
index
|
||
|
|
} = this.state);
|
||
|
|
index++;
|
||
|
|
this.modals[index] = /*#__PURE__*/React.createElement(Modal, {
|
||
|
|
data: data,
|
||
|
|
key: index,
|
||
|
|
ref: function (i) {
|
||
|
|
return _this2.rModals[index] = i;
|
||
|
|
},
|
||
|
|
onClose: this.onClose.bind(this, index)
|
||
|
|
});
|
||
|
|
this.setState({
|
||
|
|
index
|
||
|
|
});
|
||
|
|
this.getBodyWrap().classList.add('modaled');
|
||
|
|
return index;
|
||
|
|
}
|
||
|
|
|
||
|
|
openCard(controller, id, options = {}) {
|
||
|
|
var closeMe, index, t;
|
||
|
|
index = null;
|
||
|
|
t = this;
|
||
|
|
|
||
|
|
closeMe = function () {
|
||
|
|
return t.rModals[index].close();
|
||
|
|
};
|
||
|
|
|
||
|
|
return index = Modals.create({
|
||
|
|
content: /*#__PURE__*/React.createElement(Card, {
|
||
|
|
ajax: true,
|
||
|
|
controller: controller,
|
||
|
|
id: id,
|
||
|
|
in_modal: true,
|
||
|
|
onClose: closeMe,
|
||
|
|
options: options
|
||
|
|
}),
|
||
|
|
scrollable: true
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
render() {
|
||
|
|
var i, modals;
|
||
|
|
modals = [];
|
||
|
|
|
||
|
|
for (i in this.modals) {
|
||
|
|
modals.push(this.modals[i]);
|
||
|
|
}
|
||
|
|
|
||
|
|
return modals;
|
||
|
|
}
|
||
|
|
|
||
|
|
};
|
||
|
|
|
||
|
|
createModals = function () {
|
||
|
|
var div;
|
||
|
|
div = document.createElement('div');
|
||
|
|
document.body.appendChild(div);
|
||
|
|
return ReactDOM.render( /*#__PURE__*/React.createElement(ModalWrap, {
|
||
|
|
ref: function (i) {
|
||
|
|
return window.Modals = i;
|
||
|
|
}
|
||
|
|
}), div);
|
||
|
|
};
|
||
|
|
|
||
|
|
document.addEventListener('DOMContentLoaded', createModals);
|
||
|
|
//# sourceMappingURL=modal.js.map
|