Browse Source

typo qrcodescanner

master
cyril.tsui 1 month ago
parent
commit
6bff46ded1
5 changed files with 18 additions and 18 deletions
  1. +2
    -2
      src/components/MailSetting/MailSetting.tsx
  2. +2
    -2
      src/components/PickOrderDetail/PickOrderDetail.tsx
  3. +2
    -2
      src/components/PoDetail/PutawayForm.tsx
  4. +2
    -2
      src/components/PoDetail/QrModal.tsx
  5. +10
    -10
      src/components/QrCodeScannerProvider/QrCodeScannerProvider.tsx

+ 2
- 2
src/components/MailSetting/MailSetting.tsx View File

@@ -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 {


+ 2
- 2
src/components/PickOrderDetail/PickOrderDetail.tsx View File

@@ -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();


+ 2
- 2
src/components/PoDetail/PutawayForm.tsx View File

@@ -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();


+ 2
- 2
src/components/PoDetail/QrModal.tsx View File

@@ -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();


+ 10
- 10
src/components/QrCodeScannerProvider/QrCodeScannerProvider.tsx View File

@@ -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;


Loading…
Cancel
Save