172 lines
7.2 KiB
HTML
172 lines
7.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ru">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>ROBO-OPS | Панель оператора</title>
|
|
<link rel="stylesheet" href="/static/css/styles.css">
|
|
</head>
|
|
<body>
|
|
<header class="header">
|
|
<div class="header__brand">
|
|
<span class="logo">ROBO-OPS</span>
|
|
<span class="header__user" id="header-user"></span>
|
|
</div>
|
|
<nav class="nav">
|
|
<button class="nav__btn nav__btn--active" data-page="dashboard">Главная</button>
|
|
<button class="nav__btn" data-page="profile">Личный кабинет</button>
|
|
<button class="btn btn--ghost" id="btn-logout">Выйти</button>
|
|
</nav>
|
|
</header>
|
|
|
|
<main class="main">
|
|
<section id="page-dashboard" class="page page--active">
|
|
<div class="page__header">
|
|
<h1 class="page__title">Панель управления роботом</h1>
|
|
<p class="page__subtitle">Выберите робота и настройте параметры работы</p>
|
|
</div>
|
|
|
|
<div class="dashboard-grid">
|
|
<aside class="panel">
|
|
<div class="panel__head">
|
|
<h2 class="panel__title">Реестр роботов</h2>
|
|
<span class="badge" id="robot-count">4</span>
|
|
</div>
|
|
<div class="robot-list" id="robot-list"></div>
|
|
</aside>
|
|
|
|
<div class="panel panel--wide">
|
|
<div class="panel__head">
|
|
<h2 class="panel__title">Настройки: <span id="selected-robot-name">—</span></h2>
|
|
<span class="badge badge--status" id="robot-status-badge">—</span>
|
|
</div>
|
|
|
|
<div class="robot-visual" id="robot-visual-frame">
|
|
<div class="robot-visual__id" id="robot-visual-id">№ —</div>
|
|
<div class="robot-visual__mode" id="robot-mode-label">—</div>
|
|
</div>
|
|
|
|
<div class="stats-grid" id="stats-grid"></div>
|
|
|
|
<div class="controls">
|
|
<h3 class="controls__title">Параметры управления</h3>
|
|
<div class="control-group">
|
|
<label class="control-label">Режим работы
|
|
<select id="ctrl-mode" class="control-select">
|
|
<option value="auto">Автономный</option>
|
|
<option value="manual">Ручной</option>
|
|
<option value="assist">Ассистированный</option>
|
|
<option value="standby">Ожидание</option>
|
|
</select>
|
|
</label>
|
|
</div>
|
|
<div class="control-group">
|
|
<label class="control-label">Скорость: <strong id="speed-value">50</strong>%
|
|
<input type="range" id="ctrl-speed" min="0" max="100" value="50" class="control-range">
|
|
</label>
|
|
</div>
|
|
<div class="control-group">
|
|
<label class="control-label">Чувствительность: <strong id="sensitivity-value">70</strong>%
|
|
<input type="range" id="ctrl-sensitivity" min="0" max="100" value="70" class="control-range">
|
|
</label>
|
|
</div>
|
|
<div class="control-group control-group--row">
|
|
<label class="checkbox-label"><input type="checkbox" id="ctrl-emergency"> Аварийная остановка</label>
|
|
<label class="checkbox-label"><input type="checkbox" id="ctrl-night"> Ночной режим</label>
|
|
</div>
|
|
<div class="control-actions">
|
|
<button class="btn btn--primary" id="btn-apply">Применить</button>
|
|
<button class="btn btn--secondary" id="btn-reset">Сбросить</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<aside class="panel">
|
|
<div class="panel__head">
|
|
<h2 class="panel__title">Журнал событий</h2>
|
|
</div>
|
|
<div class="log" id="event-log"></div>
|
|
</aside>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="page-profile" class="page">
|
|
<div class="page__header">
|
|
<h1 class="page__title">Личный кабинет оператора</h1>
|
|
<p class="page__subtitle">Профиль, рейтинг и активные сессии</p>
|
|
</div>
|
|
|
|
<div class="profile-layout">
|
|
<div class="profile-card panel">
|
|
<h2 class="profile-card__name" id="profile-fullname">—</h2>
|
|
<p class="profile-card__email" id="profile-email">—</p>
|
|
<div class="profile-stats">
|
|
<div class="profile-stat">
|
|
<span class="profile-stat__label">Рейтинг</span>
|
|
<span class="profile-stat__value" id="profile-rating">0</span>
|
|
</div>
|
|
<div class="profile-stat">
|
|
<span class="profile-stat__label">Баллы</span>
|
|
<span class="profile-stat__value" id="profile-points">0</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<form class="panel" id="profile-form">
|
|
<div class="panel__head">
|
|
<h2 class="panel__title">Данные оператора</h2>
|
|
</div>
|
|
<div class="form-grid">
|
|
<div class="form-field">
|
|
<label for="field-email">Электронная почта</label>
|
|
<input type="email" id="field-email" readonly>
|
|
</div>
|
|
<div class="form-field">
|
|
<label for="field-phone">Номер телефона</label>
|
|
<input type="tel" id="field-phone" placeholder="+7 (___) ___-__-__">
|
|
</div>
|
|
<div class="form-field">
|
|
<label for="field-firstname">Имя</label>
|
|
<input type="text" id="field-firstname">
|
|
</div>
|
|
<div class="form-field">
|
|
<label for="field-lastname">Фамилия</label>
|
|
<input type="text" id="field-lastname">
|
|
</div>
|
|
<div class="form-field">
|
|
<label for="field-patronymic">Отчество</label>
|
|
<input type="text" id="field-patronymic">
|
|
</div>
|
|
<div class="form-field">
|
|
<label for="field-age">Возраст</label>
|
|
<input type="number" id="field-age" min="18" max="120">
|
|
</div>
|
|
</div>
|
|
<div class="form-actions">
|
|
<button type="submit" class="btn btn--primary">Сохранить</button>
|
|
<button type="button" class="btn btn--secondary" id="btn-cancel-profile">Отмена</button>
|
|
</div>
|
|
</form>
|
|
|
|
<div class="panel profile-sessions">
|
|
<div class="panel__head">
|
|
<h2 class="panel__title">Активные сессии</h2>
|
|
</div>
|
|
<div id="sessions-list" class="sessions-list"></div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<footer class="footer">
|
|
<span>ROBO-OPS — Личный кабинет оператора робота</span>
|
|
<span id="footer-time"></span>
|
|
</footer>
|
|
|
|
<div class="toast" id="toast"></div>
|
|
|
|
<script src="/static/js/api.js"></script>
|
|
<script src="/static/js/app.js"></script>
|
|
</body>
|
|
</html>
|