69 lines
2.1 KiB
JavaScript
69 lines
2.1 KiB
JavaScript
import { Toast } from "bootstrap";
|
|
import moment from "moment";
|
|
|
|
export const toastsInit = () => {
|
|
const wrapper = document.createElement("div");
|
|
wrapper.classList.add("toast-container", "position-fixed", "top-0", "end-0", "p-3", "mt-5");
|
|
const body = document.querySelector("body");
|
|
body.appendChild(wrapper);
|
|
return wrapper;
|
|
};
|
|
|
|
const toast = () => {
|
|
const toastElement = document.createElement("div");
|
|
toastElement.classList.add("toast", "bg-dark", "text-light");
|
|
toastElement.setAttribute("role", "alert");
|
|
return toastElement;
|
|
};
|
|
|
|
const caption = (title) => {
|
|
const captionElement = document.createElement("strong");
|
|
captionElement.classList.add("me-auto");
|
|
captionElement.innerText = title;
|
|
return captionElement;
|
|
};
|
|
|
|
const dateTime = () => {
|
|
const dateTimeElement = document.createElement("small");
|
|
dateTimeElement.classList.add("text-light");
|
|
dateTimeElement.innerText = moment().format("DD.MM HH:mm");
|
|
return dateTimeElement;
|
|
};
|
|
|
|
const closeButton = () => {
|
|
const closeElement = document.createElement("button");
|
|
closeElement.setAttribute("type", "button");
|
|
closeElement.setAttribute("data-bs-dismiss", "toast");
|
|
closeElement.classList.add("btn-close", "btn-close-white");
|
|
return closeElement;
|
|
};
|
|
|
|
const header = (title) => {
|
|
const headerElement = document.createElement("div");
|
|
headerElement.classList.add("toast-header", "bg-dark", "text-light");
|
|
headerElement.appendChild(caption(title));
|
|
headerElement.appendChild(dateTime());
|
|
headerElement.appendChild(closeButton());
|
|
return headerElement;
|
|
};
|
|
|
|
const body = (message) => {
|
|
const bodyElement = document.createElement("div");
|
|
bodyElement.classList.add("toast-body");
|
|
bodyElement.innerText = message;
|
|
return bodyElement;
|
|
};
|
|
|
|
export const showToast = (container, title, message) => {
|
|
const toastElement = toast();
|
|
toastElement.appendChild(header(title));
|
|
toastElement.appendChild(body(message));
|
|
|
|
toastElement.addEventListener("hidden.bs.toast", () => {
|
|
container.removeChild(toastElement);
|
|
});
|
|
|
|
container.appendChild(toastElement);
|
|
|
|
new Toast(toastElement).show();
|
|
}; |