94 lines
3.2 KiB
JavaScript
94 lines
3.2 KiB
JavaScript
import AOverlay from '/js/libs/js-AOverlay.js';
|
|
|
|
export default class AModal extends window.AObject {
|
|
constructor(temp) {
|
|
super();
|
|
this.overlay = new AOverlay(document.body);
|
|
this.overlay.isCloseOverlay(false);
|
|
this.overlay.createOverlay();
|
|
this.overlay.setIndex(2200);
|
|
this.customForm = temp;
|
|
}
|
|
createModal(typeModal, t1 = 'default') {
|
|
var temp = `
|
|
<div class="modal-scroll">
|
|
<div class="modal-con d-f j-c-center ${ (t1 instanceof Array) ? t1.join(" ") : t1 }">
|
|
<div class="modal-dialog">
|
|
<div class="btClose pointer">
|
|
<span class="atg atg-x"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>`;
|
|
this.overlay.overlay.insertAdjacentHTML("afterbegin", temp);
|
|
const b = this.overlay.overlay.querySelector(".modal-dialog");
|
|
const bc1 = this.overlay.overlay.querySelector(".btClose");
|
|
bc1.addEventListener("click", ((e) => {
|
|
this.trigger("Close");
|
|
this.overlay.removeOverlay();
|
|
}).bind(this));
|
|
switch (typeModal) {
|
|
case "CustomForm":
|
|
b.insertAdjacentHTML("beforeend", this.customForm);
|
|
this.CustomContainer = b;
|
|
break;
|
|
case "OK":
|
|
this.AModalOK = new AModalOK(b);
|
|
this.AModalOK.createElement();
|
|
this.AModalOK.bindEvent(".btn-ok", "click", ((ev, mO) => {
|
|
this.trigger("OK");
|
|
this.overlay.removeOverlay();
|
|
}).bind(this));
|
|
this.AModalOK.bindEvent(".btn-close", "click", ((ev, mO) => {
|
|
this.trigger("Close");
|
|
this.overlay.removeOverlay();
|
|
}).bind(this));
|
|
break;
|
|
case "YesNo":
|
|
break;
|
|
|
|
}
|
|
}
|
|
showModal() {
|
|
this.overlay.showOverlay();
|
|
}
|
|
|
|
}
|
|
|
|
class AModalOK {
|
|
constructor(p) {
|
|
this.parent = p;
|
|
}
|
|
message(str, classes = "") {
|
|
this.mess.innerHTML = str;
|
|
if (classes.length > 0) {
|
|
Array.from(classes.split(" ")).forEach(el => {
|
|
this.mess.classList.add(el);
|
|
})
|
|
}
|
|
}
|
|
title(str, classes = "") {
|
|
this.tit.innerHTML = str;
|
|
if (classes.length > 0) {
|
|
Array.from(classes.split(" ")).forEach(el => {
|
|
this.tit.classList.add(el);
|
|
})
|
|
}
|
|
}
|
|
createElement() {
|
|
const temp = `<div class="d-f f-c modalok">
|
|
<h5>Information</h5>
|
|
<span class="mess-info"></span>
|
|
<div class="ml-auto mt-2">
|
|
<button class="btn btn-primary btn-effect waves-effect waves-float btn-ok">Ok</button>
|
|
<button class="btn btn-secondary btn-effect waves-effect waves-float btn-close">Cancel</button>
|
|
</div>
|
|
</div>`;
|
|
this.parent.insertAdjacentHTML("beforeend", temp);
|
|
this.tit = this.parent.querySelector("h5");
|
|
this.mess = this.parent.querySelector(".mess-info");
|
|
}
|
|
bindEvent(ele, n, f) {
|
|
this.parent.querySelector(ele).addEventListener(n, f.bind(null, this));
|
|
}
|
|
} |