"use client"; import { z } from "zod"; import { useQuery } from "@tanstack/react-query"; import { useAuth } from "@/components/auth"; import { CrudPage } from "@/components/crud-page"; import { apiGet, Customer, Device, Location, Paginated } from "@/lib/api"; const optionalNumber = z.union([z.coerce.number().int().positive(), z.literal(""), z.null()]).optional(); const schema = z.object({ customer_id: z.string().min(1), location_id: z.string().optional().nullable(), manufacturer: z.string().min(2), model: z.string().min(1), device_type: z.string().optional().nullable(), serial_number: z.string().min(2), year_built: optionalNumber, commissioned_on: z.string().optional().nullable(), chamber_volume_liters: optionalNumber, steam_generation: z.string().optional().nullable(), water_treatment: z.string().optional().nullable(), documentation: z.string().optional().nullable(), supplier: z.string().optional().nullable() }); export default function DevicesPage() { const { token } = useAuth(); const customers = useQuery({ queryKey: ["customers-options", token], queryFn: () => apiGet>("/customers?page=1&page_size=100", token ?? ""), enabled: Boolean(token) }); const locations = useQuery({ queryKey: ["locations-options", token], queryFn: () => apiGet>("/locations?page=1&page_size=100", token ?? ""), enabled: Boolean(token) }); const customerOptions = (customers.data?.items ?? []).map((item) => ({ label: item.name, value: item.id })); const locationOptions = (locations.data?.items ?? []).map((item) => ({ label: item.name, value: item.id })); return ( title="Geraete" subtitle="Geraetestammdaten, technische Daten, Standort und Dokumentation." endpoint="/devices" columns={[ { key: "manufacturer", label: "Hersteller" }, { key: "model", label: "Modell" }, { key: "device_type", label: "Typ" }, { key: "serial_number", label: "Seriennummer" } ]} fields={[ { name: "customer_id", label: "Kunde", type: "select", options: customerOptions }, { name: "location_id", label: "Standort", type: "select", options: locationOptions }, { name: "manufacturer", label: "Hersteller" }, { name: "model", label: "Modell" }, { name: "device_type", label: "Typ" }, { name: "serial_number", label: "Seriennummer" }, { name: "year_built", label: "Baujahr", type: "number" }, { name: "commissioned_on", label: "Inbetriebnahme", type: "date" }, { name: "chamber_volume_liters", label: "Kammervolumen Liter", type: "number" }, { name: "steam_generation", label: "Dampferzeugung" }, { name: "water_treatment", label: "Wasseraufbereitung" }, { name: "supplier", label: "Lieferant" }, { name: "documentation", label: "Dokumentation", type: "textarea" } ]} schema={schema} emptyValues={{ customer_id: "", location_id: "", manufacturer: "", model: "", device_type: "", serial_number: "", year_built: "", commissioned_on: "", chamber_volume_liters: "", steam_generation: "", water_treatment: "", documentation: "", supplier: "" }} /> ); }