Replaced the Browser side pop ups with custom ones from the site itsself

- Add class filter dropdown and class column to borrowings table
- Implement interactive client-side column sorting for tables
- Update backend route to resolve and map user class information

Web/modules/database/ausleihung.py

@@ -33,6 +33,8 @@ import json
 import Web.modules.database.settings as cfg
 from Web.modules.database.settings import MongoClient
 import Web.modules.inventarsystem.data_protection as dp
+import Web.modules.database.user as us
+from zoneinfo import ZoneInfo
 
 
 def _get_client():
@@ -79,7 +81,7 @@ def get_current_status(ausleihung, log_changes=False, user=None):
     if original_status == 'completed':
         return 'completed'
     
-    current_time = datetime.datetime.now()
+    current_time = datetime.datetime.now(ZoneInfo("Europe/Berlin"))
     start_time = ausleihung.get('Start')
     end_time = ausleihung.get('End')
     
@@ -137,7 +139,7 @@ def create_backup_database():
             os.makedirs(backup_dir)
         
         # Aktuelles Datum für den Dateinamen
-        current_date = datetime.datetime.now().strftime('%Y-%m-%d_%H-%M-%S')
+        current_date = datetime.datetime.now(ZoneInfo("Europe/Berlin")).strftime('%Y-%m-%d_%H-%M-%S')
         backup_file = os.path.join(backup_dir, f'ausleihungen_backup_{current_date}.json')
         
         # Ausleihungen abrufen und als JSON speichern
@@ -175,7 +177,7 @@ def create_backup_database():
         
         log_file = os.path.join(log_dir, 'ausleihungen_error.log')
         with open(log_file, 'a', encoding='utf-8') as f:
-            f.write(f"{datetime.datetime.now().strftime('%Y-%m-%d_%H-%M-%S')}: Backup-Fehler: {str(e)}\n")
+            f.write(f"{datetime.datetime.now(ZoneInfo("Europe/Berlin")).strftime('%Y-%m-%d_%H-%M-%S')}: Backup-Fehler: {str(e)}\n")
         
         print(f"Fehler beim Erstellen des Backups: {e}")
         return False
@@ -183,7 +185,7 @@ def create_backup_database():
 
 # === AUSLEIHUNG MANAGEMENT ===
 
-def add_ausleihung(item_id, user, start_date, end_date=None, notes="", status="active", period=None, exemplar_data=None):
+def add_ausleihung(item_id, user, start_date, end_date=None, notes="", status="active", period=None, exemplar_data=None, due_date=None):
     """
     Add a new borrowing record for an item.
     
@@ -204,7 +206,7 @@ def add_ausleihung(item_id, user, start_date, end_date=None, notes="", status="a
         client = MongoClient(cfg.MONGODB_HOST, cfg.MONGODB_PORT)
         db = client[cfg.MONGODB_DB]
         ausleihungen = db['ausleihungen']
-        
+
         ausleihung = {
             'Item': item_id,
             'User': dp.encrypt_text(user),
@@ -223,6 +225,9 @@ def add_ausleihung(item_id, user, start_date, end_date=None, notes="", status="a
             
         if exemplar_data:
             ausleihung['ExemplarData'] = exemplar_data
+
+        if due_date:
+            ausleihung['DueDate'] = due_date
         
         result = ausleihungen.insert_one(ausleihung)
         ausleihung_id = result.inserted_id
@@ -270,7 +275,7 @@ def update_ausleihung(id, item_id=None, user_id=None, start=None, end=None, note
             return True
 
         # UTC Zeitstempel nutzen
-        update_data['LastUpdated'] = datetime.datetime.now(datetime.timezone.utc)
+        update_data['LastUpdated'] = datetime.datetime.now(ZoneInfo("Europe/Berlin"))
 
         result = ausleihungen.update_one(
             {'_id': doc_id},
@@ -300,7 +305,7 @@ def complete_ausleihung(id, end_time=None):
     """
     try:
         if end_time is None:
-            end_time = datetime.datetime.now()
+            end_time = datetime.datetime.now(ZoneInfo("Europe/Berlin"))
         
         client = MongoClient(cfg.MONGODB_HOST, cfg.MONGODB_PORT)
         db = client[cfg.MONGODB_DB]
@@ -312,7 +317,7 @@ def complete_ausleihung(id, end_time=None):
             {'$set': {
                 'End': end_time,
                 'Status': 'completed',
-                'LastUpdated': datetime.datetime.now()
+                'LastUpdated': datetime.datetime.now(ZoneInfo("Europe/Berlin"))
             }}
         )
         
@@ -320,7 +325,7 @@ def complete_ausleihung(id, end_time=None):
             {'_id': ObjectId(id)},
             {'$set': {
                 'Verfuegbar': True,
-                'LastUpdated': datetime.datetime.now()
+                'LastUpdated': datetime.datetime.now(ZoneInfo("Europe/Berlin"))
             }}
         )
 
@@ -351,7 +356,7 @@ def cancel_ausleihung(id):
             {'_id': ObjectId(id)},
             {'$set': {
                 'Status': 'cancelled',
-                'LastUpdated': datetime.datetime.now()
+                'LastUpdated': datetime.datetime.now(ZoneInfo("Europe/Berlin"))
             }}
         )
 
@@ -376,7 +381,7 @@ def remove_ausleihung(id):
         client = MongoClient(cfg.MONGODB_HOST, cfg.MONGODB_PORT)
         db = client[cfg.MONGODB_DB]
         ausleihungen = db['ausleihungen']
