From 637c22f1886cecf7307ced88dc951134d466a3fa Mon Sep 17 00:00:00 2001
From: "HATEC\\SPVDEV001" <tri.susilo@altama.co.id>
Date: Mon, 19 Jun 2023 15:46:03 +0700
Subject: checkout

---
 src/lib/checkout/components/Checkout.jsx | 90 ++++++++------------------------
 1 file changed, 22 insertions(+), 68 deletions(-)

(limited to 'src/lib/checkout/components/Checkout.jsx')

diff --git a/src/lib/checkout/components/Checkout.jsx b/src/lib/checkout/components/Checkout.jsx
index 088b641b..09fdbd86 100644
--- a/src/lib/checkout/components/Checkout.jsx
+++ b/src/lib/checkout/components/Checkout.jsx
@@ -4,15 +4,14 @@ import Link from '@/core/components/elements/Link/Link'
 import useAuth from '@/core/hooks/useAuth'
 import { getItemAddress } from '@/core/utils/address'
 import addressesApi from '@/lib/address/api/addressesApi'
-import CartApi from '@/lib/cart/api/CartApi'
 import { ExclamationCircleIcon } from '@heroicons/react/24/outline'
 import React, { useEffect, useRef, useState } from 'react'
 import _ from 'lodash'
-import { deleteItemCart, getCart, getItemCart } from '@/core/utils/cart'
+import { deleteItemCart, getCartApi } from '@/core/utils/cart'
 import currencyFormat from '@/core/utils/currencyFormat'
 import { toast } from 'react-hot-toast'
 import getFileBase64 from '@/core/utils/getFileBase64'
-import checkoutApi from '../api/checkoutApi'
+// import checkoutApi from '../api/checkoutApi'
 import { useRouter } from 'next/router'
 import VariantGroupCard from '@/lib/variant/components/VariantGroupCard'
 import axios from 'axios'
@@ -24,12 +23,18 @@ import whatsappUrl from '@/core/utils/whatsappUrl'
 import { createSlug } from '@/core/utils/slug'
 import { Button, Modal } from 'flowbite-react'
 import BottomPopup from '@/core/components/elements/Popup/BottomPopup'
+import { useQuery } from 'react-query'
 
 const SELF_PICKUP_ID = 32
 
