189 lines
7.3 KiB
HTML
189 lines
7.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ru">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>VPN Parser — Панель управления</title>
|
|
<link rel="stylesheet" href="/style.css">
|
|
</head>
|
|
<body>
|
|
<div id="app">
|
|
<div id="login-screen" class="screen">
|
|
<div class="login-card">
|
|
<div class="login-header">
|
|
<div class="logo-icon"></div>
|
|
<h1>VPN Parser</h1>
|
|
</div>
|
|
<form id="login-form">
|
|
<div class="field">
|
|
<label for="username">Имя пользователя</label>
|
|
<input type="text" id="username" autocomplete="username" required>
|
|
</div>
|
|
<div class="field">
|
|
<label for="password">Пароль</label>
|
|
<input type="password" id="password" autocomplete="current-password" required>
|
|
</div>
|
|
<button type="submit" class="btn btn-primary btn-full">Войти</button>
|
|
<div id="login-error" class="error-msg hidden"></div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="dashboard-screen" class="screen hidden">
|
|
<header class="topbar">
|
|
<div class="topbar-left">
|
|
<div class="logo-icon small"></div>
|
|
<span class="topbar-title">VPN Parser — Панель управления</span>
|
|
</div>
|
|
<button id="logout-btn" class="btn btn-ghost">Выход</button>
|
|
</header>
|
|
|
|
<main class="dashboard">
|
|
<section class="card config-card">
|
|
<h2>Настройки</h2>
|
|
<div class="config-row">
|
|
<label for="novavps-url">Ссылка NOVAVPS</label>
|
|
<input type="text" id="novavps-url" placeholder="https://novavps.app/s/...">
|
|
<button id="save-config-btn" class="btn btn-primary">Сохранить</button>
|
|
</div>
|
|
<div id="config-msg" class="msg hidden"></div>
|
|
</section>
|
|
|
|
<section class="card actions-card">
|
|
<button id="run-btn" class="btn btn-success btn-lg">
|
|
<span class="btn-icon">⟳</span>
|
|
Обновить сейчас
|
|
</button>
|
|
<button id="sync-xray2-btn" class="btn btn-secondary btn-lg">
|
|
<span class="btn-icon">↻</span>
|
|
Синхр. Xray 2
|
|
</button>
|
|
<div id="run-msg" class="msg hidden"></div>
|
|
</section>
|
|
|
|
<section id="running-indicator" class="card running-card hidden">
|
|
<div class="spinner"></div>
|
|
<div class="running-text">
|
|
<span class="running-label">Выполнение</span>
|
|
<span id="current-step" class="running-step">Инициализация...</span>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="status-section">
|
|
<h2 class="section-title">Статус панелей</h2>
|
|
<div class="status-grid">
|
|
<div class="status-card" id="xray1-card">
|
|
<div class="status-card-header">
|
|
<span class="panel-icon xray-icon"></span>
|
|
<h3>Xray 1</h3>
|
|
</div>
|
|
<div class="status-badge" id="xray1-status">ожидание</div>
|
|
<div class="status-detail" id="xray1-detail"></div>
|
|
<div class="status-time" id="xray1-time"></div>
|
|
</div>
|
|
<div class="status-card" id="xray2-card">
|
|
<div class="status-card-header">
|
|
<span class="panel-icon xray-icon"></span>
|
|
<h3>Xray 2</h3>
|
|
</div>
|
|
<div class="status-badge" id="xray2-status">ожидание</div>
|
|
<div class="status-detail" id="xray2-detail"></div>
|
|
<div class="status-time" id="xray2-time"></div>
|
|
</div>
|
|
<div class="status-card" id="novavps-card">
|
|
<div class="status-card-header">
|
|
<span class="panel-icon novavps-icon"></span>
|
|
<h3>Novavps</h3>
|
|
</div>
|
|
<div class="status-badge" id="novavps-status">ожидание</div>
|
|
<div class="status-detail" id="novavps-detail"></div>
|
|
<div class="status-time" id="novavps-time"></div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="card data-section" id="xray1-data-section">
|
|
<div class="data-section-header" onclick="toggleSection('xray1-data')">
|
|
<h2>Исходящие Xray 1</h2>
|
|
<span class="data-count" id="xray1-data-count"></span>
|
|
<span class="collapse-arrow" id="xray1-data-arrow">▼</span>
|
|
</div>
|
|
<div class="data-content" id="xray1-data">
|
|
<div class="table-wrapper">
|
|
<table class="data-table" id="xray1-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Метка</th>
|
|
<th>Протокол</th>
|
|
<th>Адрес</th>
|
|
<th>Порт</th>
|
|
<th>Задержка</th>
|
|
<th>Синхр.</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="xray1-tbody"></tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="card data-section hidden" id="xray2-data-section">
|
|
<div class="data-section-header" onclick="toggleSection('xray2-data')">
|
|
<h2>Исходящие Xray 2</h2>
|
|
<span class="data-count" id="xray2-data-count"></span>
|
|
<span class="collapse-arrow" id="xray2-data-arrow">▼</span>
|
|
</div>
|
|
<div class="data-content" id="xray2-data">
|
|
<div class="table-wrapper">
|
|
<table class="data-table" id="xray2-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Метка</th>
|
|
<th>Протокол</th>
|
|
<th>Адрес</th>
|
|
<th>Порт</th>
|
|
<th>Синхр.</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="xray2-tbody"></tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="card data-section" id="novavps-data-section">
|
|
<div class="data-section-header" onclick="toggleSection('novavps-data')">
|
|
<h2>Подключения Novavps</h2>
|
|
<span class="data-count" id="novavps-data-count"></span>
|
|
<span class="collapse-arrow" id="novavps-data-arrow">▼</span>
|
|
</div>
|
|
<div class="data-content" id="novavps-data">
|
|
<div class="table-wrapper">
|
|
<table class="data-table" id="novavps-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Имя</th>
|
|
<th>Протокол</th>
|
|
<th>Адрес</th>
|
|
<th>Порт</th>
|
|
<th>Безопасность</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="novavps-tbody"></tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="last-run-section">
|
|
<span class="last-run-label">Последний запуск:</span>
|
|
<span id="last-run" class="last-run-value">Никогда</span>
|
|
</section>
|
|
</main>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="/app.js"></script>
|
|
</body>
|
|
</html>
|