feat(migration): moved ocp, ocme, wrapper stuff

This commit is contained in:
2025-10-26 10:35:06 -05:00
parent 0fe0a8f56a
commit 4ca20a085e
52 changed files with 1522 additions and 1525 deletions

View File

@@ -43,6 +43,8 @@
"react-calendar-timeline": "^0.30.0-beta.3",
"react-day-picker": "^9.11.1",
"react-dom": "^19.1.1",
"react-hook-form": "^7.65.0",
"react-resizable-panels": "^3.0.6",
"recharts": "^2.15.4",
"socket.io-client": "^4.8.1",
"sonner": "^2.0.7",
@@ -6598,6 +6600,22 @@
"react": "^19.1.1"
}
},
"node_modules/react-hook-form": {
"version": "7.65.0",
"resolved": "https://registry.npmjs.org/react-hook-form/-/react-hook-form-7.65.0.tgz",
"integrity": "sha512-xtOzDz063WcXvGWaHgLNrNzlsdFgtUWcb32E6WFaGTd7kPZG3EeDusjdZfUsPwKCKVXy1ZlntifaHZ4l8pAsmw==",
"license": "MIT",
"engines": {
"node": ">=18.0.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/react-hook-form"
},
"peerDependencies": {
"react": "^16.8.0 || ^17 || ^18 || ^19"
}
},
"node_modules/react-is": {
"version": "18.3.1",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
@@ -6651,6 +6669,16 @@
}
}
},
"node_modules/react-resizable-panels": {
"version": "3.0.6",
"resolved": "https://registry.npmjs.org/react-resizable-panels/-/react-resizable-panels-3.0.6.tgz",
"integrity": "sha512-b3qKHQ3MLqOgSS+FRYKapNkJZf5EQzuf6+RLiq1/IlTHw99YrZ2NJZLk4hQIzTnnIkRg2LUqyVinu6YWWpUYew==",
"license": "MIT",
"peerDependencies": {
"react": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc",
"react-dom": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc"
}
},
"node_modules/react-smooth": {
"version": "4.0.4",
"resolved": "https://registry.npmjs.org/react-smooth/-/react-smooth-4.0.4.tgz",

View File

@@ -45,6 +45,8 @@
"react-calendar-timeline": "^0.30.0-beta.3",
"react-day-picker": "^9.11.1",
"react-dom": "^19.1.1",
"react-hook-form": "^7.65.0",
"react-resizable-panels": "^3.0.6",
"recharts": "^2.15.4",
"socket.io-client": "^4.8.1",
"sonner": "^2.0.7",

View File

@@ -0,0 +1,54 @@
import * as React from "react"
import { GripVerticalIcon } from "lucide-react"
import * as ResizablePrimitive from "react-resizable-panels"
import { cn } from "@/lib/utils"
function ResizablePanelGroup({
className,
...props
}: React.ComponentProps<typeof ResizablePrimitive.PanelGroup>) {
return (
<ResizablePrimitive.PanelGroup
data-slot="resizable-panel-group"
className={cn(
"flex h-full w-full data-[panel-group-direction=vertical]:flex-col",
className
)}
{...props}
/>
)
}
function ResizablePanel({
...props
}: React.ComponentProps<typeof ResizablePrimitive.Panel>) {
return <ResizablePrimitive.Panel data-slot="resizable-panel" {...props} />
}
function ResizableHandle({
withHandle,
className,
...props
}: React.ComponentProps<typeof ResizablePrimitive.PanelResizeHandle> & {
withHandle?: boolean
}) {
return (
<ResizablePrimitive.PanelResizeHandle
data-slot="resizable-handle"
className={cn(
"bg-border focus-visible:ring-ring relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-offset-1 focus-visible:outline-hidden data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90",
className
)}
{...props}
>
{withHandle && (
<div className="bg-border z-10 flex h-4 w-3 items-center justify-center rounded-xs border">
<GripVerticalIcon className="size-2.5" />
</div>
)}
</ResizablePrimitive.PanelResizeHandle>
)
}
export { ResizablePanelGroup, ResizablePanel, ResizableHandle }

View File

@@ -19,6 +19,7 @@ import { Route as MobileMobileLayoutRouteRouteImport } from './routes/_mobile/_m
import { Route as AppAdminLayoutRouteRouteImport } from './routes/_app/_adminLayout/route'
import { Route as OldOldIndexRouteImport } from './routes/_old/old/index'
import { Route as AppauthLoginRouteImport } from './routes/_app/(auth)/login'
import { Route as OldOldOcpIndexRouteImport } from './routes/_old/old/ocp/index'
import { Route as MobileMobileLayoutMIndexRouteImport } from './routes/_mobile/_mobileLayout/m/index'
import { Route as AppauthUserIndexRouteImport } from './routes/_app/(auth)/user/index'
import { Route as MobileMobileLayoutMRelocateRouteImport } from './routes/_mobile/_mobileLayout/m/relocate'
@@ -31,6 +32,7 @@ import { Route as AppauthUserSignupRouteImport } from './routes/_app/(auth)/user
import { Route as AppauthUserResetpasswordRouteImport } from './routes/_app/(auth)/user/resetpassword'
import { Route as AppauthUserProfileRouteImport } from './routes/_app/(auth)/user/profile'
import { Route as AppAdminLayoutAdminUsersRouteRouteImport } from './routes/_app/_adminLayout/admin/_users/route'
import { Route as OldOldocmeCyclecountIndexRouteImport } from './routes/_old/old/(ocme)/cyclecount/index'
import { Route as OldOldlogisticsSiloAdjustmentsIndexRouteImport } from './routes/_old/old/(logistics)/siloAdjustments/index'
import { Route as OldOldlogisticsSiloAdjustmentsHistRouteImport } from './routes/_old/old/(logistics)/siloAdjustments/$hist'
import { Route as AppAdminLayoutAdminUsersUsersRouteImport } from './routes/_app/_adminLayout/admin/_users/users'
@@ -83,6 +85,11 @@ const AppauthLoginRoute = AppauthLoginRouteImport.update({
path: '/login',
getParentRoute: () => AppRouteRoute,
} as any)
const OldOldOcpIndexRoute = OldOldOcpIndexRouteImport.update({
id: '/ocp/',
path: '/ocp/',
getParentRoute: () => OldOldRouteRoute,
} as any)
const MobileMobileLayoutMIndexRoute =
MobileMobileLayoutMIndexRouteImport.update({
id: '/m/',
@@ -151,6 +158,12 @@ const AppAdminLayoutAdminUsersRouteRoute =
id: '/_users',
getParentRoute: () => AppAdminLayoutAdminRoute,
} as any)
const OldOldocmeCyclecountIndexRoute =
OldOldocmeCyclecountIndexRouteImport.update({
id: '/(ocme)/cyclecount/',
path: '/cyclecount/',
getParentRoute: () => OldOldRouteRoute,
} as any)
const OldOldlogisticsSiloAdjustmentsIndexRoute =
OldOldlogisticsSiloAdjustmentsIndexRouteImport.update({
id: '/(logistics)/siloAdjustments/',
@@ -200,10 +213,12 @@ export interface FileRoutesByFullPath {
'/m/relocate': typeof MobileMobileLayoutMRelocateRoute
'/user': typeof AppauthUserIndexRoute
'/m': typeof MobileMobileLayoutMIndexRoute
'/old/ocp': typeof OldOldOcpIndexRoute
'/admin/prodUsers': typeof AppAdminLayoutAdminUsersProdUsersRoute
'/admin/users': typeof AppAdminLayoutAdminUsersUsersRoute
'/old/siloAdjustments/$hist': typeof OldOldlogisticsSiloAdjustmentsHistRoute
'/old/siloAdjustments': typeof OldOldlogisticsSiloAdjustmentsIndexRoute
'/old/cyclecount': typeof OldOldocmeCyclecountIndexRoute
'/old/siloAdjustments/comment/$comment': typeof OldOldlogisticsSiloAdjustmentsCommentCommentRoute
}
export interface FileRoutesByTo {
@@ -223,10 +238,12 @@ export interface FileRoutesByTo {
'/m/relocate': typeof MobileMobileLayoutMRelocateRoute
'/user': typeof AppauthUserIndexRoute
'/m': typeof MobileMobileLayoutMIndexRoute
'/old/ocp': typeof OldOldOcpIndexRoute
'/admin/prodUsers': typeof AppAdminLayoutAdminUsersProdUsersRoute
'/admin/users': typeof AppAdminLayoutAdminUsersUsersRoute
'/old/siloAdjustments/$hist': typeof OldOldlogisticsSiloAdjustmentsHistRoute
'/old/siloAdjustments': typeof OldOldlogisticsSiloAdjustmentsIndexRoute
'/old/cyclecount': typeof OldOldocmeCyclecountIndexRoute
'/old/siloAdjustments/comment/$comment': typeof OldOldlogisticsSiloAdjustmentsCommentCommentRoute
}
export interface FileRoutesById {
@@ -252,10 +269,12 @@ export interface FileRoutesById {
'/_mobile/_mobileLayout/m/relocate': typeof MobileMobileLayoutMRelocateRoute
'/_app/(auth)/user/': typeof AppauthUserIndexRoute
'/_mobile/_mobileLayout/m/': typeof MobileMobileLayoutMIndexRoute
'/_old/old/ocp/': typeof OldOldOcpIndexRoute
'/_app/_adminLayout/admin/_users/prodUsers': typeof AppAdminLayoutAdminUsersProdUsersRoute
'/_app/_adminLayout/admin/_users/users': typeof AppAdminLayoutAdminUsersUsersRoute
'/_old/old/(logistics)/siloAdjustments/$hist': typeof OldOldlogisticsSiloAdjustmentsHistRoute
'/_old/old/(logistics)/siloAdjustments/': typeof OldOldlogisticsSiloAdjustmentsIndexRoute
'/_old/old/(ocme)/cyclecount/': typeof OldOldocmeCyclecountIndexRoute
'/_old/old/(logistics)/siloAdjustments/comment/$comment': typeof OldOldlogisticsSiloAdjustmentsCommentCommentRoute
}
export interface FileRouteTypes {
@@ -278,10 +297,12 @@ export interface FileRouteTypes {
| '/m/relocate'
| '/user'
| '/m'
| '/old/ocp'
| '/admin/prodUsers'
| '/admin/users'
| '/old/siloAdjustments/$hist'
| '/old/siloAdjustments'
| '/old/cyclecount'
| '/old/siloAdjustments/comment/$comment'
fileRoutesByTo: FileRoutesByTo
to:
@@ -301,10 +322,12 @@ export interface FileRouteTypes {
| '/m/relocate'
| '/user'
| '/m'
| '/old/ocp'
| '/admin/prodUsers'
| '/admin/users'
| '/old/siloAdjustments/$hist'
| '/old/siloAdjustments'
| '/old/cyclecount'
| '/old/siloAdjustments/comment/$comment'
id:
| '__root__'
@@ -329,10 +352,12 @@ export interface FileRouteTypes {
| '/_mobile/_mobileLayout/m/relocate'
| '/_app/(auth)/user/'
| '/_mobile/_mobileLayout/m/'
| '/_old/old/ocp/'
| '/_app/_adminLayout/admin/_users/prodUsers'
| '/_app/_adminLayout/admin/_users/users'
| '/_old/old/(logistics)/siloAdjustments/$hist'
| '/_old/old/(logistics)/siloAdjustments/'
| '/_old/old/(ocme)/cyclecount/'
| '/_old/old/(logistics)/siloAdjustments/comment/$comment'
fileRoutesById: FileRoutesById
}
@@ -407,6 +432,13 @@ declare module '@tanstack/react-router' {
preLoaderRoute: typeof AppauthLoginRouteImport
parentRoute: typeof AppRouteRoute
}
'/_old/old/ocp/': {
id: '/_old/old/ocp/'
path: '/ocp'
fullPath: '/old/ocp'
preLoaderRoute: typeof OldOldOcpIndexRouteImport
parentRoute: typeof OldOldRouteRoute
}
'/_mobile/_mobileLayout/m/': {
id: '/_mobile/_mobileLayout/m/'
path: '/m'
@@ -491,6 +523,13 @@ declare module '@tanstack/react-router' {
preLoaderRoute: typeof AppAdminLayoutAdminUsersRouteRouteImport
parentRoute: typeof AppAdminLayoutAdminRoute
}
'/_old/old/(ocme)/cyclecount/': {
id: '/_old/old/(ocme)/cyclecount/'
path: '/cyclecount'
fullPath: '/old/cyclecount'
preLoaderRoute: typeof OldOldocmeCyclecountIndexRouteImport
parentRoute: typeof OldOldRouteRoute
}
'/_old/old/(logistics)/siloAdjustments/': {
id: '/_old/old/(logistics)/siloAdjustments/'
path: '/siloAdjustments'
@@ -624,17 +663,21 @@ const MobileMobileLayoutRouteRouteWithChildren =
interface OldOldRouteRouteChildren {
OldOldIndexRoute: typeof OldOldIndexRoute
OldOldOcpIndexRoute: typeof OldOldOcpIndexRoute
OldOldlogisticsSiloAdjustmentsHistRoute: typeof OldOldlogisticsSiloAdjustmentsHistRoute
OldOldlogisticsSiloAdjustmentsIndexRoute: typeof OldOldlogisticsSiloAdjustmentsIndexRoute
OldOldocmeCyclecountIndexRoute: typeof OldOldocmeCyclecountIndexRoute
OldOldlogisticsSiloAdjustmentsCommentCommentRoute: typeof OldOldlogisticsSiloAdjustmentsCommentCommentRoute
}
const OldOldRouteRouteChildren: OldOldRouteRouteChildren = {
OldOldIndexRoute: OldOldIndexRoute,
OldOldOcpIndexRoute: OldOldOcpIndexRoute,
OldOldlogisticsSiloAdjustmentsHistRoute:
OldOldlogisticsSiloAdjustmentsHistRoute,
OldOldlogisticsSiloAdjustmentsIndexRoute:
OldOldlogisticsSiloAdjustmentsIndexRoute,
OldOldocmeCyclecountIndexRoute: OldOldocmeCyclecountIndexRoute,
OldOldlogisticsSiloAdjustmentsCommentCommentRoute:
OldOldlogisticsSiloAdjustmentsCommentCommentRoute,
}

View File

@@ -0,0 +1,14 @@
import { createFileRoute } from "@tanstack/react-router";
import OcmeCycleCount from "../../-components/ocme/ocmeCycleCount";
export const Route = createFileRoute("/_old/old/(ocme)/cyclecount/")({
component: RouteComponent,
});
function RouteComponent() {
return (
<div className="m-2">
<OcmeCycleCount />
</div>
);
}

View File

@@ -0,0 +1,101 @@
import { useForm } from "@tanstack/react-form";
import axios from "axios";
import { useState } from "react";
import { toast } from "sonner";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
export default function ManuallyEnterRn() {
const [sending, setSendingRn] = useState(false);
const form = useForm({
defaultValues: {
runningNr: "",
},
onSubmit: async ({ value }) => {
console.log(value);
setSendingRn(true);
try {
const res = await axios.post("/ocme/api/v1/postRunningNumber", {
runningNr: value.runningNr,
areaFrom: "wrapper_1",
completed: true,
});
if (res.data.success) {
form.reset();
toast.success(`${value.runningNr} was just created please login`);
setTimeout(() => {
setSendingRn(false);
}, 3 * 1000);
}
if (!res.data.success) {
toast.error(res.data.message);
setTimeout(() => {
setSendingRn(false);
}, 3 * 1000);
}
} catch (error) {
//console.log(error);
toast.error("There was an error registering");
setTimeout(() => {
setSendingRn(false);
}, 3 * 1000);
}
},
});
return (
<div>
<form
onSubmit={(e) => {
e.preventDefault();
//e.stopPropagation();
}}
>
<form.Field
name="runningNr"
validators={{
// We can choose between form-wide and field-specific validators
onChange: ({ value }) =>
value.length > 3
? undefined
: "pallet number must be greater than 4 numbers",
}}
children={(field) => {
return (
<div className="m-2 min-w-48 max-w-96 p-2 flex flex-row">
<div>
<Label htmlFor="runningNr" className="mb-2">
Running Number
</Label>
<Input
name={field.name}
value={field.state.value}
onBlur={field.handleBlur}
type="number"
onChange={(e) => field.handleChange(e.target.value)}
/>
{field.state.meta.errors.length ? (
<em>{field.state.meta.errors.join(",")}</em>
) : null}
</div>
<div className="ml-1 mt-5">
<Button
className="ml-1"
type="submit"
onClick={form.handleSubmit}
disabled={sending}
>
Submit
</Button>
</div>
</div>
);
}}
/>
</form>
</div>
);
}

View File

@@ -0,0 +1,165 @@
import { useQuery } from "@tanstack/react-query";
import axios from "axios";
import { format } from "date-fns";
import { Trash } from "lucide-react";
import { toast } from "sonner";
import { Button } from "@/components/ui/button";
import { ScrollArea } from "@/components/ui/scroll-area";
import { Skeleton } from "@/components/ui/skeleton";
import {
Table,
TableBody,
TableCell,
TableHead,
TableHeader,
TableRow,
} from "@/components/ui/table";
import { getOcmeInfo } from "../../-utils/querys/ocp/getOcmeInfo";
import { LstCard } from "../extendedUi/LstCard";
import ManualTrigger from "../rfid/ManualTrigger";
const currentPallets = [
{ key: "line", label: "Line" },
{ key: "runningNumber", label: "Running #" },
{ key: "upd_date", label: "Date Scanned" },
{ key: "waitingfor", label: "Waiting For" },
{ key: "clear", label: "Clear" },
];
// const currentTags = [
// { key: "line", label: "Line" },
// { key: "printerName", label: "Printer" },
// { key: "runningNr", label: "Running #" },
// { key: "upd_date", label: "Label date" },
// { key: "status", label: "Label Status" },
// ];
export default function WrapperManualTrigger() {
const { data, isError, isLoading } = useQuery(getOcmeInfo());
const cameraTrigger = async () => {
try {
const res = await axios.get("/ocme/api/v1/manualCameraTrigger");
if (res.data.success) {
toast.success(res.data.message);
return;
}
if (!res.data.success) {
toast.error(res.data.message);
}
} catch (error) {
console.log(error);
//stoast.success(error.data.message);
}
};
const clearLabel = async (d: any) => {
const data = {
runningNr: d.runningNr,
};
try {
const res = await axios.patch("/ocme/api/v1/pickedUp", data);
if (res.data.success) {
toast.success(`${d.runningNr} was just removed from being picked up.`);
return;
}
if (!res.data.success) {
toast.error(res.data.message);
}
} catch (error) {
console.log(error);
//stoast.success(error.data.message);
}
};
if (isError) {
return (
<div>
<p className="text-center text-pretty">
There was an error getting wrapper scans
</p>
</div>
);
}
const info = data?.filter((r: any) => r.areaFrom === "wrapper_1");
return (
<LstCard className="m-2 p-2 w-auto">
<ScrollArea className="max-h-[200px]">
<span>Wrapper Pallet Info</span>
<div>
<Table>
<TableHeader>
<TableRow>
{currentPallets.map((l) => (
<TableHead key={l.key}>{l.label}</TableHead>
))}
</TableRow>
</TableHeader>
{isLoading ? (
<TableBody>
{Array(3)
.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>
) : (
<TableBody>
{info.map((i: any) => (
<TableRow key={i.runningNr}>
<TableCell className="font-medium">{i.lineNum}</TableCell>
<TableCell>{i.runningNr}</TableCell>
<TableCell>
{format(i?.upd_date.replace("Z", ""), "M/d/yyyy hh:mm")}
</TableCell>
<TableCell>{i.waitingFor}</TableCell>
<TableCell>
<Button
variant="destructive"
size="icon"
onClick={() => clearLabel(i)}
>
<Trash />
</Button>
</TableCell>
</TableRow>
))}
</TableBody>
)}
</Table>
</div>
</ScrollArea>
<div>
<hr />
{/* <p className="text-center mb-3">Manual Trigger</p>
<ManuallyEnterRn />
<Separator className="m-1" /> */}
<div className="flex flex-row justify-between m-2">
<Button onClick={cameraTrigger}>Camera</Button>
<ManualTrigger />
</div>
</div>
</LstCard>
);
}

View File

@@ -0,0 +1,229 @@
import axios from "axios";
import { useState } from "react";
import { Controller, useForm } from "react-hook-form";
import { toast } from "sonner";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { LstCard } from "@/components/ui/lstCard";
//import CycleCountLog from "./CycleCountLog";
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from "@/components/ui/select";
import { Skeleton } from "@/components/ui/skeleton";
import {
Table,
TableBody,
TableCell,
TableHead,
TableHeader,
TableRow,
} from "@/components/ui/table";
export default function OcmeCycleCount() {
const token = localStorage.getItem("auth_token");
const [data, setData] = useState([]);
const [counting, setCounting] = useState(false);
const {
register,
handleSubmit,
//watch,
formState: { errors },
reset,
control,
} = useForm({
defaultValues: {
lane: "",
laneType: "name",
},
});
const onSubmit = async (data: any) => {
setData([]);
setCounting(true);
if (data.laneType === "") {
toast.error("Please select a type");
setCounting(false);
return;
}
toast.success(`Cycle count started`);
try {
const res = await axios.post("/ocme/api/v1/cycleCount", data, {
headers: { Authorization: `Bearer ${token}` },
});
if (res.data.success) {
toast.success(res.data.message);
setData(res.data.data);
setCounting(false);
reset();
}
if (!res.data.success) {
toast.success(res.data.message);
setCounting(false);
}
} catch (error) {
toast.error("There was an error cycle counting");
setCounting(false);
reset();
}
};
return (
<div className="flex flex-row w-screen">
<div className="m-2 w-5/6">
<LstCard>
<p className="ml-2">
Please enter the name or laneID you want to cycle count.
</p>
<div>
<form onSubmit={handleSubmit(onSubmit)}>
<div className="flex justify-between">
<div className="m-2 flex flex-row">
<Input
placeholder="enter lane: L064"
className={errors.lane ? "border-red-500" : ""}
aria-invalid={!!errors.lane}
{...register("lane", {
required: true,
minLength: {
value: 3,
message: "The lane is too short!",
},
})}
/>
<div className="ml-2">
<Controller
control={control}
name="laneType"
render={({
field: { onChange },
fieldState: {},
//formState,
}) => (
<Select onValueChange={onChange}>
<SelectTrigger className="w-[180px]">
<SelectValue placeholder="Select name or id" />
</SelectTrigger>
<SelectContent>
<SelectItem value="name">Name</SelectItem>
<SelectItem value="laneID">Lane ID</SelectItem>
</SelectContent>
</Select>
)}
/>
</div>
</div>
<Button className="m-2" type="submit" disabled={counting}>
{counting ? (
<span>Counting...</span>
) : (
<span>CycleCount</span>
)}
</Button>
</div>
</form>
</div>
<div>
<Table>
<TableHeader>
<TableRow>
<TableHead>LaneID</TableHead>
<TableHead>Lane</TableHead>
<TableHead>AV</TableHead>
<TableHead>Description</TableHead>
<TableHead>Running Number</TableHead>
<TableHead>In Ocme</TableHead>
<TableHead>In Stock</TableHead>
<TableHead>Result</TableHead>
</TableRow>
</TableHeader>
{data?.length === 0 ? (
<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>
</TableRow>
))}
</TableBody>
) : (
<>
{data.map((i: any) => {
let classname = ``;
if (i.info === "Validate pallet is ok.") {
classname = `bg-red-500`;
}
if (i.info === "Sent to Inv") {
classname = `bg-amber-700`;
}
return (
<TableRow key={i.runningNumber}>
<TableCell className={`font-medium ${classname}`}>
{i.alpla_laneID}
</TableCell>
<TableCell className={`font-medium ${classname}`}>
{i.alpla_laneDescription}
</TableCell>
<TableCell className={`font-medium ${classname}`}>
{i.Article}
</TableCell>
<TableCell className={`font-medium ${classname}`}>
{i.alpla_laneDescription}
</TableCell>
<TableCell className={`font-medium ${classname}`}>
{i.runningNumber}
</TableCell>
<TableCell className={`font-medium ${classname}`}>
{i.ocme}
</TableCell>
<TableCell className={`font-medium ${classname}`}>
{i.stock}
</TableCell>
<TableCell className={`font-medium ${classname}`}>
{i.info}
</TableCell>
</TableRow>
);
})}
</>
)}
</Table>
</div>
</LstCard>
</div>
{/* <div className="m-2">
<CycleCountLog />
</div> */}
</div>
);
}

View File

@@ -0,0 +1,24 @@
// import {useSessionStore} from "@/lib/store/sessionStore";
// import {useSettingStore} from "@/lib/store/useSettings";
import { useQuery } from "@tanstack/react-query";
import { getlabels } from "../../-utils/querys/ocp/labels";
import { labelolumns } from "../../-utils/tableData/production/labels/labelColumns";
import { LabelTable } from "../../-utils/tableData/production/labels/labelData";
export default function LabelLog() {
const { data, isError, isLoading } = useQuery(getlabels("4"));
if (isError) return <div>Error</div>;
if (isLoading) return <div>Loading</div>;
const labelData = data ? data : [];
return (
<div className="m-2">
<LabelTable
columns={labelolumns}
data={labelData}
//style={style}
/>
</div>
);
}

View File

@@ -0,0 +1,27 @@
import { useQuery } from "@tanstack/react-query";
import { getlabelRatio } from "../../-utils/querys/ocp/labelRatio";
import { labelRatioColumns } from "../../-utils/tableData/production/labelRatio/labelRatioColumns";
import { LabelRatioTable } from "../../-utils/tableData/production/labelRatio/labelRatioData";
export default function LabelRatio() {
const { data, isError, isLoading } = useQuery(getlabelRatio());
const ratioData = data ? data : [];
if (isError) {
return <div>Error</div>;
}
if (isLoading) {
return <div>Loading</div>;
}
return (
<div className="m-2">
<LabelRatioTable
columns={labelRatioColumns}
data={ratioData}
//style={style}
/>
</div>
);
}

View File

@@ -1,5 +1,5 @@
import { useQuery } from "@tanstack/react-query";
import { LstCard } from "@/components/extendedUI/LstCard";
import { ScrollArea } from "@/components/ui/scroll-area";
import { Skeleton } from "@/components/ui/skeleton";
import {
@@ -10,12 +10,11 @@ import {
TableHeader,
TableRow,
} from "@/components/ui/table";
import { useSessionStore } from "@/lib/store/sessionStore";
import { useGetUserRoles } from "@/lib/store/useGetRoles";
import { useModuleStore } from "@/lib/store/useModuleStore";
import { useSettingStore } from "@/lib/store/useSettings";
import { LotType } from "@/types/lots";
import { getlots } from "@/utils/querys/production/lots";
import { useAuth, userAccess } from "@/lib/authClient";
import { useSettingStore } from "../../-lib/store/useSettings";
import type { LotType } from "../../-types/lots";
import { getlots } from "../../-utils/querys/ocp/lots";
import { LstCard } from "../extendedUi/LstCard";
import ManualPrint from "./ManualPrinting/ManualPrint";
import ManualPrintForm from "./ManualPrinting/ManualPrintForm";
@@ -67,23 +66,20 @@ let lotColumns = [
];
export default function Lots() {
const { data, isError, isLoading } = useQuery(getlots());
const { user } = useSessionStore();
const { session } = useAuth();
const { settings } = useSettingStore();
const { userRoles } = useGetUserRoles();
const { modules } = useModuleStore();
const server = settings.filter((n) => n.name === "server")[0]?.value || "";
const roles = ["systemAdmin", "technician", "admin", "manager", "operator"];
const server = settings.filter((n) => n.name === "dbServer")[0]?.value || "";
const lotdata = data ? data : [];
const module = modules.filter((n) => n.name === "logistics");
const accessRoles = userAccess("ocp", [
"systemAdmin",
"technician",
"admin",
"manager",
]);
const accessRoles = userRoles.filter(
(n: any) => n.module === module[0]?.name,
) as any;
if (user && roles.includes(accessRoles[0]?.role)) {
if (session?.user && accessRoles) {
//width = 1280;
const checkCol = lotColumns.some((l) => l.key === "printLabel");
if (!checkCol) {
@@ -230,7 +226,7 @@ export default function Lots() {
<TableCell className="font-medium">
{lot.overPrinting}
</TableCell>
{user && roles.includes(accessRoles[0]?.role) && (
{session?.user && accessRoles && (
<>
{server === "usday1vms006" || server === "localhost" ? (
<>

View File

@@ -0,0 +1,46 @@
import { Button } from "@/components/ui/button";
//import {useSettingStore} from "@/lib/store/useSettings";
import { Tag } from "lucide-react";
import { useState } from "react";
import { toast } from "sonner";
import { useAuth } from "@/lib/authClient";
import type { LotType } from "../../../-types/lots";
import { manualPrintLabels } from "./ManualPrintLabel";
export default function ManualPrint({ lot }: { lot: LotType }) {
const { session } = useAuth();
const [printing, setPrinting] = useState(false);
//const {settings} = useSettingStore();
//const server = settings.filter((n) => n.name === "server")[0]?.value;
//const serverPort = settings.filter((n) => n.name === "serverPort")[0]?.value;
//const serverUrl = `http://${server}:${serverPort}`;
const handlePrintLabel = async (lot: LotType) => {
const labels: any = await manualPrintLabels(lot, session?.user);
if (labels.success) {
toast.success(labels.message);
setTimeout(() => {
setPrinting(false);
}, 5 * 1000);
setPrinting(true);
} else {
toast.error(labels.message);
setTimeout(() => {
setPrinting(false);
}, 5 * 1000);
}
};
return (
<Button
variant="outline"
size="icon"
onClick={() => handlePrintLabel(lot)}
disabled={printing}
>
<Tag className="h-[16px] w-[16px]" />
</Button>
);
}

View File

@@ -0,0 +1,256 @@
import axios from "axios";
import { Tag } from "lucide-react";
import { useState } from "react";
import { Controller, useForm } from "react-hook-form";
import { toast } from "sonner";
import { Button } from "@/components/ui/button";
import {
Dialog,
DialogContent,
// DialogDescription,
DialogFooter,
DialogHeader,
DialogTitle,
DialogTrigger,
} from "@/components/ui/dialog";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import {
Select,
SelectContent,
SelectGroup,
SelectItem,
SelectLabel,
SelectTrigger,
SelectValue,
} from "@/components/ui/select";
import { Textarea } from "@/components/ui/textarea";
import { useSettingStore } from "../../../-lib/store/useSettings";
const printReason = [
{ key: "printerIssue", label: "Printer Related" },
{ key: "missingRfidTag", label: "Missing or incorrect tag" },
{ key: "rfidMissScan", label: "Missed Scan from RFID reader" },
{ key: "strapper", label: "Strapper Error" },
{ key: "manualCheck", label: "20th pallet check" },
{ key: "outOfSync", label: "Labeler Out of Sync" },
];
export default function ManualPrintForm() {
const token = localStorage.getItem("auth_token");
const { settings } = useSettingStore();
const [open, setOpen] = useState(false);
const [isSubmitting, setIsSubmitting] = useState(false);
const server = settings.filter((n) => n.name === "server")[0]?.value;
// const serverPort = settings.filter((n) => n.name === "serverPort")[0]?.value;
// const serverUrl = `http://${server}:${serverPort}`;
// what is the dyco set to? rfid or dyco
const dyco = settings.filter((n) => n.name === "dycoPrint");
const {
register,
handleSubmit,
//watch,
formState: { errors },
reset,
control,
} = useForm();
const handleManualPrintLog = async (logData: any) => {
// toast.success(`A new label was sent to printer: ${lot.PrinterName} for line ${lot.MachineDescription} `);
const logdataUrl = `/lst/old/api/ocp/manuallabellog`;
setIsSubmitting(true);
axios
.post(logdataUrl, logData, {
headers: { Authorization: `Bearer ${token}` },
})
.then((d) => {
console.log(d);
if (d.data.success) {
toast.success(d.data.message);
} else {
toast.error(d.data.message);
}
reset();
setOpen(false);
setIsSubmitting(false);
})
.catch((e) => {
if (e.response.status === 500) {
toast.error(`Internal Server error please try again.`);
setIsSubmitting(false);
return { sucess: false };
}
if (e.response.status === 401) {
//console.log(e.response);
toast.error(`You are not authorized to do this.`);
setIsSubmitting(false);
return { sucess: false };
}
});
};
const onSubmit = (data: any) => {
console.log(data);
handleManualPrintLog(data);
};
const closeForm = () => {
reset();
setOpen(false);
};
return (
<Dialog
open={open}
onOpenChange={(isOpen) => {
if (!open) {
reset();
}
setOpen(isOpen);
// toast.message("Model was something", {
// description: isOpen ? "Modal is open" : "Modal is closed",
// });
}}
>
<DialogTrigger asChild>
<Button variant="outline" size="icon">
<Tag className="h-[16px] w-[16px]" />
</Button>
</DialogTrigger>
<DialogContent className="sm:max-w-[425px]">
<DialogHeader>
<DialogTitle>Manual Print form</DialogTitle>
{/* <DialogDescription>
Make changes to your profile here. Click save when
you're done.
</DialogDescription> */}
</DialogHeader>
<form onSubmit={handleSubmit(onSubmit)}>
<p>
To manually print a label you must complete all the required fields
below.
<br />
If you clicked this in error just click close
</p>
<hr className="mt-2 mb-2" />
{server == "usday1vms006" ? (
<Controller
control={control}
name="printReason"
defaultValue={""}
render={({
field: { onChange },
fieldState: {},
//formState,
}) => (
<Select onValueChange={onChange}>
<SelectTrigger className="w-[180px]">
<SelectValue placeholder="Select Reason" />
</SelectTrigger>
<SelectContent>
<SelectGroup>
<SelectLabel>Print Reasons</SelectLabel>
{printReason.map((printReason: any) => (
<SelectItem value={printReason.key}>
{printReason.label}
</SelectItem>
))}
</SelectGroup>
</SelectContent>
</Select>
)}
/>
) : (
<div className="m-2">
<Label htmlFor="printRason" className="m-1">
Why are you manually printing?
</Label>
<Input
type="text"
className={errors.printReason ? "border-red-500" : ""}
aria-invalid={!!errors.printReason}
{...register("printReason", {
required: true,
minLength: {
value: 5,
message: "To short of a reason please try again!",
},
})}
/>
</div>
)}
<div className="m-2">
<Label htmlFor="line" className="m-1">
"What is the line number you are printing?"
</Label>
<Input
//variant="underlined"
type="number"
className={errors.line ? "border-red-500" : ""}
aria-invalid={!!errors.line}
{...register("line", { required: true })}
/>
</div>
<div className="m-2">
<Label htmlFor="initials" className="m-1">
Enter intials
</Label>
<Input
//variant="underlined"
//label="Enter intials"
{...register("initials", { required: true })}
/>
</div>
<hr />
{dyco[0].value === "0" && (
<div>
<p>Enter the missing tag number.</p>
<hr />
<Label htmlFor="rfidTag" className="m-1">
Enter the tag number only Example ALPLA000002541. only enter
2541
</Label>
<Input
type="text"
className={errors.printReason ? "border-red-500" : ""}
aria-invalid={!!errors.printReason}
{...register("rfidTag", {
required: true,
minLength: {
value: 1,
message: "Tag number is to short!",
},
})}
/>
</div>
)}
<div className="m-2">
<Textarea
//label="Comments"
placeholder="add more info as needed."
{
...register("additionalComments")
// { required: true, minLength: 10 }
}
/>
</div>
<DialogFooter>
<div className="mt-3">
<Button color="danger" variant="default" onClick={closeForm}>
Close
</Button>
<Button color="primary" type="submit" disabled={isSubmitting}>
Print
</Button>
</div>
</DialogFooter>
</form>
</DialogContent>
</Dialog>
);
}

View File

@@ -0,0 +1,44 @@
import axios from "axios";
import type { LotType } from "../../../-types/lots";
export const manualPrintLabels = async (lot: LotType, user: any) => {
//console.log(lot);
const labelUrl = `/lst/old/api/ocp/manualprintandfollow`;
try {
const res = await axios.post(
labelUrl,
{ line: lot.MachineLocation, printerName: lot.PrinterName },
{ headers: { Authorization: `Basic ${user?.prod}` } },
);
if (res.data.success) {
return {
success: true,
message: `A new label was printed for ${lot.MachineDescription} to printer: ${lot.PrinterName}`,
};
} else {
return {
success: false,
message: `Line ${lot.MachineDescription} encountered an error printing labels: ${res.data.message}`,
};
}
} catch (error: any) {
if (error.response.status === 500) {
//toast.error(`Internal Server error please try again.`);
return {
success: false,
message: `Internal Server error please try again.`,
};
}
if (error.response.status === 401) {
//console.log(e.response);
//toast.error(`You are not authorized to do this.`);
return {
success: false,
message: `You are not authorized to do this.`,
};
}
}
};

View File

@@ -0,0 +1,46 @@
import { useQuery } from "@tanstack/react-query";
import axios from "axios";
import { useMemo } from "react";
import { toast } from "sonner";
import { getOcpLogs } from "../../-utils/querys/ocp/ocpLogs";
import { ocpColumns } from "../../-utils/tableData/production/ocpLogs/ocpLogColumns";
import { OcpLogTable } from "../../-utils/tableData/production/ocpLogs/ocpLogData";
export default function OcpLogs() {
const { data, isError, isLoading } = useQuery(getOcpLogs("4"));
const clearLog = async (log: any) => {
try {
const res = await axios.patch(`/lst/old/api/logger/logs/${log.log_id}`);
if (res.data.success) {
toast.success(`Log message: ${log.message}, was just cleared`);
} else {
console.log(res);
toast.error(`There was an error clearing the message.`);
}
} catch (error) {
toast.error(`There was an error trying to clearing the message.`);
}
};
const columns = useMemo(() => ocpColumns(clearLog), [clearLog]);
const logData = data ? data : [];
if (isError) {
return <div>Error</div>;
}
if (isLoading) {
return <div>Loading</div>;
}
return (
<div className="m-2">
<OcpLogTable
columns={columns}
data={logData}
//style={style}
/>
</div>
);
}

View File

@@ -0,0 +1,134 @@
import {
ResizableHandle,
ResizablePanel,
ResizablePanelGroup,
} from "@/components/ui/resizable";
import { useSettingStore } from "../../-lib/store/useSettings";
import WrapperManualTrigger from "../ocme/WrapperCard";
import LabelLog from "./LabelLog";
import LabelRatio from "./LabelRatio";
import Lots from "./Lots";
import OcpLogs from "./OcpLogs";
import PrinterStatus from "./PrinterStatus";
export default function OCPPage() {
const { settings } = useSettingStore();
if (settings.length === 0) return;
let token = settings.filter((n) => n.name === "plantToken");
return (
<div className="ml-5 w-11/12 h-9/10">
<ResizablePanelGroup
direction="horizontal"
//className="rounded-lg border"
autoSaveId="ocpPage"
>
<ResizablePanel>
<ResizablePanelGroup direction="vertical">
<ResizablePanel
style={{
overflow: "auto",
scrollbarWidth: "none",
}}
>
<Lots />
</ResizablePanel>
<ResizableHandle />
<ResizablePanel>
<ResizablePanelGroup direction="horizontal" autoSaveId="ocpPage">
<ResizablePanel
//className="text-sm p-4 overflow-scroll"
style={{
overflow: "auto",
scrollbarWidth: "none",
}}
>
<LabelLog />
</ResizablePanel>
<ResizableHandle />
<ResizablePanel
style={{
overflow: "auto",
scrollbarWidth: "none",
}}
>
<OcpLogs />
</ResizablePanel>
</ResizablePanelGroup>
</ResizablePanel>
</ResizablePanelGroup>
</ResizablePanel>
<ResizableHandle />
<ResizablePanel className="min-h-[200px] min-w-[200px] max-w-[450px]">
<ResizablePanelGroup direction="vertical" autoSaveId="ocpPage_vert">
{token[0].value === "usday1vms006" ||
(location.pathname === "localhost" && (
<ResizablePanel
style={{
overflow: "auto",
scrollbarWidth: "none",
}}
defaultSize={50}
className="min-h-[200px]"
>
<WrapperManualTrigger />
</ResizablePanel>
))}
<ResizableHandle />
<ResizablePanel>
<PrinterStatus />
<LabelRatio />
</ResizablePanel>
</ResizablePanelGroup>
</ResizablePanel>
</ResizablePanelGroup>
</div>
);
// return (
// <div className="h-screen w-full ">
// <div className="flex flex-row gap-2">
// <div className="flex flex-col w-4/5 h-dvh">
// <div className="">
// <Lots />
// </div>
// <div className="w-5/6 h-1/2">
// <Tabs defaultValue="ocplogs" className="w-full">
// <TabsList className="grid w-full grid-cols-2">
// <TabsTrigger value="ocplogs">
// OcpLogs
// </TabsTrigger>
// <TabsTrigger value="labels">Labels</TabsTrigger>
// </TabsList>
// <TabsContent value="ocplogs">
// <div className="w-full">
// <OcpLogs />
// </div>
// </TabsContent>
// <TabsContent value="labels">
// <LabelLog />
// </TabsContent>
// </Tabs>
// </div>
// </div>
// <div className="flex flex-col">
// {server[0].value === "usday1vms006" && (
// <div>
// <WrapperManualTrigger />
// </div>
// )}
// {server[0].value === "localhost" && (
// <div>
// <WrapperManualTrigger />
// </div>
// )}
// <div>
// <PrinterStatus />
// </div>
// </div>
// </div>
// </div>
// );
}

View File

@@ -0,0 +1,114 @@
import { useQuery } from "@tanstack/react-query";
import { ScrollArea } from "@/components/ui/scroll-area";
import { Skeleton } from "@/components/ui/skeleton";
import {
Table,
TableBody,
TableCell,
TableHead,
TableHeader,
TableRow,
} from "@/components/ui/table";
import { getPrinters } from "../../-utils/querys/ocp/printers";
import { LstCard } from "../extendedUi/LstCard";
let printerCols = [
{
key: "printer",
label: "Printer",
},
{
key: "statusMessage",
label: "Status Message",
},
];
export default function PrinterStatus() {
const { data, isError, isLoading } = useQuery(getPrinters());
if (isError) {
return (
<ScrollArea className="h-[400px]">
<p className="text-center">Printer Staus error</p>
<Table>
<TableHeader>
<TableRow>
{printerCols.map((l) => (
<TableHead key={l.key}>{l.label}</TableHead>
))}
</TableRow>
</TableHeader>
<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>
</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>
);
}

View File

@@ -0,0 +1,30 @@
import axios from "axios";
import { toast } from "sonner";
import { Button } from "@/components/ui/button";
export default function ManualTrigger() {
const rfidReaderTrigger = async () => {
try {
const res = await axios.post("/lst/old/api/rfid/manualtrigger/wrapper1");
if (res.data.success) {
toast.success(res.data.message);
return;
}
if (!res.data.success) {
toast.error(res.data.message);
}
} catch (error) {
console.log(error);
//stoast.success(error.data.message);
}
};
return (
<div>
<Button onClick={rfidReaderTrigger}>Wrapper 1 RFID</Button>
</div>
);
}

View File

@@ -0,0 +1,19 @@
import { queryOptions } from "@tanstack/react-query";
import axios from "axios";
export function getOcmeInfo() {
return queryOptions({
queryKey: ["ocmeInfo"],
queryFn: () => fetchSettings(),
staleTime: 1000,
refetchInterval: 2 * 2000,
refetchOnWindowFocus: true,
});
}
const fetchSettings = async () => {
const { data } = await axios.get(`/lst/old/ocme/api/v1/getInfo`);
// if we are not localhost ignore the devDir setting.
//const url: string = window.location.host.split(":")[0];
return data.data ?? [];
};

View File

@@ -0,0 +1,20 @@
import { queryOptions } from "@tanstack/react-query";
import axios from "axios";
export function getlabelRatio() {
return queryOptions({
queryKey: ["labelRatio"],
queryFn: () => fetchSettings(),
//staleTime: 1000,
refetchInterval: 2 * 2000,
refetchOnWindowFocus: true,
});
}
const fetchSettings = async () => {
const { data } = await axios.get(`/lst/old/api/ocp/labelratio`);
// if we are not localhost ignore the devDir setting.
//const url: string = window.location.host.split(":")[0];
return data.data ?? [];
};

View File

@@ -0,0 +1,20 @@
import { queryOptions } from "@tanstack/react-query";
import axios from "axios";
export function getlabels(hours: string) {
return queryOptions({
queryKey: ["labels"],
queryFn: () => fetchSettings(hours),
//staleTime: 1000,
refetchInterval: 2 * 2000,
refetchOnWindowFocus: true,
});
}
const fetchSettings = async (hours: string) => {
const { data } = await axios.get(`/lst/old/api/ocp/getlabels?hours=${hours}`);
// if we are not localhost ignore the devDir setting.
//const url: string = window.location.host.split(":")[0];
return data.data ?? [];
};

View File

@@ -0,0 +1,21 @@
import { queryOptions } from "@tanstack/react-query";
import axios from "axios";
export function getlots() {
return queryOptions({
queryKey: ["lots"],
queryFn: () => fetchSettings(),
staleTime: 10 * 1000,
refetchInterval: 1000 * 10,
refetchOnWindowFocus: true,
});
}
const fetchSettings = async () => {
const { data } = await axios.get("/lst/old/api/ocp/getlots");
// if we are not localhost ignore the devDir setting.
//const url: string = window.location.host.split(":")[0];
let lotData = data.data;
return lotData ?? [];
};

View File

@@ -0,0 +1,22 @@
import { queryOptions } from "@tanstack/react-query";
import axios from "axios";
export function getOcpLogs(hours: string) {
return queryOptions({
queryKey: ["ocpLogs"],
queryFn: () => fetchSettings(hours),
staleTime: 1000,
refetchInterval: 2 * 1000,
refetchOnWindowFocus: true,
});
}
const fetchSettings = async (hours: string) => {
const { data } = await axios.get(
`/lst/old/api/logger/logs?service=ocp&service=rfid&service=dyco&level=error&level=warn&hours=${hours}`,
);
// if we are not localhost ignore the devDir setting.
//const url: string = window.location.host.split(":")[0];
return data.data ?? [];
};

View File

@@ -0,0 +1,20 @@
import { queryOptions } from "@tanstack/react-query";
import axios from "axios";
export function getPrinters() {
return queryOptions({
queryKey: ["printers"],
queryFn: () => fetchSettings(),
staleTime: 1000,
refetchInterval: 2 * 2000,
refetchOnWindowFocus: true,
});
}
const fetchSettings = async () => {
const { data } = await axios.get(`/lst/old/api/ocp/getprinters`);
// if we are not localhost ignore the devDir setting.
//const url: string = window.location.host.split(":")[0];
return data.data ?? [];
};

View File

@@ -1,19 +0,0 @@
import { queryOptions } from "@tanstack/react-query";
import axios from "axios";
export function getOcmeInfo() {
return queryOptions({
queryKey: ["ocmeInfo"],
queryFn: () => fetchSettings(),
staleTime: 1000,
refetchInterval: 2 * 2000,
refetchOnWindowFocus: true,
});
}
const fetchSettings = async () => {
const { data } = await axios.get(`/ocme/api/v1/getInfo`);
// if we are not localhost ignore the devDir setting.
//const url: string = window.location.host.split(":")[0];
return data.data ?? [];
};

View File

@@ -1,20 +0,0 @@
import { queryOptions } from "@tanstack/react-query";
import axios from "axios";
export function getlabelRatio() {
return queryOptions({
queryKey: ["labelRatio"],
queryFn: () => fetchSettings(),
//staleTime: 1000,
refetchInterval: 2 * 2000,
refetchOnWindowFocus: true,
});
}
const fetchSettings = async () => {
const { data } = await axios.get(`/api/ocp/labelratio`);
// if we are not localhost ignore the devDir setting.
//const url: string = window.location.host.split(":")[0];
return data.data ?? [];
};

View File

@@ -1,20 +0,0 @@
import { queryOptions } from "@tanstack/react-query";
import axios from "axios";
export function getlabels(hours: string) {
return queryOptions({
queryKey: ["labels"],
queryFn: () => fetchSettings(hours),
//staleTime: 1000,
refetchInterval: 2 * 2000,
refetchOnWindowFocus: true,
});
}
const fetchSettings = async (hours: string) => {
const { data } = await axios.get(`/api/ocp/getlabels?hours=${hours}`);
// if we are not localhost ignore the devDir setting.
//const url: string = window.location.host.split(":")[0];
return data.data ?? [];
};

View File

@@ -1,21 +0,0 @@
import { queryOptions } from "@tanstack/react-query";
import axios from "axios";
export function getlots() {
return queryOptions({
queryKey: ["lots"],
queryFn: () => fetchSettings(),
staleTime: 10 * 1000,
refetchInterval: 1000 * 10,
refetchOnWindowFocus: true,
});
}
const fetchSettings = async () => {
const { data } = await axios.get("/api/ocp/getlots");
// if we are not localhost ignore the devDir setting.
//const url: string = window.location.host.split(":")[0];
let lotData = data.data;
return lotData ?? [];
};

View File

@@ -1,22 +0,0 @@
import { queryOptions } from "@tanstack/react-query";
import axios from "axios";
export function getOcpLogs(hours: string) {
return queryOptions({
queryKey: ["ocpLogs"],
queryFn: () => fetchSettings(hours),
staleTime: 1000,
refetchInterval: 2 * 1000,
refetchOnWindowFocus: true,
});
}
const fetchSettings = async (hours: string) => {
const { data } = await axios.get(
`/api/logger/logs?service=ocp&service=rfid&service=dyco&level=error&level=warn&hours=${hours}`
);
// if we are not localhost ignore the devDir setting.
//const url: string = window.location.host.split(":")[0];
return data.data ?? [];
};

View File

@@ -1,20 +0,0 @@
import { queryOptions } from "@tanstack/react-query";
import axios from "axios";
export function getPrinters() {
return queryOptions({
queryKey: ["printers"],
queryFn: () => fetchSettings(),
staleTime: 1000,
refetchInterval: 2 * 2000,
refetchOnWindowFocus: true,
});
}
const fetchSettings = async () => {
const { data } = await axios.get(`/api/ocp/getprinters`);
// if we are not localhost ignore the devDir setting.
//const url: string = window.location.host.split(":")[0];
return data.data ?? [];
};

View File

@@ -13,7 +13,7 @@ export function getReaders() {
}
const fetchReaders = async () => {
const { data } = await axios.get(`/api/rfid/getreaders`);
const { data } = await axios.get(`/lst/old/api/rfid/getreaders`);
// if we are not localhost ignore the devDir setting.
//const url: string = window.location.host.split(":")[0];
return data.data ?? [];

View File

@@ -0,0 +1,14 @@
import { createFileRoute } from "@tanstack/react-router";
import OCPPage from "../-components/ocp/OcpPage";
export const Route = createFileRoute("/_old/old/ocp/")({
component: RouteComponent,
});
function RouteComponent() {
return (
<div className="h-dvh w-dvw">
<OCPPage />
</div>
);
}

View File

@@ -29,7 +29,7 @@ function RouteComponent() {
const { session } = useAuth();
const logout = useLogout();
//const { settings } = useSettingStore();
console.log(location.pathname);
//console.log(location.pathname);
return (
<div>
<nav className="flex justify-end w-full shadow ">

View File

@@ -5,7 +5,6 @@
{ "path": "./tsconfig.node.json" }
],
"compilerOptions": {
"baseUrl": ".",
"paths": {
"@/*": ["./src/*"]
}

View File

@@ -1,31 +0,0 @@
import { Button } from "@/components/ui/button";
import axios from "axios";
import { toast } from "sonner";
export default function ManualTrigger() {
const rfidReaderTrigger = async () => {
try {
const res = await axios.post("/api/rfid/manualtrigger/wrapper1");
if (res.data.success) {
toast.success(res.data.message);
return;
}
if (!res.data.success) {
toast.error(res.data.message);
}
} catch (error) {
console.log(error);
//stoast.success(error.data.message);
}
};
return (
<div>
<Button onClick={rfidReaderTrigger}>Wrapper 1 RFID</Button>
</div>
);
}

View File

@@ -1,106 +0,0 @@
import { useForm } from "@tanstack/react-form";
import { Input } from "../ui/input";
import { Label } from "../ui/label";
import axios from "axios";
import { toast } from "sonner";
import { Button } from "../ui/button";
import { useState } from "react";
export default function ManuallyEnterRn() {
const [sending, setSendingRn] = useState(false);
const form = useForm({
defaultValues: {
runningNr: "",
},
onSubmit: async ({ value }) => {
console.log(value);
setSendingRn(true);
try {
const res = await axios.post("/ocme/api/v1/postRunningNumber", {
runningNr: value.runningNr,
areaFrom: "wrapper_1",
completed: true,
});
if (res.data.success) {
form.reset();
toast.success(
`${value.runningNr} was just created please login`
);
setTimeout(() => {
setSendingRn(false);
}, 3 * 1000);
}
if (!res.data.success) {
toast.error(res.data.message);
setTimeout(() => {
setSendingRn(false);
}, 3 * 1000);
}
} catch (error) {
//console.log(error);
toast.error("There was an error registering");
setTimeout(() => {
setSendingRn(false);
}, 3 * 1000);
}
},
});
return (
<div>
<form
onSubmit={(e) => {
e.preventDefault();
//e.stopPropagation();
}}
>
<form.Field
name="runningNr"
validators={{
// We can choose between form-wide and field-specific validators
onChange: ({ value }) =>
value.length > 3
? undefined
: "pallet number must be greater than 4 numbers",
}}
children={(field) => {
return (
<div className="m-2 min-w-48 max-w-96 p-2 flex flex-row">
<div>
<Label htmlFor="runningNr" className="mb-2">
Running Number
</Label>
<Input
name={field.name}
value={field.state.value}
onBlur={field.handleBlur}
type="number"
onChange={(e) =>
field.handleChange(e.target.value)
}
/>
{field.state.meta.errors.length ? (
<em>
{field.state.meta.errors.join(",")}
</em>
) : null}
</div>
<div className="ml-1 mt-5">
<Button
className="ml-1"
type="submit"
onClick={form.handleSubmit}
disabled={sending}
>
Submit
</Button>
</div>
</div>
);
}}
/>
</form>
</div>
);
}

View File

@@ -1,172 +0,0 @@
import axios from "axios";
import { LstCard } from "../extendedUI/LstCard";
import { Button } from "../ui/button";
import { ScrollArea } from "../ui/scroll-area";
import { Skeleton } from "../ui/skeleton";
import {
Table,
TableBody,
TableCell,
TableHead,
TableHeader,
TableRow,
} from "../ui/table";
import { toast } from "sonner";
import { getOcmeInfo } from "@/utils/querys/production/getOcmeInfo";
import { useQuery } from "@tanstack/react-query";
import { format } from "date-fns";
import { Trash } from "lucide-react";
import ManualTrigger from "../logistics/rfid/ManualTrigger";
const currentPallets = [
{ key: "line", label: "Line" },
{ key: "runningNumber", label: "Running #" },
{ key: "upd_date", label: "Date Scanned" },
{ key: "waitingfor", label: "Waiting For" },
{ key: "clear", label: "Clear" },
];
// const currentTags = [
// { key: "line", label: "Line" },
// { key: "printerName", label: "Printer" },
// { key: "runningNr", label: "Running #" },
// { key: "upd_date", label: "Label date" },
// { key: "status", label: "Label Status" },
// ];
export default function WrapperManualTrigger() {
const { data, isError, isLoading } = useQuery(getOcmeInfo());
const cameraTrigger = async () => {
try {
const res = await axios.get("/ocme/api/v1/manualCameraTrigger");
if (res.data.success) {
toast.success(res.data.message);
return;
}
if (!res.data.success) {
toast.error(res.data.message);
}
} catch (error) {
console.log(error);
//stoast.success(error.data.message);
}
};
const clearLabel = async (d: any) => {
const data = {
runningNr: d.runningNr,
};
try {
const res = await axios.patch("/ocme/api/v1/pickedUp", data);
if (res.data.success) {
toast.success(
`${d.runningNr} was just removed from being picked up.`
);
return;
}
if (!res.data.success) {
toast.error(res.data.message);
}
} catch (error) {
console.log(error);
//stoast.success(error.data.message);
}
};
if (isError) {
return (
<div>
<p className="text-center text-pretty">
There was an error getting wrapper scans
</p>
</div>
);
}
const info = data?.filter((r: any) => r.areaFrom === "wrapper_1");
return (
<LstCard className="m-2 p-2 w-auto">
<ScrollArea className="max-h-[200px]">
<span>Wrapper Pallet Info</span>
<div>
<Table>
<TableHeader>
<TableRow>
{currentPallets.map((l) => (
<TableHead key={l.key}>{l.label}</TableHead>
))}
</TableRow>
</TableHeader>
{isLoading ? (
<TableBody>
{Array(3)
.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>
) : (
<TableBody>
{info.map((i: any) => (
<TableRow key={i.runningNr}>
<TableCell className="font-medium">
{i.lineNum}
</TableCell>
<TableCell>{i.runningNr}</TableCell>
<TableCell>
{format(
i?.upd_date.replace("Z", ""),
"M/d/yyyy hh:mm"
)}
</TableCell>
<TableCell>{i.waitingFor}</TableCell>
<TableCell>
<Button
variant="destructive"
size="icon"
onClick={() => clearLabel(i)}
>
<Trash />
</Button>
</TableCell>
</TableRow>
))}
</TableBody>
)}
</Table>
</div>
</ScrollArea>
<div>
<hr />
{/* <p className="text-center mb-3">Manual Trigger</p>
<ManuallyEnterRn />
<Separator className="m-1" /> */}
<div className="flex flex-row justify-between m-2">
<Button onClick={cameraTrigger}>Camera</Button>
<ManualTrigger />
</div>
</div>
</LstCard>
);
}

View File

@@ -1,260 +0,0 @@
import { toast } from "sonner";
import { LstCard } from "../extendedUI/LstCard";
import { Button } from "../ui/button";
import { Input } from "../ui/input";
import {
Table,
TableBody,
TableCell,
TableHead,
TableHeader,
TableRow,
} from "../ui/table";
import { Skeleton } from "../ui/skeleton";
//import CycleCountLog from "./CycleCountLog";
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from "../ui/select";
import { Controller, useForm } from "react-hook-form";
import axios from "axios";
import { useState } from "react";
export default function OcmeCycleCount() {
const token = localStorage.getItem("auth_token");
const [data, setData] = useState([]);
const [counting, setCounting] = useState(false);
const {
register,
handleSubmit,
//watch,
formState: { errors },
reset,
control,
} = useForm({
defaultValues: {
lane: "",
laneType: "name",
},
});
const onSubmit = async (data: any) => {
setData([]);
setCounting(true);
if (data.laneType === "") {
toast.error("Please select a type");
setCounting(false);
return;
}
toast.success(`Cycle count started`);
try {
const res = await axios.post("/ocme/api/v1/cycleCount", data, {
headers: { Authorization: `Bearer ${token}` },
});
if (res.data.success) {
toast.success(res.data.message);
setData(res.data.data);
setCounting(false);
reset();
}
if (!res.data.success) {
toast.success(res.data.message);
setCounting(false);
}
} catch (error) {
toast.error("There was an error cycle counting");
setCounting(false);
reset();
}
};
return (
<div className="flex flex-row w-screen">
<div className="m-2 w-5/6">
<LstCard>
<p className="ml-2">
Please enter the name or laneID you want to cycle count.
</p>
<div>
<form onSubmit={handleSubmit(onSubmit)}>
<div className="flex justify-between">
<div className="m-2 flex flex-row">
<Input
placeholder="enter lane: L064"
className={
errors.lane ? "border-red-500" : ""
}
aria-invalid={!!errors.lane}
{...register("lane", {
required: true,
minLength: {
value: 3,
message:
"The lane is too short!",
},
})}
/>
<div className="ml-2">
<Controller
control={control}
name="laneType"
render={({
field: { onChange },
fieldState: {},
//formState,
}) => (
<Select
onValueChange={onChange}
>
<SelectTrigger className="w-[180px]">
<SelectValue placeholder="Select name or id" />
</SelectTrigger>
<SelectContent>
<SelectItem value="name">
Name
</SelectItem>
<SelectItem value="laneID">
Lane ID
</SelectItem>
</SelectContent>
</Select>
)}
/>
</div>
</div>
<Button
className="m-2"
type="submit"
disabled={counting}
>
{counting ? (
<span>Counting...</span>
) : (
<span>CycleCount</span>
)}
</Button>
</div>
</form>
</div>
<div>
<Table>
<TableHeader>
<TableRow>
<TableHead>LaneID</TableHead>
<TableHead>Lane</TableHead>
<TableHead>AV</TableHead>
<TableHead>Description</TableHead>
<TableHead>Running Number</TableHead>
<TableHead>In Ocme</TableHead>
<TableHead>In Stock</TableHead>
<TableHead>Result</TableHead>
</TableRow>
</TableHeader>
{data?.length === 0 ? (
<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>
</TableRow>
))}
</TableBody>
) : (
<>
{data.map((i: any) => {
let classname = ``;
if (
i.info === "Validate pallet is ok."
) {
classname = `bg-red-500`;
}
if (i.info === "Sent to Inv") {
classname = `bg-amber-700`;
}
return (
<TableRow key={i.runningNumber}>
<TableCell
className={`font-medium ${classname}`}
>
{i.alpla_laneID}
</TableCell>
<TableCell
className={`font-medium ${classname}`}
>
{i.alpla_laneDescription}
</TableCell>
<TableCell
className={`font-medium ${classname}`}
>
{i.Article}
</TableCell>
<TableCell
className={`font-medium ${classname}`}
>
{i.alpla_laneDescription}
</TableCell>
<TableCell
className={`font-medium ${classname}`}
>
{i.runningNumber}
</TableCell>
<TableCell
className={`font-medium ${classname}`}
>
{i.ocme}
</TableCell>
<TableCell
className={`font-medium ${classname}`}
>
{i.stock}
</TableCell>
<TableCell
className={`font-medium ${classname}`}
>
{i.info}
</TableCell>
</TableRow>
);
})}
</>
)}
</Table>
</div>
</LstCard>
</div>
{/* <div className="m-2">
<CycleCountLog />
</div> */}
</div>
);
}

View File

@@ -1,25 +0,0 @@
// import {useSessionStore} from "@/lib/store/sessionStore";
// import {useSettingStore} from "@/lib/store/useSettings";
import { useQuery } from "@tanstack/react-query";
import { getlabels } from "@/utils/querys/production/labels";
import { LabelTable } from "@/utils/tableData/production/labels/labelData";
import { labelolumns } from "@/utils/tableData/production/labels/labelColumns";
export default function LabelLog() {
const { data, isError, isLoading } = useQuery(getlabels("4"));
if (isError) return <div>Error</div>;
if (isLoading) return <div>Loading</div>;
const labelData = data ? data : [];
return (
<div className="m-2">
<LabelTable
columns={labelolumns}
data={labelData}
//style={style}
/>
</div>
);
}

View File

@@ -1,27 +0,0 @@
import { getlabelRatio } from "@/utils/querys/production/labelRatio";
import { labelRatioColumns } from "@/utils/tableData/production/labelRatio/labelRatioColumns";
import { LabelRatioTable } from "@/utils/tableData/production/labelRatio/labelRatioData";
import { useQuery } from "@tanstack/react-query";
export default function LabelRatio() {
const { data, isError, isLoading } = useQuery(getlabelRatio());
const ratioData = data ? data : [];
if (isError) {
return <div>Error</div>;
}
if (isLoading) {
return <div>Loading</div>;
}
return (
<div className="m-2">
<LabelRatioTable
columns={labelRatioColumns}
data={ratioData}
//style={style}
/>
</div>
);
}

View File

@@ -1,44 +0,0 @@
import { Button } from "@/components/ui/button";
import { useSessionStore } from "@/lib/store/sessionStore";
//import {useSettingStore} from "@/lib/store/useSettings";
import { LotType } from "@/types/lots";
import { Tag } from "lucide-react";
import { toast } from "sonner";
import { manualPrintLabels } from "./ManualPrintLabel";
import { useState } from "react";
export default function ManualPrint({ lot }: { lot: LotType }) {
const { user } = useSessionStore();
const [printing, setPrinting] = useState(false);
//const {settings} = useSettingStore();
//const server = settings.filter((n) => n.name === "server")[0]?.value;
//const serverPort = settings.filter((n) => n.name === "serverPort")[0]?.value;
//const serverUrl = `http://${server}:${serverPort}`;
const handlePrintLabel = async (lot: LotType) => {
const labels: any = await manualPrintLabels(lot, user);
if (labels.success) {
toast.success(labels.message);
setTimeout(() => {
setPrinting(false);
}, 5 * 1000);
setPrinting(true);
} else {
toast.error(labels.message);
setTimeout(() => {
setPrinting(false);
}, 5 * 1000);
}
};
return (
<Button
variant="outline"
size="icon"
onClick={() => handlePrintLabel(lot)}
disabled={printing}
>
<Tag className="h-[16px] w-[16px]" />
</Button>
);
}

View File

@@ -1,275 +0,0 @@
import { Button } from "@/components/ui/button";
import {
Dialog,
DialogContent,
// DialogDescription,
DialogFooter,
DialogHeader,
DialogTitle,
DialogTrigger,
} from "@/components/ui/dialog";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import {
Select,
SelectContent,
SelectGroup,
SelectItem,
SelectLabel,
SelectTrigger,
SelectValue,
} from "@/components/ui/select";
import { Textarea } from "@/components/ui/textarea";
import { useSettingStore } from "@/lib/store/useSettings";
import axios from "axios";
import { Tag } from "lucide-react";
import { useState } from "react";
import { Controller, useForm } from "react-hook-form";
import { toast } from "sonner";
const printReason = [
{ key: "printerIssue", label: "Printer Related" },
{ key: "missingRfidTag", label: "Missing or incorrect tag" },
{ key: "rfidMissScan", label: "Missed Scan from RFID reader" },
{ key: "strapper", label: "Strapper Error" },
{ key: "manualCheck", label: "20th pallet check" },
{ key: "outOfSync", label: "Labeler Out of Sync" },
];
export default function ManualPrintForm() {
const token = localStorage.getItem("auth_token");
const { settings } = useSettingStore();
const [open, setOpen] = useState(false);
const [isSubmitting, setIsSubmitting] = useState(false);
const server = settings.filter((n) => n.name === "server")[0]?.value;
// const serverPort = settings.filter((n) => n.name === "serverPort")[0]?.value;
// const serverUrl = `http://${server}:${serverPort}`;
// what is the dyco set to? rfid or dyco
const dyco = settings.filter((n) => n.name === "dycoPrint");
const {
register,
handleSubmit,
//watch,
formState: { errors },
reset,
control,
} = useForm();
const handleManualPrintLog = async (logData: any) => {
// toast.success(`A new label was sent to printer: ${lot.PrinterName} for line ${lot.MachineDescription} `);
const logdataUrl = `/api/ocp/manuallabellog`;
setIsSubmitting(true);
axios
.post(logdataUrl, logData, {
headers: { Authorization: `Bearer ${token}` },
})
.then((d) => {
console.log(d);
if (d.data.success) {
toast.success(d.data.message);
} else {
toast.error(d.data.message);
}
reset();
setOpen(false);
setIsSubmitting(false);
})
.catch((e) => {
if (e.response.status === 500) {
toast.error(`Internal Server error please try again.`);
setIsSubmitting(false);
return { sucess: false };
}
if (e.response.status === 401) {
//console.log(e.response);
toast.error(`You are not authorized to do this.`);
setIsSubmitting(false);
return { sucess: false };
}
});
};
const onSubmit = (data: any) => {
console.log(data);
handleManualPrintLog(data);
};
const closeForm = () => {
reset();
setOpen(false);
};
return (
<Dialog
open={open}
onOpenChange={(isOpen) => {
if (!open) {
reset();
}
setOpen(isOpen);
// toast.message("Model was something", {
// description: isOpen ? "Modal is open" : "Modal is closed",
// });
}}
>
<DialogTrigger asChild>
<Button variant="outline" size="icon">
<Tag className="h-[16px] w-[16px]" />
</Button>
</DialogTrigger>
<DialogContent className="sm:max-w-[425px]">
<DialogHeader>
<DialogTitle>Manual Print form</DialogTitle>
{/* <DialogDescription>
Make changes to your profile here. Click save when
you're done.
</DialogDescription> */}
</DialogHeader>
<form onSubmit={handleSubmit(onSubmit)}>
<p>
To manually print a label you must complete all the
required fields below.
<br />
If you clicked this in error just click close
</p>
<hr className="mt-2 mb-2" />
{server == "usday1vms006" ? (
<Controller
control={control}
name="printReason"
defaultValue={""}
render={({
field: { onChange },
fieldState: {},
//formState,
}) => (
<Select onValueChange={onChange}>
<SelectTrigger className="w-[180px]">
<SelectValue placeholder="Select Reason" />
</SelectTrigger>
<SelectContent>
<SelectGroup>
<SelectLabel>
Print Reasons
</SelectLabel>
{printReason.map(
(printReason: any) => (
<SelectItem
value={printReason.key}
>
{printReason.label}
</SelectItem>
)
)}
</SelectGroup>
</SelectContent>
</Select>
)}
/>
) : (
<div className="m-2">
<Label htmlFor="printRason" className="m-1">
Why are you manually printing?
</Label>
<Input
type="text"
className={
errors.printReason ? "border-red-500" : ""
}
aria-invalid={!!errors.printReason}
{...register("printReason", {
required: true,
minLength: {
value: 5,
message:
"To short of a reason please try again!",
},
})}
/>
</div>
)}
<div className="m-2">
<Label htmlFor="line" className="m-1">
"What is the line number you are printing?"
</Label>
<Input
//variant="underlined"
type="number"
className={errors.line ? "border-red-500" : ""}
aria-invalid={!!errors.line}
{...register("line", { required: true })}
/>
</div>
<div className="m-2">
<Label htmlFor="initials" className="m-1">
Enter intials
</Label>
<Input
//variant="underlined"
//label="Enter intials"
{...register("initials", { required: true })}
/>
</div>
<hr />
{dyco[0].value === "0" && (
<div>
<p>Enter the missing tag number.</p>
<hr />
<Label htmlFor="rfidTag" className="m-1">
Enter the tag number only Example
ALPLA000002541. only enter 2541
</Label>
<Input
type="text"
className={
errors.printReason ? "border-red-500" : ""
}
aria-invalid={!!errors.printReason}
{...register("rfidTag", {
required: true,
minLength: {
value: 1,
message: "Tag number is to short!",
},
})}
/>
</div>
)}
<div className="m-2">
<Textarea
//label="Comments"
placeholder="add more info as needed."
{
...register("additionalComments")
// { required: true, minLength: 10 }
}
/>
</div>
<DialogFooter>
<div className="mt-3">
<Button
color="danger"
variant="default"
onClick={closeForm}
>
Close
</Button>
<Button
color="primary"
type="submit"
disabled={isSubmitting}
>
Print
</Button>
</div>
</DialogFooter>
</form>
</DialogContent>
</Dialog>
);
}

View File

@@ -1,44 +0,0 @@
import { LotType } from "@/types/lots";
import axios from "axios";
export const manualPrintLabels = async (lot: LotType, user: any) => {
//console.log(lot);
const labelUrl = `/api/ocp/manualprintandfollow`;
try {
const res = await axios.post(
labelUrl,
{ line: lot.MachineLocation, printerName: lot.PrinterName },
{ headers: { Authorization: `Basic ${user?.prod}` } }
);
if (res.data.success) {
return {
success: true,
message: `A new label was printed for ${lot.MachineDescription} to printer: ${lot.PrinterName}`,
};
} else {
return {
success: false,
message: `Line ${lot.MachineDescription} encountered an error printing labels: ${res.data.message}`,
};
}
} catch (error: any) {
if (error.response.status === 500) {
//toast.error(`Internal Server error please try again.`);
return {
success: false,
message: `Internal Server error please try again.`,
};
}
if (error.response.status === 401) {
//console.log(e.response);
//toast.error(`You are not authorized to do this.`);
return {
success: false,
message: `You are not authorized to do this.`,
};
}
}
};

View File

@@ -1,46 +0,0 @@
import { getOcpLogs } from "@/utils/querys/production/ocpLogs";
import { ocpColumns } from "@/utils/tableData/production/ocpLogs/ocpLogColumns";
import { OcpLogTable } from "@/utils/tableData/production/ocpLogs/ocpLogData";
import { useQuery } from "@tanstack/react-query";
import axios from "axios";
import { useMemo } from "react";
import { toast } from "sonner";
export default function OcpLogs() {
const { data, isError, isLoading } = useQuery(getOcpLogs("4"));
const clearLog = async (log: any) => {
try {
const res = await axios.patch(`/api/logger/logs/${log.log_id}`);
if (res.data.success) {
toast.success(`Log message: ${log.message}, was just cleared`);
} else {
console.log(res);
toast.error(`There was an error clearing the message.`);
}
} catch (error) {
toast.error(`There was an error trying to clearing the message.`);
}
};
const columns = useMemo(() => ocpColumns(clearLog), [clearLog]);
const logData = data ? data : [];
if (isError) {
return <div>Error</div>;
}
if (isLoading) {
return <div>Loading</div>;
}
return (
<div className="m-2">
<OcpLogTable
columns={columns}
data={logData}
//style={style}
/>
</div>
);
}

View File

@@ -1,153 +0,0 @@
import WrapperManualTrigger from "@/components/ocme/WrapperCard";
import Lots from "./Lots";
import OcpLogs from "./OcpLogs";
import PrinterStatus from "./PrinterStatus";
import { useSettingStore } from "@/lib/store/useSettings";
import LabelLog from "./LabelLog";
import {
ResizableHandle,
ResizablePanel,
ResizablePanelGroup,
} from "@/components/ui/resizable-panels";
import LabelRatio from "./LabelRatio";
export default function OCPPage() {
const { settings } = useSettingStore();
if (settings.length === 0) return;
let server = settings.filter((n) => n.name === "server");
return (
<div className="ml-5 w-11/12 h-9/10">
<ResizablePanelGroup
direction="horizontal"
//className="rounded-lg border"
autoSaveId="ocpPage"
>
<ResizablePanel>
<ResizablePanelGroup direction="vertical">
<ResizablePanel
style={{
overflow: "auto",
scrollbarWidth: "none",
}}
>
<Lots />
</ResizablePanel>
<ResizableHandle />
<ResizablePanel>
<ResizablePanelGroup
direction="horizontal"
autoSaveId="ocpPage"
>
<ResizablePanel
//className="text-sm p-4 overflow-scroll"
style={{
overflow: "auto",
scrollbarWidth: "none",
}}
>
<LabelLog />
</ResizablePanel>
<ResizableHandle />
<ResizablePanel
style={{
overflow: "auto",
scrollbarWidth: "none",
}}
>
<OcpLogs />
</ResizablePanel>
</ResizablePanelGroup>
</ResizablePanel>
</ResizablePanelGroup>
</ResizablePanel>
<ResizableHandle />
<ResizablePanel className="min-h-[200px] min-w-[200px] max-w-[450px]">
<ResizablePanelGroup
direction="vertical"
autoSaveId="ocpPage_vert"
>
{server[0].value === "usday1vms006" && (
<ResizablePanel
style={{
overflow: "auto",
scrollbarWidth: "none",
}}
defaultSize={50}
className="min-h-[200px]"
>
<WrapperManualTrigger />
</ResizablePanel>
)}
{server[0]?.value === "localhost" && (
<ResizablePanel
className="min-h-[200px]"
style={{
overflow: "auto",
scrollbarWidth: "none",
}}
defaultSize={50}
>
<WrapperManualTrigger />
</ResizablePanel>
)}
<ResizableHandle />
<ResizablePanel>
<PrinterStatus />
<LabelRatio />
</ResizablePanel>
</ResizablePanelGroup>
</ResizablePanel>
</ResizablePanelGroup>
</div>
);
// return (
// <div className="h-screen w-full ">
// <div className="flex flex-row gap-2">
// <div className="flex flex-col w-4/5 h-dvh">
// <div className="">
// <Lots />
// </div>
// <div className="w-5/6 h-1/2">
// <Tabs defaultValue="ocplogs" className="w-full">
// <TabsList className="grid w-full grid-cols-2">
// <TabsTrigger value="ocplogs">
// OcpLogs
// </TabsTrigger>
// <TabsTrigger value="labels">Labels</TabsTrigger>
// </TabsList>
// <TabsContent value="ocplogs">
// <div className="w-full">
// <OcpLogs />
// </div>
// </TabsContent>
// <TabsContent value="labels">
// <LabelLog />
// </TabsContent>
// </Tabs>
// </div>
// </div>
// <div className="flex flex-col">
// {server[0].value === "usday1vms006" && (
// <div>
// <WrapperManualTrigger />
// </div>
// )}
// {server[0].value === "localhost" && (
// <div>
// <WrapperManualTrigger />
// </div>
// )}
// <div>
// <PrinterStatus />
// </div>
// </div>
// </div>
// </div>
// );
}

View File

@@ -1,114 +0,0 @@
import { LstCard } from "@/components/extendedUI/LstCard";
import { ScrollArea } from "@/components/ui/scroll-area";
import { Skeleton } from "@/components/ui/skeleton";
import {
Table,
TableBody,
TableCell,
TableHead,
TableHeader,
TableRow,
} from "@/components/ui/table";
import { getPrinters } from "@/utils/querys/production/printers";
import { useQuery } from "@tanstack/react-query";
let printerCols = [
{
key: "printer",
label: "Printer",
},
{
key: "statusMessage",
label: "Status Message",
},
];
export default function PrinterStatus() {
const { data, isError, isLoading } = useQuery(getPrinters());
if (isError) {
return (
<ScrollArea className="h-[400px]">
<p className="text-center">Printer Staus error</p>
<Table>
<TableHeader>
<TableRow>
{printerCols.map((l) => (
<TableHead key={l.key}>{l.label}</TableHead>
))}
</TableRow>
</TableHeader>
<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>
</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>
);
}

View File

@@ -1,14 +0,0 @@
import OcmeCycleCount from "@/components/ocme/ocmeCycleCount";
import {createFileRoute} from "@tanstack/react-router";
export const Route = createFileRoute("/(ocme)/cyclecount/")({
component: RouteComponent,
});
function RouteComponent() {
return (
<div className="m-2">
<OcmeCycleCount />
</div>
);
}

View File

@@ -1,13 +0,0 @@
import {createFileRoute} from "@tanstack/react-router";
export const Route = createFileRoute("/about")({
component: About,
});
function About() {
return (
<div className="m-auto">
<h2>About page to come.</h2>
</div>
);
}

View File

@@ -1,14 +0,0 @@
import Changelog from "@/components/changelog/ChangeLog";
import { createFileRoute } from "@tanstack/react-router";
export const Route = createFileRoute("/changelog")({
component: RouteComponent,
});
function RouteComponent() {
return (
<div>
<Changelog />
</div>
);
}

View File

@@ -1,17 +0,0 @@
import { createFileRoute } from "@tanstack/react-router";
//import GridLayout from "react-grid-layout";
import "../../node_modules/react-grid-layout/css/styles.css";
import "../../node_modules/react-resizable/css/styles.css";
import DashBoard from "@/components/dashboard/DashBoard";
export const Route = createFileRoute("/")({
component: Index,
});
function Index() {
return (
<div className="h-dvh w-dvw">
<DashBoard />
</div>
);
}

View File

@@ -1,14 +0,0 @@
import OCPPage from "@/components/production/ocp/OcpPage";
import { createFileRoute } from "@tanstack/react-router";
export const Route = createFileRoute("/ocp/")({
component: RouteComponent,
});
function RouteComponent() {
return (
<div className="h-dvh w-dvw">
<OCPPage />
</div>
);
}