From 14b29eba976aa5501b0acb486def2f04eae1f27e Mon Sep 17 00:00:00 2001 From: "cyril.tsui" Date: Tue, 12 Aug 2025 17:13:07 +0800 Subject: [PATCH 1/2] quick update --- src/theme/ThemeRegistry.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/theme/ThemeRegistry.tsx b/src/theme/ThemeRegistry.tsx index e2628bf..22c9831 100644 --- a/src/theme/ThemeRegistry.tsx +++ b/src/theme/ThemeRegistry.tsx @@ -17,7 +17,7 @@ const getLocalizationFromLang = (lang: string) => { // Copied from https://github.com/mui/material-ui/blob/master/examples/material-ui-nextjs-ts/src/components/ThemeRegistry/ThemeRegistry.tsx export default function ThemeRegistry({ children, - lang, + lang = "zh", }: { children: React.ReactNode; lang: string; @@ -28,7 +28,7 @@ export default function ThemeRegistry({ ); return ( - + {children} From 62555ebef1b76701b1fd6cdb7225bec1f6f3dc96 Mon Sep 17 00:00:00 2001 From: "MSI\\derek" Date: Tue, 12 Aug 2025 18:24:52 +0800 Subject: [PATCH 2/2] update qc modal in po inputgrid: now trigger with urlParams --- src/components/PoDetail/PoDetail.tsx | 14 +++++++-- src/components/PoDetail/PoInputGrid.tsx | 41 ++++++++++++++++++------- 2 files changed, 42 insertions(+), 13 deletions(-) diff --git a/src/components/PoDetail/PoDetail.tsx b/src/components/PoDetail/PoDetail.tsx index 5ffb3f8..17fd4f5 100644 --- a/src/components/PoDetail/PoDetail.tsx +++ b/src/components/PoDetail/PoDetail.tsx @@ -53,7 +53,7 @@ import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown"; import KeyboardArrowUpIcon from "@mui/icons-material/KeyboardArrowUp"; import PoInputGrid from "./PoInputGrid"; import { QcItemWithChecks } from "@/app/api/qc"; -import { useSearchParams } from "next/navigation"; +import { useRouter, useSearchParams, usePathname } from "next/navigation"; import { WarehouseResult } from "@/app/api/warehouse"; import { calculateWeight, returnWeightUnit } from "@/app/utils/formatUtil"; import { CameraContext } from "../Cameras/CameraProvider"; @@ -86,11 +86,14 @@ const PoDetail: React.FC = ({ po, qc, warehouse }) => { const [rows, setRows] = useState( purchaseOrder.pol || [], ); + const pathname = usePathname() + const router = useRouter(); + const searchParams = useSearchParams(); + const [row, setRow] = useState(rows[0]); const [stockInLine, setStockInLine] = useState(rows[0].stockInLine); const [processedQty, setProcessedQty] = useState(rows[0].processed); - const searchParams = useSearchParams(); // const [currPoStatus, setCurrPoStatus] = useState(purchaseOrder.status); const removeParam = (paramToRemove: string) => { @@ -232,6 +235,12 @@ const PoDetail: React.FC = ({ po, qc, warehouse }) => { ); const [isOpenScanner, setOpenScanner] = useState(false); + // const testing = useCallback(() => { + // // setOpenScanner(true); + // const newParams = new URLSearchParams(searchParams.toString()); + // console.log(pathname) + // }, [pathname, router, searchParams]); + const onOpenScanner = useCallback(() => { setOpenScanner(true); }, []); @@ -377,6 +386,7 @@ const PoDetail: React.FC = ({ po, qc, warehouse }) => { alignItems="center" > + {/* */} ) : undefined} diff --git a/src/components/PoDetail/PoInputGrid.tsx b/src/components/PoDetail/PoInputGrid.tsx index eb3392f..0dc4762 100644 --- a/src/components/PoDetail/PoInputGrid.tsx +++ b/src/components/PoDetail/PoInputGrid.tsx @@ -34,7 +34,7 @@ import { QcItemWithChecks } from "src/app/api/qc"; import PlayArrowIcon from "@mui/icons-material/PlayArrow"; import { PurchaseOrderLine, StockInLine } from "@/app/api/po"; import { createStockInLine, PurchaseQcResult } from "@/app/api/po/actions"; -import { useSearchParams } from "next/navigation"; +import { usePathname, useRouter, useSearchParams } from "next/navigation"; import { returnWeightUnit, calculateWeight, @@ -124,6 +124,10 @@ function PoInputGrid({ const [modalInfo, setModalInfo] = useState< StockInLine & { qcResult?: PurchaseQcResult[] } >(); + const pathname = usePathname() + const router = useRouter(); + const searchParams = useSearchParams(); + const [qcOpen, setQcOpen] = useState(false); const [escalOpen, setEscalOpen] = useState(false); const [stockInOpen, setStockInOpen] = useState(false); @@ -259,13 +263,29 @@ function PoInputGrid({ ); const [newOpen, setNewOpen] = useState(false); - const closeNewModal = useCallback(() => { - setNewOpen(false); - }, []); + const stockInLineId = searchParams.get("stockInLineId"); +const closeNewModal = useCallback(() => { + const newParams = new URLSearchParams(searchParams.toString()); + newParams.delete("stockInLineId"); // Remove the parameter + router.replace(`${pathname}?${newParams.toString()}`); + setTimeout(() => { + setNewOpen(false); // Close the modal first + }, 300); // Add a delay to avoid immediate re-trigger of useEffect + }, [searchParams, pathname, router]); + + // Open modal const openNewModal = useCallback(() => { setNewOpen(true); }, []); + // Open modal if `stockInLineId` exists in the URL + useEffect(() => { + if (stockInLineId && !newOpen) { + openNewModal(); + } + }, [stockInLineId, newOpen, openNewModal]); + + // Button handler to update the URL and open the modal const handleNewQC = useCallback( (id: GridRowId, params: any) => async () => { setBtnIsLoading(true); @@ -273,22 +293,21 @@ function PoInputGrid({ ...prev, [id]: { mode: GridRowModes.View }, })); + const qcResult = await fetchQcDefaultValue(id); - console.log(params.row); - console.log(qcResult); setModalInfo({ ...params.row, qcResult: qcResult, }); - // set default values + setTimeout(() => { - // open qc modal - console.log("delayed"); - openNewModal(); + const newParams = new URLSearchParams(searchParams.toString()); + newParams.set("stockInLineId", id.toString()); // Ensure `set` to avoid duplicates + router.replace(`${pathname}?${newParams.toString()}`); setBtnIsLoading(false); }, 200); }, - [fetchQcDefaultValue, openNewModal], + [fetchQcDefaultValue, searchParams, router, pathname] ); const handleEscalation = useCallback(