fix

2 files changed, 44 insertions, 16 deletions

diff --git a/src/lib/checkout/components/Checkout.jsx b/src/lib/checkout/components/Checkout.jsx
index 8af3d996..b4fd33ff 100644
--- a/src/lib/checkout/components/Checkout.jsx
+++ b/src/lib/checkout/components/Checkout.jsx
@@ -17,6 +17,7 @@ import { useRouter } from 'next/router'
 import VariantGroupCard from '@/lib/variant/components/VariantGroupCard'
 import axios from 'axios'
 import Script from 'next/script'
+import Image from '@/core/components/elements/Image/Image'
 
 const Checkout = () => {
   const router = useRouter()
@@ -56,6 +57,7 @@ const Checkout = () => {
     })
   }, [addresses])
 
+  const [paymentMethod, setPaymentMethod] = useState('')
   const [products, setProducts] = useState(null)
   const [totalAmount, setTotalAmount] = useState(0)
   const [totalDiscountAmount, setTotalDiscountAmount] = useState(0)
@@ -96,6 +98,11 @@ const Checkout = () => {
   const [isLoading, setIsLoading] = useState(false)
 
   const checkout = async () => {
+    if (!paymentMethod) {
+      toast.error('Metode pembayaran harus dipilih', { position: 'bottom-center' })
+      return
+    }
+
     const file = poFile.current.files[0]
     if (typeof file !== 'undefined' && file.size > 5000000) {
       toast.error('Maksimal ukuran file adalah 5MB', { position: 'bottom-center' })
@@ -121,12 +128,16 @@ const Checkout = () => {
       toast.error('Gagal melakukan transaksi, terjadi kesalahan internal')
       return
     }
-
-    const payment = await axios.post(
-      `${process.env.NEXT_PUBLIC_SELF_HOST}/api/shop/midtrans-payment?transactionId=${isCheckouted.id}`
-    )
+    
     for (const product of products) deleteItemCart({ productId: product.id })
-    window.location.href = payment.data.redirectUrl
+    if (paymentMethod == 'midtrans') {
+      const payment = await axios.post(
+        `${process.env.NEXT_PUBLIC_SELF_HOST}/api/shop/midtrans-payment?transactionId=${isCheckouted.id}`
+      )
+      window.location.href = payment.data.redirectUrl
+    } else {
+      router.push(`/shop/checkout/finish?order_id=${isCheckouted.name}`)
+    }
   }
 
   return (
@@ -222,6 +233,34 @@ const Checkout = () => {
       <Divider />
 
       <div className='p-4'>
+        <div className='font-medium mb-4'>Metode Pembayaran</div>
+        <div className='flex flex-col gap-y-3'>
+          <div
+            className={`p-2 idt-transition border rounded text-gray_r-12/80 ${
+              paymentMethod == 'manual' ? 'border-yellow_r-8 bg-yellow_r-2' : 'border-gray_r-6'
+            }`}
+            onClick={() => setPaymentMethod('manual')}
+          >
+            Bank BCA (PT. Indoteknik Dotcom)
+            <div className='mt-1'>8870-4000-81</div>
+          </div>
+          <div
+            className={`p-2 idt-transition border rounded ${
+              paymentMethod == 'midtrans' ? 'border-yellow_r-8 bg-yellow_r-2' : 'border-gray_r-6'
+            }`}
+            onClick={() => setPaymentMethod('midtrans')}
+          >
+            <Image
+              src='/images/payments/midtrans.jpg'
+              alt='Midtrans Payment'
+            />
+          </div>
+        </div>
+      </div>
+
+      <Divider />
+
+      <div className='p-4'>
         <div className='font-medium'>Purchase Order</div>
 
         <div className='mt-4 flex gap-x-3'>
diff --git a/src/lib/checkout/components/FinishCheckout.jsx b/src/lib/checkout/components/FinishCheckout.jsx
index f5346d67..33c0d46a 100644
--- a/src/lib/checkout/components/FinishCheckout.jsx
+++ b/src/lib/checkout/components/FinishCheckout.jsx
@@ -1,17 +1,6 @@
 import Link from '@/core/components/elements/Link/Link'
-import axios from 'axios'
-import { useEffect } from 'react'
 
 const FinishCheckout = ({ query }) => {
-  useEffect(() => {
-    if (query?.order_id) {
-      console.log(`${process.env.NEXT_PUBLIC_SELF_HOST}/api/shop/finish-checkout?orderName=${query.order_id}`);
-      axios.post(
-        `${process.env.NEXT_PUBLIC_SELF_HOST}/api/shop/finish-checkout?orderId=${query.order_id}`
-      )
-    }
-  }, [query])
-
   return (
     <div className='p-4'>
       <div className='rounded-xl bg-yellow_r-4 text-center border border-yellow_r-7'>