Erste Version: HCRB Spieltag-Kalender und Fahrtplaner

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

private/gruppe.html

@@ -0,0 +1,85 @@
+<!doctype html>
+<html lang="de">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>Gruppe – HCRB</title>
+  <link rel="stylesheet" href="/css/style.css">
+</head>
+<body>
+  <main class="narrow">
+    <div class="card">
+      <h2 id="member-form-title">Mitglied hinzufügen</h2>
+      <form id="member-form">
+        <input type="hidden" id="member-id">
+        <label>Vorname
+          <input type="text" id="member-name" required autocomplete="off" maxlength="50">
+        </label>
+        <label class="inline">
+          <input type="checkbox" id="member-external"> Extern (gehört nicht zur Gruppe, fährt aber manchmal mit)
+        </label>
+        <label class="inline">
+          <input type="checkbox" id="member-hascar"> Hat Auto
+        </label>
+        <label>Fährt am liebsten mit bei
+          <select id="member-rideswith"></select>
+        </label>
+        <div id="member-seats-wrap" hidden>
+          <label>Freie Plätze (ohne Fahrer)
+            <input type="number" id="member-seats" min="1" max="8" value="4">
+          </label>
+          <label class="inline">
+            <input type="checkbox" id="member-always"> Kommt immer mit eigenem Auto
+          </label>
+          <p class="muted">Fährt dann bei jeder Fahrt selbst, auch wenn weniger Autos reichen würden.</p>
+          <label>Standard-Treffpunkt, wenn er/sie fährt
+            <select id="member-point"></select>
+          </label>
+        </div>
+        <div class="row">
+          <button type="submit" class="primary">Speichern</button>
+          <button type="button" id="member-cancel" hidden>Abbrechen</button>
+        </div>
+      </form>
+    </div>
+
+    <div class="card">
+      <h2>Gruppe</h2>
+      <p id="members-empty" class="muted" hidden>Noch keine Mitglieder gespeichert.</p>
+      <ul id="members-list" class="list"></ul>
+    </div>
+
+    <div class="card">
+      <h2 id="point-form-title">Treffpunkt hinzufügen</h2>
+      <form id="point-form">
+        <input type="hidden" id="point-id">
+        <label>Name
+          <input type="text" id="point-name" required autocomplete="off" maxlength="60" placeholder="z. B. Parkplatz Bahnhof">
+        </label>
+        <label>Adresse
+          <input type="text" id="point-address" required autocomplete="off" maxlength="200" placeholder="Straße Nr., PLZ Ort">
+        </label>
+        <div class="row">
+          <button type="submit" class="primary">Speichern</button>
+          <button type="button" id="point-cancel" hidden>Abbrechen</button>
+        </div>
+      </form>
+      <p id="points-empty" class="muted" hidden>Noch keine Treffpunkte gespeichert.</p>
+      <ul id="points-list" class="list"></ul>
+    </div>
+
+    <div class="card">
+      <h2>Daten sichern</h2>
+      <p class="muted">Gruppe als JSON-Datei sichern oder eine gesicherte Datei wieder einspielen (ersetzt die aktuelle Gruppe).</p>
+      <div class="row">
+        <button id="export-btn">Exportieren (JSON)</button>
+        <label class="button">Importieren
+          <input type="file" id="import-file" accept="application/json" hidden>
+        </label>
+      </div>
+    </div>
+  </main>
+
+  <script type="module" src="/js/gruppe.js"></script>
+</body>
+</html>