admin/logbuch
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Show Objekte in compact list; narrower columns and shorter date format

Browse Source 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Reinhard X. Fürst
2026-04-28 13:35:21 +02:00
parent e3e5842805
commit 2469715756
2 changed files with 47 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
components/LogbuchList.tsx
View File

@@ -11,10 +11,14 @@ interface Props {
compact?: boolean;
}
function formatDateTime(dt: string): string {
function formatDateTime(dt: string, short = false): string {
if (!dt) return '';
const d = new Date(dt);
if (isNaN(d.getTime())) return dt;
if (short) {
const pad = (n: number) => String(n).padStart(2, '0');
return `${pad(d.getDate())}.${pad(d.getMonth() + 1)}. ${pad(d.getHours())}:${pad(d.getMinutes())}`;
}
return d.toLocaleString('de-DE', { day: '2-digit', month: '2-digit', year: 'numeric', hour: '2-digit', minute: '2-digit' });
}
@@ -30,7 +34,7 @@ export default function LogbuchList({ kuppel, refreshKey, onEdit, limit = 20, co
.then((r) => { if (!r.ok) throw new Error(); return r.json(); })
.then((data) => { setEntries(data); setLoading(false); })
.catch(() => { setError('Fehler beim Laden.'); setLoading(false); });
}, [kuppel, refreshKey]);
}, [kuppel, refreshKey, limit]);
async function confirmDelete(id: number) {
try {
@@ -48,48 +52,55 @@ export default function LogbuchList({ kuppel, refreshKey, onEdit, limit = 20, co
if (error) return <div className="text-red-600 text-sm py-4">{error}</div>;
if (entries.length === 0) return <div className="text-gray-500 text-sm py-4">Keine Einträge vorhanden.</div>;
const cell = compact
? 'px-1.5 py-1 border border-gray-200 text-xs'
: 'px-3 py-2 border border-gray-200';
const head = compact
? 'px-1.5 py-1 border border-gray-300 text-xs font-semibold'
: 'px-3 py-2 border border-gray-300';
return (
<div>
<div className="overflow-x-auto">
<table className="w-full text-sm border-collapse">
<table className="w-full border-collapse" style={{ fontSize: compact ? '0.75rem' : '0.875rem' }}>
<thead>
<tr className="bg-gray-100 text-left">
<th className="px-3 py-2 border border-gray-300 whitespace-nowrap">Beginn</th>
<th className="px-3 py-2 border border-gray-300 whitespace-nowrap">Ende</th>
<th className="px-3 py-2 border border-gray-300">Art</th>
<th className="px-3 py-2 border border-gray-300 text-center">Besucher</th>
<th className="px-3 py-2 border border-gray-300">BEOs</th>
{!compact && <th className="px-3 py-2 border border-gray-300">Objekte</th>}
{!compact && <th className="px-3 py-2 border border-gray-300">Bemerkungen</th>}
<th className="px-3 py-2 border border-gray-300 text-center">Aktionen</th>
<th className={`${head} whitespace-nowrap`}>Beginn</th>
<th className={`${head} whitespace-nowrap`}>Ende</th>
<th className={head}>Art</th>
{!compact && <th className={`${head} text-center`}>Besucher</th>}
<th className={head}>BEOs</th>
<th className={head}>Objekte</th>
{!compact && <th className={head}>Bemerkungen</th>}
<th className={`${head} text-center`}>Aktionen</th>
</tr>
</thead>
<tbody>
{entries.map((e) => (
<tr key={e.ID} className="hover:bg-gray-50">
<td className="px-3 py-2 border border-gray-200 whitespace-nowrap">{formatDateTime(e.Beginn)}</td>
<td className="px-3 py-2 border border-gray-200 whitespace-nowrap">{formatDateTime(e.Ende)}</td>
<td className="px-3 py-2 border border-gray-200">{e.ArtFuehrung}</td>
<td className="px-3 py-2 border border-gray-200 text-center">{e.Besucher}</td>
<td className="px-3 py-2 border border-gray-200">{e.BEOs || '—'}</td>
{!compact && <td className="px-3 py-2 border border-gray-200">{e.Objekte || '—'}</td>}
<td className={`${cell} whitespace-nowrap`}>{formatDateTime(e.Beginn, compact)}</td>
<td className={`${cell} whitespace-nowrap`}>{formatDateTime(e.Ende, compact)}</td>
<td className={cell}>{e.ArtFuehrung}</td>
{!compact && <td className={`${cell} text-center`}>{e.Besucher}</td>}
<td className={cell}>{e.BEOs || '—'}</td>
<td className={cell}>{e.Objekte || '—'}</td>
{!compact && (
<td className="px-3 py-2 border border-gray-200 max-w-xs">
<td className={`${cell} max-w-xs`}>
<span className="line-clamp-2">{e.Bemerkungen || ''}</span>
</td>
)}
<td className="px-3 py-2 border border-gray-200 text-center whitespace-nowrap">
<td className={`${cell} text-center whitespace-nowrap`}>
<button
onClick={() => onEdit(e)}
className="text-blue-600 hover:text-blue-800 mr-3 text-xs font-medium"
className="text-blue-600 hover:text-blue-800 mr-2 font-medium"
>
Bearbeiten
✎
</button>
<button
onClick={() => setDeleteId(e.ID)}
className="text-red-600 hover:text-red-800 text-xs font-medium"
className="text-red-600 hover:text-red-800 font-medium"
>
Löschen
✕
</button>
</td>
</tr>

9
migrate_art.sql
View File

@@ -1,6 +1,8 @@
-- Migration: ArtFuehrung von Langtext auf Kürzel umstellen
-- Erst Daten aktualisieren, dann ENUM ändern
-- Schritt 1: ENUM zu VARCHAR öffnen (nimmt alle Werte an)
ALTER TABLE logbuch MODIFY ArtFuehrung VARCHAR(50) NOT NULL DEFAULT 'RF';
-- Schritt 2: Bestehende Daten umschreiben
UPDATE logbuch SET ArtFuehrung = 'RF' WHERE ArtFuehrung = 'Reguläre Führung';
UPDATE logbuch SET ArtFuehrung = 'SF' WHERE ArtFuehrung = 'Sonderführung';
UPDATE logbuch SET ArtFuehrung = 'BEOS' WHERE ArtFuehrung = 'BEO-Sitzung';
@@ -10,6 +12,5 @@ UPDATE logbuch SET ArtFuehrung = 'Beob' WHERE ArtFuehrung = 'Beobachtung';
UPDATE logbuch SET ArtFuehrung = 'ToT' WHERE ArtFuehrung = 'Tag der offenen Tür';
UPDATE logbuch SET ArtFuehrung = 'Sonst' WHERE ArtFuehrung = 'Sonstiges';
ALTER TABLE logbuch
MODIFY ArtFuehrung ENUM('RF','SF','BEOS','SonF','TD','Beob','ToT','Sonst')
NOT NULL DEFAULT 'RF';
-- Schritt 3: Zurück zu ENUM mit neuen Kürzeln
ALTER TABLE logbuch MODIFY ArtFuehrung ENUM('RF','SF','BEOS','SonF','TD','Beob','ToT','Sonst') NOT NULL DEFAULT 'RF';