feat(migration): moved material helper over
This commit is contained in:
@@ -0,0 +1,42 @@
|
||||
import { createFileRoute } from "@tanstack/react-router";
|
||||
import ConsumeMaterial from "../../../-components/logistics/materialHelper/consumption/ConsumeMaterial";
|
||||
import PreformReturn from "../../../-components/logistics/materialHelper/consumption/MaterialReturn";
|
||||
import TransferToNextLot from "../../../-components/logistics/materialHelper/consumption/TransferToNextLot";
|
||||
|
||||
export const Route = createFileRoute(
|
||||
"/_old/old/(logistics)/materialHelper/consumption/",
|
||||
)({
|
||||
component: RouteComponent,
|
||||
head: () => ({
|
||||
meta: [
|
||||
{
|
||||
name: "description",
|
||||
content: "My App is a web application",
|
||||
},
|
||||
{
|
||||
title: "LST - Logistics",
|
||||
},
|
||||
],
|
||||
}),
|
||||
});
|
||||
|
||||
function RouteComponent() {
|
||||
const url: string = window.location.host.split(":")[0];
|
||||
const auth = localStorage.getItem("auth_token");
|
||||
return (
|
||||
<div className="flex flex-wrap">
|
||||
{auth ? (
|
||||
<>
|
||||
<ConsumeMaterial />
|
||||
{url === "localhost" && <PreformReturn />}
|
||||
<TransferToNextLot />
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<ConsumeMaterial />
|
||||
<TransferToNextLot />
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,25 @@
|
||||
import { createFileRoute } from "@tanstack/react-router";
|
||||
import MaterialHelperPage from "../../-components/logistics/materialHelper/materialHelperPage";
|
||||
|
||||
export const Route = createFileRoute("/_old/old/(logistics)/materialHelper/")({
|
||||
component: RouteComponent,
|
||||
head: () => ({
|
||||
meta: [
|
||||
{
|
||||
name: "description",
|
||||
content: "My App is a web application",
|
||||
},
|
||||
{
|
||||
title: "LST - Logistics",
|
||||
},
|
||||
],
|
||||
}),
|
||||
});
|
||||
|
||||
function RouteComponent() {
|
||||
return (
|
||||
<div>
|
||||
<MaterialHelperPage />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,107 @@
|
||||
import axios from "axios";
|
||||
import { useState } from "react";
|
||||
import { useForm } from "react-hook-form";
|
||||
import { toast } from "sonner";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { CardHeader } from "@/components/ui/card";
|
||||
import { Input } from "@/components/ui/input";
|
||||
import { Label } from "@/components/ui/label";
|
||||
import { LstCard } from "../../../extendedUi/LstCard";
|
||||
|
||||
export default function ConsumeMaterial() {
|
||||
const { register: register1, handleSubmit: handleSubmit1, reset } = useForm();
|
||||
const [submitting, setSubmitting] = useState(false);
|
||||
|
||||
const handleConsume = async (data: any) => {
|
||||
setSubmitting(true);
|
||||
try {
|
||||
// const result = await axios.post(`/api/logistics/consume`, data, {
|
||||
// headers: {Authorization: `Bearer ${token}`},
|
||||
// });
|
||||
const result = await axios.post(`/lst/old/api/logistics/consume`, data);
|
||||
if (result.data.success) {
|
||||
toast.success(result.data.message);
|
||||
setSubmitting(false);
|
||||
reset();
|
||||
}
|
||||
if (!result.data.success) {
|
||||
//console.log(result.data);
|
||||
setSubmitting(false);
|
||||
|
||||
toast.error(result.data.message);
|
||||
}
|
||||
} catch (error: any) {
|
||||
console.log(error);
|
||||
setSubmitting(false);
|
||||
if (error.status === 401) {
|
||||
toast.error("Unauthorized to do this task.");
|
||||
} else {
|
||||
toast.error(
|
||||
"Unexpected error if this continues please constact an admin.",
|
||||
);
|
||||
}
|
||||
}
|
||||
};
|
||||
return (
|
||||
<div className="m-2">
|
||||
<LstCard>
|
||||
<CardHeader>
|
||||
<p className="text-center text-lg">Consuming Material.</p>
|
||||
</CardHeader>
|
||||
<div className="flex m-1">
|
||||
<div className="w-96 m-1">
|
||||
<LstCard>
|
||||
<form onSubmit={handleSubmit1(handleConsume)}>
|
||||
<div className="m-2">
|
||||
<Label htmlFor="runningNr">Enter unit running number</Label>
|
||||
<Input
|
||||
className="mt-2"
|
||||
//defaultValue="634"
|
||||
type="number"
|
||||
{...register1("runningNr")}
|
||||
/>
|
||||
</div>
|
||||
<div className="m-2">
|
||||
<Label htmlFor="lotNum">Enter lot number</Label>
|
||||
<Input
|
||||
className="mt-2"
|
||||
//defaultValue="634"
|
||||
type="number"
|
||||
{...register1("lotNum")}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Button
|
||||
className="m-2"
|
||||
color="primary"
|
||||
type="submit"
|
||||
disabled={submitting}
|
||||
>
|
||||
Consume materal
|
||||
</Button>
|
||||
</form>
|
||||
</LstCard>
|
||||
</div>
|
||||
<div className="m-1 p-1">
|
||||
<LstCard>
|
||||
<div className="w-96 p-1">
|
||||
<ol>
|
||||
<li>
|
||||
1. Enter the running number of the material you would like
|
||||
to consume
|
||||
</li>
|
||||
<li>2. Enter the lot number you will be consuming to</li>
|
||||
<li>3. Press consume material</li>
|
||||
</ol>
|
||||
<p className="text-pretty w-96">
|
||||
*This process is only for barcoded material, if it is set to
|
||||
auto consume you will encounter and error.
|
||||
</p>
|
||||
</div>
|
||||
</LstCard>
|
||||
</div>
|
||||
</div>
|
||||
</LstCard>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,144 @@
|
||||
import axios from "axios";
|
||||
import { useState } from "react";
|
||||
import { useForm } from "react-hook-form";
|
||||
import { toast } from "sonner";
|
||||
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { CardHeader } from "@/components/ui/card";
|
||||
import { Input } from "@/components/ui/input";
|
||||
import { Label } from "@/components/ui/label";
|
||||
import { LstCard } from "../../../extendedUi/LstCard";
|
||||
|
||||
export default function PreformReturn() {
|
||||
const { register: register1, handleSubmit: handleSubmit1, reset } = useForm();
|
||||
const [submitting, setSubmitting] = useState(false);
|
||||
|
||||
const handleConsume = async (data: any) => {
|
||||
setSubmitting(true);
|
||||
try {
|
||||
const result = await axios.post(
|
||||
`/lst/old/auth/api/logistics/consume`,
|
||||
data,
|
||||
);
|
||||
if (result.data.success) {
|
||||
toast.success(result.data.message);
|
||||
setSubmitting(false);
|
||||
reset();
|
||||
}
|
||||
if (!result.data.success) {
|
||||
//console.log(result.data);
|
||||
setSubmitting(false);
|
||||
|
||||
toast.error(result.data.message);
|
||||
}
|
||||
} catch (error: any) {
|
||||
//console.log(error);
|
||||
setSubmitting(false);
|
||||
if (error.status === 401) {
|
||||
toast.error("Unauthorized to do this task.");
|
||||
} else {
|
||||
toast.error(
|
||||
"Unexpected error if this continues please constact an admin.",
|
||||
);
|
||||
}
|
||||
}
|
||||
};
|
||||
return (
|
||||
<div className="m-2">
|
||||
<LstCard>
|
||||
<CardHeader>
|
||||
<p className="text-center text-lg">Preform Return.</p>
|
||||
</CardHeader>
|
||||
<div className="flex m-1">
|
||||
<div className="w-96 m-1">
|
||||
<LstCard>
|
||||
<form onSubmit={handleSubmit1(handleConsume)}>
|
||||
<div className="m-2">
|
||||
<Label htmlFor="runningNr">Enter unit running number</Label>
|
||||
<Input
|
||||
className="mt-2"
|
||||
//defaultValue="634"
|
||||
type="number"
|
||||
{...register1("runningNr")}
|
||||
/>
|
||||
</div>
|
||||
<div className="m-2">
|
||||
<Label htmlFor="lotNum">
|
||||
Enter the new wight of the gaylord of preforms
|
||||
</Label>
|
||||
<Input
|
||||
className="mt-2"
|
||||
//defaultValue="634"
|
||||
type="number"
|
||||
{...register1("lotNum")}
|
||||
/>
|
||||
</div>
|
||||
<div className="m-2">
|
||||
<Label htmlFor="lotNum">
|
||||
Select the printer you would like to print to
|
||||
</Label>
|
||||
<Input
|
||||
className="mt-2"
|
||||
//defaultValue="634"
|
||||
type="number"
|
||||
{...register1("lotNum")}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="m-2">
|
||||
<Label htmlFor="lotNum">
|
||||
Select the staging location to be returned to.
|
||||
</Label>
|
||||
<Input
|
||||
className="mt-2"
|
||||
//defaultValue="634"
|
||||
type="number"
|
||||
{...register1("lotNum")}
|
||||
/>
|
||||
</div>
|
||||
<div className="m-2">
|
||||
<Label htmlFor="lotNum">
|
||||
Select type of material coming back.
|
||||
</Label>
|
||||
<Input
|
||||
className="mt-2"
|
||||
//defaultValue="634"
|
||||
type="number"
|
||||
{...register1("lotNum")}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Button
|
||||
className="m-2"
|
||||
color="primary"
|
||||
type="submit"
|
||||
disabled={submitting}
|
||||
>
|
||||
Preform return
|
||||
</Button>
|
||||
</form>
|
||||
</LstCard>
|
||||
</div>
|
||||
<div className="m-1 p-1">
|
||||
<LstCard>
|
||||
<div className="w-96 p-1">
|
||||
<ol>
|
||||
<li>
|
||||
1. Enter the running number of the preform cage you would
|
||||
like to return
|
||||
</li>
|
||||
<li>2. Enter the new weight of the gaylord</li>
|
||||
<li>3. Select the printer you would like to print to</li>
|
||||
</ol>
|
||||
<p className="text-pretty w-96">
|
||||
*As soon as you press preform return it will print a new label
|
||||
and return to the staging location.
|
||||
</p>
|
||||
</div>
|
||||
</LstCard>
|
||||
</div>
|
||||
</div>
|
||||
</LstCard>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,348 @@
|
||||
import axios from "axios";
|
||||
import { Info } from "lucide-react";
|
||||
import { useState } from "react";
|
||||
import { toast } from "sonner";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { CardContent, CardHeader } from "@/components/ui/card";
|
||||
import { Input } from "@/components/ui/input";
|
||||
import { Switch } from "@/components/ui/switch";
|
||||
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
|
||||
import {
|
||||
Tooltip,
|
||||
TooltipContent,
|
||||
TooltipTrigger,
|
||||
} from "@/components/ui/tooltip";
|
||||
import { useAppForm } from "@/lib/formStuff";
|
||||
import { useSettingStore } from "@/routes/_old/old/-lib/store/useSettings";
|
||||
import { LstCard } from "../../../extendedUi/LstCard";
|
||||
|
||||
export default function TransferToNextLot() {
|
||||
const [gaylordFilled, setGaylordFilled] = useState([0]);
|
||||
const [actualAmount, setActualAmount] = useState(0);
|
||||
const [tab, setTab] = useState("esitmate");
|
||||
const [typeSwitch, setTypeSwitch] = useState(false);
|
||||
const { settings } = useSettingStore();
|
||||
|
||||
const server = settings.filter((n: any) => n.name === "plantToken");
|
||||
const form = useAppForm({
|
||||
defaultValues: {
|
||||
runningNumber: "",
|
||||
lotNumber: "",
|
||||
originalAmount: "",
|
||||
amount: "",
|
||||
},
|
||||
onSubmit: async ({ value }) => {
|
||||
//console.log(transferData);
|
||||
//toast.success("603468: qty: 361, was transfered to lot:24897");
|
||||
try {
|
||||
const res = await axios.post("/lst/old/api/ocp/materiallottransfer", {
|
||||
runningNumber: Number(value.runningNumber),
|
||||
lotNumber: Number(value.lotNumber),
|
||||
originalAmount: Number(value.originalAmount),
|
||||
level: Number(
|
||||
gaylordFilled.length === 1
|
||||
? 0.25
|
||||
: gaylordFilled.length === 2
|
||||
? 0.5
|
||||
: gaylordFilled.length === 3
|
||||
? 0.75
|
||||
: gaylordFilled.length === 4 && 0.95,
|
||||
),
|
||||
amount: actualAmount,
|
||||
type: typeSwitch ? "eom" : "lot",
|
||||
});
|
||||
|
||||
if (res.data.success) {
|
||||
toast.success(`${res.data.message}`);
|
||||
form.reset();
|
||||
setGaylordFilled([0]);
|
||||
setActualAmount(0);
|
||||
}
|
||||
//console.log(res.data);
|
||||
|
||||
if (!res.data.success) {
|
||||
toast.error(res.data.message);
|
||||
}
|
||||
} catch (error) {
|
||||
if (error) {
|
||||
console.log(error);
|
||||
//toast.error(error)
|
||||
}
|
||||
}
|
||||
},
|
||||
});
|
||||
return (
|
||||
<div>
|
||||
<LstCard>
|
||||
<CardHeader>
|
||||
<p className="text-center text-lg">Material Transfer to Next lot</p>
|
||||
</CardHeader>
|
||||
<div>
|
||||
<div className="flex flex-wrap m-2 gap-2">
|
||||
<div className="flex gap-2">
|
||||
<div>
|
||||
<LstCard className="">
|
||||
<Tabs defaultValue={tab} onValueChange={setTab}>
|
||||
<TabsList>
|
||||
<TabsTrigger value="esitmate">
|
||||
Estimate Amount
|
||||
</TabsTrigger>
|
||||
<TabsTrigger value="actual">Actual Amount</TabsTrigger>
|
||||
</TabsList>
|
||||
|
||||
<TabsContent value="esitmate">
|
||||
<div className="grid columns-1">
|
||||
<button
|
||||
className={`box-border h-16 w-96 border-3 ${
|
||||
gaylordFilled.includes(4) ? " bg-green-500" : ""
|
||||
}`}
|
||||
onClick={() => setGaylordFilled([1, 2, 3, 4])}
|
||||
>
|
||||
<p className="text-center">Almost full - 95%</p>
|
||||
</button>
|
||||
<button
|
||||
className={`box-border h-16 w-96 border-3 ${
|
||||
gaylordFilled.includes(3) ? " bg-green-500" : ""
|
||||
}`}
|
||||
onClick={() => setGaylordFilled([1, 2, 3])}
|
||||
>
|
||||
<p className="text-center">About full - 75%</p>
|
||||
</button>
|
||||
<button
|
||||
className={`box-border h-16 w-96 border-3 ${
|
||||
gaylordFilled.includes(2) ? " bg-green-500" : ""
|
||||
}`}
|
||||
onClick={() => setGaylordFilled([1, 2])}
|
||||
>
|
||||
<p className="text-center">Half full - 50%</p>
|
||||
</button>
|
||||
<button
|
||||
className={`box-border h-16 w-96 border-3 ${
|
||||
gaylordFilled.includes(1) ? " bg-green-500" : ""
|
||||
}`}
|
||||
onClick={() => setGaylordFilled(() => [1])}
|
||||
>
|
||||
<p className="text-center">Almost empty - 25%</p>
|
||||
</button>
|
||||
</div>
|
||||
<div className="flex justify-end pr-1">
|
||||
<Button onClick={() => setGaylordFilled([0])}>
|
||||
Reset Gaylord
|
||||
</Button>
|
||||
</div>
|
||||
</TabsContent>
|
||||
<TabsContent value="actual" className="w-96">
|
||||
<CardHeader>
|
||||
<p>Enter the total amount of the cage/gaylord</p>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<Input
|
||||
type="number"
|
||||
//placeholder="35"
|
||||
onChange={(e) =>
|
||||
setActualAmount(Number(e.target.value))
|
||||
}
|
||||
/>
|
||||
</CardContent>
|
||||
</TabsContent>
|
||||
</Tabs>
|
||||
</LstCard>
|
||||
</div>
|
||||
<div>
|
||||
<div className="w-96">
|
||||
<LstCard>
|
||||
<form
|
||||
onSubmit={(e) => {
|
||||
e.preventDefault();
|
||||
form.handleSubmit();
|
||||
}}
|
||||
>
|
||||
<div className="mt-3 p-2">
|
||||
<form.AppField
|
||||
name="runningNumber"
|
||||
children={(field) => (
|
||||
<field.InputField
|
||||
label="Running Number"
|
||||
inputType="number"
|
||||
required={true}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
<div className="mt-3 p-2">
|
||||
<form.AppField
|
||||
name="lotNumber"
|
||||
children={(field) => (
|
||||
<field.InputField
|
||||
label="Lot Number"
|
||||
inputType="number"
|
||||
required={true}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
{tab !== "actual" && (
|
||||
<div className="mt-3 p-2">
|
||||
<form.AppField
|
||||
name="originalAmount"
|
||||
children={(field) => (
|
||||
<field.InputField
|
||||
label="Orignal Quantity"
|
||||
inputType="number"
|
||||
required={true}
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="flex justify-between p-2">
|
||||
<div className="flex items-center space-x-2">
|
||||
<Switch
|
||||
checked={typeSwitch}
|
||||
onCheckedChange={setTypeSwitch}
|
||||
/>
|
||||
<span>
|
||||
{typeSwitch ? (
|
||||
<div className="flex items-center space-x-2">
|
||||
<span>"EOM Transfer"</span>
|
||||
<Tooltip>
|
||||
<TooltipTrigger>
|
||||
<Info className="h-[16px] w-[16px]" />
|
||||
</TooltipTrigger>
|
||||
<TooltipContent>
|
||||
<p>
|
||||
Click the toggle if you will be
|
||||
transfering at EOM, NOTE: This will
|
||||
trigger the delayed transfer.
|
||||
</p>
|
||||
</TooltipContent>
|
||||
</Tooltip>
|
||||
</div>
|
||||
) : (
|
||||
<div className="flex items-center space-x-2">
|
||||
<span>"Lot Transfer"</span>
|
||||
<Tooltip>
|
||||
<TooltipTrigger>
|
||||
<Info className="h-[16px] w-[16px]" />
|
||||
</TooltipTrigger>
|
||||
<TooltipContent>
|
||||
<p>
|
||||
Click the toggle if you will be
|
||||
transferring at EOM, NOTE: This will
|
||||
trigger the delayed transfer.
|
||||
</p>
|
||||
</TooltipContent>
|
||||
</Tooltip>
|
||||
</div>
|
||||
)}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<form.AppForm>
|
||||
<form.SubmitButton>Transfer To Lot</form.SubmitButton>
|
||||
</form.AppForm>
|
||||
</div>
|
||||
</form>
|
||||
</LstCard>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<LstCard className="p-2">
|
||||
<CardHeader>
|
||||
<p className="text-center text-lg">
|
||||
Moving material to the next lot.
|
||||
</p>
|
||||
</CardHeader>
|
||||
{tab !== "actual" ? (
|
||||
<div>
|
||||
<ol>
|
||||
<li>
|
||||
1. Grab the gaylord running number from the gaylord at
|
||||
the line/next to the tschritter
|
||||
</li>
|
||||
<li>
|
||||
2. Grab the next lot number you are going to be running
|
||||
(or the one that state no Main material prepared)
|
||||
</li>
|
||||
<li>
|
||||
3. Enter the total gaylord weight (this is how much the
|
||||
gaylord weighed when it came in from the supplier.)
|
||||
</li>
|
||||
<li>
|
||||
4. *Click the level of the gaylord (this is just an
|
||||
estimate to move to the next lot.)
|
||||
</li>
|
||||
<li>5. type in running number on the gaylord.</li>
|
||||
<li>6. Type in the new lot number.</li>
|
||||
<li>7. Press "Transfer To Lot"</li>
|
||||
</ol>
|
||||
<br></br>
|
||||
<p>
|
||||
* to reduce the time needed to get the lot going we will
|
||||
use an estimate of how full the gaylord is.
|
||||
</p>
|
||||
<p>
|
||||
NOTE: This is not the return process, this process will
|
||||
just get the gaylord to the next lot.
|
||||
</p>
|
||||
<br />
|
||||
{settings.length > 0 && (
|
||||
<p>
|
||||
For more in depth instructions please{" "}
|
||||
<a
|
||||
href={`https://${server[0].value}prod.alpla.net/lst/d/docs/ocp/ocp#tranfer-partial-estimated-quantity-to-the-next-lot`}
|
||||
target="_blank"
|
||||
>
|
||||
<em>CLICK HERE</em>
|
||||
</a>
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
) : (
|
||||
<div>
|
||||
<ol>
|
||||
<li>
|
||||
1. Grab the gaylord running number from the gaylord at
|
||||
the line/next to the tschritter
|
||||
</li>
|
||||
<li>
|
||||
2. Grab the next lot number you are going to be running
|
||||
(or the one that state no Main material prepared)
|
||||
</li>
|
||||
<li>3. Take the gaylord to the scale and weight it</li>
|
||||
<li>
|
||||
4. Enter the weight of the gaylord minus the tar weight.
|
||||
</li>
|
||||
<li>5. type in running number on the gaylord.</li>
|
||||
<li>6. Type in the new lot number.</li>
|
||||
<li>7. Press "Transfer To Lot"</li>
|
||||
</ol>
|
||||
<br></br>
|
||||
|
||||
<p>
|
||||
NOTE: This is not the return process, this process will
|
||||
just get the gaylord to the next lot.
|
||||
</p>
|
||||
<br />
|
||||
{settings.length > 0 && (
|
||||
<p>
|
||||
For more in depth instructions please{" "}
|
||||
<a
|
||||
href={`https://${server[0].value}.alpla.net/lst/d/docs/ocp/ocp#tranfer-partial-estimated-quantity-to-the-next-lot`}
|
||||
target="_blank"
|
||||
>
|
||||
<em>CLICK HERE</em>
|
||||
</a>
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</LstCard>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</LstCard>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user