feat: Druck – kleinere Schrift und chronologische Reihenfolge

Beim Drucken wird die Tabellenschrift auf 0.72rem verkleinert.
Der Drucken-Button lädt vorab alle Einträge des Monats in
aufsteigender Reihenfolge (älteste zuerst) und ruft dann
window.print() auf. API unterstützt jetzt order=asc.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

components/LogbuchList.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { useEffect, useState } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import type { Kuppel, LogbuchEintrag } from '@/types/logbuch';
 
 interface Props {
@@ -58,6 +58,8 @@ export default function LogbuchList({ kuppel, refreshKey, onEdit, limit = 10, co
   const [loading, setLoading] = useState(true);
   const [deleteId, setDeleteId] = useState<number | null>(null);
   const [error, setError] = useState('');
+  const [printEntries, setPrintEntries] = useState<LogbuchEintrag[] | null>(null);
+  const printPending = useRef(false);
 
   useEffect(() => { setPage(0); }, [kuppel, refreshKey, month]);
 
@@ -72,6 +74,27 @@ export default function LogbuchList({ kuppel, refreshKey, onEdit, limit = 10, co
       .catch(() => { setError('Fehler beim Laden.'); setLoading(false); });
   }, [kuppel, refreshKey, limit, page, month]);
 
+  useEffect(() => {
+    function onAfterPrint() { setPrintEntries(null); }
+    window.addEventListener('afterprint', onAfterPrint);
+    return () => window.removeEventListener('afterprint', onAfterPrint);
+  }, []);
+
+  useEffect(() => {
+    if (printPending.current && printEntries !== null) {
+      printPending.current = false;
+      window.print();
+    }
+  }, [printEntries]);
+
+  async function handlePrint() {
+    const url = `/api/logbuch?kuppel=${encodeURIComponent(kuppel)}&limit=500&offset=0` +
+      (month ? `&month=${encodeURIComponent(month)}` : '') + '&order=asc';
+    const data = await fetch(url).then((r) => r.json());
+    printPending.current = true;
+    setPrintEntries(data.entries);
+  }
+
   async function confirmDelete(id: number) {
     try {
       const res = await fetch(`/api/logbuch/${id}`, { method: 'DELETE' });
@@ -129,8 +152,21 @@ export default function LogbuchList({ kuppel, refreshKey, onEdit, limit = 10, co
   if (loading) return <>{monthNav}<div className="text-gray-500 text-sm py-4">Lade Einträge...</div></>;
   if (error)   return <>{monthNav}<div className="text-red-600 text-sm py-4">{error}</div></>;
 
+  const displayEntries = printEntries ?? entries;
+
   return (
     <div>
+      {!compact && (
+        <div className="flex justify-between items-center mb-2 print:hidden">
+          <span className="text-sm font-semibold text-gray-600">Einträge {kuppel}-Kuppel</span>
+          <button
+            onClick={handlePrint}
+            className="text-sm px-3 py-1.5 bg-gray-200 hover:bg-gray-300 text-gray-700 rounded-lg"
+          >
+            🖨 Drucken
+          </button>
+        </div>
+      )}
       {monthNav}
       {printHeader}
       <div className="overflow-x-auto">
@@ -156,13 +192,13 @@ export default function LogbuchList({ kuppel, refreshKey, onEdit, limit = 10, co
             </tr>
           </thead>
           <tbody>
-            {entries.length === 0 ? (
+            {displayEntries.length === 0 ? (
               <tr>
                 <td colSpan={compact ? 7 : 10} className="px-3 py-4 text-gray-500 text-sm text-center">
                   Keine Einträge für {monthLabel(month)}.
                 </td>
               </tr>
-            ) : entries.map((e) => (
+            ) : displayEntries.map((e) => (
               <tr key={e.ID} className="hover:bg-gray-50">
                 <td className={`${cell} whitespace-nowrap`}>{formatDate(e.Beginn, compact)}</td>
                 {compact ? (