From 9a7f1008552fc654ae8468c24c38ba7d0043a9ab Mon Sep 17 00:00:00 2001
From: rene <mail@motocamp.de>
Date: Fri, 15 May 2026 12:06:14 +0200
Subject: [PATCH] Legal: Widerrufs-Checkbox im Upgrade-Modal + AGB-Abschnitt in
 Datenschutz
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Upgrade-Modal: Checkbox §356 Abs.4 BGB muss aktiv bestätigt werden,
  "Anfrage senden" bleibt bis dahin deaktiviert
- Akzeptanz-Zeitstempel wird mit der upgradeRequest-Message mitgeschickt
- datenschutz.js: neuer Abschnitt "Abonnement & Kündigung" mit Laufzeit,
  Verlängerung, Zahlung, Kündigung, Erstattung und Widerrufsrecht
---
 backend/static/js/pages/datenschutz.js | 30 ++++++++++++++++++++++++++
 backend/static/js/pages/settings.js    | 22 ++++++++++++++++++-
 2 files changed, 51 insertions(+), 1 deletion(-)

diff --git a/backend/static/js/pages/datenschutz.js b/backend/static/js/pages/datenschutz.js
index 425536f..368010c 100644
--- a/backend/static/js/pages/datenschutz.js
+++ b/backend/static/js/pages/datenschutz.js
@@ -238,6 +238,36 @@ window.Page_datenschutz = (() => {
                style="${S.a}">www.lda.bayern.de</a>
           </p>`)}
 
+        ${sec('Abonnement &amp; Kündigung', `
+          <p style="${S.p}">
+            Ban Yaro Pro und das Züchter-Paket sind Jahresabonnements mit einer Laufzeit von
+            12 Monaten ab Freischaltung.
+          </p>
+          <p style="${S.p};margin-top:var(--space-3)">
+            <strong>Laufzeit &amp; Verlängerung:</strong> Das Abonnement läuft 12 Monate ab dem
+            Tag der Freischaltung. Nach Ablauf verlängert es sich auf unbestimmte Zeit mit einer
+            Kündigungsfrist von einem Monat zum Monatsende, sofern nicht vorher gekündigt wird
+            (§&nbsp;309 Nr.&nbsp;9 BGB).
+          </p>
+          <p style="${S.p};margin-top:var(--space-3)">
+            <strong>Zahlung:</strong> Der Jahresbeitrag (29&nbsp;EUR für Pro, 49&nbsp;EUR für
+            Züchter) wird einmalig für die gesamte Laufzeit im Voraus fällig.
+          </p>
+          <p style="${S.p};margin-top:var(--space-3)">
+            <strong>Kündigung:</strong> Die Kündigung kann jederzeit in den Einstellungen der App
+            erfolgen. Der Zugang bleibt bis zum Ende der bezahlten Laufzeit erhalten.
+          </p>
+          <p style="${S.p};margin-top:var(--space-3)">
+            <strong>Erstattung:</strong> Bei vorzeitiger Kündigung durch den Nutzer erfolgt keine
+            anteilige Rückerstattung des Jahresbeitrags. Der Zugang bleibt bis zum Ende der
+            bezahlten Laufzeit vollständig bestehen.
+          </p>
+          <p style="${S.p};margin-top:var(--space-3)">
+            <strong>Widerrufsrecht:</strong> Da die Nutzung sofort nach Freischaltung beginnt und
+            der Nutzer dem ausdrücklich zustimmt, erlischt das 14-tägige Widerrufsrecht gemäß
+            §&nbsp;356 Abs.&nbsp;4 BGB mit Beginn der Nutzung.
+          </p>`)}
+
         ${sec('Speicherdauer', `
           <p style="${S.p}">
             Deine Daten werden vollständig gelöscht, sobald du deinen Account löschst —
diff --git a/backend/static/js/pages/settings.js b/backend/static/js/pages/settings.js
index 3cc8ac9..2cb9b49 100644
--- a/backend/static/js/pages/settings.js
+++ b/backend/static/js/pages/settings.js
@@ -313,6 +313,18 @@ window.Page_settings = (() => {
                       font-size:var(--text-xs);color:#c05000;line-height:1.6;margin-top:var(--space-2)">
             💡 Tipp: Trag deine <strong>Rechnungsadresse</strong> im Profil ein — dann können wir die Rechnung vollständig ausstellen.
           </div>` : ''}
+          <div style="margin-top:var(--space-3);padding:var(--space-3);border-radius:var(--radius-md);
+                      background:var(--c-surface-raised,rgba(0,0,0,.04));">
+            <label style="display:flex;align-items:flex-start;gap:var(--space-2);cursor:pointer;
+                          font-size:var(--text-xs);color:var(--c-text-secondary);line-height:1.5">
+              <input type="checkbox" id="widerruf-checkbox"
+                     style="margin-top:2px;flex-shrink:0;accent-color:${color}">
+              <span>
+                Ich stimme zu, dass mein Zugang sofort nach Freischaltung beginnt, und bestätige,
+                dass ich damit mein 14-tägiges Widerrufsrecht verliere (§&nbsp;356 Abs.&nbsp;4 BGB).
+              </span>
+            </label>
+          </div>
           ${breederForm}
         </div>`,
       footer: `
@@ -330,6 +342,13 @@ window.Page_settings = (() => {
         </button>`
     });
 
+    const widerrufBox = document.getElementById('widerruf-checkbox');
+    const sendBtn = document.getElementById('upgrade-request-send-btn');
+    if (sendBtn) sendBtn.disabled = true;
+    widerrufBox?.addEventListener('change', () => {
+      if (sendBtn) sendBtn.disabled = !widerrufBox.checked;
+    });
+
     document.getElementById('upgrade-request-send-btn')?.addEventListener('click', async () => {
       const btn = document.getElementById('upgrade-request-send-btn');
       if (!btn) return;
@@ -363,7 +382,8 @@ window.Page_settings = (() => {
       }
 
       try {
-        const res = await API.auth.upgradeRequest(tier);
+        const widerrufAt = new Date().toLocaleString('de-DE');
+        const res = await API.auth.upgradeRequest(tier, `[Widerrufsrecht akzeptiert am ${widerrufAt}]`);
         UI.modal.close();
         if (res.already) {
           UI.toast.info('Deine Anfrage liegt bereits vor — wir melden uns bald.');