Merge pull request #119 from Hanaemong/#117

[fix] QR결제 수정
Hanaemong · Jul 9, 2024 · 5cf8cb3 · 5cf8cb3
2 parents e1f89d8 + 1ffedac
commit 5cf8cb3
Showing 1 changed file with 12 additions and 22 deletions.
diff --git a/src/pages/team/Qrcode.tsx b/src/pages/team/Qrcode.tsx
@@ -1,7 +1,6 @@
 import { useEffect, useRef, useState } from "react";
 import { Button, ConfirmCard, Topbar } from "../../components";
 import QrScanner from "qr-scanner";
-import QRCode from "qrcode.react";
 import { useLocation, useNavigate } from "react-router-dom";
 import { useMutation } from "@tanstack/react-query";
 import { transactionApi } from "../../apis/domains/transactionApi";
@@ -18,12 +17,17 @@ const Qrcode = () => {
   const [confirm, setConfirm] = useState<boolean>(false);
 
   const handleScan = (result: QrScanner.ScanResult) => {
-    const parsedData = JSON.parse(result.data);
-    // console.log(`Scan: ${JSON.stringify(parsedData)}`);
-    expense(parsedData.teamId);
+    try {
+      const parsedData = JSON.parse(result.data);
+      console.log(`Scan: ${JSON.stringify(parsedData)}`);
+      expense(parsedData.teamId);
+    } catch (err) {
+      console.error("Failed to parse QR code data", err);
+    }
   };
+
   const QrOptions = {
-    preferredCamera: "user",
+    preferredCamera: "environment",
     maxScansPerSecond: 5,
     highlightScanRegion: true,
   };
@@ -42,23 +46,9 @@ const Qrcode = () => {
 
   useEffect(() => {
     const videoElem = videoRef.current;
-    // const canvas: HTMLCanvasElement = document.querySelector("canvas")!;
     if (videoElem) {
-      const qrScanner = new QrScanner(
-        videoElem,
-        (result) => handleScan(result),
-        QrOptions
-      );
+      const qrScanner = new QrScanner(videoElem, handleScan, QrOptions);
       qrScanner.start();
-      // QrScanner.scanImage(canvas)
-      //   .then((result) => {
-      //     console.log(result);
-      //     const res = JSON.parse(result);
-      //     console.log(res);
-      //     expense(res.teamId);
-      //   })
-      //   .catch((error) => console.log(error || "No QR code found."));
-
       return () => qrScanner.destroy();
     }
   }, []);
@@ -108,10 +98,10 @@ const Qrcode = () => {
               />
             </>
           )}
-          <QRCode
+          {/* <QRCode
             className="size-24 hidden"
             value={JSON.stringify({ teamId: locationState.teamId })}
-          />
+          /> */}
         </div>
       </div>
     </section>