Add QR style barcode

frontend/package.json

@@ -87,7 +87,7 @@
     "eslint-plugin-prettier": "^5.0.0",
     "eslint-plugin-react": "^7.33.2",
     "eslint-plugin-react-hooks": "^4.6.0",
-    "prettier": "^3.3.2",
+    "prettier": "^3.4.2",
     "sass": "^1.57.1"
   }
 }

frontend/src/components/printBarcode/BarcodeContext.js

@@ -0,0 +1,6 @@
+import React from "react";
+
+export const BarcodeContext = React.createContext({
+  format: "barcode",
+  setFormat: () => {},
+});

frontend/src/components/printBarcode/ExistingOrder.js

@@ -19,8 +19,12 @@ import CustomLabNumberInput from "../common/CustomLabNumberInput";
 import { NotificationContext } from "../layout/Layout";
 import { AlertDialog, NotificationKinds } from "../common/CustomNotification";
 import { getFromOpenElisServer } from "../utils/Utils";
+import { BarcodeContext } from "./BarcodeContext";
 
 const ExistingOrder = () => {
+  const { format } = useContext(BarcodeContext);
+  // console.log(format);
+
   const intl = useIntl();
   const componentMounted = useRef(false);
   const [accessionNumber, setAccessionNumber] = useState("");
@@ -75,21 +79,21 @@ const ExistingOrder = () => {
 
   const printLabelSets = () => {
     setSource(
-      `/LabelMakerServlet?labNo=${accessionNumber}&type=default&quantity=`,
+      `/LabelMakerServlet?labNo=${accessionNumber}&type=default&quantity=&format=${format}`,
     );
     setRenderBarcode(true);
   };
 
   const printOrderLabels = () => {
     setSource(
-      `/LabelMakerServlet?labNo=${accessionNumber}&type=order&quantity=${orderLabels}`,
+      `/LabelMakerServlet?labNo=${accessionNumber}&type=order&quantity=${orderLabels}&format=${format}`,
     );
     setRenderBarcode(true);
   };
 
   const printSpecimenLabels = (specimenAccessionNumber) => {
     setSource(
-      `/LabelMakerServlet?labNo=${specimenAccessionNumber}&type=specimen&quantity=1`,
+      `/LabelMakerServlet?labNo=${specimenAccessionNumber}&type=specimen&quantity=1&format=${format}`,
     );
     setRenderBarcode(true);
   };

frontend/src/components/printBarcode/Index.js

@@ -1,29 +1,58 @@
-import React from "react";
+import React, { useState } from "react";
 import { FormattedMessage } from "react-intl";
-import { Column, Grid, Heading, Section } from "@carbon/react";
+import {
+  Column,
+  Grid,
+  Heading,
+  Section,
+  Select,
+  SelectItem,
+} from "@carbon/react";
 import ExistingOrder from "./ExistingOrder";
 import PrePrint from "./PrePrint";
 import PageBreadCrumb from "../common/PageBreadCrumb.js";
+import { BarcodeContext } from "./BarcodeContext";
 
 let breadcrumbs = [{ label: "home.label", link: "/" }];
+
 const PrintBarcode = () => {
+  const [barcodeFormat, setBarcodeFormat] = useState("barcode");
+
   return (
-    <div>
-      <PageBreadCrumb breadcrumbs={breadcrumbs} />
-      <Grid fullWidth={true}>
-        <Column lg={16} md={8} sm={4}>
-          <Section>
+    <BarcodeContext.Provider
+      value={{ format: barcodeFormat, setFormat: setBarcodeFormat }}
+    >
+      <div>
+        <PageBreadCrumb breadcrumbs={breadcrumbs} />
+        <Grid fullWidth={true}>
+          <Column lg={16} md={8} sm={4}>
             <Section>
-              <Heading>
-                <FormattedMessage id="barcode.print.title" />
-              </Heading>
+              <Section>
+                <Heading>
+                  <FormattedMessage id="barcode.print.title" />
+                </Heading>
+              </Section>
             </Section>
-          </Section>
-        </Column>
-      </Grid>
-      <PrePrint />
-      <ExistingOrder />
-    </div>
+          </Column>
+        </Grid>
+        <Grid>
+          <Column lg={8} md={4} sm={4}>
+            <Select
+              id="barcodeFormat"
+              labelText="Barcode Format:"
+              value={barcodeFormat}
+              onChange={(e) => setBarcodeFormat(e.target.value)}
+            >
+              <SelectItem text="Barcode (Classic)" value="barcode" />
+              <SelectItem text="QR Code" value="qr" />
+            </Select>
+          </Column>
+        </Grid>
+        <PrePrint />
+        <ExistingOrder />
+      </div>
+    </BarcodeContext.Provider>
   );
 };
+
 export default PrintBarcode;

frontend/src/components/printBarcode/PrePrint.js

@@ -1,4 +1,4 @@
-import { React, useState, useEffect, useRef } from "react";
+import { React, useState, useEffect, useRef, useContext } from "react";
 import { FormattedMessage, useIntl, injectIntl } from "react-intl";
 import {
   Checkbox,
@@ -14,8 +14,12 @@ import { getFromOpenElisServer } from "../utils/Utils";
 import { sampleTypeTestsStructure } from "../data/SampleEntryTestsForTypeProvider";
 import AutoComplete from "../common/AutoComplete";
 import "../Style.css";
+import { BarcodeContext } from "./BarcodeContext";
 
 const PrePrint = () => {
+  const { format } = useContext(BarcodeContext);
+  // console.log(format);
+
   const intl = useIntl();
   const componentMounted = useRef(false);
   const [sampleTypes, setSampleTypes] = useState([]);
@@ -149,21 +153,67 @@ const PrePrint = () => {
     setSelectedPanels([]);
   };
 
-  const prePrintLabels = () => {
+  // const prePrintLabels = () => {
+  //   console.log(selectedPanels);
+  //   const selectedTestIds = selectedTests
+  //     .map((selectedTest) => selectedTest.id)
+  //     .join(",");
+  //   const params = new URLSearchParams({
+  //     prePrinting: "true",
+  //     numSetsOfLabels: labelSets,
+  //     numOrderLabelsPerSet: orderLabelsPerSet,
+  //     numSpecimenLabelsPerSet: specimenLabelsPerSet,
+  //     facilityName: facilityId,
+  //     testIds: selectedTestIds,
+  //     format: format,
+  //   });
+  //   setSource(`LabelMakerServlet?${params.toString()}`);
+  //   setRenderBarcode(true);
+  // };
+
+  const prePrintLabels = async () => {
     console.log(selectedPanels);
     const selectedTestIds = selectedTests
       .map((selectedTest) => selectedTest.id)
       .join(",");
+
     const params = new URLSearchParams({
       prePrinting: "true",
       numSetsOfLabels: labelSets,
       numOrderLabelsPerSet: orderLabelsPerSet,
       numSpecimenLabelsPerSet: specimenLabelsPerSet,
       facilityName: facilityId,
       testIds: selectedTestIds,
+      format: format,
     });
-    setSource(`LabelMakerServlet?${params.toString()}`);
-    setRenderBarcode(true);
+
+    const url = `LabelMakerServlet?${params.toString()}`;
+    console.log("Fetching labels from:", url);
+
+    try {
+      const response = await fetch(url, {
+        // Add these options to ensure we can see the custom headers
+        credentials: "include",
+        headers: {
+          Accept: "*/*",
+        },
+      });
+
+      // Log the entire headers for debugging
+      console.log("All response headers:");
+      for (const [key, value] of response.headers.entries()) {
+        console.log(`${key}: ${value}`);
+      }
+
+      // Log the specific debug header
+      const debugLog = response.headers.get("X-Debug-Log");
+      console.log("Debug Log:", debugLog);
+
+      setSource(url);
+      setRenderBarcode(true);
+    } catch (error) {
+      console.error("Error fetching labels:", error);
+    }
   };
 
   useEffect(() => {

frontend/src/index.css

@@ -1,8 +1,8 @@
 body {
   margin: 0;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
-    "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
-    sans-serif;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto",
+    "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans",
+    "Helvetica Neue", sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }

pom.xml

@@ -31,7 +31,17 @@
 		<testContainersVersion>1.15.3</testContainersVersion>
 	</properties>
 	<dependencies>
-
+    <!-- ZXing QR Code Generation -->
+    <dependency>
+        <groupId>com.google.zxing</groupId>
+        <artifactId>core</artifactId>
+        <version>3.5.2</version>
+    </dependency>
+    <dependency>
+        <groupId>com.google.zxing</groupId>
+        <artifactId>javase</artifactId>
+        <version>3.5.2</version>
+    </dependency>
 		<dependency>
 			<groupId>commons-codec</groupId>
 			<artifactId>commons-codec</artifactId>
@@ -573,17 +583,26 @@
 		</dependency>
 	</dependencies>
 	<repositories>
-		<repository>
-			<id>jaspersoft-third-party</id>
-			<url>https://jaspersoft.jfrog.io/jaspersoft/third-party-ce-artifacts/</url>
-		</repository>
-		<repository>
-			<id>shibboleth</id>
-			<!-- openSaml -->
-			<url>https://build.shibboleth.net/maven/releases/</url>
-		</repository>
-		<!-- <repository> <id>uwdigi-repo-central</id> <name>DIGI Public Repository</name>
-			<url>https://packages.uwdigi.org/artifactory/public</url> </repository> -->
+		<!-- Maven Central Repository -->
+    <repository>
+        <id>central</id>
+        <name>Central Repository</name>
+        <url>https://repo.maven.apache.org/maven2</url>
+    </repository>
+    <repository>
+        <id>jaspersoft-third-party</id>
+        <url>https://jaspersoft.jfrog.io/jaspersoft/third-party-ce-artifacts/</url>
+    </repository>
+    <repository>
+        <id>shibboleth</id>
+        <!-- openSaml-->
+        <url>https://build.shibboleth.net/maven/releases/</url>
+    </repository>
+    <repository>
+        <id>uwdigi-repo-central</id>
+        <name>DIGI Public Repository</name>
+        <url>https://packages.uwdigi.org/artifactory/public</url>
+    </repository>
 	</repositories>
 	<build>
 		<finalName>OpenELIS-Global</finalName>
@@ -756,6 +775,7 @@
 						<importOrder />
 						<!-- standard import order -->
 
+
 						<removeUnusedImports />
 
 						<eclipse>
@@ -798,9 +818,6 @@
 
 				</executions>
 			</plugin>
-
-
-
 		</plugins>
 	</build>
 </project>