+const { checkoutApi } = require('../api/checkoutApi')
+const { getProductsCheckout } = require('../api/checkoutApi')
+
 const Checkout = () => {
   const router = useRouter()
   const auth = useAuth()
+  const { data: cartCheckout } = useQuery('cartCheckout', getProductsCheckout)
+
   const [selectedAddress, setSelectedAddress] = useState({
     shipping: null,
     invoicing: null
@@ -66,8 +71,6 @@ const Checkout = () => {
   }, [addresses])
 
   const [products, setProducts] = useState(null)
-  const [totalAmount, setTotalAmount] = useState(0)
-  const [totalDiscountAmount, setTotalDiscountAmount] = useState(0)
   const [totalWeight, setTotalWeight] = useState(0)
   const [priceCheck, setPriceCheck] = useState(false)
   const [listExpedisi, setExpedisi] = useState([])
@@ -96,52 +99,10 @@ const Checkout = () => {
   }, [])
 
   useEffect(() => {
-    const loadProducts = async () => {
-      let variantIds = ''
-      let { query } = router
-      if (query?.productId) {
-        variantIds = query.productId
-      } else {
-        const cart = getCart()
-        variantIds = _.filter(cart, (o) => o.selected == true)
-          .map((o) => o.productId)
-          .join(',')
-      }
-
-      const dataProducts = await CartApi({ variantIds })
-      const productsWithQuantity = dataProducts?.map((product) => {
-        if (product.price.priceDiscount == 0) setPriceCheck(true)
-        return {
-          ...product,
-          quantity: query.quantity
-            ? query.quantity
-            : getItemCart({ productId: product.id }).quantity
-        }
-      })
-      setProducts(productsWithQuantity)
-    }
-    loadProducts()
-  }, [router])
-
-  useEffect(() => {
-    if (products) {
-      let calculateTotalAmount = 0
-      let calculateTotalDiscountAmount = 0
-      let calcuateTotalWeight = 0
-      products.forEach((product) => {
-        calculateTotalAmount += product.price.price * product.quantity
-        calculateTotalDiscountAmount +=
-          (product.price.price - product.price.priceDiscount) * product.quantity
-        calcuateTotalWeight += product.weight * product.quantity
-        if (product.weight == 0) {
-          setCheckWeight(true)
-        }
-      })
-      setTotalAmount(calculateTotalAmount)
-      setTotalDiscountAmount(calculateTotalDiscountAmount)
-      setTotalWeight(calcuateTotalWeight * 1000)
-    }
-  }, [products])
+    setProducts(cartCheckout?.products)
+    setCheckWeight(cartCheckout?.hasProductWithoutWeight)
+    setTotalWeight(cartCheckout?.totalWeight.g)
+  }, [cartCheckout])
 
   useEffect(() => {
     const loadServiceRajaOngkir = async () => {
@@ -240,7 +201,6 @@ const Checkout = () => {
     setIsLoading(false)
     window.location.href = payment.data.redirectUrl
   }
-  const taxTotal = (totalAmount - totalDiscountAmount) * 0.11
 
   return (
     <>
@@ -304,19 +264,19 @@ const Checkout = () => {
           <div className='flex flex-col gap-y-4'>
             <div className='flex gap-x-2 justify-between'>
               <div className='text-gray_r-11'>Total Belanja</div>
-              <div>{currencyFormat(totalAmount)}</div>
+              <div>{currencyFormat(cartCheckout?.totalPurchase)}</div>
             </div>
             <div className='flex gap-x-2 justify-between'>
               <div className='text-gray_r-11'>Total Diskon</div>
-              <div className='text-danger-500'>- {currencyFormat(totalDiscountAmount)}</div>
+              <div className='text-danger-500'>- {currencyFormat(cartCheckout?.totalDiscount)}</div>
             </div>
             <div className='flex gap-x-2 justify-between'>
               <div className='text-gray_r-11'>Subtotal</div>
-              <div>{currencyFormat(totalAmount - totalDiscountAmount)}</div>
+              <div>{currencyFormat(cartCheckout?.subtotal)}</div>
             </div>
             <div className='flex gap-x-2 justify-between'>
               <div className='text-gray_r-11'>PPN 11%</div>
-              <div>{currencyFormat(taxTotal)}</div>
+              <div>{currencyFormat(cartCheckout?.tax)}</div>
             </div>
             <div className='flex gap-x-2 justify-between'>
               <div className='text-gray_r-11'>
@@ -329,10 +289,7 @@ const Checkout = () => {
           <div className='flex gap-x-2 justify-between mb-4'>
             <div>Grand Total</div>
             <div className='font-semibold text-gray_r-12'>
-              {currencyFormat(
-                totalAmount -
-                  totalDiscountAmount +
-                  taxTotal +
+              {currencyFormat(cartCheckout?.grandTotal +
                   Math.round(parseInt(biayaKirim * 1.1) / 1000) * 1000
               )}
             </div>
@@ -526,19 +483,19 @@ const Checkout = () => {
               <div className='flex flex-col gap-y-4'>
                 <div className='flex gap-x-2 justify-between'>
                   <div className='text-gray_r-11'>Total Belanja</div>
-                  <div>{currencyFormat(totalAmount)}</div>
+                  <div>{currencyFormat(cartCheckout?.totalPurchase)}</div>
                 </div>
                 <div className='flex gap-x-2 justify-between'>
                   <div className='text-gray_r-11'>Total Diskon</div>
-                  <div className='text-danger-500'>- {currencyFormat(totalDiscountAmount)}</div>
+                  <div className='text-danger-500'>- {currencyFormat(cartCheckout?.totalDiscount)}</div>
                 </div>
                 <div className='flex gap-x-2 justify-between'>
                   <div className='text-gray_r-11'>Subtotal</div>
-                  <div>{currencyFormat(totalAmount - totalDiscountAmount)}</div>
+                  <div>{currencyFormat(cartCheckout?.subtotal)}</div>
                 </div>
                 <div className='flex gap-x-2 justify-between'>
                   <div className='text-gray_r-11'>PPN 11%</div>
-                  <div>{currencyFormat(taxTotal)}</div>
+                  <div>{currencyFormat(cartCheckout?.tax)}</div>
                 </div>
                 <div className='flex gap-x-2 justify-between'>
                   <div className='text-gray_r-11'>
@@ -554,10 +511,7 @@ const Checkout = () => {
               <div className='flex gap-x-2 justify-between mb-4'>
                 <div>Grand Total</div>
                 <div className='font-semibold text-gray_r-12'>
-                  {currencyFormat(
-                    totalAmount -
-                      totalDiscountAmount +
-                      taxTotal +
+                  {currencyFormat(cartCheckout?.grandTotal +
                       Math.round(parseInt(biayaKirim * 1.1) / 1000) * 1000
                   )}
                 </div>
-- 
cgit v1.2.3

