mirror of
https://github.com/andrey271192/amnezia_web-PRO.git
synced 2026-09-20 14:42:00 +00:00
148 lines
7.1 KiB
HTML
148 lines
7.1 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<title>AmneziaWG — клиенты</title>
|
||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||
<link href="https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;600;700&family=JetBrains+Mono:wght@400;600&display=swap" rel="stylesheet">
|
||
<link rel="stylesheet" href="/styles.css">
|
||
</head>
|
||
<body class="page">
|
||
<div id="login-gate" class="gate hidden" aria-hidden="true">
|
||
<div class="gate-card">
|
||
<p class="eyebrow">Панель сервера</p>
|
||
<h1>Вход</h1>
|
||
<p class="sub">Введите пароль администратора панели.</p>
|
||
<form id="login-form">
|
||
<label for="login-password">Пароль</label>
|
||
<input id="login-password" type="password" autocomplete="current-password" required>
|
||
<button type="submit" class="btn primary full">Войти</button>
|
||
<p id="login-error" class="status err" role="alert"></p>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="app-root" class="shell hidden">
|
||
<header class="top">
|
||
<div>
|
||
<p class="eyebrow">Панель сервера</p>
|
||
<h1>Пользователи AmneziaWG</h1>
|
||
<p class="sub">Дату отключения задаёте сами (локальное время браузера). Кнопка «Выключить» убирает клиента из туннеля сразу. «Задать дату» без галочки — только запись в таблице; с галочкой — клиент остаётся в туннеле до наступления времени. Несколько инстансов AmneziaWG (Legacy и др.) — в переменной AWG_PROFILES и списке «Инстанс».</p>
|
||
</div>
|
||
<div class="token-box">
|
||
<div class="session-actions">
|
||
<button type="button" id="logout" class="btn ghost full">Выйти</button>
|
||
</div>
|
||
<details class="pw-change">
|
||
<summary>Сменить пароль</summary>
|
||
<form id="pw-form">
|
||
<label for="pw-current">Текущий пароль</label>
|
||
<input id="pw-current" type="password" autocomplete="current-password" required>
|
||
<label for="pw-new">Новый пароль</label>
|
||
<input id="pw-new" type="password" autocomplete="new-password" required minlength="8">
|
||
<label for="pw-new2">Повтор нового пароля</label>
|
||
<input id="pw-new2" type="password" autocomplete="new-password" required minlength="8">
|
||
<button type="submit" class="btn primary full">Сохранить новый пароль</button>
|
||
<p id="pw-msg" class="status" role="status"></p>
|
||
</form>
|
||
</details>
|
||
</div>
|
||
</header>
|
||
|
||
<section class="toolbar">
|
||
<div class="pill proto-pill"><span class="dot ok"></span><span id="proto-label">Протокол: AmneziaWG</span></div>
|
||
<div id="proto-switch" class="proto-switch hidden">
|
||
<label for="proto-select" class="proto-switch-label muted">Инстанс</label>
|
||
<select id="proto-select" class="proto-select" aria-label="Инстанс AmneziaWG"></select>
|
||
</div>
|
||
<div class="clock-strip" role="status" aria-live="polite">
|
||
<div class="clock-row">
|
||
<span class="muted clock-kind">Сервер</span>
|
||
<time id="clock-server" class="clock-time">—</time>
|
||
</div>
|
||
<div class="clock-row">
|
||
<span class="muted clock-kind">Браузер</span>
|
||
<time id="clock-local" class="clock-time">—</time>
|
||
</div>
|
||
<p class="clock-hint muted">
|
||
Сервер показывается в вашем часовом поясе (как браузер). «Сверить» — заново запросить момент с VPS.
|
||
</p>
|
||
<button type="button" id="clock-sync" class="btn small ghost clock-sync-btn">
|
||
Сверить время
|
||
</button>
|
||
</div>
|
||
<button type="button" id="refresh" class="btn primary">Обновить</button>
|
||
</section>
|
||
|
||
<p id="status" class="status" role="status"></p>
|
||
|
||
<section class="panel">
|
||
<div class="panel-head">
|
||
<h2>Пользователи</h2>
|
||
<span class="muted" id="peer-count"></span>
|
||
</div>
|
||
<div class="table-wrap">
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>Имя</th>
|
||
<th>IP</th>
|
||
<th>Статус</th>
|
||
<th>Последнее отключение</th>
|
||
<th></th>
|
||
</tr>
|
||
</thead>
|
||
<tbody id="rows"></tbody>
|
||
</table>
|
||
</div>
|
||
</section>
|
||
|
||
<details class="raw">
|
||
<summary>Вывод awg show (отладка)</summary>
|
||
<pre id="wg-show"></pre>
|
||
</details>
|
||
</div>
|
||
|
||
<footer class="support-footer">
|
||
<div class="support-line">
|
||
<strong class="support-title">Amnezia Admin WebUI</strong>
|
||
<span class="support-sep" aria-hidden="true">·</span>
|
||
<a href="https://github.com/andrey271192/Amnezia_web" target="_blank" rel="noopener noreferrer">⭐ GitHub</a>
|
||
<span class="support-sep" aria-hidden="true">·</span>
|
||
<a href="https://boosty.to/andrey27/donate" target="_blank" rel="noopener noreferrer">💖 Boosty</a>
|
||
<span class="support-sep" aria-hidden="true">·</span>
|
||
<a href="https://finance.ozon.ru/apps/sbp/ozonbankpay/019dc200-2a5d-7931-a619-782d285f6798" target="_blank" rel="noopener noreferrer">💳 Ozon СБП</a>
|
||
<span class="support-sep" aria-hidden="true">·</span>
|
||
<a href="https://t.me/lot_andrey" target="_blank" rel="noopener noreferrer">✉️ Telegram @lot_andrey</a>
|
||
</div>
|
||
<p class="support-blurb">
|
||
Поддержать проект — поставь звезду на GitHub И донат. Связаться с автором — Telegram.
|
||
</p>
|
||
</footer>
|
||
|
||
<dialog id="disconnect-dt-dialog" class="dt-dialog">
|
||
<div class="dt-dialog-inner">
|
||
<h3 id="dt-dialog-title">Дата отключения</h3>
|
||
<p class="muted" id="dt-dialog-client"></p>
|
||
<label for="dt-dialog-input">Дата и время</label>
|
||
<input type="datetime-local" id="dt-dialog-input" step="60">
|
||
<div id="dt-dialog-extra" class="dt-dialog-extra hidden">
|
||
<p class="dt-dialog-hint" id="dt-dialog-hint"></p>
|
||
<label class="dt-checkbox-label">
|
||
<input type="checkbox" id="dt-dialog-schedule-tunnel">
|
||
Убрать из туннеля в указанное время (до этого клиент остаётся в туннеле)
|
||
</label>
|
||
</div>
|
||
<div class="dt-dialog-actions">
|
||
<button type="button" class="btn ghost" id="dt-dialog-cancel">Отмена</button>
|
||
<button type="button" class="btn primary" id="dt-dialog-ok">Подтвердить</button>
|
||
</div>
|
||
</div>
|
||
</dialog>
|
||
|
||
<script src="/app.js" type="module"></script>
|
||
</body>
|
||
</html>
|