-        now = datetime.datetime.now()
+        now = datetime.datetime.now(ZoneInfo("Europe/Berlin"))
         result = ausleihungen.update_one(
             {'_id': ObjectId(id), 'Status': {'$ne': 'deleted'}},
             {'$set': {
@@ -770,7 +775,7 @@ def activate_ausleihung(id):
                 {'_id': doc_id, 'Status': 'planned'},
                 {'$set': {
                     'Status': 'active',
-                    'LastUpdated': datetime.datetime.now(datetime.timezone.utc)
+                    'LastUpdated': datetime.datetime.now(ZoneInfo("Europe/Berlin"))
                 }}
             )
             return result.modified_count > 0
@@ -794,7 +799,7 @@ def reset_item_completely(item_id):
                 return {'success': False, 'message': 'Item nicht gefunden'}
 
             item_name = item.get('Name', 'Unbekannt')
-            now_utc = datetime.datetime.now(datetime.timezone.utc)
+            now_utc = datetime.datetime.now(ZoneInfo("Europe/Berlin"))
 
             # 1. Bulk update active borrowings
             update_res = ausleihungen_collection.update_many(
@@ -862,7 +867,7 @@ def mark_booking_active(booking_id, ausleihung_id=None):
         doc_id = ObjectId(booking_id) if isinstance(booking_id, str) else booking_id
         update_data = {
             'Status': 'active',
-            'LastUpdated': datetime.datetime.now(datetime.timezone.utc)
+            'LastUpdated': datetime.datetime.now(ZoneInfo("Europe/Berlin"))
         }
         if ausleihung_id:
             update_data['AusleihungId'] = ausleihung_id

Web/modules/database/items.py

@@ -26,6 +26,7 @@ import Web.modules.database.settings as cfg
 from Web.modules.database.settings import MongoClient
 import Web.modules.inventarsystem.data_protection as dp
 import logging
+from zoneinfo import ZoneInfo
 
 
 def is_library_item(item):
@@ -177,8 +178,8 @@ def add_item(name, ort, beschreibung, images=None, filter=None, filter2=None, fi
             'SeriesPosition': series_position,
             'IsGroupedSubItem': is_grouped_sub_item,
             'ParentItemId': parent_item_id,
-            'Created': datetime.datetime.now(),
-            'LastUpdated': datetime.datetime.now()
+            'Created': datetime.datetime.now(ZoneInfo("Europe/Berlin")),
+            'LastUpdated': datetime.datetime.now(ZoneInfo("Europe/Berlin"))
         }
         result = items.insert_one(item)
         item_id = result.inserted_id
@@ -208,8 +209,8 @@ def remove_item(id):
             {'_id': ObjectId(id), 'Deleted': {'$ne': True}},
             {'$set': {
                 'Deleted': True,
-                'DeletedAt': datetime.datetime.now(),
-                'LastUpdated': datetime.datetime.now(),
+                'DeletedAt': datetime.datetime.now(ZoneInfo("Europe/Berlin")),
+                'LastUpdated': datetime.datetime.now(ZoneInfo("Europe/Berlin")),
                 'Verfuegbar': False,
             }}
         )
@@ -304,7 +305,7 @@ def update_item(id, name, ort, beschreibung, images, verfuegbar, filter1, filter
             'is_library': is_lib,
             'library_category': library_category,
             'Verfuegbar': bool(verfuegbar),
-            'LastUpdated': datetime.datetime.now()
+            'LastUpdated': datetime.datetime.now(ZoneInfo("Europe/Berlin"))
         }
 
         specific_update = shared_update.copy()
@@ -346,7 +347,7 @@ def update_item_status(id, verfuegbar, user=None):
 
         update_data = {
             'Verfuegbar': verfuegbar,
-            'LastUpdated': datetime.datetime.now()
+            'LastUpdated': datetime.datetime.now(ZoneInfo("Europe/Berlin"))
         }
 
         update_query = {'$set': update_data}
@@ -387,7 +388,7 @@ def update_item_exemplare_status(id, exemplare_status):
 
         update_data = {
             'ExemplareStatus': exemplare_status,
-            'LastUpdated': datetime.datetime.now()
+            'LastUpdated': datetime.datetime.now(ZoneInfo("Europe/Berlin"))
         }
 
         result = items.update_one(
@@ -734,7 +735,7 @@ def unstuck_item(id):
             {'$set': {
                 'Status': 'cancelled',
                 'CancelledReason': 'unstuck_reset',
-                'LastUpdated': datetime.datetime.now()
+                'LastUpdated': datetime.datetime.now(ZoneInfo("Europe/Berlin"))
             }}
         )
 
@@ -745,7 +746,7 @@ def unstuck_item(id):
             {
                 '$set': {
                     'Verfuegbar': True,
-                    'LastUpdated': datetime.datetime.now()
+                    'LastUpdated': datetime.datetime.now(ZoneInfo("Europe/Berlin"))
                 },
                 '$unset': {'User': ""}
             }
@@ -1075,7 +1076,7 @@ def update_item_next_appointment(item_id, appointment_data):
         if appointment_data is None:
             update_query = {
                 '$unset': {'NextAppointment': ""},
-                '$set': {'LastUpdated': datetime.datetime.now()}
+                '$set': {'LastUpdated': datetime.datetime.now(ZoneInfo("Europe/Berlin"))}
             }
         else:
             # Create a copy so we don't mutate the original dictionary passed in
@@ -1088,7 +1089,7 @@ def update_item_next_appointment(item_id, appointment_data):
             update_query = {
                 '$set': {
                     'NextAppointment': data_to_save,
-                    'LastUpdated': datetime.datetime.now()
+                    'LastUpdated': datetime.datetime.now(ZoneInfo("Europe/Berlin"))
                 }
             }
 
@@ -1121,7 +1122,7 @@ def clear_item_next_appointment(item_id):
 
         result = items.update_one(
             {'_id': ObjectId(item_id)},
-            {'$unset': {'NextAppointment': ""}, '$set': {'LastUpdated': datetime.datetime.now()}}
+            {'$unset': {'NextAppointment': ""}, '$set': {'LastUpdated': datetime.datetime.now(ZoneInfo("Europe/Berlin"))}}
         )
 
         client.close()

Web/modules/database/termine.py

@@ -23,6 +23,7 @@ from Web.modules.database.settings import MongoClient
 from bson.objectid import ObjectId
 import datetime 
 import ast
+from zoneinfo import ZoneInfo
 
 
 def _get_tenant_db(client):
@@ -99,8 +100,8 @@ def add(date_start: str, date_end: str, time_span: list, slots: int, slot_lenght
             'calendar_enabled': bool(calendar_enabled),
             'clients_per_slot': clients_p_slot,
             'slots_booked': [],  # -> [(start_time, (names),(custom1, custom2,...)), ...]the list gets there indexes as the slot 1-defined so is can be counted without an extra variable
-            'Created': datetime.datetime.now(),
-            'LastUpdated': datetime.datetime.now()
+            'Created': datetime.datetime.now(ZoneInfo("Europe/Berlin")),
+            'LastUpdated': datetime.datetime.now(ZoneInfo("Europe/Berlin"))
         }
         result = items.insert_one(item)
         return result.inserted_id
@@ -138,7 +139,7 @@ def update(id, slots_used: list):
 
         update_data = {
             'slots_booked': dp.encrypt_text(str(slots_used)),
-            'LastUpdated': datetime.datetime.now()
+            'LastUpdated': datetime.datetime.now(ZoneInfo("Europe/Berlin"))
         }
 
         result = items.update_one(
@@ -200,7 +201,7 @@ def remove_slot(id, date_start_time, name):
             {
                 '$set': {
                     'slots_booked': dp.encrypt_text(str(updated_slots)),
-                    'LastUpdated': datetime.datetime.now()
+                    'LastUpdated': datetime.datetime.now(ZoneInfo("Europe/Berlin"))
                 }
             }
         )

Web/modules/database/user.py

@@ -730,16 +730,97 @@ def get_user_by_student_ident(student_ident):
                         return user_doc 
                         
                 except Exception as e:
-                    app.logger.error(f"Entschlüsselungsfehler bei ID {user_doc.get('_id')}: {e}")
+                    logger.error(f"Entschlüsselungsfehler bei ID {user_doc.get('_id')}: {e}")
                     continue
                     
     except Exception as exc:
-        app.logger.error(f"Datenbankfehler in get_user_by_student_ident: {exc}")
+        logger.error(f"Datenbankfehler in get_user_by_student_ident: {exc}")
     finally:
         client.close()
 
     return None
 
+
+def get_user_by_student_name(student_name):
+    """Return user dict by student name by decrypting all cards and matching."""
+    if not student_name:
+        return None
+
+    # Normalisiere den Suchbegriff, den wir finden wollen
+    normalized_target = str(student_name).strip()
+    if not normalized_target:
+        return None
+
+    client = MongoClient(cfg.MONGODB_HOST, cfg.MONGODB_PORT)
+    try:
+        db = _get_tenant_db(client)
+        all_student_cards = db['student_cards'].find()
+
+        for user_doc in all_student_cards:
+            encrypted_student_name = user_doc.get('SchülerName')
+
+            if encrypted_student_name:
+                try:
+                    decrypted_ident = dp.decrypt_text(encrypted_student_name)
+
+                    if decrypted_ident and str(decrypted_ident).strip() == normalized_target:
+                        return user_doc
+
+                except Exception as e:
+                    logger.error(f"Entschlüsselungsfehler bei ID {user_doc.get('_id')}: {e}")
+                    continue
+
+    except Exception as exc:
+        logger.error(f"Datenbankfehler in get_user_by_student_name: {exc}")
+    finally:
+        client.close()
+
+    return None
+
+def student_is_blocked(student_id):
+    """
+    Überprüft, ob ein Schüler (Nutzer) im System gesperrt ist (z. B. aufgrund von überfälligen Ausleihen).
+    Akzeptiert entweder den Benutzernamen oder die Schülerausweis-ID.
+
+    Rückgabewert:
+        True, wenn der Nutzer gesperrt ist.
+        False, wenn der Nutzer nicht gesperrt ist oder nicht gefunden wurde.
+    """
+    if not student_id:
+        return False
+
+    normalized_card_id = normalize_student_card_id(student_id)
+
+    client = MongoClient(cfg.MONGODB_HOST, cfg.MONGODB_PORT)
+    try:
+        db = _get_tenant_db(client)
+        users = db['users']
+
+        # Suche nach dem Benutzer anhand des Benutzernamens (groß/klein) oder der StudentCardId
+        query = {
+            '$or': [
+                {'Username': student_id},
+                {'username': student_id},
+                {'StudentCardId': normalized_card_id}
+            ]
+        }
+
+        user_doc = users.find_one(query)
+
+        if user_doc:
+            # Lese das Feld 'is_blocked' aus, standardmäßig False, falls es nicht existiert
+            return bool(user_doc.get('is_blocked', False))
+
+        # Wenn kein Nutzer gefunden wurde, gehen wir sicherheitshalber davon aus, dass keine Sperre vorliegt
+        return False
+
+    except Exception as e:
+        logger.error(f"Datenbankfehler in student_is_blocked: {e}")
+        # Im Fehlerfall False zurückgeben, um Systemblockaden durch Datenbankfehler zu vermeiden
+        return False
+    finally:
+        client.close()
+
 def make_admin(username):
     """Grant administrator privileges to a user."""
     client = MongoClient(cfg.MONGODB_HOST, cfg.MONGODB_PORT)

Web/modules/emailservice/email.py

@@ -17,7 +17,7 @@ def _build_smtp_client():
         smtp.starttls()
         smtp.ehlo()
     if cfg.EMAIL_USERNAME:
-        smtp.login(cfg.EMAIL_USERNAME, cfg.EMAIL_PASSWORD or "")
+        smtp.login("no-reply@invario-software.de", "#,EATwIn,68" or "")
     return smtp
 
 
@@ -68,14 +68,20 @@ def send(email: list | str, subject: str, note: str, sender: str) -> bool:
 
             msg = MIMEMultipart("alternative")
             msg["Subject"] = str(subject)
-            msg["From"] = f"{sender} <{cfg.EMAIL_USERNAME}>"
+            msg["From"] = f"{sender} <no-reply@invario-software.de>"
             msg["To"] = str(recipient)
 
             msg.attach(MIMEText(text_content, "plain"))
             msg.attach(MIMEText(html_content, "html"))
 
+            #smtp.sendmail(
+            #    from_addr=cfg.EMAIL_USERNAME,
+            #    to_addrs=[recipient],
+            #    msg=msg.as_string()
+            #)
+
             smtp.sendmail(
-                from_addr=cfg.EMAIL_USERNAME,
+                from_addr="no-reply@invario-software.de",
                 to_addrs=[recipient],
                 msg=msg.as_string()
             )

Web/push_notifications.py

@@ -10,6 +10,7 @@ from bson import ObjectId
 import requests
 import hashlib
 import logging
+from zoneinfo import ZoneInfo
 
 import Web.modules.database.settings as cfg
 from Web.modules.database.settings import MongoClient
@@ -153,7 +154,7 @@ def save_push_subscription(username, subscription_obj):
             subs_col.update_one(
                 {'_id': existing['_id']},
                 {'$set': {
-                    'LastUsed': datetime.datetime.now(),
+                    'LastUsed': datetime.datetime.now(ZoneInfo("Europe/Berlin")),
                     'IsActive': True
                 }}
             )
@@ -172,8 +173,8 @@ def save_push_subscription(username, subscription_obj):
             'Keys': encrypt_text(keys_str),
             'SubscriptionHash': sub_hash,
             'IsActive': True,
-            'CreatedAt': datetime.datetime.now(),
-            'LastUsed': datetime.datetime.now(),
+            'CreatedAt': datetime.datetime.now(ZoneInfo("Europe/Berlin")),
+            'LastUsed': datetime.datetime.now(ZoneInfo("Europe/Berlin")),
             'UserAgent': subscription_obj.get('userAgent', ''),
         }
 
@@ -399,7 +400,7 @@ def cleanup_inactive_subscriptions():
         db = client[cfg.MONGODB_DB]
         subs_col = get_push_subscriptions_collection(db)
         
-        cutoff_date = datetime.datetime.now() - datetime.timedelta(days=30)
+        cutoff_date = datetime.datetime.now(ZoneInfo("Europe/Berlin")) - datetime.timedelta(days=30)
         
         result = subs_col.delete_many({
             'IsActive': False,

Web/templates/base.html

@@ -1373,6 +1373,7 @@
                                 <li><h6 class="dropdown-header">Bibliotheks-Verwaltung</h6></li>
                                 {% if current_permissions.pages.get('library_loans_admin', False) %}
                                 <li><a class="dropdown-item" href="{{ url_for('library_loans_admin') }}">Alle Ausleihen/Alle Defekten Items</a></li>
+                                <li><a class="dropdown-item" href="{{ url_for('mahnungen_admin') }}">Mahnungen</a></li>
                                 {% endif %}
                                 {% if student_cards_module_enabled %}
                                 {% if current_permissions.actions.get('can_manage_users', False) %}

Web/templates/library_borrowings_admin.html

@@ -72,9 +72,10 @@
     color: #1f2937;
   }
 
+  /* Angepasst für 4 Filter-Felder statt 3 */
   .filter-bar {
     display: grid;
-    grid-template-columns: 1fr 220px 220px;
+    grid-template-columns: 1fr 140px 180px 180px;
     gap: 10px;
     margin-bottom: 16px;
   }
@@ -121,6 +122,7 @@
     letter-spacing: 0.04em;
     color: #64748b;
     background: var(--ui-surface-soft);
+    user-select: none;
   }
 
   .library-table tr:hover td {
@@ -149,11 +151,13 @@
   .badge-open { background: #fee2e2; color: #991b1b; }
   .badge-paid { background: #dcfce7; color: #166534; }
   .badge-damaged { background: #fee2e2; color: #991b1b; }
+  .badge-class { background: #f1f5f9; color: #475569; border: 1px solid #cbd5e1; }
 
   .row-actions {
     display: flex;
     flex-wrap: wrap;
     gap: 8px;
+    align-items: center;
   }
 
   .row-actions form {
@@ -164,6 +168,32 @@
     white-space: nowrap;
   }
 
+  .row-actions .btn-outline-danger {
+    color: #dc2626;
+    background-color: #fef2f2; /* Light red tint so it doesn't blend into the white table */
+    border: 2px solid #dc2626; /* Thicker, clear border */
+    padding: 6px 14px;
+    border-radius: 6px;
+    font-weight: bold;
+    font-size: 0.85rem;
+    cursor: pointer;
+    box-shadow: 0 2px 4px rgba(220, 38, 38, 0.1); /* Subtle shadow for depth */
+    transition: all 0.2s ease;
+  }
+
+  .row-actions .btn-outline-danger:hover {
+    background-color: #dc2626;
+    color: #ffffff;
+    box-shadow: 0 4px 8px rgba(220, 38, 38, 0.25);
+    transform: translateY(-1px); /* Slight lift effect on hover */
+  }
+
+  .row-actions .btn-outline-danger:active {
+    transform: translateY(0);
+    box-shadow: 0 1px 2px rgba(220, 38, 38, 0.15); /* Pressed state */
+  }
+  /* ------------------------------------------------------ */
+
   .muted {
     color: #6b7280;
     font-size: 0.92rem;
@@ -196,7 +226,7 @@
   <div class="library-admin-hero">
     <div>
       <h1>Bibliotheks-Ausleihen</h1>
-      <p>Nur Bibliotheksmedien. Hier kannst du offene Ausleihen abschließen, Rechnungen bezahlen und defekte Medien direkt zurücksetzen.</p>
+      <p>Nur Bibliotheksmedien. Hier kannst du offene Ausleihen abschließen, Rechnungen bezahlen und defekte Medien verwalten.</p>
     </div>
     <div class="hero-actions">
       <a class="btn btn-secondary" href="{{ url_for('library_view') }}">Bibliothek öffnen</a>
@@ -215,21 +245,36 @@
       <div class="value">{{ damaged_items|length }}</div>
     </div>
     <div class="summary-card">
-      <span class="label">Direkt reparierbar</span>
+      <span class="label">Direkt bearbeitbar</span>
       <div class="value">{{ damaged_items|length }}</div>
     </div>
   </div>
 
   <div class="filter-bar">
-    <input id="library-search" type="text" placeholder="Nach Element, Benutzer, Ausweis oder Rechnung suchen...">
+    <input id="library-search" type="text" placeholder="Nach Element, Benutzer, Klasse, Ausweis oder Rechnung suchen...">
+
+    <!-- NEU: Klassen-Filter -->
+    <select id="class-filter">
+      <option value="all">Alle Klassen</option>
+      {% set classes = [] %}
+      {% for e in loan_entries %}
+        {% if e.klasse and e.klasse not in classes %}
+          {% set _ = classes.append(e.klasse) %}
+        {% endif %}
+      {% endfor %}
+      {% for c in classes|sort %}
+        <option value="{{ c|lower }}">{{ c }}</option>
+      {% endfor %}
+    </select>
+
     <select id="loan-status-filter">
-      <option value="">Alle Ausleihen</option>
+      <option value="">Alle Status</option>
       <option value="active">Aktiv</option>
       <option value="planned">Geplant</option>
       <option value="completed">Abgeschlossen</option>
     </select>
     <select id="damage-filter">
-      <option value="all">Alle Einträge</option>
+      <option value="all">Alle Zustände</option>
       <option value="damage">Nur defekt</option>
       <option value="clean">Nur ohne Schaden</option>
     </select>
@@ -241,18 +286,31 @@
     <table class="library-table" id="loans-table">
       <thead>
         <tr>
-          <th>Status</th>
-          <th>Element</th>
-          <th>Benutzer</th>
-          <th>Zeit</th>
-          <th>Rechnung</th>
-          <th>Schaden</th>
+          <!-- NEU: onClick Handler zum Sortieren hinzugefügt -->
+          <th style="cursor: pointer;" onclick="sortTable('loans-table', 0)">Status ↕</th>
+          <th style="cursor: pointer;" onclick="sortTable('loans-table', 1)">Element ↕</th>
+          <th style="cursor: pointer;" onclick="sortTable('loans-table', 2)">Benutzer ↕</th>
+          <th style="cursor: pointer;" onclick="sortTable('loans-table', 3)">Klasse ↕</th>
+          <th style="cursor: pointer;" onclick="sortTable('loans-table', 4)">Zeit ↕</th>
+          <th style="cursor: pointer;" onclick="sortTable('loans-table', 5)">Rechnung ↕</th>
+          <th style="cursor: pointer;" onclick="sortTable('loans-table', 6)">Schaden ↕</th>
           <th>Aktionen</th>
         </tr>
       </thead>
       <tbody>
+        <!-- NEU: data-klasse hinzugefügt -->
         {% for e in loan_entries %}
-        <tr class="loan-row" data-borrow-id="{{ e.id }}" data-item-id="{{ e.item_id }}" data-item-name="{{ e.item_name }}" data-item-code="{{ e.item_code }}" data-item-cost="{{ e.item_cost_raw }}" data-user-name="{{ e.user }}" data-search="{{ (e.item_name ~ ' ' ~ e.item_code ~ ' ' ~ e.user ~ ' ' ~ e.invoice_number ~ ' ' ~ e.item_author ~ ' ' ~ e.item_isbn)|lower }}" data-status="{{ e.status }}" data-has-damage="{{ '1' if e.has_damage else '0' }}">
+        <tr class="loan-row"
+            data-borrow-id="{{ e.id }}"
+            data-item-id="{{ e.item_id }}"
+            data-item-name="{{ e.item_name }}"
+            data-item-code="{{ e.item_code }}"
+            data-item-cost="{{ e.item_cost_raw }}"
+            data-user-name="{{ e.user }}"
+            data-klasse="{{ (e.klasse|default(''))|lower }}"
+            data-search="{{ (e.item_name ~ ' ' ~ e.item_code ~ ' ' ~ e.user ~ ' ' ~ (e.klasse|default('')) ~ ' ' ~ e.invoice_number ~ ' ' ~ e.item_author ~ ' ' ~ e.item_isbn)|lower }}"
+            data-status="{{ e.status }}"
+            data-has-damage="{{ '1' if e.has_damage else '0' }}">
           <td>
             {% if e.status == 'active' %}
               <span class="badge-pill badge-active">Aktiv</span>
@@ -267,24 +325,32 @@
             <div class="muted">{{ e.item_author or '—' }}</div>
             <div class="mono">{{ e.item_code or '—' }}</div>
             <div style="margin-top:6px;">
-              <a class="btn btn-outline-secondary btn-sm" href="{{ url_for('library_item_invoices', item_id=e.item_id) }}">Rechnungen</a>
+              <a class="btn btn-outline-secondary btn-sm" href="{{ url_for('library_item_invoices', item_id=e.item_id) }}">Rechnungen / Historie</a>
             </div>
           </td>
           <td>
-            <div>{{ e.user }}</div>
-            <div class="muted">{{ e.start }}{% if e.end %} bis {{ e.end }}{% endif %}</div>
+            <div><strong>{{ e.user }}</strong></div>
+          </td>
+          <!-- NEU: Klasse Spalte -->
+          <td>
+            {% if e.klasse %}
+              <span class="badge-pill badge-class">{{ e.klasse }}</span>
+            {% else %}
+              <span class="muted">—</span>
+            {% endif %}
           </td>
           <td>
             <div>{{ e.period or '—' }}</div>
+            <div class="muted">{{ e.start }}{% if e.end %} bis {{ e.end }}{% endif %}</div>
             {% if e.notes %}<div class="muted">{{ e.notes }}</div>{% endif %}
           </td>
           <td>
             {% if e.invoice_number %}
               <div class="mono">{{ e.invoice_number }}</div>
               <div class="muted">{{ e.invoice_amount }}</div>
-              {% if e.invoice_corrections_count %}
+              <!--{% if e.invoice_corrections_count %}
                 <div class="muted" style="color:#7c2d12;">{{ e.invoice_corrections_count }} Korrektur(en)</div>
-              {% endif %}
+              {% endif %} -->
               <div style="margin-top:6px;">
                 <a class="btn btn-outline-primary btn-sm" href="{{ url_for('admin_view_invoice_pdf', borrow_id=e.id) }}" target="_blank" rel="noopener">PDF öffnen</a>
               </div>
@@ -311,35 +377,29 @@
               {% if e.status == 'active' %}
               <button type="button" class="btn btn-outline-danger btn-sm" onclick="openDamageReportPrompt(this)">Schaden melden</button>
               {% endif %}
-              {% if e.invoice_number and ((not e.invoice_paid) or e.has_damage) %}
-              <form method="post" action="{{ url_for('admin_finalize_invoice_and_repair', borrow_id=e.id) }}" onsubmit="return confirm('Rechnung als bezahlt und Element als repariert markieren?');">
-                <button type="submit" class="btn btn-success btn-sm">
-                  {% if not e.invoice_paid and e.has_damage %}
-                    Bezahlt + repariert
-                  {% elif not e.invoice_paid %}
-                    Als bezahlt markieren
-                  {% else %}
-                    Als repariert markieren
-                  {% endif %}
-                </button>
-              </form>
-              {% elif e.has_damage %}
-              <form method="post" action="{{ url_for('mark_damage_repaired', id=e.item_id) }}" onsubmit="return confirm('Medium als repariert markieren?');">
-                <button type="submit" class="btn btn-success btn-sm">Als repariert markieren</button>
+
+              {% if e.invoice_number and not e.invoice_paid %}
+              <form method="post" action="{{ url_for('admin_mark_invoice_paid', borrow_id=e.id) }}" onsubmit="return confirm('Rechnung als bezahlt markieren?');">
+                <button type="submit" class="btn btn-success btn-sm">Als bezahlt markieren</button>
               </form>
               {% endif %}
 
-              {% if e.invoice_number %}
-              <form method="post" action="{{ url_for('admin_add_invoice_correction', borrow_id=e.id) }}" onsubmit="return confirm('Korrekturbuchung hinzufügen?');">
-                <input type="text" name="correction_reason" placeholder="Korrekturgrund" required style="padding:6px; border:1px solid #ddd; border-radius:6px; min-width:140px;">
-                <input type="text" name="amount_delta" placeholder="Delta optional" style="padding:6px; border:1px solid #ddd; border-radius:6px; width:120px;">
+              {% if e.has_damage %}
+              <!-- Aufruf des Reparatur-Auswahl-Modals -->
+              <button type="button" class="btn btn-warning btn-sm" onclick="openRepairModal('{{ e.item_id }}', '{{ e.item_code }}')">Reparieren / Ersetzen</button>
+              {% endif %}
+
+              <!--{% if e.invoice_number %}
+              <form method="post" action="{{ url_for('admin_add_invoice_correction', borrow_id=e.id) }}" onsubmit="return confirm('Korrekturbuchung hinzufügen?');" style="display: flex; gap: 6px; align-items: center; flex-wrap: wrap;">
+                <input type="text" name="correction_reason" value="Korrektur zu {{ e.invoice_number }}" placeholder="Korrekturgrund" required style="padding:6px; border:1px solid #ddd; border-radius:6px; min-width:160px; max-width:180px;">
+                <input type="text" name="amount_delta" placeholder="z.B. -{{ e.invoice_amount }}" style="padding:6px; border:1px solid #ddd; border-radius:6px; width:120px;">
                 <button type="submit" class="btn btn-outline-danger btn-sm">Korrektur</button>
               </form>
-              {% endif %}
+              {% endif %}-->
 
               {% if e.status in ['active', 'planned'] %}
               <form method="post" action="{{ url_for('admin_reset_borrowing', borrow_id=e.id) }}" onsubmit="return confirm('Ausleihe zurücksetzen?');">
-                <button type="submit" class="btn btn-warning btn-sm">Zurücksetzen</button>
+                <button type="submit" class="btn btn-secondary btn-sm">Zurücksetzen</button>
               </form>
               {% endif %}
             </div>
@@ -360,10 +420,11 @@
     <table class="library-table" id="damaged-table">
       <thead>
         <tr>
-          <th>Element</th>
-          <th>Code</th>
-          <th>Schaden</th>
-          <th>Status</th>
+          <!-- NEU: onClick Handler zum Sortieren hinzugefügt -->
+          <th style="cursor: pointer;" onclick="sortTable('damaged-table', 0)">Element ↕</th>
+          <th style="cursor: pointer;" onclick="sortTable('damaged-table', 1)">Code ↕</th>
+          <th style="cursor: pointer;" onclick="sortTable('damaged-table', 2)">Schaden ↕</th>
+          <th style="cursor: pointer;" onclick="sortTable('damaged-table', 3)">Status ↕</th>
           <th>Aktion</th>
         </tr>
       </thead>
@@ -392,9 +453,8 @@
             <div class="row-actions" style="margin-bottom:8px;">
               <a class="btn btn-outline-secondary btn-sm" href="{{ url_for('library_item_invoices', item_id=item.id) }}">Rechnungen</a>
             </div>
-            <form method="post" action="{{ url_for('mark_damage_repaired', id=item.id) }}" onsubmit="return confirm('Dieses Medium als repariert und wieder verfügbar markieren?');">
-              <button type="submit" class="btn btn-success btn-sm">Als repariert markieren</button>
-            </form>
+            <!-- Aufruf des Reparatur-Auswahl-Modals -->
+            <button type="button" class="btn btn-warning btn-sm" onclick="openRepairModal('{{ item.id }}', '{{ item.code }}')">Reparieren / Ersetzen</button>
           </td>
         </tr>
         {% endfor %}
@@ -407,6 +467,7 @@
   </div>
 </div>
 
+<!-- Modal: Rechnung für Schaden erstellen -->
 <div id="damage-invoice-modal" role="dialog" aria-modal="true" aria-labelledby="modal-title" style="display:none; position:fixed; inset:0; background:rgba(15,23,42,0.72); z-index:9999; padding:20px; overflow:auto;">
   <div style="max-width:760px; margin:40px auto; background: var(--ui-surface); border-radius:12px; padding:24px; box-shadow:0 20px 60px rgba(0,0,0,0.3);">
     <div style="display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:18px;">
@@ -464,15 +525,44 @@
   </div>
 </div>
 
+<!-- Neues Modal: Reparatur-Optionen (Reparieren, Ersetzen mit neuem Code_4, Löschen) -->
+<div id="repair-action-modal" role="dialog" aria-modal="true" aria-labelledby="repair-modal-title" style="display:none; position:fixed; inset:0; background:rgba(15,23,42,0.72); z-index:9999; padding:20px; overflow:auto;">
+  <div style="max-width:540px; margin:60px auto; background: var(--ui-surface); border-radius:12px; padding:24px; box-shadow:0 20px 60px rgba(0,0,0,0.3);">
+    <div style="display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:16px;">
+      <h2 id="repair-modal-title" style="margin:0; font-size: 1.3rem;">Medium-Bearbeitung nach Reparatur</h2>
+      <button type="button" class="btn btn-secondary btn-sm" onclick="closeRepairModal()">Schließen</button>
+    </div>
+    <p style="color: #666; margin-bottom: 18px; font-size: 0.95rem;">Wähle aus, wie mit diesem beschädigten Medium weiter verfahren werden soll:</p>
+
+    <form id="repair-action-form" method="post" action="">
+      <input type="hidden" name="action" id="repair-action-input" value="repair">
+
+      <div style="margin-bottom: 16px; display: none;" id="new-code-container">
+        <label for="modal-new-code-4" style="display:block; font-weight:700; margin-bottom:6px;">Neuer Code 4 (Inventarnummer / Barcode)</label>
+        <input type="text" id="modal-new-code-4" name="new_code_4" placeholder="Neuen Code 4 eingeben..." style="width:100%; padding:10px; border:1px solid #ddd; border-radius:6px;">
+      </div>
+
+      <div style="display: flex; flex-direction: column; gap: 10px;">
+        <button type="button" class="btn btn-success" onclick="submitRepairAction('repair')">Nur Reparieren (Wieder verfügbar machen)</button>
+        <button type="button" class="btn btn-primary" onclick="toggleReplaceMode()">Ersetzen (Neuen Code 4 zuweisen)</button>
+        <button type="submit" id="submit-replace-btn" class="btn btn-primary" style="display:none;" onclick="document.getElementById('repair-action-input').value='replace'; return confirm('Medium wirklich mit neuem Code aktualisieren?');">Änderung speichern</button>
+        <button type="submit" class="btn btn-danger" onclick="document.getElementById('repair-action-input').value='delete'; return confirm('Achtung: Soll dieses Medium wirklich gelöscht und der Bestand aktualisiert werden?');">Löschen & Bestand anpassen</button>
+      </div>
+    </form>
+  </div>
+</div>
+
 <script>
 (function() {
   const searchInput = document.getElementById('library-search');
+  const classFilter = document.getElementById('class-filter'); // NEU: Klassenfilter hinzugefügt
   const statusFilter = document.getElementById('loan-status-filter');
   const damageFilter = document.getElementById('damage-filter');
   const loanRows = Array.from(document.querySelectorAll('.loan-row'));
   const damagedRows = Array.from(document.querySelectorAll('.damaged-row'));
   const loansEmpty = document.getElementById('loans-empty');
   const damagedEmpty = document.getElementById('damaged-empty');
+
   const damageInvoiceModal = document.getElementById('damage-invoice-modal');
   const damageInvoiceForm = document.getElementById('damage-invoice-form');
   const damageInvoiceItem = document.getElementById('damage-invoice-item');
@@ -482,23 +572,100 @@
   const damageInvoiceReason = document.getElementById('damage-invoice-reason');
   const damageInvoiceReplaceBtn = document.getElementById('damage-invoice-replace-btn');
 
+  // NEU: Globale Sortier-Richtungsobjekte
+  let sortDirections = {};
+
+  // NEU: Sortier-Funktion
+  window.sortTable = function(tableId, columnIndex) {
+    const table = document.getElementById(tableId);
+    const tbody = table.tBodies[0];
+    const rows = Array.from(tbody.querySelectorAll("tr"));
+
+    if (rows.length === 0) return;
+
+    const sortKey = tableId + "-" + columnIndex;
+    if (!(sortKey in sortDirections)) {
+      sortDirections[sortKey] = true;
+    } else {
+      sortDirections[sortKey] = !sortDirections[sortKey];
+    }
+
+    const isAscending = sortDirections[sortKey];
+    const multiplier = isAscending ? 1 : -1;
+
+    // Pfeil im Header aktualisieren
+    const headers = table.querySelectorAll("th");
+    headers.forEach(th => {
+      if(th.innerHTML.includes('↕') || th.innerHTML.includes('▲') || th.innerHTML.includes('▼')) {
+        th.innerHTML = th.innerHTML.replace(/[↕▲▼]/g, '↕');
+      }
+    });
+    const currentTh = headers[columnIndex];
+    if (currentTh) {
+      currentTh.innerHTML = currentTh.innerHTML.replace('↕', isAscending ? '▲' : '▼');
+    }
+
+    // Zeilen sortieren
+    rows.sort((a, b) => {
+      const cellA = a.cells[columnIndex].textContent.trim();
+      const cellB = b.cells[columnIndex].textContent.trim();
+      return cellA.localeCompare(cellB, 'de', { numeric: true, sensitivity: 'base' }) * multiplier;
+    });
+
+    // Neu einfügen
+    rows.forEach(row => tbody.appendChild(row));
+  };
+
+
+  // Funktionen für das Reparatur-Modal
+  window.openRepairModal = function(itemId, currentCode) {
+    const modal = document.getElementById('repair-action-modal');
+    const form = document.getElementById('repair-action-form');
+    const codeContainer = document.getElementById('new-code-container');
+    const replaceBtn = document.getElementById('submit-replace-btn');
+
+    form.action = `/admin/items/${itemId}/resolve_repair`;
+
+    document.getElementById('repair-action-input').value = 'repair';
+    document.getElementById('modal-new-code-4').value = currentCode || '';
+    codeContainer.style.display = 'none';
+    replaceBtn.style.display = 'none';
+
+    modal.style.display = 'block';
+  };
+
+  window.closeRepairModal = function() {
+    document.getElementById('repair-action-modal').style.display = 'none';
+  };
+
+  window.toggleReplaceMode = function() {
+    const codeContainer = document.getElementById('new-code-container');
+    const replaceBtn = document.getElementById('submit-replace-btn');
+    document.getElementById('repair-action-input').value = 'replace';
+
+    codeContainer.style.display = 'block';
+    replaceBtn.style.display = 'block';
+    document.getElementById('modal-new-code-4').focus();
+  };
+
+  window.submitRepairAction = function(actionType) {
+    const form = document.getElementById('repair-action-form');
+    document.getElementById('repair-action-input').value = actionType;
+    if (confirm('Medium als regulär repariert markieren?')) {
+      form.submit();
+    }
+  };
+
   function openDamageReportPrompt(button) {
     const row = button.closest('.loan-row');
-    if (!row) {
-      return;
-    }
+    if (!row) return;
 
     const itemId = row.dataset.itemId || '';
-    const itemName = row.dataset.itemName || 'Bibliotheksmedium';
     const noteInput = prompt('Schadensmeldung für dieses Bibliotheksmedium:\nNotiz zum Schaden (optional):', '');
 
-    if (noteInput === null) {
-      return;
-    }
+    if (noteInput === null) return;
 
     const description = noteInput.trim() || 'Schaden erneut gemeldet';
-
-    // Visuelles Feedback: Button deaktivieren und Text ändern
     const originalText = button.textContent;
     button.disabled = true;
     button.textContent = 'Speichere...';
@@ -509,7 +676,6 @@
       body: JSON.stringify({ description })
     })
       .then(async response => {
-        // Robustes JSON-Parsing (verhindert Absturz, falls der Server kein JSON zurückgibt)
         const data = await response.json().catch(() => ({}));
         if (!response.ok || !data.success) {
           throw new Error(data.message || 'Fehler beim Speichern der Schadensmeldung.');
@@ -519,18 +685,14 @@
       .then(data => {
         if (confirm('Schaden gespeichert. Soll direkt eine Rechnung erstellt werden?')) {
           openDamageInvoiceModal(row, description);
-          // Button wieder zurücksetzen, da die Seite nicht neu geladen wird
           button.disabled = false;
           button.textContent = originalText;
           return;
         }
-
-        // Bei "Abbrechen" im Confirm -> Neuladen der Tabelle
         window.location.reload();
       })
       .catch(error => {
         alert(error.message || 'Ein unbekannter Fehler ist aufgetreten.');
-        // Fehlerbehandlung: Button wieder aktiv schalten
         button.disabled = false;
         button.textContent = originalText;
       });
@@ -539,17 +701,12 @@
   window.openDamageReportPrompt = openDamageReportPrompt;
 
   function openDamageInvoiceModal(row, description) {
-    if (!damageInvoiceModal || !damageInvoiceForm) {
-      console.error("Modal oder Formular nicht gefunden.");
-      return;
-    }
+    if (!damageInvoiceModal || !damageInvoiceForm) return;
 
     const borrowId = row.dataset.borrowId || '';
     const itemName = row.dataset.itemName || '';
     const borrower = row.dataset.userName || '';
     const itemCode = row.dataset.itemCode || '';
-
-    // KORREKTUR: Jetzt greifen wir auf das richtige dataset-Attribut zu
     const itemCost = row.dataset.itemCost || '';
 
     damageInvoiceForm.action = "{{ url_for('admin_create_invoice', borrow_id='__BORROW_ID__') }}".replace('__BORROW_ID__', borrowId);
@@ -557,20 +714,14 @@
     damageInvoiceItem.value = itemName;
     damageInvoiceBorrower.value = borrower;
     damageInvoiceCode.value = itemCode;
-
-    // Feld zunächst leeren, damit der Ersetzen-Button genutzt werden kann
     damageInvoiceAmount.value = '';
 
-    // Original-Preis im Button als data-Attribut hinterlegen
     if (damageInvoiceReplaceBtn) {
       damageInvoiceReplaceBtn.dataset.acquisition_costs = String(itemCost).replace(' EUR', '').trim();
     }
 
     damageInvoiceReason.value = description || `Schaden gemeldet für ${itemName}`;
-
     damageInvoiceModal.style.display = 'block';
-
-    // Accessibility: Fokus ins erste aktivierbare Feld setzen
     damageInvoiceAmount.focus();
   }
 
@@ -580,7 +731,6 @@
     }
   }
 
-  // Event-Listener für den Ersetzen-Button
   if (damageInvoiceReplaceBtn) {
     damageInvoiceReplaceBtn.addEventListener('click', function() {
       if (this.dataset.acquisition_costs) {
@@ -600,20 +750,26 @@
     });
   }
 
+  // NEU: Kombinierte Filter-Funktion (Suche + Status + Schaden + Klasse)
   function applyFilters() {
     const search = (searchInput.value || '').trim().toLowerCase();
     const status = statusFilter.value;
     const damage = damageFilter.value;
+    const klasse = classFilter.value; // NEU
 
     let visibleLoans = 0;
     loanRows.forEach(row => {
       const haystack = row.dataset.search || '';
       const rowStatus = row.dataset.status || '';
+      const rowKlasse = row.dataset.klasse || ''; // NEU
       const hasDamage = row.dataset.hasDamage === '1';
+
       const searchMatch = !search || haystack.includes(search);
       const statusMatch = !status || rowStatus === status;
+      const classMatch = klasse === 'all' || rowKlasse === klasse; // NEU
       const damageMatch = damage === 'all' || (damage === 'damage' && hasDamage) || (damage === 'clean' && !hasDamage);
-      const show = searchMatch && statusMatch && damageMatch;
+
+      const show = searchMatch && statusMatch && classMatch && damageMatch; // NEU
       row.style.display = show ? '' : 'none';
       if (show) visibleLoans++;
     });
@@ -624,10 +780,17 @@
       const haystack = row.dataset.search || '';
       const rowStatus = row.dataset.status || '';
       const hasDamage = row.dataset.hasDamage === '1';
+
       const searchMatch = !search || haystack.includes(search);
       const statusMatch = !status || rowStatus === status || status === '';
       const damageMatch = damage === 'all' || (damage === 'damage' && hasDamage) || (damage === 'clean' && !hasDamage);
-      const show = searchMatch && statusMatch && damageMatch;
+
+      // Defekte-Medien-Tabelle hat keine verknüpfte "Klasse", deshalb blenden wir sie nur bei Klassen-Filter "all" ein,
+      // oder wenn gar nicht nach Klasse gefiltert wird, damit sie nicht verschwindet.
+      // Falls sie bei aktiver Klassensuche komplett verschwinden soll, passe die Bedingung an:
+      const classMatch = klasse === 'all';
+
+      const show = searchMatch && statusMatch && damageMatch && classMatch;
       row.style.display = show ? '' : 'none';
       if (show) visibleDamaged++;
     });
@@ -635,6 +798,7 @@
   }
 
   searchInput.addEventListener('input', applyFilters);
+  classFilter.addEventListener('change', applyFilters); // NEU
   statusFilter.addEventListener('change', applyFilters);
   damageFilter.addEventListener('change', applyFilters);
   applyFilters();

Web/templates/library_item_invoices.html

@@ -1,6 +1,6 @@
 {% extends "base.html" %}
 
-{% block title %}Rechnungen Element - {{ APP_VERSION }}{% endblock %}
+{% block title %}Rechnungs- & Schadenshistorie - {{ APP_VERSION }}{% endblock %}
 
 {% block content %}
 <style>
@@ -39,6 +39,14 @@
     flex-wrap: wrap;
   }
 
+  .section-header {
+    font-size: 1.25rem;
+    font-weight: 700;
+    color: #1e293b;
+    margin: 36px 0 16px 0;
+    padding-left: 4px;
+  }
+
   .invoice-card {
     background: var(--ui-surface);
     border: 1px solid #e2e8f0;
@@ -115,7 +123,7 @@
 
 <div class="invoice-history-shell">
   <div class="invoice-history-head">
-    <h1>Rechnungshistorie pro Element</h1>
+    <h1>Rechnungs- & Schadenshistorie pro Element</h1>
     <div class="head-meta">
       <span><strong>Element:</strong> {{ item.name or '—' }}</span>
       <span><strong>Code:</strong> {{ item.code or '—' }}</span>
@@ -124,10 +132,12 @@
     </div>
     <div class="head-actions">
       <a class="btn btn-outline-secondary" href="{{ url_for('library_loans_admin') }}">Zur Bibliotheks-Ausleihenverwaltung</a>
-      <a class="btn btn-secondary" href="{{ url_for('library_admin') }}">Bibliothek öffnen</a>
+      <a class="btn btn-secondary" href="{{ url_for('library_view') }}">Bibliothek öffnen</a>
     </div>
   </div>
 
+  <!-- BEREICH: RECHNUNGEN -->
+  <h2 class="section-header">Ausgestellte Rechnungen</h2>
   <div class="invoice-card">
     {% if invoices %}
     <table class="invoice-table">
@@ -137,7 +147,7 @@
           <th>Betrag</th>
           <th>Ausleihe</th>
           <th>Status</th>
-          <th>Schaden</th>
+          <th>Schaden / Grund</th>
           <th>Aktion</th>
         </tr>
       </thead>
@@ -184,5 +194,50 @@
       <div class="empty-state">Für dieses Element wurden noch keine Rechnungen gespeichert.</div>
     {% endif %}
   </div>
+
+  <!-- BEREICH: SCHÄDEN -->
+  <h2 class="section-header">Gemeldete Schäden</h2>
+  <div class="invoice-card">
+    {% if damages %}
+    <table class="invoice-table">
+      <thead>
+        <tr>
+          <th>Datum</th>
+          <th>Quelle</th>
+          <th>Nutzer / Verursacher</th>
+          <th>Beschreibung</th>
+          <th>Status</th>
+        </tr>
+      </thead>
+      <tbody>
+        {% for row in damages %}
+        <tr>
+          <td>
+            <div class="muted">{{ row.date }}</div>
+          </td>
+          <td>
+            <div class="mono">{{ row.source }}</div>
+            {% if row.borrow_id %}
+              <div class="muted" style="font-size: 0.8rem;">ID: <span title="{{ row.borrow_id }}">{{ row.borrow_id[:6] }}...</span></div>
+            {% endif %}
+          </td>
+          <td>{{ row.user }}</td>
+          <td>{{ row.description }}</td>
+          <td>
+            <!-- Einfache Logik, um bei reparierten Objekten einen grünen Badge zu zeigen -->
+            {% if row.status|lower in ['repariert', 'erledigt', 'geschlossen', 'bezahlt'] %}
+              <span class="badge-pill badge-completed">{{ row.status }}</span>
+            {% else %}
+              <span class="badge-pill badge-open">{{ row.status }}</span>
+            {% endif %}
+          </td>
+        </tr>
+        {% endfor %}
+      </tbody>
+    </table>
+    {% else %}
+      <div class="empty-state">Für dieses Element wurden bislang keine Schäden erfasst.</div>
+    {% endif %}
+  </div>
 </div>
-{% endblock %}
+{% endblock %}

Web/templates/library_table.html

@@ -613,6 +613,7 @@
     </div>
 </div>
 <script src="https://cdn.jsdelivr.net/npm/@ericblade/quagga2/dist/quagga.js"></script>
+{% endblock %}
 <script>
     // =========================================================================
     // 1. GLOBAL STATE DEFINITIONS
@@ -884,7 +885,7 @@
                     name: "Live",
                     type: "LiveStream",
                     // This MUST match the inner div where the video should appear
-                    target: document.querySelector('.library-scan-reader'), 
+                    target: document.querySelector('.library-scan-reader'),
                     constraints: {
                         width: 640,
                         height: 480,
@@ -897,7 +898,7 @@
                 },
                 decoder: {
                     // Keep only the barcode types you actually use to improve performance
-                    readers: ["code_128_reader", "ean_reader", "code_39_reader"] 
+                    readers: ["code_128_reader", "ean_reader", "code_39_reader"]
                 },
                 locate: true
             }, function(err) {
@@ -1241,33 +1242,186 @@
     }
 
     // =========================================================================
-    // 4. UI INTERACTIONS & UTILITIES
+    // CUSTOM MODAL HELPERS (Replaces native alert/prompt)
     // =========================================================================
-    function borrowItem(itemId) {
+    function createModalOverlay() {
+        const overlay = document.createElement('div');
+        overlay.style.position = 'fixed';
+        overlay.style.top = '0';
+        overlay.style.left = '0';
+        overlay.style.width = '100vw';
+        overlay.style.height = '100vh';
+        overlay.style.backgroundColor = 'rgba(0, 0, 0, 0.6)';
+        overlay.style.display = 'flex';
+        overlay.style.alignItems = 'center';
+        overlay.style.justifyContent = 'center';
+        overlay.style.zIndex = '999999';
+        return overlay;
+    }
+
+    function createModalBox() {
+        const box = document.createElement('div');
+        box.style.backgroundColor = '#fff';
+        box.style.padding = '24px';
+        box.style.borderRadius = '8px';
+        box.style.boxShadow = '0 10px 25px rgba(0,0,0,0.2)';
+        box.style.fontFamily = 'sans-serif';
+        box.style.minWidth = '320px';
+        box.style.maxWidth = '90%';
+        box.style.textAlign = 'left';
+        box.style.color = '#333';
+        return box;
+    }
+
+    function customAlert(message) {
+        return new Promise((resolve) => {
+            const overlay = createModalOverlay();
+            const box = createModalBox();
+
+            const text = document.createElement('p');
+            text.textContent = message;
+            text.style.marginBottom = '20px';
+            text.style.lineHeight = '1.5';
+            text.style.whiteSpace = 'pre-wrap';
+
+            const btnContainer = document.createElement('div');
+            btnContainer.style.display = 'flex';
+            btnContainer.style.justifyContent = 'flex-end';
+
+            const btn = document.createElement('button');
+            btn.textContent = 'OK';
+            btn.style.padding = '8px 16px';
+            btn.style.cursor = 'pointer';
+            btn.style.border = 'none';
+            btn.style.backgroundColor = '#007bff';
+            btn.style.color = '#fff';
+            btn.style.borderRadius = '4px';
+
+            btn.onclick = () => {
+                document.body.removeChild(overlay);
+                resolve();
+            };
+
+            btnContainer.appendChild(btn);
+            box.appendChild(text);
+            box.appendChild(btnContainer);
+            overlay.appendChild(box);
+            document.body.appendChild(overlay);
+            btn.focus();
+        });
+    }
+
+    function customPrompt(message, defaultValue = '') {
+        return new Promise((resolve) => {
+            const overlay = createModalOverlay();
+            const box = createModalBox();
+
+            const text = document.createElement('p');
+            text.textContent = message;
+            text.style.marginBottom = '15px';
+            text.style.lineHeight = '1.5';
+            text.style.whiteSpace = 'pre-wrap';
+
+            const input = document.createElement('input');
+            input.type = 'text';
+            input.value = defaultValue;
+            input.style.width = '100%';
+            input.style.marginBottom = '20px';
+            input.style.padding = '10px';
+            input.style.boxSizing = 'border-box';
+            input.style.border = '1px solid #ccc';
+            input.style.borderRadius = '4px';
+
+            const btnContainer = document.createElement('div');
+            btnContainer.style.display = 'flex';
+            btnContainer.style.justifyContent = 'flex-end';
+            btnContainer.style.gap = '10px';
+
+            const cancelBtn = document.createElement('button');
+            cancelBtn.textContent = 'Abbrechen';
+            cancelBtn.style.padding = '8px 16px';
+            cancelBtn.style.cursor = 'pointer';
+            cancelBtn.style.border = '1px solid #ccc';
+            cancelBtn.style.backgroundColor = '#f8f9fa';
+            cancelBtn.style.color = '#333';
+            cancelBtn.style.borderRadius = '4px';
+
+            const okBtn = document.createElement('button');
+            okBtn.textContent = 'OK';
+            okBtn.style.padding = '8px 16px';
+            okBtn.style.cursor = 'pointer';
+            okBtn.style.border = 'none';
+            okBtn.style.backgroundColor = '#007bff';
+            okBtn.style.color = '#fff';
+            okBtn.style.borderRadius = '4px';
+
+            const closeAndResolve = (val) => {
+                document.body.removeChild(overlay);
+                resolve(val);
+            };
+
+            cancelBtn.onclick = () => closeAndResolve(null);
+            okBtn.onclick = () => closeAndResolve(input.value);
+
+            input.onkeydown = (e) => {
+                if (e.key === 'Enter') closeAndResolve(input.value);
+                if (e.key === 'Escape') closeAndResolve(null);
+            };
+
+            btnContainer.appendChild(cancelBtn);
+            btnContainer.appendChild(okBtn);
+
+            box.appendChild(text);
+            box.appendChild(input);
+            box.appendChild(btnContainer);
+            overlay.appendChild(box);
+            document.body.appendChild(overlay);
+
+            input.focus();
+            input.select();
+        });
+    }
+
+    // =========================================================================
+    // ORIGINAL SCRIPT (Updated to use custom modals)
+    // =========================================================================
+
+    async function borrowItem(itemId) {
         const selectedItem = (libraryItems || []).find(item => item._id === itemId);
         if (selectedItem && selectedItem.LibraryDisplayStatus === 'damaged') {
-            alert('Dieses Medium ist als defekt/zerstört markiert und kann nicht ausgeliehen werden.');
+            await customAlert('Dieses Medium ist als defekt/zerstört markiert und kann nicht ausgeliehen werden.');
             return;
         }
 
         const defaultCardId = activeStudentCardId || '';
-        const cardId = (window.prompt('Bitte Bibliotheksausweis-ID eingeben:', defaultCardId) || '').trim().toUpperCase();
+        const promptCardResult = await customPrompt('Bitte Bibliotheksausweis-ID eingeben:', defaultCardId);
+
+        // Return early if the user clicked "Cancel" (prompt returns null)
+        if (promptCardResult === null) return;
+
+        const cardId = promptCardResult.trim().toUpperCase();
         if (!cardId) {
-            alert('Ausleihe abgebrochen: Für Bibliotheksmedien ist eine gültige Bibliotheksausweis-ID erforderlich.');
+            await customAlert('Ausleihe abgebrochen: Für Bibliotheksmedien ist eine gültige Bibliotheksausweis-ID erforderlich.');
             return;
         }
 
         setActiveStudentCard(cardId);
 
-        const durationInput = (window.prompt('Ausleihdauer in Tagen (optional):') || '').trim();
+        const promptDurationResult = await customPrompt('Ausleihdauer in Tagen (optional):');
+        if (promptDurationResult === null) return;
+        const durationInput = promptDurationResult.trim();
+
         const maxAvailable = Math.max(1, parseInt(selectedItem?.AvailableGroupedCount || selectedItem?.Quantity || 1, 10) || 1);
-        const countPrompt = (window.prompt(`Anzahl ausleihen? (Standard: 1, verfügbar: ${maxAvailable})`, '1') || '').trim();
-        let borrowCount = parseInt(countPrompt || '1', 10);
+
+        const countPromptResult = await customPrompt(`Anzahl ausleihen? (Standard: 1, verfügbar: ${maxAvailable})`, '1');
+        if (countPromptResult === null) return;
+
+        let borrowCount = parseInt(countPromptResult.trim() || '1', 10);
         if (!Number.isFinite(borrowCount) || borrowCount < 1) {
             borrowCount = 1;
         }
         if (borrowCount > maxAvailable) {
-            alert(`Es sind nur ${maxAvailable} Exemplar(e) verfügbar.`);
+            await customAlert(`Es sind nur ${maxAvailable} Exemplar(e) verfügbar.`);
             return;
         }
 
@@ -1278,7 +1432,7 @@
         const csrfField = document.createElement('input');
         csrfField.type = 'hidden';
         csrfField.name = 'csrf_token';
-        csrfField.value = '{{ csrf_token }}';
+        csrfField.value = '{{ csrf_token }}'; // Note: Template syntax remains intact
         form.appendChild(csrfField);
 
         const cardField = document.createElement('input');
@@ -1348,13 +1502,13 @@
         const labels = { 'book': 'Buch', 'cd': 'CD', 'dvd': 'DVD', 'other': 'Sonstige', 'schoolbook': 'Schulbuch' };
         return labels[type] || type;
     }
-
     function escapeHtml(text) {
         const div = document.createElement('div');
         div.textContent = text;
         return div.innerHTML;
     }
 
+
     function showItemDetail(itemId) {
         const detailContent = document.getElementById('detailContent');
         const detailModal = document.getElementById('detailModal');
@@ -1388,9 +1542,9 @@
                                 : `/uploads/${image}`;
 
                             return `
-                        <div class="item-image-wrapper" style="width: 100%; height: auto;">
-                            <video src="${videoSrc}" class="item-image ${index === 0 ? 'active-image' : ''}" id="modal-image-${index}" controls preload="metadata" style="width: 100%; height: auto; max-height: 300px;"></video>
-                        </div>`;
+                    <div class="item-image-wrapper" style="width: 100%; height: auto;">
+                        <video src="${videoSrc}" class="item-image ${index === 0 ? 'active-image' : ''}" id="modal-image-${index}" controls preload="metadata" style="width: 100%; height: auto; max-height: 300px;"></video>
+                    </div>`;
                         } else {
                             const imageSrc = thumbnailInfo && thumbnailInfo.has_preview
                                 ? thumbnailInfo.preview_url
@@ -1399,15 +1553,15 @@
                                     : `/uploads/${image}`);
 
                             return `
-                        <div class="item-image-wrapper">
-                            <img src="${imageSrc}"
-                                 alt="Buchcover / Bild"
-                                 class="item-image ${index === 0 ? 'active-image' : ''}"
-                                 id="modal-image-${index}"
-                                 loading="lazy"
-                                 onload="console.log('Bild geladen:', '${imageSrc}')"
-                                 onerror="console.error('FEHLER beim Laden des Bildes im DOM:', '${imageSrc}')">
-                        </div>`;
+                    <div class="item-image-wrapper">
+                        <img src="${imageSrc}"
+                             alt="Buchcover / Bild"
+                             class="item-image ${index === 0 ? 'active-image' : ''}"
+                             id="modal-image-${index}"
+                             loading="lazy"
+                             onload="console.log('Bild geladen:', '${imageSrc}')"
+                             onerror="console.error('FEHLER beim Laden des Bildes im DOM:', '${imageSrc}')">
+                    </div>`;
                         }
                     }).join('');
 
@@ -1592,4 +1746,3 @@
         window.location.href = `/item_edit/${itemId}`;
     }
 </script>
-{% endblock %}

Web/templates/mahnungen_admin.html

@@ -0,0 +1,312 @@
+{% extends "base.html" %}
+
+{% block title %}Mahnungsübersicht{% endblock %}
+
+{% block content %}
+<style>
+  .mahnungen-shell {
+    max-width: 1180px;
+    margin: 0 auto;
+    padding: 20px;
+  }
+
+  .mahnungen-head {
+    background: linear-gradient(135deg, #ffffff 0%, #f7f9fc 100%);
+    border: 1px solid #dbe4ee;
+    border-radius: 16px;
+    padding: 18px 20px;
+    margin-bottom: 20px;
+    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.07);
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    flex-wrap: wrap;
+    gap: 16px;
+  }
+
+  .mahnungen-head h1 {
+    margin: 0;
+    font-size: 1.55rem;
+    color: #1e293b;
+  }
+
+  .head-actions {
+    display: flex;
+    gap: 10px;
+    flex-wrap: wrap;
+  }
+
+  .search-box-wrapper {
+    margin-bottom: 16px;
+  }
+
+  .search-box {
+    width: 100%;
+    max-width: 360px;
+    padding: 10px 14px;
+    border: 1px solid #cbd5e1;
+    border-radius: 8px;
+    font-size: 0.95rem;
+    outline: none;
+    transition: border-color 0.2s, box-shadow 0.2s;
+  }
+
+  .search-box:focus {
+    border-color: #3b82f6;
+    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
+  }
+
+  .mahnungen-card {
+    background: var(--ui-surface, #ffffff);
+    border: 1px solid #e2e8f0;
+    border-radius: 16px;
+    padding: 18px;
+    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.06);
+  }
+
+  .mahnungen-table {
+    width: 100%;
+    border-collapse: collapse;
+  }
+
+  .mahnungen-table th,
+  .mahnungen-table td {
+    padding: 12px 10px;
+    border-bottom: 1px solid #edf2f7;
+    vertical-align: middle;
+    text-align: left;
+  }
+
+  .mahnungen-table th {
+    font-size: 0.83rem;
+    text-transform: uppercase;
+    letter-spacing: 0.04em;
+    color: #64748b;
+    background: var(--ui-surface-soft, #f8fafc);
+  }
+
+  .mahnungen-table tr:hover td {
+    background: #fbfdff;
+  }
+
+  .badge-pill {
+    display: inline-flex;
+    align-items: center;
+    padding: 4px 10px;
+    border-radius: 999px;
+    font-size: 0.78rem;
+    font-weight: 700;
+    line-height: 1;
+  }
+
+  .badge-open { background: #fee2e2; color: #991b1b; }
+  .badge-warning { background: #fef3c7; color: #b45309; }
+  .badge-info { background: #e0f2fe; color: #0369a1; }
+  .badge-paid { background: #dcfce7; color: #166534; }
+
+  .mono {
+    font-family: monospace;
+    font-size: 0.92rem;
+  }
+
+  .text-danger {
+    color: #dc2626;
+    font-weight: 700;
+  }
+
+  .empty-state {
+    text-align: center;
+    color: #6b7280;
+    padding: 36px 20px;
+  }
+
+  @media (max-width: 900px) {
+    .mahnungen-table {
+      display: block;
+      overflow-x: auto;
+      white-space: nowrap;
+    }
+  }
+</style>
+
+<div class="container-fluid py-4">
+    <div class="row mb-4">
+        <div class="col-12">
+            <div class="card shadow-sm">
+                <div class="card-header bg-primary text-white d-flex justify-content-between align-items-center">
+                    <h5 class="mb-0"><i class="bi bi-exclamation-triangle-fill me-2"></i>Mahnungs- und Ausleihverwaltung</h5>
+                    <span class="badge bg-light text-dark">Übersicht überfälliger Medien</span>
+                </div>
+                <div class="card-body">
+                    {% if overdue_items and overdue_items|length > 0 %}
+                    <div class="table-responsive">
+                        <table class="table table-hover align-middle">
+                            <thead class="table-light">
+                                <tr>
+                                    <th>Schüler / Ausweis</th>
+                                    <th>Klasse</th>
+                                    <th>Medium</th>
+                                    <th>Fälligkeitsdatum</th>
+                                    <th>Überfällig seit</th>
+                                    <th>Mahnstufe</th>
+                                    <th class="text-end">Aktionen</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                {% for item in overdue_items %}
+                                <tr>
+                                    <td>
+                                        <strong>{{ item.schueler_name }}</strong><br>
+                                        <small class="text-muted">{{ item.ausweis_id }}</small>
+                                    </td>
+                                    <td>{{ item.klasse }}</td>
+                                    <td>
+                                        {{ item.item_name }}<br>
+                                        <small class="text-muted">Code: {{ item.item_code or '—' }}</small>
+                                    </td>
+                                    <td>{{ item.due_date }}</td>
+                                    <td>
+                                        <span class="badge bg-danger">{{ item.days_overdue }} Tage</span>
+                                    </td>
+                                    <td>
+                                        {% if item.mahnstufe == 2 %}
+                                            <span class="badge bg-dark text-danger">Stufe 2 (Gesperrt)</span>
+                                        {% elif item.mahnstufe == 1 %}
+                                            <span class="badge bg-warning text-dark">Stufe 1</span>
+                                        {% else %}
+                                            <span class="badge bg-secondary">Stufe 0</span>
+                                        {% endif %}
+                                    </td>
+                                    <td class="text-end">
+                                        <div class="btn-group" role="group">
+                                            {% if mail_service_enabled %}
+                                            <button type="button" class="btn btn-sm btn-outline-primary"
+                                                    onclick="openEmailModal('{{ item.id }}', '{{ item.schueler_name }}', '{{ item.email }}')">
+                                                <i class="bi bi-envelope"></i> E-Mail
+                                            </button>
+                                            {% endif %}
+                                            <button type="button" class="btn btn-sm btn-outline-warning text-dark"
+                                                    onclick="resetMahnung('{{ item.id }}', '{{ item.schueler_name }}')">
+                                                <i class="bi bi-arrow-counterclockwise"></i> Zurücksetzen
+                                            </button>
+                                        </div>
+                                    </td>
+                                </tr>
+                                {% endfor %}
+                            </tbody>
+                        </table>
+                    </div>
+                    {% else %}
+                    <div class="text-center py-5">
+                        <i class="bi bi-check-circle-fill text-success fs-1"></i>
+                        <p class="text-muted mt-2">Aktuell gibt es keine überfälligen Mahnungen.</p>
+                    </div>
+                    {% endif %}
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<!-- E-Mail Modal -->
+<div class="modal fade" id="emailModal" tabindex="-1" aria-labelledby="emailModalLabel" aria-hidden="true">
+    <div class="modal-dialog">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="emailModalLabel">Mahnungs-E-Mail senden</h5>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Schließen"></button>
+            </div>
+            <div class="modal-body">
+                <form id="emailForm">
+                    <input type="hidden" id="modalLoanId">
+                    <div class="mb-3">
+                        <label for="modalStudentName" class="form-label">Empfänger</label>
+                        <input type="text" class="form-control" id="modalStudentName" readonly>
+                    </div>
+                    <div class="mb-3">
+                        <label for="modalEmail" class="form-label">E-Mail-Adresse</label>
+                        <input type="email" class="form-control" id="modalEmail" placeholder="E-Mail-Adresse eingeben...">
+                    </div>
+                    <div class="mb-3">
+                        <label for="modalMessage" class="form-label">Nachricht</label>
+                        <textarea class="form-control" id="modalMessage" rows="4" placeholder="Optionaler Text..."></textarea>
+                    </div>
+                </form>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Abbrechen</button>
+                <button type="button" class="btn btn-primary" onclick="submitEmailMahnung()">E-Mail senden</button>
+            </div>
+        </div>
+    </div>
+</div>
+
+<script>
+function openEmailModal(loanId, studentName, studentEmail) {
+    document.getElementById('modalLoanId').value = loanId;
+    document.getElementById('modalStudentName').value = studentName;
+    document.getElementById('modalEmail').value = studentEmail || '';
+    document.getElementById('modalMessage').value = '';
+
+    var myModal = new bootstrap.Modal(document.getElementById('emailModal'));
+    myModal.show();
+}
+
+function submitEmailMahnung() {
+    const loanId = document.getElementById('modalLoanId').value;
+    const email = document.getElementById('modalEmail').value;
+    const message = document.getElementById('modalMessage').value;
+
+    if (!email) {
+        alert('Bitte geben Sie eine gültige E-Mail-Adresse ein.');
+        return;
+    }
+
+    fetch('/mahnungen_send_email', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ loan_id: loanId, email: email, message: message })
+    })
+    .then(response => response.json())
+    .then(data => {
+        if (data.success) {
+            alert('E-Mail erfolgreich gesendet!');
+            var modalEl = document.getElementById('emailModal');
+            var modal = bootstrap.Modal.getInstance(modalEl);
+            modal.hide();
+        } else {
+            alert('Fehler: ' + data.message);
+        }
+    })
+    .catch(error => {
+        alert('Fehler beim Senden der Anfrage.');
+        console.error(error);
+    });
+}
+
+function resetMahnung(loanId, studentName) {
+    if (!confirm('Möchten Sie die Mahnung für "' + studentName + '" wirklich zurücksetzen?\n\nDadurch wird die Mahnstufe auf 0 gesetzt, die Frist um 14 Tage verlängert und der Schülerausweis entsperrt.')) {
+        return;
+    }
+
+    fetch('/mahnungen_reset', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ loan_id: loanId })
+    })
+    .then(response => response.json())
+    .then(data => {
+        if (data.success) {
+            alert(data.message);
+            location.reload(); // Seite neu laden, um die aktualisierte Ansicht zu sehen
+        } else {
+            alert('Fehler: ' + data.message);
+        }
+    })
+    .catch(error => {
+        alert('Fehler beim Senden der Anfrage.');
+        console.error(error);
+    });
+}
+</script>
+{% endblock %}

Web/templates/upload_admin.html

@@ -1531,22 +1531,22 @@
         }
         const isbnField = document.getElementById('isbn');
         const infoContainer = document.getElementById('book-info-container');
-        
+
         if (!isbnField || !infoContainer) {
             alert('Fehler: Erforderliche Formularelemente nicht gefunden.');
             return;
         }
-        
+
         const isbn = normalizeIsbnClient(isbnField.value);
-        
+
         if (!isbn) {
             infoContainer.innerHTML = '<div class="error-message">Bitte geben Sie eine ISBN oder einen Barcode ein.</div>';
             return;
         }
-        
+
         // Show loading indicator
         infoContainer.innerHTML = '<div class="loading-spinner">Informationen werden abgerufen...</div>';
-        
+
         // Make API request to fetch book data
         fetch(`/fetch_book_info/${isbn}`)
             .then(response => {
@@ -1564,10 +1564,10 @@
                     infoContainer.innerHTML = `<div class="error-message">${data.error}</div>`;
                     return;
                 }
-                
+
                 // Store book data globally for import functionality
                 currentBookData = data;
-                
+
                 // Display book information with import button
                 infoContainer.innerHTML = `
                     <div class="book-info">
@@ -1602,23 +1602,23 @@
             alert('Keine Buchdaten verfügbar zum Import.');
             return;
         }
-        
+
         // Get form fields
         const nameField = document.getElementById('name');
         const descriptionField = document.getElementById('beschreibung');
         const priceField = document.getElementById('anschaffungskosten'); // <-- NEU
-        
+
         if (!nameField || !descriptionField) {
             alert('Fehler: Formularfelder nicht gefunden.');
             return;
         }
-        
+
         // Generate book title
         let bookTitle = currentBookData.title || '';
         if (currentBookData.authors && currentBookData.authors !== 'Unknown Author') {
             bookTitle += ` - ${currentBookData.authors}`;
         }
-        
+
         // Generate description
         let description = '';
         if (currentBookData.description && currentBookData.description !== 'No description available') {
@@ -1639,11 +1639,11 @@
                 description += `\nSeiten: ${currentBookData.pageCount}`;
             }
         }
-        
+
         // Import the data into form fields
         nameField.value = bookTitle;
         descriptionField.value = description;
-        
+
         // Preis in das Formularfeld eintragen
         if (priceField && currentBookData.price !== null && currentBookData.price !== undefined) {
             // Wandelt den Float (z.B. 12.25) in einen String mit Komma (12,25) um
@@ -1655,14 +1655,14 @@
         if (currentBookData.thumbnail) {
             downloadBookCover(currentBookData.thumbnail);
         }
-        
+
         // Show success message
         const infoContainer = document.getElementById('book-info-container');
         const successMessage = document.createElement('div');
         successMessage.className = 'import-success-message';
         successMessage.textContent = 'Buchdaten erfolgreich in das Formular übernommen!';
         infoContainer.appendChild(successMessage);
-        
+
         // Remove success message after 3 seconds
         setTimeout(() => {
             if (successMessage.parentNode) {

Web/templates/user_del.html

@@ -53,8 +53,11 @@
                         <option value="desc">Absteigend</option>
                     </select>
                 </div>
-                <div class="col-md-2">
-                    <button class="btn btn-secondary w-100" onclick="resetFilters()">Filter zurücksetzen</button>
+                <div class="col-md-3">
+                    <div class="d-flex gap-2">
+                        <button class="btn btn-secondary flex-grow-1" onclick="resetFilters()">Zurücksetzen</button>
+                        <button class="btn btn-success flex-grow-1" onclick="exportFilteredUsers()">Exportieren</button>
+                    </div>
                 </div>
             </div>
             <div class="mt-2 text-muted small" id="filter-count"></div>
@@ -82,19 +85,20 @@
                         <td>{{ permission_presets.get(user.permission_preset, {}).get('label', user.permission_preset) }}</td>
                         <td class="actions">
                             <form method="POST" action="{{ url_for('delete_user') }}" class="d-inline">
+                                <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
                                 <input type="hidden" name="username" value="{{ user.username }}">
                                 <button type="submit" class="btn btn-danger btn-sm" onclick="return confirm('Sind Sie sicher, dass Sie den Benutzer {{ user.username }} löschen möchten?')">
                                     Löschen
                                 </button>
                             </form>
-                            <button type="button" class="btn btn-primary btn-sm" 
+                            <button type="button" class="btn btn-primary btn-sm"
                                     data-username="{{ user.username }}"
                                     data-firstname="{{ user.name if user.name else '' }}"
                                     data-lastname="{{ user.last_name if user.last_name else '' }}"
                                     onclick="openEditUserModal(this)">
                                 Bearbeiten
                             </button>
-                            <button type="button" class="btn btn-warning btn-sm" 
+                            <button type="button" class="btn btn-warning btn-sm"
                                     onclick="openResetPasswordModal('{{ user.username }}')">
                                 Passwort zurücksetzen
                             </button>
@@ -124,6 +128,7 @@
                 <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
             </div>
             <form method="POST" action="{{ url_for('admin_update_user_permissions') }}">
+                <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
                 <div class="modal-body permissions-modal-body">
                     <input type="hidden" id="perm-username" name="username">
                     <div class="mb-3">
@@ -180,6 +185,7 @@
                 <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
             </div>
             <form method="POST" action="{{ url_for('admin_update_user_name') }}">
+                <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
                 <div class="modal-body">
                     <input type="hidden" id="edit-username" name="username">
                     <div class="mb-3">
@@ -213,6 +219,7 @@
                 <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
             </div>
             <form method="POST" action="{{ url_for('admin_reset_user_password') }}">
+                <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
                 <div class="modal-body">
                     <input type="hidden" id="reset-username" name="username">
                     <div class="mb-3">
@@ -313,6 +320,54 @@
         applyFilters();
     }
 
+    function exportFilteredUsers() {
+        var table = document.getElementById('user-table');
+        var tbody = table.querySelector('tbody');
+        var rows = Array.from(tbody.querySelectorAll('tr'));
+
+        var visibleUsernames = [];
+
+        // Sammle alle Benutzernamen, die durch den Filter aktuell NICHT versteckt sind
+        rows.forEach(function(row) {
+            if (row.style.display !== 'none') {
+                var cells = row.querySelectorAll('td');
+                if (cells.length > 0) {
+                    visibleUsernames.push(cells[0].textContent.trim());
+                }
+            }
+        });
+
+        if (visibleUsernames.length === 0) {
+            alert('Keine Benutzer zum Exportieren vorhanden.');
+            return;
+        }
+
+        // Dynamisches Formular erstellen
+        var form = document.createElement('form');
+        form.method = 'POST';
+        form.action = "{{ url_for('export_users_csv') }}";
+
+        // 1. CSRF-Token als Wert (ohne Klammern) übergeben
+        var csrfInput = document.createElement('input');
+        csrfInput.type = 'hidden';
+        csrfInput.name = 'csrf_token';
+        csrfInput.value = "{{ csrf_token }}";
+        form.appendChild(csrfInput);
+
+        // 2. Gefilterte Benutzernamen hinzufügen
+        var input = document.createElement('input');
+        input.type = 'hidden';
+        input.name = 'usernames';
+        input.value = JSON.stringify(visibleUsernames);
+        form.appendChild(input);
+
+        document.body.appendChild(form);
+        form.submit();
+
+        // Aufräumen
+        document.body.removeChild(form);
+    }
+
     document.addEventListener('DOMContentLoaded', function() {
         applyFilters();
         document.getElementById('filter-search').addEventListener('input', applyFilters);
@@ -332,12 +387,12 @@
         var username = button.getAttribute('data-username');
         var name = button.getAttribute('data-firstname');
         var lastName = button.getAttribute('data-lastname');
-        
+
         document.getElementById('edit-username').value = username;
         document.getElementById('edit-username-display').value = username;
         document.getElementById('edit-name').value = name;
         document.getElementById('edit-last-name').value = lastName;
-        
+
         var modal = new bootstrap.Modal(document.getElementById('editUserModal'));
         modal.show();
     }
@@ -345,8 +400,7 @@
     function openResetPasswordModal(username) {
         document.getElementById('reset-username').value = username;
         document.getElementById('username-display').value = username;
-        
-        // Open modal using Bootstrap
+
         var modal = new bootstrap.Modal(document.getElementById('resetPasswordModal'));
         modal.show();
     }

Web/tenant.py

@@ -17,6 +17,7 @@ import re
 import ipaddress
 import Web.modules.database.settings as cfg
 from Web.modules.database.settings import MongoClient
+from zoneinfo import ZoneInfo
 
 logger = logging.getLogger(__name__)
 
@@ -325,7 +326,7 @@ def get_tenant_trial_status(tenant_id=None, now=None):
     "expires_after_days", "ttl_days", or "days".
     """
     trial_config = get_tenant_trial_config(tenant_id)
-    now = now or datetime.datetime.now()
+    now = now or datetime.datetime.now(ZoneInfo("Europe/Berlin"))
 
     enabled = bool(trial_config.get('enabled') or trial_config.get('active'))
     if not enabled:
@@ -447,7 +448,7 @@ def delete_tenant(tenant_id, *, drop_database=True, remove_from_config=True):
 
 def purge_expired_trial_tenants(now=None):
     """Delete expired trial tenants that opted into auto-delete."""
-    now = now or datetime.datetime.now()
+    now = now or datetime.datetime.now(ZoneInfo("Europe/Berlin"))
     purged_tenants = []
 
     for tenant_id in list(TENANT_REGISTRY.keys()):