feat(persoenliche-ausruestung): show catalog category, remove size/date columns, make zustand admin-configurable

This commit is contained in:
Matthias Hochmeister
2026-04-16 08:19:38 +02:00
parent dac0b79b3b
commit 058ee721e8
14 changed files with 282 additions and 96 deletions

View File

@@ -12,8 +12,7 @@ import { PageHeader } from '../components/templates';
import { usePermissionContext } from '../contexts/PermissionContext';
import { useNotification } from '../contexts/NotificationContext';
import { personalEquipmentApi } from '../services/personalEquipment';
import { ZUSTAND_LABELS, ZUSTAND_COLORS } from '../types/personalEquipment.types';
import type { PersoenlicheAusruestungZustand } from '../types/personalEquipment.types';
import type { ZustandOption } from '../types/personalEquipment.types';
export default function PersoenlicheAusruestungDetail() {
const { id } = useParams<{ id: string }>();
@@ -30,6 +29,15 @@ export default function PersoenlicheAusruestungDetail() {
enabled: !!id,
});
const { data: zustandOptions = [] } = useQuery<ZustandOption[]>({
queryKey: ['persoenliche-ausruestung', 'zustand-options'],
queryFn: () => personalEquipmentApi.getZustandOptions(),
staleTime: 5 * 60 * 1000,
});
const getZustandLabel = (key: string) => zustandOptions.find(o => o.key === key)?.label ?? key;
const getZustandColor = (key: string) => zustandOptions.find(o => o.key === key)?.color ?? 'default';
const canEdit = hasPermission('persoenliche_ausruestung:edit');
const canDelete = hasPermission('persoenliche_ausruestung:delete');
@@ -61,14 +69,14 @@ export default function PersoenlicheAusruestungDetail() {
<PageHeader
title={item.bezeichnung}
backTo="/persoenliche-ausruestung"
subtitle={item.kategorie || undefined}
subtitle={item.artikel_kategorie_name || item.kategorie || undefined}
/>
{/* Status + actions row */}
<Box sx={{ display: 'flex', gap: 1, alignItems: 'center', mb: 3 }}>
<Chip
label={ZUSTAND_LABELS[item.zustand as PersoenlicheAusruestungZustand]}
color={ZUSTAND_COLORS[item.zustand as PersoenlicheAusruestungZustand]}
label={getZustandLabel(item.zustand)}
color={getZustandColor(item.zustand) as any}
variant="outlined"
/>
<Box sx={{ flex: 1 }} />
@@ -92,10 +100,8 @@ export default function PersoenlicheAusruestungDetail() {
<Box sx={{ display: 'grid', gridTemplateColumns: '1fr 1fr', gap: 1.5 }}>
{([
['Benutzer', item.user_display_name || item.benutzer_name],
['Größe', item.groesse],
['Seriennummer', item.seriennummer],
['Inventarnummer', item.inventarnummer],
['Anschaffungsdatum', item.anschaffung_datum ? new Date(item.anschaffung_datum).toLocaleDateString('de-AT') : null],
['Erstellt am', new Date(item.erstellt_am).toLocaleDateString('de-AT')],
] as [string, string | null | undefined][]).map(([label, value]) => value ? (
<Box key={label}>