From bb9004a6fc830162dba2d00df850f7c5603a234a Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Wed, 6 Nov 2024 09:51:17 +0700 Subject: update bug products_inactive on user carts --- src/lib/cart/components/Cartheader.jsx | 354 +++++++++++++++++++++------------ 1 file changed, 223 insertions(+), 131 deletions(-) (limited to 'src/lib/cart') diff --git a/src/lib/cart/components/Cartheader.jsx b/src/lib/cart/components/Cartheader.jsx index ddb77c1f..1c30bb13 100644 --- a/src/lib/cart/components/Cartheader.jsx +++ b/src/lib/cart/components/Cartheader.jsx @@ -1,105 +1,115 @@ -import { useCallback, useEffect, useMemo, useState } from 'react' -import { getCartApi } from '../api/CartApi' -import currencyFormat from '@/core/utils/currencyFormat' -import { createSlug } from '@/core/utils/slug' -import useAuth from '@/core/hooks/useAuth' -import { useRouter } from 'next/router' -import odooApi from '@/core/api/odooApi' -import { useProductCartContext } from '@/contexts/ProductCartContext' -import Image from '@/core/components/elements/Image/Image' -import whatsappUrl from '@/core/utils/whatsappUrl' -import { AnimatePresence, motion } from 'framer-motion' -import style from '../../../../src-migrate/modules/cart/styles/item-promo.module.css' -const { ShoppingCartIcon, PhotoIcon } = require('@heroicons/react/24/outline') -const { default: Link } = require('next/link') +import { useCallback, useEffect, useMemo, useState } from 'react'; +import { getCartApi } from '../api/CartApi'; +import currencyFormat from '@/core/utils/currencyFormat'; +import { createSlug } from '@/core/utils/slug'; +import useAuth from '@/core/hooks/useAuth'; +import { useRouter } from 'next/router'; +import odooApi from '@/core/api/odooApi'; +import { useProductCartContext } from '@/contexts/ProductCartContext'; +import Image from '@/core/components/elements/Image/Image'; +import whatsappUrl from '@/core/utils/whatsappUrl'; +import { AnimatePresence, motion } from 'framer-motion'; +import style from '../../../../src-migrate/modules/cart/styles/item-promo.module.css'; +const { ShoppingCartIcon, PhotoIcon } = require('@heroicons/react/24/outline'); +const { default: Link } = require('next/link'); const Cardheader = (cartCount) => { - - const router = useRouter() - const [subTotal, setSubTotal] = useState(null) - const [buttonLoading, SetButtonTerapkan] = useState(false) - const itemLoading = [1, 2, 3] - const auth = useAuth() - const [countCart, setCountCart] = useState(null) - const { productCart, setRefreshCart, setProductCart, refreshCart, isLoading, setIsloading } = - useProductCartContext() + const router = useRouter(); + const [subTotal, setSubTotal] = useState(null); + const [buttonLoading, SetButtonTerapkan] = useState(false); + const itemLoading = [1, 2, 3]; + const auth = useAuth(); + const [countCart, setCountCart] = useState(null); + const { + productCart, + setRefreshCart, + setProductCart, + refreshCart, + isLoading, + setIsloading, + } = useProductCartContext(); - const [isHovered, setIsHovered] = useState(false) - const [isTop, setIsTop] = useState(true) + const [isHovered, setIsHovered] = useState(false); + const [isTop, setIsTop] = useState(true); const products = useMemo(() => { - return productCart?.products || [] - }, [productCart]) + return productCart?.products || []; + }, [productCart]); const handleMouseEnter = () => { - setIsHovered(true) - getCart() - } + setIsHovered(true); + getCart(); + }; const handleMouseLeave = () => { - setIsHovered(false) - } + setIsHovered(false); + }; const getCart = () => { if (!productCart && auth) { - refreshCartf() + refreshCartf(); } - } + }; const refreshCartf = useCallback(async () => { - setIsloading(true) - let cart = await getCartApi() - setProductCart(cart) - setCountCart(cart?.productTotal) - setIsloading(false) - }, [setProductCart, setIsloading]) + setIsloading(true); + let cart = await getCartApi(); + setProductCart(cart); + setCountCart(cart?.products?.length); + setIsloading(false); + }, [setProductCart, setIsloading]); useEffect(() => { - if (!products) return + if (!products) return; - let calculateTotalPriceBeforeTax = 0 - let calculateTotalTaxAmount = 0 - let calculateTotalDiscountAmount = 0 + let calculateTotalPriceBeforeTax = 0; + let calculateTotalTaxAmount = 0; + let calculateTotalDiscountAmount = 0; for (const product of products) { - if (product.quantity == '') continue + if (product.quantity == '') continue; - let priceBeforeTax = product.price.price / 1.11 - calculateTotalPriceBeforeTax += priceBeforeTax * product.quantity - calculateTotalTaxAmount += (product.price.price - priceBeforeTax) * product.quantity + let priceBeforeTax = product.price.price / 1.11; + calculateTotalPriceBeforeTax += priceBeforeTax * product.quantity; + calculateTotalTaxAmount += + (product.price.price - priceBeforeTax) * product.quantity; calculateTotalDiscountAmount += - (product.price.price - product.price.priceDiscount) * product.quantity + (product.price.price - product.price.priceDiscount) * product.quantity; } let subTotal = - calculateTotalPriceBeforeTax - calculateTotalDiscountAmount + calculateTotalTaxAmount - setSubTotal(subTotal) - }, [products]) + calculateTotalPriceBeforeTax - + calculateTotalDiscountAmount + + calculateTotalTaxAmount; + setSubTotal(subTotal); + }, [products]); useEffect(() => { if (refreshCart) { - refreshCartf() + refreshCartf(); } - setRefreshCart(false) - }, [refreshCart, refreshCartf, setRefreshCart]) + setRefreshCart(false); + }, [refreshCart, refreshCartf, setRefreshCart]); useEffect(() => { - setCountCart(cartCount.cartCount) - setRefreshCart(false) - }, [cartCount]) + setCountCart(cartCount.cartCount); + setRefreshCart(false); + }, [cartCount]); useEffect(() => { const handleScroll = () => { - setIsTop(window.scrollY === 0) - } - window.addEventListener('scroll', handleScroll) + setIsTop(window.scrollY === 0); + }; + window.addEventListener('scroll', handleScroll); return () => { - window.removeEventListener('scroll', handleScroll) - } - }, []) + window.removeEventListener('scroll', handleScroll); + }; + }, []); const handleCheckout = async () => { - SetButtonTerapkan(true) - let checkoutAll = await odooApi('POST', `/api/v1/user/${auth.id}/cart/select-all`) - router.push('/shop/checkout') - } - + SetButtonTerapkan(true); + let checkoutAll = await odooApi( + 'POST', + `/api/v1/user/${auth.id}/cart/select-all` + ); + router.push('/shop/checkout'); + }; return (
@@ -152,8 +162,13 @@ const Cardheader = (cartCount) => { className='w-full max-w-md p-2 bg-white border border-gray-200 rounded-lg shadow overflow-hidden' >
-
Keranjang Belanja
- +
+ Keranjang Belanja +
+ Lihat Semua
@@ -163,7 +178,10 @@ const Cardheader = (cartCount) => {

Silahkan{' '} - + Login {' '} Untuk Melihat Daftar Keranjang Belanja Anda @@ -172,7 +190,11 @@ const Cardheader = (cartCount) => { )} {isLoading && itemLoading.map((item) => ( -

+
@@ -194,14 +216,17 @@ const Cardheader = (cartCount) => { )} {auth && products.length > 0 && !isLoading && ( <> -
    +
      {products && products?.map((product, index) => ( <>
    • - {product.cartType === 'promotion' && ( + {product.cartType === 'promotion' && ( {product.name} {
      {product.cartType === 'promotion' && ( -

      - {product.name} -

      - )} +

      + {product.name} +

      + )} {product.cartType === 'product' && ( { {product?.price?.discountPercentage}%
      - {currencyFormat(product?.price?.price)} + {currencyFormat( + product?.price?.price + )}
      )} - +
      {product?.price?.priceDiscount > 0 ? ( - currencyFormat(product?.price?.priceDiscount) + currencyFormat( + product?.price?.priceDiscount + ) ) : ( {
-
- {product.products?.map((product) => -
- - {product?.image && {product.name}} - - -
- - {product.displayName} - - -
-
- {/*
{product.code}
*/} -
- Berat Barang: - {product.packageWeight} Kg -
-
+
+ {product.products?.map((product) => ( +
+ + {product?.image && ( + {product.name} + )} + + +
+ + {product.displayName} + + +
+
+ {/*
{product.code}
*/} +
+ + Berat Barang:{' '} + + + {product.packageWeight} Kg +
-
+
+
+ ))} + {product.freeProducts?.map((product) => ( +
+ -
- - {product?.image && {product.name}} + className='md:h-12 md:w-12 md:min-w-[48px] h-10 w-10 min-w-[40px] border border-gray-300 rounded ' + > + {product?.image && ( + {product.name} + )} + + +
+ + {product.displayName} - -
- - {product.displayName} - - -
-
- {/*
{product.code}
*/} -
- Berat Barang: - {product.packageWeight} Kg -
-
+ +
+
+ {/*
{product.code}
*/} +
+ + Berat Barang:{' '} + + + {product.packageWeight} Kg +
-
- )} +
+ ))} +
))} @@ -347,8 +433,12 @@ const Cardheader = (cartCount) => { {auth && products.length > 0 && !isLoading && ( <>
- Subtotal Sebelum PPN : - {currencyFormat(subTotal)} + + Subtotal Sebelum PPN :{' '} + + + {currencyFormat(subTotal)} +
@@ -368,7 +460,7 @@ const Cardheader = (cartCount) => { )}
- ) -} + ); +}; -export default Cardheader +export default Cardheader; -- cgit v1.2.3