119 lines
5.3 KiB
HTML
119 lines
5.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>НЕОН CRM — панель управления</title>
|
||
<meta name="description" content="CRM кальянного лаунжа НЕОН: стоп-лист табаков и меню, управление заказами.">
|
||
<link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Crect width='64' height='64' rx='14' fill='%230A0A0F'/%3E%3Ctext x='32' y='45' font-family='Arial Black, Arial' font-size='34' font-weight='900' text-anchor='middle' fill='%2300F0FF'%3EН%3C/text%3E%3C/svg%3E">
|
||
<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=Manrope:wght@400;500;600;700;800&family=Unbounded:wght@400;500;600;700;800&display=swap" rel="stylesheet">
|
||
<link rel="stylesheet" href="css/styles.css">
|
||
</head>
|
||
<body>
|
||
|
||
<!-- ЭКРАН ВХОДА -->
|
||
<section class="login" id="loginScreen">
|
||
<div class="glow glow-cyan"></div>
|
||
<div class="glow glow-purple"></div>
|
||
|
||
<div class="login-card">
|
||
<div class="login-logo">
|
||
<span class="logo-neon">Н</span>
|
||
<div>
|
||
<h1>НЕОН <em>CRM</em></h1>
|
||
<p>Панель управления лаунджем · Нягань</p>
|
||
</div>
|
||
</div>
|
||
|
||
<form id="loginForm" autocomplete="off">
|
||
<label class="field">
|
||
<span>Логин</span>
|
||
<input type="text" id="loginUser" placeholder="admin" value="" autocomplete="username">
|
||
</label>
|
||
<label class="field">
|
||
<span>Пароль</span>
|
||
<input type="password" id="loginPass" placeholder="••••••••" value="" autocomplete="current-password">
|
||
</label>
|
||
<button class="btn btn-neon btn-block" type="submit">Войти</button>
|
||
</form>
|
||
|
||
<p class="login-error hidden" id="loginError" role="alert"></p>
|
||
</div>
|
||
|
||
<p class="login-foot">neon-bar86.ru · внутренняя система</p>
|
||
</section>
|
||
|
||
<!-- ПРИЛОЖЕНИЕ -->
|
||
<div class="app hidden" id="app">
|
||
<aside class="sidebar">
|
||
<div class="side-top">
|
||
<div class="brand">
|
||
<span class="logo-neon">Н</span>
|
||
<div class="brand-txt">
|
||
<strong>НЕОН <em>CRM</em></strong>
|
||
<small id="brandRole">—</small>
|
||
</div>
|
||
</div>
|
||
<!-- карточка аккаунта перед списком вкладок: имя, роль и выход всегда сверху -->
|
||
<div class="user-card">
|
||
<span class="avatar" id="userAvatar">М</span>
|
||
<div>
|
||
<strong id="userName">—</strong>
|
||
<small id="userRole">—</small>
|
||
</div>
|
||
<button class="icon-btn" id="passwordBtn" title="Сменить пароль" type="button">🔑</button>
|
||
<button class="icon-btn" id="logoutBtn" title="Выйти" type="button">✕</button>
|
||
</div>
|
||
<nav class="nav" id="nav"></nav>
|
||
</div>
|
||
|
||
<div class="side-bottom">
|
||
<button class="btn btn-ghost btn-sm btn-block offline-retry hidden" id="offlineRetry" type="button">⟳ Переподключиться</button>
|
||
</div>
|
||
</aside>
|
||
|
||
<main class="main">
|
||
<header class="topbar">
|
||
<div>
|
||
<h2 id="pageTitle">—</h2>
|
||
<p id="pageSub">—</p>
|
||
</div>
|
||
<div class="topbar-right">
|
||
<span class="shift" id="shift">—</span>
|
||
<span class="topbar-actions" id="shiftActions"></span>
|
||
<button class="icon-btn bell" id="bellBtn" title="Новые заказы" type="button">
|
||
🔔<span class="bell-count hidden" id="bellCount">0</span>
|
||
</button>
|
||
<span class="clock" id="clock">--:--</span>
|
||
</div>
|
||
</header>
|
||
|
||
<div class="view" id="viewRoot"></div>
|
||
</main>
|
||
|
||
<!-- автопрокрутка страницы: появляется, когда список не влезает в экран -->
|
||
<div class="scroll-nav hidden" id="scrollNav">
|
||
<button class="scroll-btn" id="scrollUp" title="Прокрутить вверх" type="button">▲</button>
|
||
<button class="scroll-btn" id="scrollDown" title="Прокрутить вниз" type="button">▼</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="toast-wrap" id="toasts" role="status" aria-live="polite"></div>
|
||
|
||
<!-- модальные окна подтверждения и ввода: живут вне viewRoot, чтобы
|
||
перерисовка (опрос заказов каждые 10 с) не закрывала открытое окно -->
|
||
<div class="modal-overlay hidden" id="modalOverlay">
|
||
<div class="modal" id="modalBox" role="dialog" aria-modal="true"></div>
|
||
</div>
|
||
|
||
<!-- скрытый выбор фото позиции: живёт вне viewRoot, чтобы перерисовка
|
||
списка (опрос заказов каждые 10 с) не отваливала элемент во время
|
||
открытого диалога выбора файла -->
|
||
<input type="file" id="photoInput" accept="image/avif,image/jpeg,image/png,image/webp,image/gif" style="display:none">
|
||
|
||
<script src="js/app.js"></script>
|
||
</body>
|
||
</html>
|