feat(ocp): printer cycling backend and frontend done :)

This commit is contained in:
2025-04-07 07:02:31 -05:00
parent 75f94eae14
commit dc5ee5b97a
14 changed files with 302 additions and 35 deletions

View File

@@ -9,12 +9,10 @@ import {
TableHeader,
TableRow,
} from "@/components/ui/table";
import { getPrinters } from "@/utils/querys/production/printers";
import { useQuery } from "@tanstack/react-query";
let printerCols = [
{
key: "status",
label: "Status",
},
{
key: "printer",
label: "Printer",
@@ -25,10 +23,12 @@ let printerCols = [
},
];
export default function PrinterStatus() {
return (
<LstCard className="m-2 p-2">
<ScrollArea className="max-h-[300px]">
<p className="text-center">Printer Status</p>
const { data, isError, isLoading } = useQuery(getPrinters());
if (isError) {
return (
<ScrollArea className="h-[400px]">
<p className="text-center">Printer Staus error</p>
<Table>
<TableHeader>
@@ -50,14 +50,65 @@ export default function PrinterStatus() {
<TableCell>
<Skeleton className="h-4" />
</TableCell>
<TableCell>
<Skeleton className="h-4" />
</TableCell>
</TableRow>
))}
</TableBody>
</Table>
</ScrollArea>
);
}
/**
* only show the assigned printers
*/
const assigned = data?.filter((a: any) => a.assigned) || [];
return (
<LstCard className="m-2 p-2">
<ScrollArea className="max-h-[800px]">
<p className="text-center">
{isLoading ? (
<span>Printers status loading...</span>
) : (
<span>Printer Status</span>
)}
</p>
<Table>
<TableHeader>
<TableRow>
{printerCols.map((l) => (
<TableHead key={l.key}>{l.label}</TableHead>
))}
</TableRow>
</TableHeader>{" "}
{isLoading ? (
<TableBody>
{Array(5)
.fill(0)
.map((_, i) => (
<TableRow key={i}>
<TableCell className="font-medium">
<Skeleton className="h-4" />
</TableCell>
<TableCell>
<Skeleton className="h-4" />
</TableCell>
</TableRow>
))}
</TableBody>
) : (
<TableBody>
{assigned?.map((p: any) => (
<TableRow key={p.printer_id}>
<TableCell>{p.name}</TableCell>
<TableCell>{p.statusText}</TableCell>
</TableRow>
))}
</TableBody>
)}
</Table>
</ScrollArea>
</LstCard>
);
}