Add owner work order approval page

2026-05-16 10:51:05 +09:00
parent ac5845d5a0
commit 545f4d088d
12 changed files with 1066 additions and 48 deletions
--- a/web/work_order.html
+++ b/web/work_order.html
@@ -0,0 +1,92 @@
+<!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" />
+    <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 work-order-page">
+    <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>
+    </div>
+
+    <main class="shell work-order-shell">
+      <header class="topbar">
+        <div>
+          <p class="eyebrow">Согласование</p>
+          <h1>Заказ-наряд</h1>
+        </div>
+        <button class="icon-btn" id="refreshBtn" title="Обновить" aria-label="Обновить">↻</button>
+      </header>
+
+      <section class="passport-panel work-order-hero">
+        <div class="passport-head">
+          <div>
+            <p class="eyebrow" id="centerName">СТО</p>
+            <h2 id="orderTitle">Загружаю...</h2>
+            <small id="vehicleMeta">Проверяю доступ</small>
+          </div>
+          <span class="trust-badge" id="statusBadge">Статус</span>
+        </div>
+        <div class="work-order-total">
+          <span>Итого к согласованию</span>
+          <strong id="orderTotal">-</strong>
+        </div>
+      </section>
+
+      <section class="work-order-layout">
+        <section class="workspace">
+          <div class="section-head">
+            <div>
+              <p class="eyebrow">Состав</p>
+              <h2>Работы</h2>
+            </div>
+          </div>
+          <div id="laborList" class="stack-list"></div>
+        </section>
+
+        <section class="workspace">
+          <div class="section-head">
+            <div>
+              <p class="eyebrow">Материалы</p>
+              <h2>Запчасти и жидкости</h2>
+            </div>
+          </div>
+          <div id="productList" class="stack-list"></div>
+        </section>
+
+        <section class="workspace work-order-decision">
+          <div>
+            <p class="eyebrow">Решение владельца</p>
+            <h2 id="decisionTitle">Проверьте смету</h2>
+            <p id="decisionText">Если все понятно, согласуйте заказ-наряд. После согласования СТО сможет завершить работы.</p>
+          </div>
+          <label>
+            Комментарий
+            <textarea id="ownerComment" rows="3" placeholder="Например: согласен, но старые детали прошу оставить в багажнике"></textarea>
+          </label>
+          <div class="row-actions">
+            <button type="button" id="approveBtn">Согласовать</button>
+            <button type="button" class="ghost-btn" id="rejectBtn">Отклонить</button>
+          </div>
+          <a class="telegram-login-link hidden" id="fillProfileLink" href="/">Заполнить карточку авто</a>
+        </section>
+      </section>
+    </main>
+
+    <div class="toast hidden" id="toast" role="status" aria-live="polite"></div>
+    <script src="/static/work_order.js"></script>
+  </body>
+</html>