SHA256
UI: исправить модалку серверов доступа
This commit is contained in:
+1
-1
@@ -1,2 +1,2 @@
|
|||||||
client.version=1.2.356
|
client.version=1.2.357
|
||||||
server.version=1.2.341
|
server.version=1.2.341
|
||||||
|
|||||||
@@ -22,51 +22,15 @@ function createConfirmModal() {
|
|||||||
const root = document.getElementById('modal-root');
|
const root = document.getElementById('modal-root');
|
||||||
if (!(root instanceof HTMLElement)) return null;
|
if (!(root instanceof HTMLElement)) return null;
|
||||||
|
|
||||||
const modal = document.createElement('div');
|
|
||||||
modal.className = 'modal';
|
|
||||||
modal.hidden = true;
|
|
||||||
modal.innerHTML = `
|
|
||||||
<div class="modal-card stack" style="max-width:min(94vw,34rem);">
|
|
||||||
<h3 class="modal-title" id="access-servers-dialog-title">Подтверждение</h3>
|
|
||||||
<p class="meta-muted" id="access-servers-dialog-text"></p>
|
|
||||||
<p class="meta-muted" id="access-servers-dialog-note" hidden></p>
|
|
||||||
<div class="auth-footer-actions">
|
|
||||||
<button class="ghost-btn" type="button" id="access-servers-dialog-cancel">Нет</button>
|
|
||||||
<button class="primary-btn" type="button" id="access-servers-dialog-confirm">Да</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
root.append(modal);
|
|
||||||
|
|
||||||
const titleEl = modal.querySelector('#access-servers-dialog-title');
|
|
||||||
const textEl = modal.querySelector('#access-servers-dialog-text');
|
|
||||||
const noteEl = modal.querySelector('#access-servers-dialog-note');
|
|
||||||
const cancelBtn = modal.querySelector('#access-servers-dialog-cancel');
|
|
||||||
const confirmBtn = modal.querySelector('#access-servers-dialog-confirm');
|
|
||||||
|
|
||||||
let onConfirm = null;
|
let onConfirm = null;
|
||||||
let onCancel = null;
|
let onCancel = null;
|
||||||
|
|
||||||
const close = () => {
|
const close = () => {
|
||||||
modal.hidden = true;
|
root.innerHTML = '';
|
||||||
onConfirm = null;
|
onConfirm = null;
|
||||||
onCancel = null;
|
onCancel = null;
|
||||||
};
|
};
|
||||||
|
|
||||||
modal.addEventListener('click', (event) => {
|
|
||||||
if (event.target === modal) close();
|
|
||||||
});
|
|
||||||
cancelBtn?.addEventListener('click', async () => {
|
|
||||||
const handler = onCancel;
|
|
||||||
close();
|
|
||||||
if (typeof handler === 'function') await handler();
|
|
||||||
});
|
|
||||||
confirmBtn?.addEventListener('click', async () => {
|
|
||||||
const handler = onConfirm;
|
|
||||||
close();
|
|
||||||
if (typeof handler === 'function') await handler();
|
|
||||||
});
|
|
||||||
|
|
||||||
return {
|
return {
|
||||||
open({
|
open({
|
||||||
title,
|
title,
|
||||||
@@ -77,6 +41,30 @@ function createConfirmModal() {
|
|||||||
onConfirm: confirmHandler,
|
onConfirm: confirmHandler,
|
||||||
onCancel: cancelHandler,
|
onCancel: cancelHandler,
|
||||||
}) {
|
}) {
|
||||||
|
root.innerHTML = `
|
||||||
|
<div class="modal" id="access-servers-confirm-modal">
|
||||||
|
<div class="modal-card stack" style="max-width:min(94vw,34rem);">
|
||||||
|
<h3 class="modal-title" id="access-servers-dialog-title"></h3>
|
||||||
|
<p class="meta-muted" id="access-servers-dialog-text"></p>
|
||||||
|
<p class="meta-muted" id="access-servers-dialog-note"${note ? '' : ' hidden'}></p>
|
||||||
|
<div class="auth-footer-actions">
|
||||||
|
<button class="ghost-btn" type="button" id="access-servers-dialog-cancel"></button>
|
||||||
|
<button class="primary-btn" type="button" id="access-servers-dialog-confirm"></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
const modal = root.querySelector('#access-servers-confirm-modal');
|
||||||
|
const titleEl = root.querySelector('#access-servers-dialog-title');
|
||||||
|
const textEl = root.querySelector('#access-servers-dialog-text');
|
||||||
|
const noteEl = root.querySelector('#access-servers-dialog-note');
|
||||||
|
const cancelBtn = root.querySelector('#access-servers-dialog-cancel');
|
||||||
|
const confirmBtn = root.querySelector('#access-servers-dialog-confirm');
|
||||||
|
if (!(modal instanceof HTMLElement) || !(titleEl instanceof HTMLElement) || !(textEl instanceof HTMLElement) || !(noteEl instanceof HTMLElement) || !(cancelBtn instanceof HTMLButtonElement) || !(confirmBtn instanceof HTMLButtonElement)) {
|
||||||
|
close();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
titleEl.textContent = String(title || 'Подтверждение');
|
titleEl.textContent = String(title || 'Подтверждение');
|
||||||
textEl.textContent = String(text || '');
|
textEl.textContent = String(text || '');
|
||||||
if (note) {
|
if (note) {
|
||||||
@@ -90,10 +78,23 @@ function createConfirmModal() {
|
|||||||
cancelBtn.textContent = String(cancelLabel || 'Нет');
|
cancelBtn.textContent = String(cancelLabel || 'Нет');
|
||||||
onConfirm = confirmHandler || null;
|
onConfirm = confirmHandler || null;
|
||||||
onCancel = cancelHandler || null;
|
onCancel = cancelHandler || null;
|
||||||
modal.hidden = false;
|
|
||||||
|
modal.addEventListener('click', (event) => {
|
||||||
|
if (event.target === modal) close();
|
||||||
|
});
|
||||||
|
cancelBtn.addEventListener('click', async () => {
|
||||||
|
const handler = onCancel;
|
||||||
|
close();
|
||||||
|
if (typeof handler === 'function') await handler();
|
||||||
|
});
|
||||||
|
confirmBtn.addEventListener('click', async () => {
|
||||||
|
const handler = onConfirm;
|
||||||
|
close();
|
||||||
|
if (typeof handler === 'function') await handler();
|
||||||
|
});
|
||||||
},
|
},
|
||||||
destroy() {
|
destroy() {
|
||||||
modal.remove();
|
close();
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user