first commit
This commit is contained in:
@@ -0,0 +1,188 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Панель администратора</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="toast-container"></div>
|
||||
<div class="container">
|
||||
<h1>Панель администратора</h1>
|
||||
<div class="tabs">
|
||||
<button id="tab-main" class="tab-btn active">Общее</button>
|
||||
<button id="tab-settings" class="tab-btn">Настройки</button>
|
||||
<button id="tab-monitoring" class="tab-btn">Мониторинг</button>
|
||||
</div>
|
||||
<div id="main-tab">
|
||||
<div id="status">
|
||||
<p>Статус сервера: <span id="server-status">загрузка...</span></p>
|
||||
<button id="refresh-status-btn" class="btn-small">Обновить</button>
|
||||
</div>
|
||||
|
||||
<div id="db-status-container">
|
||||
<div>
|
||||
<p>Админ -> БД: <span id="admin-db-status">неизвестно</span></p>
|
||||
<small id="admin-db-message"></small>
|
||||
</div>
|
||||
<div>
|
||||
<p>Программа -> БД: <span id="backend-db-status">неизвестно</span></p>
|
||||
<small id="backend-db-message"></small>
|
||||
</div>
|
||||
<button id="check-db-btn" class="btn-small">Проверить</button>
|
||||
</div>
|
||||
|
||||
<div class="network-diag-container">
|
||||
<h2>Сетевая диагностика (Ping)</h2>
|
||||
<div class="ping-controls">
|
||||
<input type="text" id="ping-ip" placeholder="Введите IP-адрес или хост">
|
||||
<button id="ping-btn" class="btn-small">Пинг</button>
|
||||
<button id="ping-stop-btn" class="btn-small" disabled>Стоп</button>
|
||||
<button id="ping-clear-btn" class="btn-small">Очистить</button>
|
||||
</div>
|
||||
<pre id="ping-output"></pre>
|
||||
</div>
|
||||
|
||||
<div class="logs-container">
|
||||
<h2>Логи приложения</h2>
|
||||
<div class="log-controls">
|
||||
<button id="refresh-logs-btn" class="btn-small">Обновить логи</button>
|
||||
<button id="clear-logs-btn" class="btn-small">Очистить</button>
|
||||
</div>
|
||||
<pre id="logs-content">Нажмите "Обновить логи" для просмотра</pre>
|
||||
</div>
|
||||
|
||||
<div class="logs-container">
|
||||
<h2>Логи считывателя</h2>
|
||||
<div class="log-controls">
|
||||
<button id="refresh-card-logs-btn" class="btn-small">Обновить логи считывателя</button>
|
||||
</div>
|
||||
<pre id="ping-output">
|
||||
<pre id="card-logs-content">Нажмите "Обновить логи считывателя" для просмотра</pre>
|
||||
</pre></pre>
|
||||
</div>
|
||||
|
||||
<div class="config-container">
|
||||
<h2>Конфигурация</h2>
|
||||
<form id="config-form">
|
||||
<div class="form-group">
|
||||
<label for="payslipsPath">Путь к расчетным листкам:</label>
|
||||
<div class="input-with-button">
|
||||
<input type="text" id="payslipsPath" name="payslipsPath" required>
|
||||
<button type="button" id="browse-btn">Обзор...</button>
|
||||
</div>
|
||||
</div>
|
||||
<button type="submit">Сохранить</button>
|
||||
</form>
|
||||
<p id="config-status"></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="settings-tab" style="display:none">
|
||||
<h2>Настройки</h2>
|
||||
<div id="server-params-section"><h3>Параметры серверов</h3>
|
||||
<form id="server-params-form" novalidate>
|
||||
<fieldset><legend>Admin-server</legend>
|
||||
<label>PORT: <input type="number" id="admin-port" min="1" max="65535" required></label><br>
|
||||
<label>ADMIN_URL: <input type="text" id="admin-url" pattern="https?://.+" required></label>
|
||||
</fieldset>
|
||||
<fieldset><legend>Backend</legend>
|
||||
<label>host: <input type="text" id="backend-host" required></label><br>
|
||||
<label>port: <input type="number" id="backend-port" min="1" max="65535" required></label>
|
||||
</fieldset>
|
||||
<button type="submit">Сохранить</button>
|
||||
<span id="server-params-status" class="form-error"></span>
|
||||
</form>
|
||||
</div>
|
||||
<div id="db-section"><h3>Подключения к БД</h3>
|
||||
<form id="mysql-form" novalidate><fieldset><legend>MySQL (модераторы)</legend>
|
||||
<label>MYSQL_HOST: <input type="text" id="mysql-host" required></label><br>
|
||||
<label>MYSQL_PORT: <input type="number" id="mysql-port" min="1" max="65535" required></label><br>
|
||||
<label>MYSQL_USER: <input type="text" id="mysql-user" required></label><br>
|
||||
<label>MYSQL_PASSWORD:
|
||||
<div class="password-wrapper">
|
||||
<input type="password" id="mysql-pass" readonly>
|
||||
<button type="button" class="btn-small" data-action="edit-pass" data-target="mysql-pass">Изменить</button>
|
||||
</div>
|
||||
</label><br>
|
||||
<label>MYSQL_DATABASE: <input type="text" id="mysql-db" required></label><br>
|
||||
<button type="submit">Сохранить</button>
|
||||
<span id="mysql-status" class="form-error"></span>
|
||||
</fieldset></form>
|
||||
</div>
|
||||
<div id="cors-section"><h3>CORS (ALLOWED_ORIGINS)</h3>
|
||||
<form id="cors-form">
|
||||
<ul id="cors-list"></ul>
|
||||
<input type="text" id="cors-new-origin" placeholder="Добавить origin...">
|
||||
<button type="button" id="cors-add-btn" disabled>Добавить</button>
|
||||
<button type="submit">Сохранить</button>
|
||||
<span id="cors-status" class="form-error"></span>
|
||||
</form>
|
||||
</div>
|
||||
<div id="moders-section"><h3>Модераторы</h3>
|
||||
<form id="add-moder-form" novalidate>
|
||||
<input type="text" id="add-moder-username" placeholder="Логин" required>
|
||||
<input type="password" id="add-moder-password" placeholder="Пароль (мин. 4 символа)" minlength="4" required>
|
||||
<button type="submit">Добавить</button>
|
||||
<span id="add-moder-status" class="form-error"></span>
|
||||
</form>
|
||||
<table id="moders-table" class="moders-table"><thead><tr><th>ID</th><th>Логин</th><th>Действия</th></tr></thead><tbody></tbody></table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="monitoring-tab" style="display:none;">
|
||||
<h2>Мониторинг системы</h2>
|
||||
<div id="monitoring-status-container">
|
||||
<!-- Статусы будут здесь -->
|
||||
</div>
|
||||
|
||||
<h3>Проблемные события (Warn/Error)</h3>
|
||||
<div class="monitoring-filters">
|
||||
<label>Уровень:
|
||||
<select id="log-level-filter">
|
||||
<option value="all">Все</option>
|
||||
<option value="ERROR">Error</option>
|
||||
<option value="WARN">Warn</option>
|
||||
</select>
|
||||
</label>
|
||||
<label>Источник:
|
||||
<select id="log-source-filter">
|
||||
<option value="all">Все</option>
|
||||
<option value="Admin">Admin</option>
|
||||
<option value="Backend">Backend</option>
|
||||
<option value="CardReader">CardReader</option>
|
||||
</select>
|
||||
</label>
|
||||
<button id="refresh-monitoring-btn" class="btn-small">Обновить</button>
|
||||
</div>
|
||||
<table id="monitoring-log-table" class="moders-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="width: 20%;">Время</th>
|
||||
<th style="width: 10%;">Уровень</th>
|
||||
<th style="width: 15%;">Источник</th>
|
||||
<th>Сообщение</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<!-- Данные будут здесь -->
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Модальное окно для подтверждений -->
|
||||
<div id="confirm-modal" class="modal">
|
||||
<div class="modal-content">
|
||||
<p id="confirm-modal-text">Вы уверены?</p>
|
||||
<div class="modal-buttons">
|
||||
<button id="confirm-modal-yes" class="btn-danger">Да</button>
|
||||
<button id="confirm-modal-no" class="btn-secondary">Отмена</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="app.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user