Web: Spalte "Zuletzt geaendert" in den Produktlisten

Neue sortier- und filterbare Spalte (Datum + Uhrzeit) in Lebensmittel- und
Gegenstaende-Liste, basierend auf Product.updated_at. Nuetzlich, um zuletzt
angelegte/geaenderte Artikel zu finden (z.B. mit fehlender Kategorie). Erscheint
automatisch, laesst sich per Spaltenauswahl aus-/einblenden und umsortieren.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Scarriffle
2026-07-28 11:36:47 +02:00
parent 45031df1f4
commit 31137cd884

View File

@@ -25,6 +25,13 @@ function einheitText(p) {
? `${basis} · ${p.package_label || "Packung"} ${fmt(p.package_size)} ${unitShort(p.base_unit)}` ? `${basis} · ${p.package_label || "Packung"} ${fmt(p.package_size)} ${unitShort(p.base_unit)}`
: basis; : basis;
} }
// „Zuletzt geändert" als Datum + Uhrzeit (zum Sortieren/Filtern).
function fmtDateTime(iso) {
if (!iso) return "";
return new Date(iso).toLocaleString("de-DE", {
day: "2-digit", month: "2-digit", year: "numeric", hour: "2-digit", minute: "2-digit",
});
}
export default function Products({ fixedType = null }) { export default function Products({ fixedType = null }) {
const { isAdmin } = useAuth(); const { isAdmin } = useAuth();
@@ -93,6 +100,10 @@ export default function Products({ fixedType = null }) {
</span> </span>
); );
} }, } },
{ key: "updated", header: "Zuletzt geändert", label: "Zuletzt geändert", width: 170,
sortValue: (p) => (p.updated_at ? new Date(p.updated_at).getTime() : 0),
filterText: (p) => fmtDateTime(p.updated_at),
render: (p) => <span className="muted nowrap">{fmtDateTime(p.updated_at)}</span> },
{ key: "details", header: "", label: "Details", fixed: true, width: 84, align: "num", { key: "details", header: "", label: "Details", fixed: true, width: 84, align: "num",
render: (p) => <Link to={`/products/${p.id}`}>Details</Link> }, render: (p) => <Link to={`/products/${p.id}`}>Details</Link> },
]; ];