cowch/lstV2
1
0
Fork 0
Code Issues 37 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

test(ocp dash): more work on the dashboard

Browse Source
This commit is contained in:
Blake Matthes
2025-03-20 14:02:46 -05:00
parent 74bcd6e805
commit f3c4c26ef9
3 changed files with 136 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
frontend/src/components/production/ocp/LabelLog.tsx
View File

@@ -1,5 +1,5 @@
import {LstCard} from "@/components/extendedUI/LstCard"; import {LstCard} from "@/components/extendedUI/LstCard";
import {CardHeader} from "@/components/ui/card";
import {Skeleton} from "@/components/ui/skeleton"; import {Skeleton} from "@/components/ui/skeleton";
import {Table, TableBody, TableCell, TableHead, TableHeader, TableRow} from "@/components/ui/table"; import {Table, TableBody, TableCell, TableHead, TableHeader, TableRow} from "@/components/ui/table";
// import {useSessionStore} from "@/lib/store/sessionStore"; // import {useSessionStore} from "@/lib/store/sessionStore";
@@ -17,7 +17,7 @@ const labelLogs = [
//{key: "reprint", label: "Reprint"}, // removing the reprint button for now until repritning is working as intended //{key: "reprint", label: "Reprint"}, // removing the reprint button for now until repritning is working as intended
]; ];
export default function LabelLog() { export default function LabelLog() {
const {data, isError, error, isLoading} = useQuery(getlabels("4")); const {data, isError, isLoading} = useQuery(getlabels("4"));
//const {user} = useSessionStore(); //const {user} = useSessionStore();
//const {settings} = useSettingStore(); //const {settings} = useSettingStore();
//const server = settings.filter((n) => n.name === "server")[0]?.value || ""; //const server = settings.filter((n) => n.name === "server")[0]?.value || "";
@@ -26,10 +26,42 @@ export default function LabelLog() {
if (isError) { if (isError) {
return ( return (
<div> <div className="m-2 p-2 min-h-2/5">
<LstCard> <LstCard>
<CardHeader>There was an error loading the lots</CardHeader> <p className="text-center">Labels for the last 2 hours</p>
{JSON.stringify(error)} <Table>
<TableHeader>
<TableRow>
{labelLogs.map((l) => (
<TableHead key={l.key}>{l.label}</TableHead>
))}
</TableRow>
</TableHeader>
<TableBody>
{Array(7)
.fill(0)
.map((_, i) => (
<TableRow key={i}>
<TableCell className="font-medium">
<Skeleton className="h-4" />
</TableCell>
<TableCell>
<Skeleton className="h-4" />
</TableCell>
<TableCell>
<Skeleton className="h-4" />
</TableCell>
<TableCell>
<Skeleton className="h-4" />
</TableCell>
<TableCell>
<Skeleton className="h-4" />
</TableCell>
</TableRow>
))}
</TableBody>
</Table>
</LstCard> </LstCard>
</div> </div>
); );
@@ -37,6 +69,7 @@ export default function LabelLog() {
return ( return (
<LstCard className="m-2 p-2 min-h-2/5"> <LstCard className="m-2 p-2 min-h-2/5">
<p className="text-center">Labels for the last 2 hours</p>
<Table> <Table>
<TableHeader> <TableHeader>
<TableRow> <TableRow>

55
frontend/src/components/production/ocp/Lots.tsx
View File

@@ -1,5 +1,5 @@
import {LstCard} from "@/components/extendedUI/LstCard"; import {LstCard} from "@/components/extendedUI/LstCard";
import {CardHeader} from "@/components/ui/card";
import {Skeleton} from "@/components/ui/skeleton"; import {Skeleton} from "@/components/ui/skeleton";
import {Table, TableBody, TableCell, TableHead, TableHeader, TableRow} from "@/components/ui/table"; import {Table, TableBody, TableCell, TableHead, TableHeader, TableRow} from "@/components/ui/table";
import {useSessionStore} from "@/lib/store/sessionStore"; import {useSessionStore} from "@/lib/store/sessionStore";
@@ -57,7 +57,7 @@ let lotColumns = [
// }, // },
]; ];
export default function Lots() { export default function Lots() {
const {data, isError, error, isLoading} = useQuery(getlots()); const {data, isError, isLoading} = useQuery(getlots());
const {user} = useSessionStore(); const {user} = useSessionStore();
const {settings} = useSettingStore(); const {settings} = useSettingStore();
const server = settings.filter((n) => n.name === "server")[0]?.value || ""; const server = settings.filter((n) => n.name === "server")[0]?.value || "";
@@ -82,10 +82,54 @@ export default function Lots() {
if (isError) { if (isError) {
return ( return (
<div> <div className="m-2 p-2 min-h-2/5">
<LstCard> <LstCard>
<CardHeader>There was an error loading the lots</CardHeader> <p className="text-center">Current Assigned lots</p>
{JSON.stringify(error)} <Table>
<TableHeader>
<TableRow>
{lotColumns.map((l) => (
<TableHead key={l.key}>{l.label}</TableHead>
))}
</TableRow>
</TableHeader>
<TableBody>
{Array(10)
.fill(0)
.map((_, i) => (
<TableRow key={i}>
<TableCell className="font-medium">
<Skeleton className="h-4" />
</TableCell>
<TableCell>
<Skeleton className="h-4" />
</TableCell>
<TableCell>
<Skeleton className="h-4" />
</TableCell>
<TableCell>
<Skeleton className="h-4" />
</TableCell>
<TableCell>
<Skeleton className="h-4" />
</TableCell>
<TableCell>
<Skeleton className="h-4" />
</TableCell>
<TableCell>
<Skeleton className="h-4" />
</TableCell>
<TableCell>
<Skeleton className="h-4" />
</TableCell>
<TableCell>
<Skeleton className="h-4" />
</TableCell>
</TableRow>
))}
</TableBody>
</Table>
</LstCard> </LstCard>
</div> </div>
); );
@@ -93,6 +137,7 @@ export default function Lots() {
return ( return (
<LstCard className="m-2 p-2 min-h-2/5"> <LstCard className="m-2 p-2 min-h-2/5">
<p className="text-center">Current Assigned lots</p>
<Table> <Table>
<TableHeader> <TableHeader>
<TableRow> <TableRow>

49
frontend/src/components/production/ocp/PrinterStatus.tsx
View File

@@ -1,5 +1,52 @@
import {LstCard} from "@/components/extendedUI/LstCard"; import {LstCard} from "@/components/extendedUI/LstCard";
import {Skeleton} from "@/components/ui/skeleton";
import {Table, TableBody, TableCell, TableHead, TableHeader, TableRow} from "@/components/ui/table";
let printerCols = [
{
key: "status",
label: "Status",
},
{
key: "printer",
label: "Printer",
},
{
key: "statusMessage",
label: "Status Message",
},
];
export default function PrinterStatus() { export default function PrinterStatus() {
return <LstCard className="m-2 p-2">Printer Status</LstCard>; return (
<LstCard className="m-2 p-2">
<p className="text-center">Printer Status</p>
<Table>
<TableHeader>
<TableRow>
{printerCols.map((l) => (
<TableHead key={l.key}>{l.label}</TableHead>
))}
</TableRow>
</TableHeader>
<TableBody>
{Array(10)
.fill(0)
.map((_, i) => (
<TableRow key={i}>
<TableCell className="font-medium">
<Skeleton className="h-4" />
</TableCell>
<TableCell>
<Skeleton className="h-4" />
</TableCell>
<TableCell>
<Skeleton className="h-4" />
</TableCell>
</TableRow>
))}
</TableBody>
</Table>
</LstCard>
);
} }