for easy locate lot qrcode

src/app/api/pdf/actions.ts

@@ -22,3 +22,18 @@ export const fetchPoQrcode = async (data: any) => {
 
   return reportBlob;
 };
+export interface LotLineToQrcode {
+  inventoryLotLineId: number
+}
+export const fetchQrCodeByLotLineId = async (data: LotLineToQrcode) => {
+    const reportBlob = await serverFetchBlob<FileResponse>(
+    `${BASE_API_URL}/inventoryLotLine/print-label`,
+    {
+      method: "POST",
+      body: JSON.stringify(data),
+      headers: { "Content-Type": "application/json" },
+    },
+  );
+
+  return reportBlob;
+}

src/components/InventorySearch/InventoryLotLineTable.tsx

@@ -1,12 +1,16 @@
 import { InventoryLotLineResult, InventoryResult } from "@/app/api/inventory";
-import { Dispatch, SetStateAction, useMemo } from "react";
+import { Dispatch, SetStateAction, useCallback, useMemo } from "react";
 import { useTranslation } from "react-i18next";
 import { Column } from "../SearchResults";
 import SearchResults, { defaultPagingController, defaultSetPagingController } from "../SearchResults/SearchResults";
-import { CheckCircleOutline, DoDisturb } from "@mui/icons-material";
+import { CheckCircleOutline, DoDisturb, EditNote } from "@mui/icons-material";
 import { arrayToDateString } from "@/app/utils/formatUtil";
 import { Typography } from "@mui/material";
 import { isFinite } from "lodash";
+import useUploadContext from "../UploadProvider/useUploadContext";
+import { downloadFile } from "@/app/utils/commonUtil";
+import { fetchQrCodeByLotLineId, LotLineToQrcode } from "@/app/api/pdf/actions";
+import QrCodeIcon from "@mui/icons-material/QrCode";
 
 interface Props {
     inventoryLotLines: InventoryLotLineResult[] | null;
@@ -18,7 +22,30 @@ interface Props {
 
 const InventoryLotLineTable: React.FC<Props> = ({ inventoryLotLines, pagingController, setPagingController, totalCount, item }) => {
     const { t } = useTranslation(["inventory"]);
+    const { setIsUploading } = useUploadContext();
 
+    const printQrcode = useCallback(async (lotLineId: number) => {
+      setIsUploading(true);
+      // const postData = { stockInLineIds: [42,43,44] };
+      const postData: LotLineToQrcode = {
+        inventoryLotLineId: lotLineId
+      }
+      const response = await fetchQrCodeByLotLineId(postData);
+      if (response) {
+        console.log(response);
+        downloadFile(new Uint8Array(response.blobValue), response.filename!);
+      }
+      setIsUploading(false);
+    }, [setIsUploading]);
+    
+    const onDetailClick = useCallback(
+      (lotLine: InventoryLotLineResult) => {
+        console.log(lotLine)
+        printQrcode(lotLine.id)
+        // lot line id to find stock in line
+      },
+      [printQrcode],
+    );
     const columns = useMemo<Column<InventoryLotLineResult>[]>(
         () => [
             // {
@@ -79,6 +106,12 @@ const InventoryLotLineTable: React.FC<Props> = ({ inventoryLotLines, pagingContr
                     return arrayToDateString(params.expiryDate)
                 },
             },
+            {
+                name: "id",
+                label: t("qrcode"),
+                onClick: onDetailClick,
+                buttonIcon: <QrCodeIcon />,
+            },
             // {
             //     name: "status",
             //     label: t("Status"),