v1

2026-06-05 15:39:58 +02:00
commit 96a527c2a5
22 changed files with 4206 additions and 0 deletions
@@ -0,0 +1,168 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>KOTA Admin Panel</title>
+    <script src="https://unpkg.com/htmx.org@2.0.10"></script>
+    <style>
+      body {
+        font-family: system-ui, sans-serif;
+        margin: 0;
+        padding: 0;
+        background: #f5f7fb;
+        color: #111;
+      }
+      .app-shell {
+        max-width: 1200px;
+        margin: 0 auto;
+        padding: 24px;
+      }
+      header {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 12px;
+      }
+      h1 {
+        margin: 0;
+        font-size: 1.8rem;
+      }
+      .alert {
+        padding: 12px 16px;
+        background: #fff;
+        border: 1px solid #dbe2ee;
+        border-radius: 8px;
+        margin-bottom: 18px;
+      }
+      .alert.success {
+        border-color: #a4d4ae;
+        background: #ecf6ed;
+      }
+      .admin-panel-row {
+        display: grid;
+        grid-template-columns: 2fr 1fr;
+        gap: 20px;
+      }
+      section {
+        margin-top: 24px;
+        padding: 18px;
+        background: #fff;
+        border-radius: 14px;
+        border: 1px solid #e3e8f0;
+      }
+      table {
+        width: 100%;
+        border-collapse: collapse;
+      }
+      table th,
+      table td {
+        border-bottom: 1px solid #e3e8f0;
+        padding: 10px;
+        text-align: left;
+      }
+      table th {
+        font-weight: 600;
+      }
+      label {
+        display: block;
+        margin-bottom: 12px;
+      }
+      input,
+      select,
+      textarea {
+        width: 100%;
+        padding: 8px 10px;
+        border: 1px solid #cbd5e1;
+        border-radius: 8px;
+        font: inherit;
+      }
+      button {
+        padding: 10px 16px;
+        border: none;
+        background: #2563eb;
+        color: white;
+        border-radius: 8px;
+        cursor: pointer;
+      }
+      button:hover {
+        background: #1d4ed8;
+      }
+      .admin-panel-card {
+        min-width: 320px;
+      }
+      .control-bar {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 12px;
+        align-items: center;
+        margin-top: 16px;
+      }
+    </style>
+  </head>
+  <body>
+    <div class="app-shell">
+      <header>
+        <div>
+          <h1>KOTA Admin Panel</h1>
+          <p>Use an admin bearer token to manage devices, releases, and OTA logs.</p>
+        </div>
+        <div class="control-bar">
+          <div id="login-button"></div>
+          <span id="token-status">Loading token...</span>
+        </div>
+      </header>
+
+      <div id="admin-messages" class="alert">Use OIDC login to access the admin panel.</div>
+
+      <div hx-get="/admin/html/device-types" hx-trigger="load" hx-swap="innerHTML"></div>
+      <div hx-get="/admin/html/devices" hx-trigger="load, every 5s" hx-swap="innerHTML"></div>
+      <div hx-get="/admin/html/logs" hx-trigger="load, every 5s" hx-swap="innerHTML"></div>
+    </div>
+
+    <script>
+      let adminToken = localStorage.getItem("kotaAdminToken") || "";
+
+      function updateTokenStatus() {
+        const status = document.getElementById("token-status");
+        status.textContent = adminToken ? "Admin token loaded" : "No token configured";
+      }
+
+      document.body.addEventListener("htmx:configRequest", function (event) {
+        if (adminToken) {
+          event.detail.headers["Authorization"] = "Bearer " + adminToken;
+        }
+      });
+
+      document.body.addEventListener("htmx:beforeRequest", function () {
+        updateTokenStatus();
+      });
+
+      window.addEventListener("load", function () {
+        updateTokenStatus();
+        if (!adminToken) {
+          loginWithOidc();
+        }
+        setLoginButton(!!adminToken);
+      });
+
+      function setLoginButton(isLoggedIn) {
+        const loginButton = document.getElementById("login-button");
+        loginButton.outerHTML = isLoggedIn ?
+        `<button id="login-button" type="button" onclick="logout()">Logout</button>` :
+        `<button id="login-button" type="button" onclick="loginWithOidc()">Login with OIDC</button>`;
+      }
+
+      function loginWithOidc() {
+        window.location.href = "/admin/oidc/login?returnUrl=" + encodeURIComponent(window.location.pathname);
+      }
+
+      function logout() {
+        adminToken = "";
+        localStorage.removeItem("kotaAdminToken");
+        updateTokenStatus();
+        window.location.reload();
+      }
+    </script>
+  </body>
+</html>