Andre/PrintAuftrag-Portfolio
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

init

Browse Source
This commit is contained in:
Andreas Wilms
2025-09-08 18:30:35 +02:00
commit f12cc8b2ce
130 changed files with 16911 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

227
frontend/app/dashboard/vorlagenRollendruck/page.tsx Normal file
View File

@@ -0,0 +1,227 @@
"use client";
import { useEffect, useState } from "react";
import { Ellipsis } from "lucide-react"
import { getTableData, deleteVorlageRollendruck, getTableDataDupli, deleteDupliEntry } from "./action";
import {
Table,
TableBody,
TableCaption,
TableCell,
TableHead,
TableHeader,
TableRow,
} from "@/components/ui/table"
import { Button } from "@/components/ui/button"
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuSeparator,
DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu"
import {
AlertDialog,
AlertDialogAction,
AlertDialogCancel,
AlertDialogContent,
AlertDialogDescription,
AlertDialogFooter,
AlertDialogHeader,
AlertDialogTitle,
AlertDialogTrigger,
} from "@/components/ui/alert-dialog"
import {
Dialog,
DialogContent,
DialogDescription,
DialogHeader,
DialogTitle,
DialogTrigger,
} from "@/components/ui/dialog"
import AddDialog from "./components/addDialog";
import AlterDialog from "./components/alterDialog";
import AddDialogDupli from "./components/addDialogDupli";
type TableData = {
id: number;
printer: string;
height: number;
width: number;
articleTypes: string;
};
export default function Page() {
const [data, setData] = useState<TableData[]>([]);
const [dupliData, setDupliData] = useState<{ id: number; product_type: string }[]>([]);
useEffect(() => {
async function fetchData() {
try {
const result = await getTableData();
setData(result || []);
const dupliResult = await getTableDataDupli();
setDupliData(Array.isArray(dupliResult) ? dupliResult : []);
} catch (error) {
console.error("Fehler beim Laden der Daten:", error);
}
}
fetchData();
}, []);
const handleNewEntry = async () => {
try {
const result = await getTableData(); // Daten erneut abrufen
setData(result); // Tabelle aktualisieren
} catch (error) {
console.error("Fehler beim Aktualisieren der Daten:", error);
}
};
const handleNewEntry2 = async () => {
try {
const result = await getTableDataDupli(); // Daten erneut abrufen
setDupliData(result) // Tabelle aktualisieren
} catch (error) {
console.error("Fehler beim Aktualisieren der Daten:", error);
}
};
const deleteEntry = async (id: number) => {
try {
await deleteVorlageRollendruck(id);
await handleNewEntry();
}
catch (error) {
console.error("Fehler beim Löschen der Daten:", error);
}
};
const deleteEntryDupli = async (id: number) => {
try {
await deleteDupliEntry(id);
await handleNewEntry2();
}
catch (error) {
console.error("Fehler beim Löschen der Daten:", error);
}
}
return (
<div className="min-h-screen bg-gray-50 p-6">
<div className="flex w-full max-w-6xl mx-auto gap-2">
<div className="w-1/3 flex-shrink-0">
<Table className="bg-white shadow-md border border-gray-300">
<TableCaption>Artikel für Duplizierung</TableCaption>
<TableHeader>
<TableRow>
<TableHead className="w-[100px]">Artikel Typ</TableHead>
<TableHead className="text-right">
<AddDialogDupli onNewEntry={handleNewEntry2} />
</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{dupliData.map((item) => (
<TableRow key={item.id}>
<TableCell>{item.product_type}</TableCell>
<TableCell className="text-right">
<Button onClick={() => {
deleteEntryDupli(item.id); // Eintrag löschen
}} variant={"outline"} className="border-red-700 text-red-700 h-6">Entfernen</Button>
</TableCell>
</TableRow>
))}
</TableBody>
</Table>
</div>
<div className="flex-1">
<Table className="bg-white shadow-md border border-gray-300">
<TableCaption>Vorlagen Rollendruck</TableCaption>
<TableHeader>
<TableRow>
<TableHead className="w-[100px]">Drucker</TableHead>
<TableHead>Höhe</TableHead>
<TableHead>Breite</TableHead>
<TableHead>Artikel Typen</TableHead>
<TableHead className="text-right">
<AddDialog onNewEntry={handleNewEntry} />
</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{data.map((item) => (
<TableRow key={item.id}>
<TableCell>{item.printer}</TableCell>
<TableCell>{item.height}</TableCell>
<TableCell>{item.width}</TableCell>
<TableCell>
<Dialog>
<DialogTrigger asChild>
<Button variant="outline">Anzeigen</Button>
</DialogTrigger>
<DialogContent>
<DialogHeader>
<DialogTitle>Artikel Typen</DialogTitle>
<DialogDescription>
Hier sind die Artikel Typen gelistet, die von der Vorlage unterstützt werden.
</DialogDescription>
</DialogHeader>
{item.articleTypes}
</DialogContent>
</Dialog>
</TableCell>
<TableCell className="text-right">
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="ghost" size="icon">
<Ellipsis />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<AlterDialog onNewEntry={handleNewEntry} data={item} />
<DropdownMenuSeparator />
<DropdownMenuItem variant="destructive">
<AlertDialog>
<AlertDialogTrigger
onClick={(event) => {
event.stopPropagation(); // Verhindert das Schließen des Dropdown-Menüs
}}
>
Eintrag Löschen
</AlertDialogTrigger>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>Sind Sie sich sicher?</AlertDialogTitle>
<AlertDialogDescription>
Diese Aktion ist permanent und kann nicht rückgängig gemacht werden.
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel>Abbrechen</AlertDialogCancel>
<AlertDialogAction
onClick={() => {
deleteEntry(item.id); // Eintrag löschen
}}
>
Löschen
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
</TableCell>
</TableRow>
))}
</TableBody>
</Table>
</div>
</div>
</div>
);
}