@@ -31,8 +31,8 @@ import { MailTemplate } from "@/app/api/mail"; | |||||
import TemplateDetails from "./TemplateDetails"; | import TemplateDetails from "./TemplateDetails"; | ||||
import QrCodeScanner from "../QrCodeScanner/QrCodeScanner"; | import QrCodeScanner from "../QrCodeScanner/QrCodeScanner"; | ||||
import { | import { | ||||
QcCodeScannerContext, | |||||
useQcCodeScanner, | |||||
QrCodeScannerContext, | |||||
useQrCodeScannerContext, | |||||
} from "../QrCodeScannerProvider/QrCodeScannerProvider"; | } from "../QrCodeScannerProvider/QrCodeScannerProvider"; | ||||
export interface Props { | export interface Props { | ||||
@@ -31,7 +31,7 @@ import { | |||||
import { PlayArrow } from "@mui/icons-material"; | import { PlayArrow } from "@mui/icons-material"; | ||||
import DoneIcon from "@mui/icons-material/Done"; | import DoneIcon from "@mui/icons-material/Done"; | ||||
import { GridRowSelectionModel } from "@mui/x-data-grid"; | import { GridRowSelectionModel } from "@mui/x-data-grid"; | ||||
import { useQcCodeScanner } from "../QrCodeScannerProvider/QrCodeScannerProvider"; | |||||
import { useQrCodeScannerContext } from "../QrCodeScannerProvider/QrCodeScannerProvider"; | |||||
import { | import { | ||||
completeConsoPickOrder, | completeConsoPickOrder, | ||||
CreateStockOutLine, | CreateStockOutLine, | ||||
@@ -630,7 +630,7 @@ const PickOrderDetail: React.FC<Props> = ({ consoCode, qc }) => { | |||||
setOpenScanner((prev) => !prev); | setOpenScanner((prev) => !prev); | ||||
}, []); | }, []); | ||||
const scanner = useQcCodeScanner(); | |||||
const scanner = useQrCodeScannerContext(); | |||||
useEffect(() => { | useEffect(() => { | ||||
if (isOpenScanner && !scanner.isScanning) { | if (isOpenScanner && !scanner.isScanning) { | ||||
scanner.startScan(); | scanner.startScan(); | ||||
@@ -47,7 +47,7 @@ import ReactQrCodeScanner, { | |||||
ScannerConfig, | ScannerConfig, | ||||
} from "../ReactQrCodeScanner/ReactQrCodeScanner"; | } from "../ReactQrCodeScanner/ReactQrCodeScanner"; | ||||
import { QrCodeInfo } from "@/app/api/qrcode"; | import { QrCodeInfo } from "@/app/api/qrcode"; | ||||
import { useQcCodeScanner } from "../QrCodeScannerProvider/QrCodeScannerProvider"; | |||||
import { useQrCodeScannerContext } from "../QrCodeScannerProvider/QrCodeScannerProvider"; | |||||
import dayjs from "dayjs"; | import dayjs from "dayjs"; | ||||
import arraySupport from "dayjs/plugin/arraySupport"; | import arraySupport from "dayjs/plugin/arraySupport"; | ||||
dayjs.extend(arraySupport); | dayjs.extend(arraySupport); | ||||
@@ -219,7 +219,7 @@ const PutawayForm: React.FC<Props> = ({ itemDetail, warehouse, disabled }) => { | |||||
); | ); | ||||
// QR Code Scanner | // QR Code Scanner | ||||
const scanner = useQcCodeScanner(); | |||||
const scanner = useQrCodeScannerContext(); | |||||
useEffect(() => { | useEffect(() => { | ||||
if (isOpenScanner) { | if (isOpenScanner) { | ||||
scanner.startScan(); | scanner.startScan(); | ||||
@@ -27,7 +27,7 @@ import { QrCodeInfo } from "@/app/api/qrcode"; | |||||
import { Check } from "@mui/icons-material"; | import { Check } from "@mui/icons-material"; | ||||
import { useTranslation } from "react-i18next"; | import { useTranslation } from "react-i18next"; | ||||
import { useSearchParams } from "next/navigation"; | import { useSearchParams } from "next/navigation"; | ||||
import { useQcCodeScanner } from "../QrCodeScannerProvider/QrCodeScannerProvider"; | |||||
import { useQrCodeScannerContext } from "../QrCodeScannerProvider/QrCodeScannerProvider"; | |||||
interface Props extends Omit<ModalProps, "children"> { | interface Props extends Omit<ModalProps, "children"> { | ||||
warehouse: WarehouseResult[]; | warehouse: WarehouseResult[]; | ||||
@@ -83,7 +83,7 @@ const QrModal: React.FC<Props> = ({ open, onClose, warehouse }) => { | |||||
); | ); | ||||
// QR Code Scanner | // QR Code Scanner | ||||
const scanner = useQcCodeScanner(); | |||||
const scanner = useQrCodeScannerContext(); | |||||
useEffect(() => { | useEffect(() => { | ||||
if (open && !scanner.isScanning) { | if (open && !scanner.isScanning) { | ||||
scanner.startScan(); | scanner.startScan(); | ||||
@@ -8,7 +8,7 @@ import { | |||||
useState, | useState, | ||||
} from "react"; | } from "react"; | ||||
interface QcCodeScanner { | |||||
interface QrCodeScanner { | |||||
values: string[]; | values: string[]; | ||||
isScanning: boolean; | isScanning: boolean; | ||||
startScan: () => void; | startScan: () => void; | ||||
@@ -20,14 +20,14 @@ interface QrCodeScannerProviderProps { | |||||
children: ReactNode; | children: ReactNode; | ||||
} | } | ||||
export const QcCodeScannerContext = createContext<QcCodeScanner | undefined>( | |||||
export const QrCodeScannerContext = createContext<QrCodeScanner | undefined>( | |||||
undefined, | undefined, | ||||
); | ); | ||||
const QrCodeScannerProvider: React.FC<QrCodeScannerProviderProps> = ({ | const QrCodeScannerProvider: React.FC<QrCodeScannerProviderProps> = ({ | ||||
children, | children, | ||||
}) => { | }) => { | ||||
const [qcCodeScannerValues, setQrCodeScannerValues] = useState<string[]>([]); | |||||
const [qrCodeScannerValues, setQrCodeScannerValues] = useState<string[]>([]); | |||||
const [isScanning, setIsScanning] = useState<boolean>(false); | const [isScanning, setIsScanning] = useState<boolean>(false); | ||||
const [keys, setKeys] = useState<string[]>([]); | const [keys, setKeys] = useState<string[]>([]); | ||||
const [leftCurlyBraceCount, setLeftCurlyBraceCount] = useState<number>(0); | const [leftCurlyBraceCount, setLeftCurlyBraceCount] = useState<number>(0); | ||||
@@ -82,7 +82,7 @@ const QrCodeScannerProvider: React.FC<QrCodeScannerProviderProps> = ({ | |||||
keys.join("").substring(startBrace, endBrace + 1), | keys.join("").substring(startBrace, endBrace + 1), | ||||
]); | ]); | ||||
console.log(keys); | console.log(keys); | ||||
console.log(qcCodeScannerValues); | |||||
console.log(qrCodeScannerValues); | |||||
// reset | // reset | ||||
setKeys(() => []); | setKeys(() => []); | ||||
@@ -92,9 +92,9 @@ const QrCodeScannerProvider: React.FC<QrCodeScannerProviderProps> = ({ | |||||
}, [keys, leftCurlyBraceCount, rightCurlyBraceCount]); | }, [keys, leftCurlyBraceCount, rightCurlyBraceCount]); | ||||
return ( | return ( | ||||
<QcCodeScannerContext.Provider | |||||
<QrCodeScannerContext.Provider | |||||
value={{ | value={{ | ||||
values: qcCodeScannerValues, | |||||
values: qrCodeScannerValues, | |||||
isScanning: isScanning, | isScanning: isScanning, | ||||
startScan: startQrCodeScanner, | startScan: startQrCodeScanner, | ||||
stopScan: endQrCodeScanner, | stopScan: endQrCodeScanner, | ||||
@@ -102,15 +102,15 @@ const QrCodeScannerProvider: React.FC<QrCodeScannerProviderProps> = ({ | |||||
}} | }} | ||||
> | > | ||||
{children} | {children} | ||||
</QcCodeScannerContext.Provider> | |||||
</QrCodeScannerContext.Provider> | |||||
); | ); | ||||
}; | }; | ||||
export const useQcCodeScanner = (): QcCodeScanner => { | |||||
const context = useContext(QcCodeScannerContext); | |||||
export const useQrCodeScannerContext = (): QrCodeScanner => { | |||||
const context = useContext(QrCodeScannerContext); | |||||
if (!context) { | if (!context) { | ||||
throw new Error( | throw new Error( | ||||
"useQcCodeScanner must be used within a QcCodeScannerProvider", | |||||
"useQrCodeScanner must be used within a QrCodeScannerProvider", | |||||
); | ); | ||||
} | } | ||||
return context; | return context; | ||||