feat: Wochentag in der Liste — Version 1.17.0
Unter dem Datum steht der Wochentag des Beginns, in der Hauptliste ausgeschrieben, in der Kompaktliste als Kürzel rechtsbündig neben dem Datum. Damit die Kompaktliste dabei ihre bisherigen Spaltenbreiten behält, nehmen BEOs und Objekte den freien Platz auf (w-1/2); die Datumsspalte bekommt eine feste Breite, Art steht auf whitespace-nowrap, weil eine Prozentbreite alle übrigen Spalten auf ihre Minimalbreite drückt und der Gruppenname dort sonst Wort für Wort umbricht. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -17,6 +17,7 @@ interface Props {
|
||||
const pad = (n: number) => String(n).padStart(2, '0');
|
||||
|
||||
const MONATE = ['Januar','Februar','März','April','Mai','Juni','Juli','August','September','Oktober','November','Dezember'];
|
||||
const WOCHENTAGE = ['Sonntag','Montag','Dienstag','Mittwoch','Donnerstag','Freitag','Samstag'];
|
||||
|
||||
function currentMonth() {
|
||||
const d = new Date();
|
||||
@@ -46,6 +47,15 @@ function formatDate(dt: string, short = false): string {
|
||||
return `${pad(d.getDate())}.${pad(d.getMonth() + 1)}.${d.getFullYear()}`;
|
||||
}
|
||||
|
||||
/** Wochentag zum Datum — in der Kompaktliste auf zwei Buchstaben gekürzt. */
|
||||
function formatWeekday(dt: string, short = false): string {
|
||||
if (!dt) return '';
|
||||
const d = new Date(dt);
|
||||
if (isNaN(d.getTime())) return '';
|
||||
const name = WOCHENTAGE[d.getDay()];
|
||||
return short ? name.slice(0, 2) : name;
|
||||
}
|
||||
|
||||
function formatTime(dt: string): string {
|
||||
if (!dt) return '';
|
||||
const d = new Date(dt);
|
||||
@@ -213,7 +223,9 @@ export default function LogbuchList({ kuppel, refreshKey, onEdit, currentUserKue
|
||||
<table className="w-full border-collapse" style={{ fontSize: compact ? '0.75rem' : '0.875rem' }}>
|
||||
<thead>
|
||||
<tr className="bg-gray-100 text-left">
|
||||
<th className={`${head} whitespace-nowrap`}>Datum</th>
|
||||
{/* Im Kompaktmodus schmal halten — sonst zieht w-full die Spalte auf und der
|
||||
rechtsbündige Wochentag rutscht weit vom Datum weg. */}
|
||||
<th className={`${head} whitespace-nowrap ${compact ? 'w-20' : ''}`}>Datum</th>
|
||||
{compact ? (
|
||||
<>
|
||||
<th className={`${head} whitespace-nowrap`}>Start</th>
|
||||
@@ -222,10 +234,15 @@ export default function LogbuchList({ kuppel, refreshKey, onEdit, currentUserKue
|
||||
) : (
|
||||
<th className={`${head} whitespace-nowrap text-center`}>Zeit</th>
|
||||
)}
|
||||
<th className={head}>Art</th>
|
||||
<th className={`${head} ${compact ? 'whitespace-nowrap' : ''}`}>Art</th>
|
||||
<th className={`${head} text-center w-10`}>Bes.</th>
|
||||
<th className={head}>BEOs</th>
|
||||
<th className={head}>Objekte</th>
|
||||
{/* Im Kompaktmodus nehmen diese beiden den Restplatz auf. Sonst verteilt das
|
||||
Auto-Layout ihn bei dünn gefüllten Zeilen über alle Spalten, und Art und
|
||||
Zeiten werden unnötig breit. Die Prozentangabe drückt die übrigen Spalten
|
||||
auf ihre Minimalbreite — deshalb steht Art dort auf whitespace-nowrap,
|
||||
sonst bricht der Gruppenname dort Wort für Wort um. */}
|
||||
<th className={`${head} ${compact ? 'w-1/2' : ''}`}>BEOs</th>
|
||||
<th className={`${head} ${compact ? 'w-1/2' : ''}`}>Objekte</th>
|
||||
{!compact && <th className={head}>Bemerkungen</th>}
|
||||
{!compact && <th className={head}>Wetter</th>}
|
||||
<th className={`${head} text-center print:hidden`}>Aktionen</th>
|
||||
@@ -240,7 +257,19 @@ export default function LogbuchList({ kuppel, refreshKey, onEdit, currentUserKue
|
||||
</tr>
|
||||
) : displayEntries.map((e) => (
|
||||
<tr key={e.ID} className="hover:bg-gray-50">
|
||||
<td className={`${cell} whitespace-nowrap`}>{formatDate(e.Beginn, compact)}</td>
|
||||
<td className={`${cell} whitespace-nowrap`}>
|
||||
{compact ? (
|
||||
<div className="flex items-baseline justify-between gap-2">
|
||||
<span>{formatDate(e.Beginn, true)}</span>
|
||||
<span className="text-gray-500">{formatWeekday(e.Beginn, true)}</span>
|
||||
</div>
|
||||
) : (
|
||||
<>
|
||||
<div>{formatDate(e.Beginn)}</div>
|
||||
<div className="text-xs text-gray-500">{formatWeekday(e.Beginn)}</div>
|
||||
</>
|
||||
)}
|
||||
</td>
|
||||
{compact ? (
|
||||
<>
|
||||
<td className={`${cell} whitespace-nowrap`}>{formatTime(e.Beginn)}</td>
|
||||
@@ -253,7 +282,7 @@ export default function LogbuchList({ kuppel, refreshKey, onEdit, currentUserKue
|
||||
<div>{formatTime(e.Ende)}</div>
|
||||
</td>
|
||||
)}
|
||||
<td className={cell}>
|
||||
<td className={`${cell} ${compact ? 'whitespace-nowrap' : ''}`}>
|
||||
<div>{e.ArtFuehrung}</div>
|
||||
{e.SonderName && <div className="text-xs text-gray-500">{e.SonderName}</div>}
|
||||
{e.Spende && (
|
||||
|
||||
Reference in New Issue
Block a user