diff --git a/public/app.js b/public/app.js index 1ae714f..5a5869a 100644 --- a/public/app.js +++ b/public/app.js @@ -23,9 +23,12 @@ const dtClientEl = document.querySelector("#dt-dialog-client"); const dtInput = document.querySelector("#dt-dialog-input"); const dtCancel = document.querySelector("#dt-dialog-cancel"); const dtOk = document.querySelector("#dt-dialog-ok"); +const dtExtra = document.querySelector("#dt-dialog-extra"); +const dtHint = document.querySelector("#dt-dialog-hint"); +const dtAlsoDisable = document.querySelector("#dt-dialog-also-disable"); let dtMode = "disable"; -/** @type {{ clientId: string, name: string } | null} */ +/** @type {Record | null} */ let dtClient = null; function isoToDatetimeLocal(iso) { @@ -54,6 +57,8 @@ function openDisableDialog(c) { dtClientEl.textContent = c.name; dtOk.textContent = "Выключить"; dtInput.value = isoToDatetimeLocal(new Date().toISOString()); + dtExtra.classList.add("hidden"); + dtAlsoDisable.checked = false; dtDialog.showModal(); } @@ -66,6 +71,15 @@ function openEditDisconnectDialog(c) { const iso = c.lastDisconnectedAt || (!c.activeInConf && c.disabledAt) || new Date().toISOString(); dtInput.value = isoToDatetimeLocal(iso); + if (c.activeInConf) { + dtExtra.classList.remove("hidden"); + dtHint.textContent = + "Без галочки меняется только дата в таблице — в туннеле клиент остаётся. Чтобы реально отключить ключ, включите «Выключить из туннеля»."; + dtAlsoDisable.checked = false; + } else { + dtExtra.classList.add("hidden"); + dtAlsoDisable.checked = false; + } dtDialog.showModal(); } @@ -91,11 +105,19 @@ dtOk.addEventListener("click", async () => { body: JSON.stringify({ clientId: dtClient.clientId, disconnectedAt: iso }), }); } else { - setStatus("Сохраняю дату…", false); - await api("/api/clients/disconnect-date", { - method: "POST", - body: JSON.stringify({ clientId: dtClient.clientId, disconnectedAt: iso }), - }); + const alsoTunnel = Boolean(dtAlsoDisable.checked && dtClient.activeInConf); + setStatus(alsoTunnel ? "Выключаю из туннеля…" : "Сохраняю дату…", false); + if (alsoTunnel) { + await api("/api/clients/disable", { + method: "POST", + body: JSON.stringify({ clientId: dtClient.clientId, disconnectedAt: iso }), + }); + } else { + await api("/api/clients/disconnect-date", { + method: "POST", + body: JSON.stringify({ clientId: dtClient.clientId, disconnectedAt: iso }), + }); + } } dtDialog.close(); dtClient = null; diff --git a/public/index.html b/public/index.html index 6022cc6..a92658b 100644 --- a/public/index.html +++ b/public/index.html @@ -29,7 +29,7 @@

Панель сервера

Пользователи AmneziaWG

-

Дату отключения вы задаёте сами: при нажатии «Выключить» или кнопкой «Задать дату» в колонке «Последнее отключение». Время берётся как локальное на вашем компьютере.

+

Дату отключения вы задаёте сами: при «Выключить» или в диалоге «Задать дату» (для активных клиентов там можно отметить выключение из туннеля). Время — локальное на вашем компьютере.

@@ -108,6 +108,13 @@

+
diff --git a/public/styles.css b/public/styles.css index 8b5de3b..6672e11 100644 --- a/public/styles.css +++ b/public/styles.css @@ -443,6 +443,32 @@ tr:last-child td { font: inherit; } +.dt-dialog-extra { + margin-top: 0.85rem; +} + +.dt-dialog-hint { + margin: 0 0 0.65rem; + font-size: 0.82rem; + line-height: 1.45; + color: var(--muted); +} + +.dt-checkbox-label { + display: flex; + gap: 0.55rem; + align-items: flex-start; + font-size: 0.85rem; + line-height: 1.45; + color: var(--text); + cursor: pointer; +} + +.dt-checkbox-label input { + margin-top: 0.15rem; + flex-shrink: 0; +} + .dt-dialog-actions { display: flex; gap: 0.5rem;