diff --git a/frontend/src/components/logistics/barcodeGenerator/BGPage.tsx b/frontend/src/components/logistics/barcodeGenerator/BGPage.tsx
index d8f0003..6b72100 100644
--- a/frontend/src/components/logistics/barcodeGenerator/BGPage.tsx
+++ b/frontend/src/components/logistics/barcodeGenerator/BGPage.tsx
@@ -9,6 +9,7 @@ import { useState } from "react";
import Barcode from "react-barcode";
import { BarcodePDFExport } from "./BarcodeExport";
import { BulkBarcodePDFExport } from "./BulkExport";
+import CommonCommands from "./CommonCommands";
export default function BGPage() {
const { data, isError, isLoading } = useQuery(getLanes());
@@ -53,98 +54,112 @@ export default function BGPage() {
return (
-
-
- Warehouse Barcodes
-
- {warehouseArray.map((i: any) => {
- const lanes = data?.filter(
- (wid: any) => wid.warehouseId === i.warehouseId
- );
- return (
-
-
-
- {i.warehouseDescription}
-
-
-
- {lanes?.map((l: any) => {
- return (
-
-
- changeBox(l)
- }
- />
-
-
- );
- })}
-
-
-
-
- );
- })}
-
-
-
- {checked.length > 0 && (
+
- Current selected lanes
+ Warehouse Barcodes
- {checked.map((c: any) => {
+ {warehouseArray.map((i: any) => {
+ const lanes = data?.filter(
+ (wid: any) =>
+ wid.warehouseId === i.warehouseId
+ );
return (
-
-
-
-
- Lane: {c.laneDescription}
-
-
-
-
-
+
+
+
+ {i.warehouseDescription}
+
+
+
+ {lanes?.map((l: any) => {
+ return (
+
+
+ changeBox(
+ l
+ )
+ }
+ />
+
+
+ );
+ })}
+
+
+
);
})}
-
-
- {checked.length > 1 && (
-
-
-
- )}
-
-
- )}
+ {checked.length > 0 && (
+
+
+ Current selected lanes
+
+ {checked.map((c: any) => {
+ return (
+
+
+
+
+ Lane: {c.laneDescription}
+
+
+
+
+
+
+ );
+ })}
+
+
+
+ {checked.length > 1 && (
+
+
+
+ )}
+
+
+
+
+ )}
+
+
+
+
);
}
diff --git a/frontend/src/components/logistics/barcodeGenerator/CommonCommands.tsx b/frontend/src/components/logistics/barcodeGenerator/CommonCommands.tsx
new file mode 100644
index 0000000..139405f
--- /dev/null
+++ b/frontend/src/components/logistics/barcodeGenerator/CommonCommands.tsx
@@ -0,0 +1,104 @@
+import { LstCard } from "@/components/extendedUI/LstCard";
+import { CardContent, CardFooter, CardHeader } from "@/components/ui/card";
+import { Checkbox } from "@/components/ui/checkbox";
+import { useState } from "react";
+import Barcode from "react-barcode";
+import { BarcodePDFExport } from "./BarcodeExport";
+import { BulkBarcodePDFExport } from "./BulkExport";
+
+const commoncmd = [{ name: "Relocate", commandId: 33 }];
+export default function CommonCommands() {
+ const [checked, setChecked] = useState([]);
+
+ // handle the onchange
+ const changeBox = (d: any) => {
+ setChecked((prev: any) => {
+ if (prev.includes(d)) {
+ return prev.filter((name: any) => name !== d);
+ } else {
+ return [...prev, d];
+ }
+ });
+ };
+ return (
+
+
+
+ Common Barcodes
+
+ {commoncmd.map((i: any) => {
+ return (
+
+
+ changeBox(i)}
+ />
+
+
+
+ );
+ })}
+
+
+
+
+
+ {checked.length > 0 && (
+
+
+ Current selected Barcodes
+
+ {checked.map((c: any) => {
+ return (
+
+
+
+
+ Bacrode: {c.name}
+
+
+
+
+
+
+ );
+ })}
+
+
+
+ {checked.length > 1 && (
+
+
+
+ )}
+
+
+
+
+ )}
+
+
+ );
+}