70 lines
3.2 KiB
TypeScript
70 lines
3.2 KiB
TypeScript
"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<Paginated<Customer>>("/customers?page=1&page_size=100", token ?? ""),
|
|
enabled: Boolean(token)
|
|
});
|
|
const locations = useQuery({
|
|
queryKey: ["locations-options", token],
|
|
queryFn: () => apiGet<Paginated<Location>>("/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 (
|
|
<CrudPage<Device>
|
|
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: "" }}
|
|
/>
|
|
);
|
|
}
|