aidar/SHiNE-server
SHA256
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI: исправить модалку серверов доступа

Browse Source
This commit is contained in:
AidarKC
2026-07-28 16:40:22 +04:00
parent 0ed78e2202
commit d1e06d9ef1
2 changed files with 41 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files
shine-UI/js/pages/access-servers-view.js
+40 -39
View File
@@ -22,51 +22,15 @@ function createConfirmModal() {
const root = document.getElementById('modal-root');
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 onCancel = null;
const close = () => {
modal.hidden = true;
root.innerHTML = '';
onConfirm = 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 {
open({
title,
@@ -77,6 +41,30 @@ function createConfirmModal() {
onConfirm: confirmHandler,
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 || 'Подтверждение');
textEl.textContent = String(text || '');
if (note) {
@@ -90,10 +78,23 @@ function createConfirmModal() {
cancelBtn.textContent = String(cancelLabel || 'Нет');
onConfirm = confirmHandler || 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() {
modal.remove();
close();
},
};
}