From d14158118b658223e1b6a53bc69739a30a9e041e Mon Sep 17 00:00:00 2001
From: Suh-code <yunkisuh@naver.com>
Date: Thu, 7 Nov 2024 03:28:39 +0900
Subject: [PATCH] =?UTF-8?q?feat(#6):=EA=B2=B0=EC=A0=9C=20=EC=83=81?=
 =?UTF-8?q?=ED=83=9C=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/PaymentPage/CancelPay.jsx         | 26 ++++++++++++++++-----
 src/pages/PaymentPage/PaymentCancelDone.jsx |  4 ++++
 2 files changed, 24 insertions(+), 6 deletions(-)

diff --git a/src/pages/PaymentPage/CancelPay.jsx b/src/pages/PaymentPage/CancelPay.jsx
index f75d90c..1300b71 100644
--- a/src/pages/PaymentPage/CancelPay.jsx
+++ b/src/pages/PaymentPage/CancelPay.jsx
@@ -5,11 +5,12 @@ import { useParams, useNavigate } from "react-router-dom";
 
 const CancelPay = () => {
   const [userId, setUserId] = useState(null);
+  const [merchantId, setMerchantId] = useState(null);
   const [impUid, setImpUid] = useState(null);
   const [payAmount, setPayAmount] = useState(null);
   const { orderId } = useParams();
   const navigate = useNavigate();
-
+  
 
   // 페이지가 렌더링되면 userId를 받아옴
   useEffect(() => {
@@ -35,14 +36,12 @@ const CancelPay = () => {
       const response = await axios.get(`${import.meta.env.VITE_BASE_URL}/payment/list/${userId}`);
       const paymentData = response.data;
 
-      // console.log("Fetched Payment Data:", paymentData);
+      console.log("Fetched Payment Data:", paymentData);
 
       if (paymentData.length > 0 && paymentData[0].impUid) {
         setImpUid(paymentData[0].impUid);
-        setPayAmount(paymentData[0].pay_amount);
-
-        // impUid 설정 후 handleCancel 호출
-        handleCancel(paymentData[0].impUid, paymentData[0].pay_amount);
+        setMerchantId(paymentData[0].merchantId);
+        setPayAmount(paymentData[0].payAmount);
       } else {
         console.error("impUid를 찾을 수 없습니다.");
         alert("impUid를 찾을 수 없습니다.");
@@ -53,6 +52,13 @@ const CancelPay = () => {
     }
   };
 
+  useEffect(() => {
+    if (impUid && payAmount) {
+      handleCancel(impUid, payAmount);
+    }
+  }, [impUid, payAmount]);
+
+
   // 결제 취소 요청 핸들링
   const handleCancel = async (impUid, payAmount) => {
     if (!impUid) return;
@@ -99,6 +105,14 @@ const CancelPay = () => {
       );
       console.log("결제 취소 완료:", response.data);
       alert("결제가 취소되었습니다.");
+      console.log(merchantId, impUid);
+      await axios.get(`${import.meta.env.VITE_BASE_URL}/payment/cancel`, {
+        params:{
+          id : merchantId,
+          iamUid : impUid,
+        }
+        });
+
       navigate(`/paymentCancelDone/${orderId}`);
       
     } catch (error) {
diff --git a/src/pages/PaymentPage/PaymentCancelDone.jsx b/src/pages/PaymentPage/PaymentCancelDone.jsx
index 71cf69c..27e2475 100644
--- a/src/pages/PaymentPage/PaymentCancelDone.jsx
+++ b/src/pages/PaymentPage/PaymentCancelDone.jsx
@@ -166,6 +166,10 @@ const PaymentCancelDone = () => {
         <PaymentDetailsContainer>
   {payment && (
     <>
+      <PaymentDetailRow>
+        <PaymentDetailTitle>결제 상태 :</PaymentDetailTitle>
+        <PaymentDetailValue>{payment.payStatus}</PaymentDetailValue>
+      </PaymentDetailRow>
       <PaymentDetailRow>
         <PaymentDetailTitle>주문 날짜 :</PaymentDetailTitle>
         <PaymentDetailValue>{new Date(payment.createdAt).toLocaleString()}</PaymentDetailValue>