quick update

src/components/PoDetail/PoDetail.tsx

@@ -63,6 +63,7 @@ import { PlayArrow } from "@mui/icons-material";
 import DoneIcon from "@mui/icons-material/Done";
 import { getCustomWidth } from "@/app/utils/commonUtil";
 import PoInfoCard from "./PoInfoCard";
+import { decimalFormatter, integerFormatter } from "@/app/utils/formatUtil";
 
 type Props = {
   po: PoResult;
@@ -114,7 +115,7 @@ const PoDetail: React.FC<Props> = ({ po, qc, warehouse }) => {
   }, [purchaseOrder]);
 
   function Row(props: { row: PurchaseOrderLine }) {
-    const { row } = props;
+  const { row } = props;
     const [firstReceiveQty, setFirstReceiveQty] = useState<number>()
     const [secondReceiveQty, setSecondReceiveQty] = useState<number>()
     const [open, setOpen] = useState(false);
@@ -155,14 +156,14 @@ const PoDetail: React.FC<Props> = ({ po, qc, warehouse }) => {
           </TableCell>
           <TableCell align="left">{row.itemNo}</TableCell>
           <TableCell align="left">{row.itemName}</TableCell>
-          <TableCell align="left">{row.qty}</TableCell>
-          <TableCell align="left">{processedQty}</TableCell>
+          <TableCell align="left">{integerFormatter.format(row.qty)}</TableCell>
+          <TableCell align="left">{integerFormatter.format(processedQty)}</TableCell>
           <TableCell align="left">{row.uom?.code}</TableCell>
           <TableCell align="left">
-            {totalWeight} {weightUnit}
+            {decimalFormatter.format(totalWeight)} {weightUnit}
           </TableCell>
           {/* <TableCell align="left">{weightUnit}</TableCell> */}
-          <TableCell align="left">{row.price}</TableCell>
+          <TableCell align="left">{decimalFormatter.format(row.price)}</TableCell>
           {/* <TableCell align="left">{row.expiryDate}</TableCell> */}
           <TableCell align="left">{t(`${currStatus.toLowerCase()}`)}</TableCell>
           {/* <TableCell align="left">
@@ -371,16 +372,7 @@ const PoDetail: React.FC<Props> = ({ po, qc, warehouse }) => {
           </Grid>
         </Grid>) : undefined}
         <Grid container xs={12} justifyContent="space-between">
-          <Grid item xs={8}>
-            <Tabs
-              value={tabIndex}
-              onChange={handleTabChange}
-              variant="scrollable"
-            >
-              {/* <Tab label={t("General")} iconPosition="end" /> */}
-              {/* <Tab label={t("Bind Storage")} iconPosition="end" /> */}
-            </Tabs>
-          </Grid>
+          
           {/* <Grid item xs={4}> */}
           {/* scanner */}
           {/* </Grid> */}
@@ -419,7 +411,7 @@ const PoDetail: React.FC<Props> = ({ po, qc, warehouse }) => {
                     <TableCell align="left">{t("uom")}</TableCell>
                     <TableCell align="left">{t("total weight")}</TableCell>
                     {/* <TableCell align="left">{t("weight unit")}</TableCell> */}
-                    <TableCell align="left">{t("price")}</TableCell>
+                    <TableCell align="left">{`${t("price")} (HKD)`}</TableCell>
                     {/* <TableCell align="left">{t("expiryDate")}</TableCell> */}
                     <TableCell align="left">{t("status")}</TableCell>
                     {/* start == true && firstInQty == null ? no hide : hide*/}

src/components/PoDetail/PoInputGrid.tsx

@@ -58,6 +58,7 @@ import PoQcStockInModal from "./PoQcStockInModal";
 import DoDisturbIcon from "@mui/icons-material/DoDisturb";
 import { useSession } from "next-auth/react";
 import PoQcStockInModalVer2 from "./QcStockInModalVer2";
+import { decimalFormatter, integerFormatter } from "@/app/utils/formatUtil";
 
 interface ResultWithId {
   id: number;
@@ -443,6 +444,9 @@ function PoInputGrid({
         type: "number",
         // editable: true,
         // replace with tooltip + content
+        renderCell: (params) => {
+          return integerFormatter.format(params.value)
+        }
       },
       {
         field: "uom",
@@ -464,7 +468,7 @@ function PoInputGrid({
             params.row.uom,
           );
           const weightUnit = returnWeightUnit(params.row.uom);
-          return `${weight} ${weightUnit}`;
+          return `${decimalFormatter.format(weight)} ${weightUnit}`;
         },
       },
       {