Alter Maintenance-Screen hinzugefügt
This commit is contained in:
PxlLoewe
118
apps/hub/app/(app)/admin/config/_components/MessageForm.tsx
Normal file
118
apps/hub/app/(app)/admin/config/_components/MessageForm.tsx
Normal file
@@ -0,0 +1,118 @@
|
||||
"use client";
|
||||
|
||||
import { zodResolver } from "@hookform/resolvers/zod";
|
||||
import { Notam } from "@repo/db";
|
||||
import { NotamOptionalDefaults, NotamOptionalDefaultsSchema } from "@repo/db/zod";
|
||||
import { useForm } from "react-hook-form";
|
||||
import { addMessage, disableMessage } from "../action";
|
||||
import "react-datepicker/dist/react-datepicker.css"; // <-- Add this line at the top if using react-datepicker
|
||||
import { Button } from "_components/ui/Button";
|
||||
import { PaginatedTableRef } from "_components/PaginatedTable";
|
||||
import { RefObject } from "react";
|
||||
|
||||
export const MessageForm = ({ tableRef }: { tableRef: RefObject<PaginatedTableRef | null> }) => {
|
||||
const disableMessageClient = async () => {
|
||||
await disableMessage();
|
||||
tableRef?.current?.refresh();
|
||||
};
|
||||
|
||||
const form = useForm<NotamOptionalDefaults>({
|
||||
resolver: zodResolver(NotamOptionalDefaultsSchema),
|
||||
});
|
||||
|
||||
return (
|
||||
<form
|
||||
onSubmit={form.handleSubmit(async (values) => {
|
||||
try {
|
||||
await addMessage(values);
|
||||
tableRef?.current?.refresh();
|
||||
form.reset();
|
||||
} catch (error) {
|
||||
console.error("Failed to add message", error);
|
||||
}
|
||||
})}
|
||||
className="grid grid-cols-6 gap-3"
|
||||
>
|
||||
<label className="floating-label col-span-6">
|
||||
<span>Notam</span>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Globales Notam"
|
||||
className="input input-md w-full mb-2"
|
||||
{...form.register("message")}
|
||||
/>
|
||||
</label>
|
||||
<div className="gap-2 flex justify-between col-span-6">
|
||||
<div className="flex flex-col gap-4">
|
||||
<div className="content-center">
|
||||
<input
|
||||
type="radio"
|
||||
value="INFO"
|
||||
{...form.register("color")}
|
||||
className="radio radio-info ml-2 mr-2"
|
||||
/>
|
||||
<span>Info</span>
|
||||
<input
|
||||
type="radio"
|
||||
value="SUCCESS"
|
||||
{...form.register("color")}
|
||||
className="radio radio-success ml-2 mr-2"
|
||||
/>
|
||||
<span>Success</span>
|
||||
<input
|
||||
type="radio"
|
||||
value="WARNING"
|
||||
{...form.register("color")}
|
||||
className="radio radio-warning ml-2 mr-2"
|
||||
/>
|
||||
<span>Warning</span>
|
||||
<input
|
||||
type="radio"
|
||||
value="ERROR"
|
||||
{...form.register("color")}
|
||||
className="radio radio-error ml-2 mr-2"
|
||||
/>
|
||||
<span>Error</span>
|
||||
</div>
|
||||
<div className="flex flex-col gap-2 ml-2">
|
||||
<label className="label">
|
||||
<input
|
||||
type="checkbox"
|
||||
className="checkbox checkbox-primary"
|
||||
{...form.register("maintenanceEnabled")}
|
||||
/>
|
||||
Wartungsmodus einschalten
|
||||
</label>
|
||||
<label className="label">
|
||||
<input
|
||||
type="checkbox"
|
||||
className="checkbox checkbox-primary"
|
||||
{...form.register("disableHPG")}
|
||||
/>
|
||||
HPG Alarmierung deaktivieren
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-col justify-end">
|
||||
<div className="flex justify-center gap-2">
|
||||
<Button
|
||||
type="button"
|
||||
onSubmit={() => false}
|
||||
className="btn btn-soft"
|
||||
onClick={disableMessageClient}
|
||||
>
|
||||
Config zurücksetzen
|
||||
</Button>
|
||||
<Button
|
||||
type="submit"
|
||||
className="btn btn-primary"
|
||||
isLoading={form.formState.isSubmitting}
|
||||
>
|
||||
Speichern
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
);
|
||||
};
|
||||
22
apps/hub/app/(app)/admin/config/action.tsx
Normal file
22
apps/hub/app/(app)/admin/config/action.tsx
Normal file
@@ -0,0 +1,22 @@
|
||||
"use server";
|
||||
import { prisma, Prisma } from "@repo/db";
|
||||
|
||||
export const addMessage = async (notam: Prisma.NotamCreateInput) => {
|
||||
try {
|
||||
await prisma.notam.create({
|
||||
data: notam,
|
||||
});
|
||||
} catch (error) {
|
||||
throw new Error("Failed to add message");
|
||||
}
|
||||
};
|
||||
|
||||
export const disableMessage = async () => {
|
||||
try {
|
||||
await prisma.notam.create({
|
||||
data: {},
|
||||
});
|
||||
} catch (error) {
|
||||
throw new Error("Failed to disable message");
|
||||
}
|
||||
};
|
||||
80
apps/hub/app/(app)/admin/config/page.tsx
Normal file
80
apps/hub/app/(app)/admin/config/page.tsx
Normal file
@@ -0,0 +1,80 @@
|
||||
"use client";
|
||||
|
||||
import { Check, MessageSquareWarning, Settings } from "lucide-react";
|
||||
import { MessageForm } from "./_components/MessageForm";
|
||||
import { PaginatedTable, PaginatedTableRef } from "_components/PaginatedTable";
|
||||
import { ColumnDef } from "@tanstack/react-table";
|
||||
import { Notam } from "@repo/db";
|
||||
import { useRef } from "react";
|
||||
|
||||
export default function MessagePage() {
|
||||
const tableRef = useRef<PaginatedTableRef | null>(null);
|
||||
return (
|
||||
<>
|
||||
<div className="grid grid-cols-6 gap-4">
|
||||
<div className="col-span-full">
|
||||
<p className="text-2xl font-semibold text-left flex items-center gap-2">
|
||||
<Settings className="w-5 h-5" /> Config
|
||||
</p>
|
||||
</div>
|
||||
<div className="card bg-base-200 shadow-xl mb-4 col-span-6">
|
||||
<div className="card-body">
|
||||
<MessageForm tableRef={tableRef} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<PaginatedTable
|
||||
ref={tableRef}
|
||||
prismaModel="notam"
|
||||
initialOrderBy={[{ id: "createdAt", desc: true }]}
|
||||
columns={
|
||||
[
|
||||
{
|
||||
accessorKey: "message",
|
||||
header: "Nachricht",
|
||||
},
|
||||
{
|
||||
accessorKey: "color",
|
||||
header: "Typ",
|
||||
cell: ({ row }) => {
|
||||
const color = row.getValue("color");
|
||||
return color;
|
||||
},
|
||||
},
|
||||
{
|
||||
accessorKey: "wartungsmodus",
|
||||
header: "Wartungsmodus",
|
||||
cell: ({ row }) => {
|
||||
const wartungsmodus = row.original.maintenanceEnabled;
|
||||
return wartungsmodus ? <Check /> : "";
|
||||
},
|
||||
},
|
||||
{
|
||||
accessorKey: "disableHPG",
|
||||
header: "HPG deaktiviert",
|
||||
cell: ({ row }) => {
|
||||
const disableHPG = row.original.disableHPG;
|
||||
return disableHPG ? <Check /> : "";
|
||||
},
|
||||
},
|
||||
|
||||
{
|
||||
accessorKey: "createdAt",
|
||||
header: "Erstellt am",
|
||||
cell: ({ cell }) => {
|
||||
const date = new Date(cell.getValue() as string);
|
||||
return date.toLocaleDateString("de-DE", {
|
||||
year: "numeric",
|
||||
month: "2-digit",
|
||||
day: "2-digit",
|
||||
hour: "2-digit",
|
||||
minute: "2-digit",
|
||||
});
|
||||
},
|
||||
},
|
||||
] as ColumnDef<Notam>[]
|
||||
}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user