880 lines
41 KiB
HTML
880 lines
41 KiB
HTML
<!doctype html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
<meta name="theme-color" content="#16806a" />
|
||
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||
<meta name="apple-mobile-web-app-title" content="Гараж" />
|
||
<title>Гараж</title>
|
||
<link rel="manifest" href="/manifest.webmanifest" />
|
||
<link rel="stylesheet" href="/static/styles.css" />
|
||
<script src="https://telegram.org/js/telegram-web-app.js"></script>
|
||
</head>
|
||
<body class="auth-required">
|
||
<div class="auth-overlay" id="authOverlay">
|
||
<div class="auth-panel">
|
||
<p class="eyebrow">CarPass</p>
|
||
<h1>Цифровой паспорт авто</h1>
|
||
<p id="authMessage">Откройте приложение через Telegram-бота, чтобы безопасно привязать гараж к вашему аккаунту.</p>
|
||
<div class="auth-actions">
|
||
<a id="telegramLoginLink" class="telegram-login-link hidden" href="#" rel="noreferrer">Открыть в Telegram</a>
|
||
<button id="telegramRetryBtn" class="telegram-secondary-btn" type="button">Проверить вход</button>
|
||
</div>
|
||
<div id="telegramLoginSlot" class="telegram-login-slot"></div>
|
||
<p class="auth-note" id="authNote">Mini App открывается кнопкой «Открыть CarPass» внутри бота.</p>
|
||
</div>
|
||
</div>
|
||
<main class="shell">
|
||
<header class="topbar">
|
||
<div>
|
||
<p class="eyebrow">Drivers</p>
|
||
<h1>Гараж</h1>
|
||
</div>
|
||
<div class="top-actions">
|
||
<button class="icon-btn" id="refreshBtn" title="Обновить" aria-label="Обновить">↻</button>
|
||
<button class="icon-btn" id="menuBtn" title="Меню" aria-label="Меню">☰</button>
|
||
</div>
|
||
</header>
|
||
|
||
<section class="hero-grid">
|
||
<div class="summary-card">
|
||
<span>Стоимость в месяц</span>
|
||
<strong id="selectedCarTitle">Не выбран</strong>
|
||
<small id="selectedCarMeta">Добавь авто или выбери из списка</small>
|
||
</div>
|
||
<div class="summary-card accent">
|
||
<span>Стоимость 1 км</span>
|
||
<strong id="summaryTotal">0</strong>
|
||
<small>по пробегу и расходам периода</small>
|
||
</div>
|
||
<div class="summary-card blue">
|
||
<span>Прогноз расходов</span>
|
||
<strong id="summaryConsumption">-</strong>
|
||
<small>на ближайший месяц</small>
|
||
</div>
|
||
</section>
|
||
<button class="primary-add-btn" id="addRecordPrimaryBtn" type="button">Добавить запись</button>
|
||
|
||
<section class="layout">
|
||
<aside class="panel reveal">
|
||
<div class="section-head">
|
||
<h2>Автомобили</h2>
|
||
<button class="ghost-btn" id="addCarQuickBtn">+</button>
|
||
</div>
|
||
<div id="cars" class="cars"></div>
|
||
</aside>
|
||
|
||
<section class="workspace reveal">
|
||
<section class="passport-panel" id="passportPanel">
|
||
<div class="passport-head">
|
||
<div>
|
||
<p class="eyebrow">CarPass</p>
|
||
<h2>Цифровой паспорт</h2>
|
||
<small id="scoreHint">Добавь авто и первую запись, чтобы видеть точные отчеты</small>
|
||
</div>
|
||
<div class="score-ring" id="scoreRing">
|
||
<strong id="scoreValue">0</strong>
|
||
<span>/100</span>
|
||
</div>
|
||
</div>
|
||
<div class="passport-vehicle-summary" id="passportVehicleSummary"></div>
|
||
<div class="passport-grid">
|
||
<div class="passport-metric">
|
||
<span>Качество данных</span>
|
||
<strong id="scoreTitle">Старт</strong>
|
||
</div>
|
||
<div class="passport-metric passport-metric-combo">
|
||
<span>История и ТО</span>
|
||
<strong id="verifiedHistoryStatus">Self-reported</strong>
|
||
<small id="maintenanceStatus">Unknown</small>
|
||
</div>
|
||
</div>
|
||
<div class="passport-actions" id="scoreActions"></div>
|
||
</section>
|
||
<div class="status-bar" id="statusBar" aria-live="polite">Готов к работе</div>
|
||
|
||
<section class="report-bar">
|
||
<div>
|
||
<p class="eyebrow">Отчет</p>
|
||
<h2>Стоимость владения</h2>
|
||
</div>
|
||
<div class="period-controls">
|
||
<select id="periodPreset" aria-label="Период отчета">
|
||
<option value="7d">7 дней</option>
|
||
<option value="30d">30 дней</option>
|
||
<option value="3m">3 месяца</option>
|
||
<option value="6m">6 месяцев</option>
|
||
<option value="12m">12 месяцев</option>
|
||
<option value="all">Весь период</option>
|
||
<option value="custom">Свой период</option>
|
||
</select>
|
||
<input id="periodFrom" type="date" aria-label="Дата начала" />
|
||
<input id="periodTo" type="date" aria-label="Дата окончания" />
|
||
</div>
|
||
</section>
|
||
|
||
<div class="stats" id="stats"></div>
|
||
|
||
<section class="quick-actions hidden">
|
||
<button class="action-card active" data-action="fuel">
|
||
<span>Заправка</span>
|
||
<strong>30 сек</strong>
|
||
</button>
|
||
<button class="action-card" data-action="service">
|
||
<span>Сервис</span>
|
||
<strong>ТО / ремонт</strong>
|
||
</button>
|
||
<button class="action-card" data-action="scan">
|
||
<span>Разбор чека</span>
|
||
<strong>Текст</strong>
|
||
</button>
|
||
</section>
|
||
|
||
<section class="charts">
|
||
<div class="chart-card">
|
||
<div class="section-head">
|
||
<h2>Динамика расходов</h2>
|
||
</div>
|
||
<canvas id="expensesChart" width="720" height="260"></canvas>
|
||
</div>
|
||
<div class="chart-card compact">
|
||
<div class="section-head">
|
||
<h2>Структура</h2>
|
||
</div>
|
||
<canvas id="splitChart" width="280" height="260"></canvas>
|
||
</div>
|
||
</section>
|
||
|
||
<form id="fuelForm" class="entry-form quick-form hidden">
|
||
<label>
|
||
Дата
|
||
<input name="entry_date" type="date" required />
|
||
</label>
|
||
<label>
|
||
Одометр, км
|
||
<input name="odometer" type="number" min="0" required />
|
||
</label>
|
||
<label>
|
||
Литры
|
||
<input name="liters" type="number" min="0" step="0.001" required />
|
||
</label>
|
||
<label>
|
||
Цена за литр
|
||
<input name="price_per_liter" type="number" min="0" step="0.01" required />
|
||
</label>
|
||
<label>
|
||
АЗС
|
||
<select name="station">
|
||
<option value="">Не выбрано</option>
|
||
<option>Shell</option>
|
||
<option>Lukoil</option>
|
||
<option>Gazprom</option>
|
||
<option>Rosneft</option>
|
||
<option>Neste</option>
|
||
</select>
|
||
</label>
|
||
<label class="check">
|
||
<input name="is_full_tank" type="checkbox" checked />
|
||
Полный бак
|
||
</label>
|
||
<button type="submit">Сохранить заправку</button>
|
||
</form>
|
||
|
||
<form id="serviceForm" class="entry-form hidden">
|
||
<label>
|
||
Дата
|
||
<input name="entry_date" type="date" required />
|
||
</label>
|
||
<label>
|
||
Одометр, км
|
||
<input name="odometer" type="number" min="0" />
|
||
</label>
|
||
<label>
|
||
Тип
|
||
<select name="service_type">
|
||
<option value="maintenance">Обслуживание</option>
|
||
<option value="repair">Ремонт</option>
|
||
<option value="fluid">Жидкости</option>
|
||
<option value="tire">Шины</option>
|
||
<option value="inspection">Осмотр</option>
|
||
<option value="insurance">Страховка</option>
|
||
<option value="tax">Налог</option>
|
||
<option value="other">Другое</option>
|
||
</select>
|
||
</label>
|
||
<label>
|
||
Что сделано
|
||
<input name="title" placeholder="Замена масла" required />
|
||
</label>
|
||
<div class="preset-row">
|
||
<button type="button" data-service-title="Замена масла" data-service-type="maintenance">Масло</button>
|
||
<button type="button" data-service-title="Шиномонтаж" data-service-type="tire">Шины</button>
|
||
<button type="button" data-service-title="Диагностика" data-service-type="inspection">Осмотр</button>
|
||
</div>
|
||
<label>
|
||
Стоимость
|
||
<input name="total_cost" type="number" min="0" step="0.01" required />
|
||
</label>
|
||
<label>
|
||
Исполнитель
|
||
<input name="vendor" placeholder="СТО / магазин" />
|
||
</label>
|
||
<details class="advanced-fields wide">
|
||
<summary>Напоминание о следующем ТО</summary>
|
||
<div class="grid-form drawer-form compact-inner-form">
|
||
<label>
|
||
Следующая дата
|
||
<input name="next_due_date" type="date" />
|
||
</label>
|
||
<label>
|
||
Следующий пробег
|
||
<input name="next_due_odometer" type="number" min="0" />
|
||
</label>
|
||
</div>
|
||
</details>
|
||
<button type="submit">Сохранить запись</button>
|
||
</form>
|
||
</section>
|
||
</section>
|
||
</main>
|
||
|
||
<div class="drawer hidden" id="userDrawer">
|
||
<div class="drawer-panel">
|
||
<div class="section-head">
|
||
<h2>Меню</h2>
|
||
<button class="icon-btn" id="closeMenuBtn" aria-label="Закрыть">×</button>
|
||
</div>
|
||
<div class="drawer-menu">
|
||
<section class="service-profile-card hidden" id="serviceProfileCard">
|
||
<div>
|
||
<p class="eyebrow">Профиль СТО</p>
|
||
<strong id="serviceProfileTitle">Рабочее место</strong>
|
||
<small id="serviceProfileMeta">Доступно после регистрации СТО</small>
|
||
</div>
|
||
<button class="wide-btn" type="button" data-open-sto-page>Открыть рабочее место</button>
|
||
</section>
|
||
|
||
<details class="menu-group" open>
|
||
<summary>Автомобиль</summary>
|
||
<button class="menu-row" data-menu-section="carsSection">Мои автомобили</button>
|
||
<button class="menu-row" data-page-link="/car_profile.html?action=new">Добавить авто</button>
|
||
<button class="menu-row" data-page-link="/car_profile.html">Паспорт и параметры авто</button>
|
||
<button class="menu-row" data-menu-section="maintenanceRecommendationsSection">Рекомендации ТО</button>
|
||
<button class="menu-row" data-menu-section="confirmationsSection">Подтверждения</button>
|
||
<button class="menu-row" data-menu-section="connectedServicesSection">Подключенные СТО</button>
|
||
</details>
|
||
|
||
<details class="menu-group" open>
|
||
<summary>Расходы</summary>
|
||
<button class="menu-row" data-menu-section="expensesSection">Все расходы</button>
|
||
<button class="menu-row" data-menu-section="fuelSection">Заправка</button>
|
||
<button class="menu-row" data-menu-section="serviceSection">ТО и ремонт</button>
|
||
<button class="menu-row" data-menu-section="insuranceSection">Страховка</button>
|
||
<button class="menu-row" data-menu-section="taxSection">Налоги</button>
|
||
<button class="menu-row" data-menu-section="fineSection">Штрафы</button>
|
||
</details>
|
||
|
||
<details class="menu-group" open>
|
||
<summary>СТО</summary>
|
||
<button class="menu-row" data-menu-section="publicServicesSection">Каталог СТО</button>
|
||
<button class="menu-row" data-page-link="/book_sto.html">Записаться в СТО</button>
|
||
<button class="menu-row" data-menu-section="appointmentsSection">Мои записи</button>
|
||
<button class="menu-row" data-menu-section="reviewsSection">Отзывы</button>
|
||
<button class="menu-row sto-workplace-only hidden" data-open-sto-page>Панель СТО</button>
|
||
<button class="menu-row sto-calendar-only hidden" data-page-link="/sto_settings.html">Настройки СТО</button>
|
||
<button class="menu-row sto-calendar-only hidden" data-menu-section="stoCalendarSection">Календарь СТО</button>
|
||
<button class="menu-row service-owner-only hidden" data-page-link="/service_profile.html">Профиль СТО</button>
|
||
</details>
|
||
|
||
<details class="menu-group">
|
||
<summary>Аккаунт</summary>
|
||
<button class="menu-row" data-menu-section="settingsSection">Настройки</button>
|
||
<button class="menu-row" data-menu-section="notificationsSection">Уведомления</button>
|
||
<button class="menu-row" data-page-link="/data_exchange.html">Импорт / экспорт</button>
|
||
<button class="menu-row admin-only hidden" data-menu-section="adminSection">Админ</button>
|
||
</details>
|
||
</div>
|
||
|
||
<div class="drawer-content">
|
||
<section class="drawer-section hidden" id="quickAddSection">
|
||
<h2>Добавить запись</h2>
|
||
<div class="quick-entry-grid">
|
||
<button type="button" data-quick-entry="fuelSection">
|
||
<span>Заправка</span>
|
||
<small>дата, пробег, литры, цена</small>
|
||
</button>
|
||
<button type="button" data-quick-entry="serviceSection">
|
||
<span>ТО и ремонт</span>
|
||
<small>работа, стоимость, следующий срок</small>
|
||
</button>
|
||
<button type="button" data-quick-entry="expensesSection">
|
||
<span>Расход</span>
|
||
<small>страховка, штраф, парковка, прочее</small>
|
||
</button>
|
||
<button type="button" data-quick-entry="scan">
|
||
<span>Скан чека</span>
|
||
<small>фото или файл</small>
|
||
</button>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="drawer-section hidden" id="carsSection">
|
||
<h2>Автомобили</h2>
|
||
<div id="drawerCars" class="cars drawer-cars"></div>
|
||
</section>
|
||
|
||
<section class="drawer-section hidden" id="expensesSection">
|
||
<h2>Добавить расход</h2>
|
||
<form id="expenseForm" class="grid-form drawer-form">
|
||
<label>
|
||
Дата
|
||
<input name="entry_date" type="date" required />
|
||
</label>
|
||
<label>
|
||
Категория
|
||
<select name="category" id="expenseCategorySelect">
|
||
<option value="insurance">Страховка</option>
|
||
<option value="tax">Налог</option>
|
||
<option value="fine">Штраф</option>
|
||
<option value="parking">Парковка</option>
|
||
<option value="car_wash">Мойка</option>
|
||
<option value="toll">Платная дорога</option>
|
||
<option value="tires">Шины</option>
|
||
<option value="wheels">Диски</option>
|
||
<option value="battery">Аккумулятор</option>
|
||
<option value="parts">Запчасти</option>
|
||
<option value="repair">Ремонт</option>
|
||
<option value="maintenance">Плановое ТО</option>
|
||
<option value="diagnostics">Диагностика</option>
|
||
<option value="towing">Эвакуатор</option>
|
||
<option value="loan_payment">Кредит / лизинг</option>
|
||
<option value="loan_interest">Проценты по кредиту</option>
|
||
<option value="state_fee">Госпошлина</option>
|
||
<option value="registration">Регистрация</option>
|
||
<option value="inspection">Техосмотр</option>
|
||
<option value="other">Прочее</option>
|
||
</select>
|
||
</label>
|
||
<label>
|
||
Название
|
||
<input name="title" placeholder="ОСАГО / парковка / налог" required />
|
||
</label>
|
||
<label>
|
||
Стоимость
|
||
<input name="total_cost" type="number" min="0" step="0.01" required />
|
||
</label>
|
||
<label>
|
||
Валюта
|
||
<select name="currency">
|
||
<option value="RUB">RUB</option>
|
||
<option value="KRW">KRW</option>
|
||
<option value="USD">USD</option>
|
||
<option value="EUR">EUR</option>
|
||
</select>
|
||
</label>
|
||
<label>
|
||
Поставщик / место
|
||
<input name="vendor" />
|
||
</label>
|
||
<details class="advanced-fields wide">
|
||
<summary>Дополнительно</summary>
|
||
<div class="grid-form drawer-form compact-inner-form">
|
||
<label>
|
||
Одометр
|
||
<input name="odometer" type="number" min="0" />
|
||
</label>
|
||
<label>
|
||
Начало периода
|
||
<input name="period_start" type="date" />
|
||
</label>
|
||
<label>
|
||
Конец периода
|
||
<input name="period_end" type="date" />
|
||
</label>
|
||
<label>
|
||
Месяцев покрытия
|
||
<select name="period_months">
|
||
<option value="">По датам</option>
|
||
<option value="1">1 месяц</option>
|
||
<option value="3">3 месяца</option>
|
||
<option value="6">6 месяцев</option>
|
||
<option value="12">12 месяцев</option>
|
||
</select>
|
||
</label>
|
||
<label>
|
||
Номер полиса / документа
|
||
<input name="policy_number" />
|
||
</label>
|
||
<label>
|
||
Тип страховки
|
||
<select name="insurance_type">
|
||
<option value="">Не задано</option>
|
||
<option value="mandatory">ОСАГО / обязательная</option>
|
||
<option value="full">КАСКО / полная</option>
|
||
<option value="other">Другое</option>
|
||
</select>
|
||
</label>
|
||
<label>
|
||
Комментарий
|
||
<input name="notes" />
|
||
</label>
|
||
<label class="check">
|
||
<input name="is_recurring" type="checkbox" />
|
||
Регулярный расход
|
||
</label>
|
||
</div>
|
||
</details>
|
||
<button type="submit">Сохранить расход</button>
|
||
</form>
|
||
</section>
|
||
|
||
<section class="drawer-section hidden" id="fuelSection">
|
||
<h2>Заправка</h2>
|
||
<div id="fuelFormMount"></div>
|
||
<button type="button" class="wide-btn ghost-btn" id="fuelScanBtn">Скан чека</button>
|
||
</section>
|
||
|
||
<section class="drawer-section hidden" id="serviceSection">
|
||
<h2>ТО и ремонт</h2>
|
||
<div id="serviceFormMount"></div>
|
||
</section>
|
||
|
||
<section class="drawer-section hidden" id="insuranceSection">
|
||
<h2>Страховка</h2>
|
||
<div class="tip-card">Укажите период действия полиса, и CarPass распределит стоимость по месяцам.</div>
|
||
<button class="wide-btn" type="button" data-expense-preset="insurance">Добавить страховку</button>
|
||
</section>
|
||
|
||
<section class="drawer-section hidden" id="taxSection">
|
||
<h2>Налоги</h2>
|
||
<button class="wide-btn" type="button" data-expense-preset="tax">Добавить налог</button>
|
||
</section>
|
||
|
||
<section class="drawer-section hidden" id="fineSection">
|
||
<h2>Штрафы</h2>
|
||
<button class="wide-btn" type="button" data-expense-preset="fine">Добавить штраф</button>
|
||
</section>
|
||
|
||
<section class="drawer-section hidden" id="publicServicesSection">
|
||
<h2>СТО</h2>
|
||
<div class="tip-card">Обычный профиль не показывает панель СТО. Для бизнеса отправьте заявку на проверку.</div>
|
||
<button class="wide-btn service-owner-only hidden" type="button" data-page-link="/service_profile.html">Открыть профиль СТО</button>
|
||
<div id="publicServiceCenters" class="stack-list"></div>
|
||
<div id="serviceCard" class="service-card hidden"></div>
|
||
</section>
|
||
|
||
<section class="drawer-section hidden" id="reviewsSection">
|
||
<h2>Отзывы</h2>
|
||
<div id="serviceReviews" class="stack-list"></div>
|
||
</section>
|
||
|
||
<section class="drawer-section hidden" id="appointmentsSection">
|
||
<h2>Мои записи</h2>
|
||
<div class="tip-card">Здесь видны заявки, подтвержденные записи и предложения нового времени от СТО.</div>
|
||
<div id="appointmentsList" class="stack-list"></div>
|
||
</section>
|
||
|
||
<section class="drawer-section hidden" id="maintenanceRecommendationsSection">
|
||
<h2>Рекомендации ТО</h2>
|
||
<div class="tip-card">CarPass подсказывает обслуживание по пробегу, времени и истории работ.</div>
|
||
<div id="maintenanceRecommendations" class="stack-list"></div>
|
||
</section>
|
||
|
||
<section class="drawer-section hidden" id="settingsSection">
|
||
<h2>Настройки</h2>
|
||
<form id="settingsForm" class="grid-form drawer-form">
|
||
<label>
|
||
Язык
|
||
<select name="locale" id="localeSelect">
|
||
<option value="ru">Русский</option>
|
||
<option value="en">English</option>
|
||
<option value="ko">한국어</option>
|
||
</select>
|
||
</label>
|
||
<label>
|
||
Валюта
|
||
<select name="currency" id="currencySelect">
|
||
<option value="RUB">RUB ₽</option>
|
||
<option value="USD">USD $</option>
|
||
<option value="EUR">EUR €</option>
|
||
<option value="KRW">KRW ₩</option>
|
||
<option value="KZT">KZT ₸</option>
|
||
</select>
|
||
</label>
|
||
<button type="submit">Сохранить настройки</button>
|
||
</form>
|
||
</section>
|
||
|
||
<section class="drawer-section hidden" id="notificationsSection">
|
||
<h2>Уведомления</h2>
|
||
<div class="tip-card" id="notificationStatus">Напомним о ТО, страховке и регулярном внесении пробега.</div>
|
||
<div class="tip-card hidden" id="notificationHelp"></div>
|
||
<button type="button" class="wide-btn" id="enableNotificationsBtn">Включить уведомления</button>
|
||
</section>
|
||
|
||
<section class="drawer-section hidden" id="confirmationsSection">
|
||
<h2>Запросы на подтверждение</h2>
|
||
<div class="tip-card">Здесь будут визиты СТО и изменения данных авто, которые ждут твоего решения.</div>
|
||
<div id="confirmationRequests" class="stack-list"></div>
|
||
</section>
|
||
|
||
<section class="drawer-section hidden" id="connectedServicesSection">
|
||
<h2>Подключенные автосервисы</h2>
|
||
<div class="tip-card">Автосервис видит машину только после твоего разрешения или в рамках визита.</div>
|
||
<div id="connectedServices" class="stack-list"></div>
|
||
</section>
|
||
|
||
<section class="drawer-section hidden" id="servicePanelSection">
|
||
<h2>Панель СТО</h2>
|
||
<form id="serviceCenterForm" class="grid-form drawer-form">
|
||
<label>
|
||
Название СТО
|
||
<input name="display_name" placeholder="Smart Service" required />
|
||
</label>
|
||
<label>
|
||
Юридическое название
|
||
<input name="legal_name" placeholder="ООО Smart Service" />
|
||
</label>
|
||
<label>
|
||
Страна
|
||
<input name="country" maxlength="2" placeholder="KR" />
|
||
</label>
|
||
<label>
|
||
Город
|
||
<input name="city" placeholder="Seoul" />
|
||
</label>
|
||
<label>
|
||
Адрес
|
||
<input name="address" />
|
||
</label>
|
||
<label>
|
||
Телефон
|
||
<input name="phone" />
|
||
</label>
|
||
<label>
|
||
Контактное лицо
|
||
<input name="contact_person" />
|
||
</label>
|
||
<label>
|
||
Специализация
|
||
<input name="specializations" placeholder="BMW, электрика, шиномонтаж" />
|
||
</label>
|
||
<label>
|
||
График работы
|
||
<input name="working_hours" placeholder="Пн-Сб 09:00-19:00" />
|
||
</label>
|
||
<label>
|
||
Описание
|
||
<input name="description" placeholder="Коротко о сервисе" />
|
||
</label>
|
||
<label>
|
||
Регистрационный номер
|
||
<input name="business_registration_number" />
|
||
</label>
|
||
<label>
|
||
Фото фасада, URL
|
||
<input name="facade_photo_url" placeholder="https://..." />
|
||
</label>
|
||
<label>
|
||
Фото документов, URL через запятую
|
||
<input name="document_photo_urls" placeholder="https://..., https://..." />
|
||
</label>
|
||
<label>
|
||
Дополнительные фото, URL через запятую
|
||
<input name="additional_photo_urls" placeholder="https://..., https://..." />
|
||
</label>
|
||
<button type="submit">Отправить заявку</button>
|
||
</form>
|
||
<div id="serviceCentersList" class="stack-list"></div>
|
||
</section>
|
||
|
||
<section class="drawer-section hidden" id="stoCalendarSection">
|
||
<h2>Календарь СТО</h2>
|
||
<div class="tip-card">Краткая сводка заявок и подтвержденных записей по первому доступному СТО.</div>
|
||
<div id="stoDashboardSummary" class="stats mini-stats"></div>
|
||
<div id="stoCalendarList" class="stack-list"></div>
|
||
</section>
|
||
|
||
<section class="drawer-section hidden" id="mechanicWorkplaceSection">
|
||
<div class="section-head">
|
||
<div>
|
||
<p class="eyebrow">СТО</p>
|
||
<h2>Рабочее место механика</h2>
|
||
</div>
|
||
<select id="mechanicCenterSelect" aria-label="СТО"></select>
|
||
</div>
|
||
<div id="mechanicDashboardSummary" class="stats mini-stats"></div>
|
||
<div id="mechanicWorkplaceList" class="stack-list"></div>
|
||
</section>
|
||
|
||
<section class="drawer-section hidden" id="adminSection">
|
||
<h2>Модерация СТО</h2>
|
||
<div class="tip-card">Заявки видны только администраторам и модераторам.</div>
|
||
<div id="adminPendingServices" class="stack-list"></div>
|
||
</section>
|
||
|
||
<section class="drawer-section hidden" id="carFormSection">
|
||
<h2>Новое авто</h2>
|
||
<form id="carForm" class="grid-form drawer-form">
|
||
<label>
|
||
Название авто
|
||
<input name="name" placeholder="Toyota Camry" required />
|
||
</label>
|
||
<label>
|
||
Марка
|
||
<select name="make" id="makeSelect" required></select>
|
||
</label>
|
||
<label>
|
||
Модель
|
||
<select name="model" id="modelSelect" required></select>
|
||
</label>
|
||
<label>
|
||
Комплектация
|
||
<select name="trim" id="trimSelect"></select>
|
||
</label>
|
||
<div class="catalog-preview" id="catalogPreview">
|
||
<strong>Выбери модель</strong>
|
||
<span>Покажем кузов, топливо, привод и годы выпуска.</span>
|
||
</div>
|
||
<label>
|
||
Год
|
||
<input name="year" type="number" min="1900" max="2100" />
|
||
</label>
|
||
<label>
|
||
Госномер
|
||
<input name="plate_number" placeholder="12가3456" />
|
||
</label>
|
||
<label>
|
||
VIN
|
||
<input name="vin" maxlength="17" placeholder="17 символов без I/O/Q" />
|
||
</label>
|
||
<label>
|
||
Текущий пробег
|
||
<input name="current_odometer" type="number" min="0" />
|
||
</label>
|
||
<label>
|
||
Тип топлива
|
||
<select name="fuel_type" id="fuelTypeSelect">
|
||
<option value="">Авто</option>
|
||
<option value="gasoline">Бензин</option>
|
||
<option value="diesel">Дизель</option>
|
||
<option value="hybrid">Гибрид</option>
|
||
<option value="electric">Электро</option>
|
||
</select>
|
||
</label>
|
||
<label>
|
||
Стоимость покупки
|
||
<input name="purchase_price" type="number" min="0" step="0.01" />
|
||
</label>
|
||
<label>
|
||
Дата покупки
|
||
<input name="purchase_date" type="date" />
|
||
</label>
|
||
<label>
|
||
Тип покупки
|
||
<select name="purchase_type">
|
||
<option value="unknown">Не указано</option>
|
||
<option value="cash">Наличные</option>
|
||
<option value="credit">Кредит</option>
|
||
<option value="lease">Лизинг</option>
|
||
<option value="gift">Подарок</option>
|
||
</select>
|
||
</label>
|
||
<button type="submit">Добавить авто</button>
|
||
</form>
|
||
</section>
|
||
|
||
<section class="drawer-section hidden" id="carProfileSection">
|
||
<h2>Параметры авто</h2>
|
||
<div class="tip-card" id="carProfileHint">Выбери автомобиль, чтобы настроить жидкости, расход и сервисные нормы.</div>
|
||
<form id="carProfileForm" class="grid-form drawer-form">
|
||
<label>
|
||
Госномер
|
||
<input name="plate_number" placeholder="12가3456" />
|
||
</label>
|
||
<label>
|
||
VIN
|
||
<input name="vin" maxlength="17" placeholder="17 символов без I/O/Q" />
|
||
</label>
|
||
<label>
|
||
Поколение / кузов
|
||
<input name="generation" placeholder="XV70 / CN7" />
|
||
</label>
|
||
<label>
|
||
Тип кузова
|
||
<input name="body_type" placeholder="седан / SUV" />
|
||
</label>
|
||
<label>
|
||
Объем двигателя, л
|
||
<input name="engine_volume_l" type="number" min="0" step="0.01" />
|
||
</label>
|
||
<label>
|
||
Коробка передач
|
||
<select name="transmission">
|
||
<option value="">Не задано</option>
|
||
<option value="manual">Механика</option>
|
||
<option value="automatic">Автомат</option>
|
||
<option value="cvt">CVT</option>
|
||
<option value="dct">DCT</option>
|
||
</select>
|
||
</label>
|
||
<label>
|
||
Привод
|
||
<select name="drive_type">
|
||
<option value="">Не задано</option>
|
||
<option value="fwd">Передний</option>
|
||
<option value="rwd">Задний</option>
|
||
<option value="awd">Полный</option>
|
||
</select>
|
||
</label>
|
||
<label>
|
||
Тип топлива
|
||
<select name="fuel_type">
|
||
<option value="">Не задано</option>
|
||
<option value="gasoline">Бензин</option>
|
||
<option value="diesel">Дизель</option>
|
||
<option value="hybrid">Гибрид</option>
|
||
<option value="electric">Электро</option>
|
||
</select>
|
||
</label>
|
||
<label>
|
||
Нормальный расход, л/100 км
|
||
<input name="target_consumption_l_per_100km" type="number" min="0" step="0.01" placeholder="8.50" />
|
||
</label>
|
||
<label>
|
||
Бак, л
|
||
<input name="fuel_tank_volume_l" type="number" min="0" step="0.01" placeholder="60" />
|
||
</label>
|
||
<label>
|
||
Моторное масло
|
||
<input name="engine_oil_type" placeholder="5W-30 API SP" />
|
||
</label>
|
||
<label>
|
||
Объем масла, л
|
||
<input name="engine_oil_volume_l" type="number" min="0" step="0.01" placeholder="4.50" />
|
||
</label>
|
||
<label>
|
||
Трансмиссионная жидкость
|
||
<input name="transmission_fluid_type" placeholder="ATF WS / DCTF / CVT" />
|
||
</label>
|
||
<label>
|
||
Объем трансмиссии, л
|
||
<input name="transmission_fluid_volume_l" type="number" min="0" step="0.01" placeholder="7.20" />
|
||
</label>
|
||
<label>
|
||
Антифриз
|
||
<input name="coolant_type" placeholder="G12+ / LLC" />
|
||
</label>
|
||
<label>
|
||
Тормозная жидкость
|
||
<input name="brake_fluid_type" placeholder="DOT 4" />
|
||
</label>
|
||
<label>
|
||
Давление перед, bar
|
||
<input name="tire_pressure_front_bar" type="number" min="0" step="0.01" placeholder="2.30" />
|
||
</label>
|
||
<label>
|
||
Давление зад, bar
|
||
<input name="tire_pressure_rear_bar" type="number" min="0" step="0.01" placeholder="2.20" />
|
||
</label>
|
||
<label>
|
||
Размер шин
|
||
<input name="tire_size" placeholder="205/55 R16" />
|
||
</label>
|
||
<label>
|
||
Интервал масла, км
|
||
<input name="oil_change_interval_km" type="number" min="0" placeholder="10000" />
|
||
</label>
|
||
<label>
|
||
Интервал масла, мес
|
||
<input name="oil_change_interval_months" type="number" min="0" placeholder="12" />
|
||
</label>
|
||
<label>
|
||
Стоимость покупки
|
||
<input name="purchase_price" type="number" min="0" step="0.01" />
|
||
</label>
|
||
<label>
|
||
Дата покупки
|
||
<input name="purchase_date" type="date" />
|
||
</label>
|
||
<label>
|
||
Тип покупки
|
||
<select name="purchase_type">
|
||
<option value="unknown">Не указано</option>
|
||
<option value="cash">Наличные</option>
|
||
<option value="credit">Кредит</option>
|
||
<option value="lease">Лизинг</option>
|
||
<option value="gift">Подарок</option>
|
||
</select>
|
||
</label>
|
||
<label>
|
||
Сумма кредита
|
||
<input name="loan_principal" type="number" min="0" step="0.01" />
|
||
</label>
|
||
<label>
|
||
Первоначальный взнос
|
||
<input name="loan_down_payment" type="number" min="0" step="0.01" />
|
||
</label>
|
||
<label>
|
||
Срок кредита, мес
|
||
<input name="loan_term_months" type="number" min="1" />
|
||
</label>
|
||
<label>
|
||
Ставка годовая, %
|
||
<input name="loan_annual_interest_rate" type="number" min="0" step="0.001" />
|
||
</label>
|
||
<label>
|
||
Первый платеж
|
||
<input name="loan_first_payment_date" type="date" />
|
||
</label>
|
||
<label class="check">
|
||
<input name="include_depreciation" type="checkbox" />
|
||
Учитывать амортизацию
|
||
</label>
|
||
<label>
|
||
Заметки
|
||
<input name="notes" placeholder="Особенности авто" />
|
||
</label>
|
||
<button type="submit">Сохранить параметры</button>
|
||
<button type="button" class="danger-btn" id="deleteCarBtn">Удалить автомобиль</button>
|
||
</form>
|
||
</section>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="scan-modal hidden" id="scanModal">
|
||
<div class="scan-panel">
|
||
<div class="section-head">
|
||
<h2>Разбор чека</h2>
|
||
<button class="icon-btn" id="closeScanBtn" aria-label="Закрыть">×</button>
|
||
</div>
|
||
<form id="ocrForm" class="scan-form">
|
||
<div class="scan-actions">
|
||
<button type="button" class="ghost-btn" id="scanCameraBtn">Сфотографировать</button>
|
||
<button type="button" class="ghost-btn" id="scanFileBtn">Выбрать файл</button>
|
||
</div>
|
||
<input id="receiptCameraInput" class="hidden-file" type="file" accept="image/*" capture="environment" />
|
||
<input id="receiptFileInput" class="hidden-file" type="file" accept="image/*,.pdf,.txt" />
|
||
<div id="receiptFileName" class="file-hint">Файл не выбран</div>
|
||
<button type="submit">Разобрать текст</button>
|
||
</form>
|
||
<div id="ocrResult" class="tip-card">Загрузите фото или файл чека. CarPass распознает данные и предложит проверить их перед сохранением.</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="report-sheet hidden" id="reportSheet">
|
||
<div class="sheet-panel">
|
||
<div class="section-head">
|
||
<h2 id="reportTitle">Отчет</h2>
|
||
<button class="icon-btn" id="closeReportBtn" aria-label="Закрыть">×</button>
|
||
</div>
|
||
<div id="reportBody"></div>
|
||
</div>
|
||
</div>
|
||
<div class="toast hidden" id="toast" role="status" aria-live="polite"></div>
|
||
<script src="/static/app.js"></script>
|
||
</body>
|
||
</html>
|