update

src/app/api/po/actions.ts

@@ -57,7 +57,9 @@ export interface PurchaseQCInput {
 }
 export interface EscalationInput {
   status: string;
+  remarks?: string;
   handler: string;
+  productLotNo: string;
   acceptedQty: number; // this is the qty to be escalated
   // escalationQty: number
 }

src/components/PickOrderDetail/PickOrderDetail.tsx

@@ -795,7 +795,7 @@ const PickOrderDetail: React.FC<Props> = ({ consoCode, qc }) => {
             </Button>
           </Grid>
           {/* homemade qrcode for testing purpose */}
-          <Grid
+          {/* <Grid
             item
             xs={12}
             style={{ display: "flex", justifyContent: "center" }}
@@ -804,7 +804,7 @@ const PickOrderDetail: React.FC<Props> = ({ consoCode, qc }) => {
               content={homemade_Qrcode}
               sx={{ width: 200, height: 200 }}
             />
-          </Grid>
+          </Grid> */}
         </Grid>
         <Grid container xs={12} justifyContent="space-between">
           {/* <Grid item xs={12} sx={{ height: 400 }}>

src/components/PoDetail/EscalationForm.tsx

@@ -87,7 +87,7 @@ const EscalationForm: React.FC<Props> = ({
   useEffect(() => {
     console.log("triggered");
     setValue("status", status);
-  }, []);
+  }, [setValue, status]);
 
   return (
     <Grid container justifyContent="flex-start" alignItems="flex-start">
@@ -108,6 +108,18 @@ const EscalationForm: React.FC<Props> = ({
         spacing={2}
         sx={{ mt: 0.5 }}
       >
+        <Grid item xs={12}>
+          <TextField
+            label={t("productLotNo")}
+            fullWidth
+            {...register("productLotNo", {
+              required: "productLotNo required!",
+            })}
+            disabled={disabled}
+            error={Boolean(errors.productLotNo)}
+            helperText={errors.productLotNo?.message}
+          />
+        </Grid>
         <Grid item xs={6}>
           <TextField
             label={t("reportQty")}
@@ -124,6 +136,24 @@ const EscalationForm: React.FC<Props> = ({
             helperText={errors.acceptedQty?.message}
           />
         </Grid>
+        <Grid item xs={6}>
+          <TextField
+            label={t("uom")}
+            fullWidth
+            disabled={true}
+            defaultValue={itemDetail.uom.code}
+          />
+        </Grid>
+        <Grid item xs={12}>
+          <TextField
+            label={t("remarks")}
+            fullWidth
+            {...register("remarks", {
+
+            })}
+            disabled={disabled}
+          />
+        </Grid>
       </Grid>
       <Grid
         container

src/components/PoDetail/PoDetail.tsx

@@ -106,14 +106,14 @@ const PoDetail: React.FC<Props> = ({ po, qc, warehouse }) => {
     console.log(checkRes);
     const newPo = await fetchPoInClient(purchaseOrder.id);
     setPurchaseOrder(newPo);
-  }, [checkPolAndCompletePo, fetchPoInClient]);
+  }, [purchaseOrder.id]);
 
   const handleStartPo = useCallback(async () => {
     const startRes = await startPo(purchaseOrder.id);
     console.log(startRes);
     const newPo = await fetchPoInClient(purchaseOrder.id);
     setPurchaseOrder(newPo);
-  }, [startPo, fetchPoInClient]);
+  }, [purchaseOrder.id]);
 
   useEffect(() => {
     setRows(purchaseOrder.pol || []);
@@ -127,11 +127,11 @@ const PoDetail: React.FC<Props> = ({ po, qc, warehouse }) => {
     const [stockInLine, setStockInLine] = useState(row.stockInLine);
     const totalWeight = useMemo(
       () => calculateWeight(row.qty, row.uom),
-      [calculateWeight],
+      [row.qty, row.uom],
     );
     const weightUnit = useMemo(
       () => returnWeightUnit(row.uom),
-      [returnWeightUnit],
+      [row.uom],
     );
 
     useEffect(() => {
@@ -142,7 +142,7 @@ const PoDetail: React.FC<Props> = ({ po, qc, warehouse }) => {
       } else {
         setCurrStatus("pending".toUpperCase());
       }
-    }, [processedQty]);
+    }, [processedQty, row.qty]);
 
     return (
       <>

src/components/PoDetail/PoQcStockInModal.tsx

@@ -160,7 +160,7 @@ const PoQcStockInModal: React.FC<Props> = ({
   const checkStockIn = useCallback(
     (data: ModalFormInput): boolean => {
       let hasErrors = false;
-      if (!isFinite(accQty) || accQty!! <= 0 ) {
+      if (!isFinite(accQty) || accQty! <= 0 ) {
         formProps.setError("acceptedQty", {
           message: `${t("Accepted qty must greater than")} ${
             0
@@ -168,7 +168,7 @@ const PoQcStockInModal: React.FC<Props> = ({
           type: "required",
         });
         hasErrors = true;
-      } else if (accQty!! > itemDetail.acceptedQty) {
+      } else if (accQty! > itemDetail.acceptedQty) {
         formProps.setError("acceptedQty", {
           message: `${t("Accepted qty must not greater than")} ${
             itemDetail.acceptedQty
@@ -214,7 +214,7 @@ const PoQcStockInModal: React.FC<Props> = ({
       }
       return hasErrors;
     },
-    [itemDetail, formProps],
+    [accQty, itemDetail.acceptedQty, itemDetail.shelfLife, productLotNo, formProps, t],
   );
 
   const checkPutaway = useCallback(

src/components/PoDetail/QcForm.tsx

@@ -97,7 +97,7 @@ const QcForm: React.FC<Props> = ({ qc, itemDetail, disabled }) => {
   useEffect(() => {
     clearErrors();
     validateForm();
-  }, [validateForm]);
+  }, [clearErrors, validateForm]);
 
   const columns = useMemo<GridColDef[]>(
     () => [