From 9fe495a36352afb8d715d3282d421855ab1f7f95 Mon Sep 17 00:00:00 2001
From: mivanchenko <rogalik.gh@gmail.com>
Date: Sat, 12 Sep 2026 02:33:18 +0200
Subject: [PATCH] Owner agenda: hide cancelled bookings by default, with a
 toggle

Cancelled bookings previously stayed visible (struck-through) in the
week view permanently, cluttering it over time. Adds a "Stornierte
anzeigen" checkbox next to the Filiale toggles -- unchecked by default
so cancelled rows are hidden, checkable to bring them back for
history/audit purposes. Client-side filter, remembered via
localStorage like the Filiale toggle.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 backoffice/app/templates/owner/agenda.html | 33 ++++++++++++++++------
 1 file changed, 24 insertions(+), 9 deletions(-)
diff --git a/backoffice/app/templates/owner/agenda.html b/backoffice/app/templates/owner/agenda.html
index b2acb15..21acc64 100644
--- a/backoffice/app/templates/owner/agenda.html
+++ b/backoffice/app/templates/owner/agenda.html
@@ -55,14 +55,15 @@
 <body>
   <h1>{{ client.business_name if client else 'Kalender' }}</h1>
 
-  {% if resources|length > 1 %}
   <div class="filiale-filter" id="filialeFilter">
+    {% if resources|length > 1 %}
     <p class="flabel">Filialen:</p>
     {% for r in resources %}
     <label><input type="checkbox" class="res-toggle" value="{{ r.resource_id }}" checked> {{ r.name }}</label>
     {% endfor %}
+    {% endif %}
+    <label><input type="checkbox" id="showCancelled"> Stornierte anzeigen</label>
   </div>
-  {% endif %}
 
   {% if error == "missing_fields" %}
     <div class="error">Bitte alle Felder ausfüllen.</div>
@@ -122,7 +123,7 @@
       {% endfor %}
       </tbody>
     </table>
-    <p class="day-no-match">Keine Buchungen für die ausgewählten Filialen.</p>
+    <p class="day-no-match">Keine Buchungen für die aktuelle Filter-Auswahl.</p>
     {% endif %}
   </div>
   {% endfor %}
@@ -168,25 +169,37 @@
   <p class="muted" style="margin-top:20px;"><a href="{{ url_for('owner_auth.dashboard') }}">Zurück</a></p>
 
   <script>
-    // Per-Filiale show/hide (#toggle both/either), remembered across
+    // Per-Filiale show/hide + hide-cancelled-by-default, remembered across
     // week navigation via localStorage since each week is a full page load.
     (function () {
-      var STORAGE_KEY = 'ownerAgendaFilialeFilter';
+      var RES_KEY = 'ownerAgendaFilialeFilter';
+      var CANCELLED_KEY = 'ownerAgendaShowCancelled';
       var checkboxes = document.querySelectorAll('.res-toggle');
-      if (!checkboxes.length) return;
+      var showCancelledCb = document.getElementById('showCancelled');
+      if (!checkboxes.length && !showCancelledCb) return;
 
       try {
-        var saved = JSON.parse(localStorage.getItem(STORAGE_KEY) || 'null');
+        var saved = JSON.parse(localStorage.getItem(RES_KEY) || 'null');
         if (saved && saved.length) {
           checkboxes.forEach(function (cb) { cb.checked = saved.indexOf(cb.value) !== -1; });
         }
       } catch (e) {}
 
+      try {
+        if (showCancelledCb) {
+          showCancelledCb.checked = localStorage.getItem(CANCELLED_KEY) === '1';
+        }
+      } catch (e) {}
+
       function applyFilter() {
         var active = [];
         checkboxes.forEach(function (cb) { if (cb.checked) active.push(cb.value); });
+        var showCancelled = !!(showCancelledCb && showCancelledCb.checked);
+
         document.querySelectorAll('table tbody tr[data-resource]').forEach(function (tr) {
-          tr.classList.toggle('res-hidden', active.indexOf(tr.getAttribute('data-resource')) === -1);
+          var resOk = !checkboxes.length || active.indexOf(tr.getAttribute('data-resource')) !== -1;
+          var statusOk = showCancelled || !tr.classList.contains('status-cancelled');
+          tr.classList.toggle('res-hidden', !(resOk && statusOk));
         });
         document.querySelectorAll('.day').forEach(function (dayEl) {
           var table = dayEl.querySelector('table');
@@ -198,10 +211,12 @@
           table.style.display = anyVisible ? '' : 'none';
           if (noMatch) noMatch.style.display = anyVisible ? 'none' : 'block';
         });
-        try { localStorage.setItem(STORAGE_KEY, JSON.stringify(active)); } catch (e) {}
+        try { localStorage.setItem(RES_KEY, JSON.stringify(active)); } catch (e) {}
+        try { localStorage.setItem(CANCELLED_KEY, showCancelled ? '1' : '0'); } catch (e) {}
       }
 
       checkboxes.forEach(function (cb) { cb.addEventListener('change', applyFilter); });
+      if (showCancelledCb) showCancelledCb.addEventListener('change', applyFilter);
       applyFilter();
     })();
   </script>
