From d4f59658ab714325f7ff679997c22b306e766d5c Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Fri, 11 Oct 2024 15:46:55 +0700 Subject: add penawaran instan --- .../product-detail/components/AddToQuotation.tsx | 221 +++++++++++++++++++++ .../product-detail/components/PriceAction.tsx | 9 + 2 files changed, 230 insertions(+) create mode 100644 src-migrate/modules/product-detail/components/AddToQuotation.tsx (limited to 'src-migrate/modules') diff --git a/src-migrate/modules/product-detail/components/AddToQuotation.tsx b/src-migrate/modules/product-detail/components/AddToQuotation.tsx new file mode 100644 index 00000000..cc91f729 --- /dev/null +++ b/src-migrate/modules/product-detail/components/AddToQuotation.tsx @@ -0,0 +1,221 @@ +import BottomPopup from '@/core/components/elements/Popup/BottomPopup'; +import style from '../styles/price-action.module.css'; +import { Button, Link, useToast } from '@chakra-ui/react'; +import { ArrowDownTrayIcon } from '@heroicons/react/24/outline'; +import product from 'next-seo/lib/jsonld/product'; +import { useRouter } from 'next/router'; +import { useEffect, useState } from 'react'; +import Image from '~/components/ui/image'; +import { getAuth } from '~/libs/auth'; +import { upsertUserCart } from '~/services/cart'; +import LazyLoad from 'react-lazy-load'; +import ProductSimilar from '../../../../src/lib/product/components/ProductSimilar'; +import { IProductDetail } from '~/types/product'; +import ImageNext from 'next/image'; +import { useProductCartContext } from '@/contexts/ProductCartContext'; +import { createSlug } from '~/libs/slug'; +import formatCurrency from '~/libs/formatCurrency'; +import { useProductDetail } from '../stores/useProductDetail'; + +type Props = { + variantId: number | null; + quantity?: number; + source?: 'buy' | 'add_to_cart'; + products: IProductDetail; +}; + +type Status = 'idle' | 'loading' | 'success'; + +const AddToQuotation = ({ + variantId, + quantity = 1, + source = 'add_to_cart', + products, +}: Props) => { + const auth = getAuth(); + const router = useRouter(); + const toast = useToast({ + position: 'top', + isClosable: true, + }); + + const { askAdminUrl } = useProductDetail(); + + const [product, setProducts] = useState(products); + const [status, setStatus] = useState('idle'); + const { + productCart, + setRefreshCart, + setProductCart, + refreshCart, + isLoading, + setIsloading, + } = useProductCartContext(); + + const productSimilarQuery = [ + product?.name, + `fq=-product_id_i:${product.id}`, + `fq=-manufacture_id_i:${product.manufacture?.id || 0}`, + ].join('&'); + const [addCartAlert, setAddCartAlert] = useState(false); + + const handleButton = async () => { + if (typeof auth !== 'object') { + const currentUrl = encodeURIComponent(router.asPath); + router.push(`/login?next=${currentUrl}`); + return; + } + + if (!variantId || isNaN(quantity) || typeof auth !== 'object') return; + if (status === 'success') return; + setStatus('loading'); + await upsertUserCart({ + userId: auth.id, + type: 'product', + id: variantId, + qty: quantity, + selected: true, + source: source, + qtyAppend: true, + }); + setStatus('idle'); + setRefreshCart(true); + setAddCartAlert(true); + + toast({ + title: 'Tambah ke keranjang', + description: 'Berhasil menambahkan barang ke keranjang belanja', + status: 'success', + duration: 3000, + isClosable: true, + position: 'top', + }); + + if (source === 'buy') { + router.push('/shop/quotation?source=buy'); + } + }; + useEffect(() => { + if (status === 'success') + setTimeout(() => { + setStatus('idle'); + }, 3000); + }, [status]); + + const btnConfig = { + add_to_cart: { + colorScheme: 'yellow', + + text: 'Keranjang', + }, + buy: { + colorScheme: 'red', + text: 'Beli', + }, + }; + + return ( +
+ + { + setAddCartAlert(false); + }} + > +
+
+ +
+
+ {!!product.manufacture.name ? ( + + {product.manufacture.name} + + ) : ( + '-' + )} +

{product.name}

+

{product.code}

+ {!!product.lowest_price && product.lowest_price.price > 0 && ( + <> +
+ {product.lowest_price.discount_percentage > 0 && ( + <> +
+ {Math.floor(product.lowest_price.discount_percentage)}% +
+
+ Rp {formatCurrency(product.lowest_price.price || 0)} +
+ + )} +
+ Rp{' '} + {formatCurrency(product.lowest_price.price_discount || 0)} +
+
+ + )} + + {!!product.lowest_price && product.lowest_price.price === 0 && ( + + Hubungi kami untuk dapatkan harga terbaik,{' '} + + klik disini + + + )} +
+
+ + Lihat Keranjang + +
+
+
+
+ Kamu Mungkin Juga Suka +
+ + + +
+ +
+ ); +}; + +export default AddToQuotation; diff --git a/src-migrate/modules/product-detail/components/PriceAction.tsx b/src-migrate/modules/product-detail/components/PriceAction.tsx index 9021264e..a69e896c 100644 --- a/src-migrate/modules/product-detail/components/PriceAction.tsx +++ b/src-migrate/modules/product-detail/components/PriceAction.tsx @@ -5,6 +5,7 @@ import formatCurrency from '~/libs/formatCurrency'; import { IProductDetail } from '~/types/product'; import { useProductDetail } from '../stores/useProductDetail'; import AddToCart from './AddToCart'; +import AddToQuotation from './AddToQuotation'; import Link from 'next/link'; import { getAuth } from '~/libs/auth'; @@ -110,6 +111,14 @@ const PriceAction = ({ product }: Props) => { /> )} +
+ +
); }; -- cgit v1.2.3 From f073b22e917acde22c21808906a37270e274085f Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Thu, 24 Oct 2024 10:04:38 +0700 Subject: ubah image --- .../modules/product-detail/components/AddToQuotation.tsx | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) (limited to 'src-migrate/modules') diff --git a/src-migrate/modules/product-detail/components/AddToQuotation.tsx b/src-migrate/modules/product-detail/components/AddToQuotation.tsx index cc91f729..09a7501d 100644 --- a/src-migrate/modules/product-detail/components/AddToQuotation.tsx +++ b/src-migrate/modules/product-detail/components/AddToQuotation.tsx @@ -120,9 +120,15 @@ const AddToQuotation = ({ onClick={handleButton} color={'red'} colorScheme='white' - className='w-full border-2 flex items-center' + className='w-full border-2 p-2 hover:bg-slate-100 flex items-center' > - + Penawaran Harga Instan Date: Thu, 24 Oct 2024 10:12:11 +0700 Subject: avoid error code --- src-migrate/modules/product-detail/components/PriceAction.tsx | 1 - 1 file changed, 1 deletion(-) (limited to 'src-migrate/modules') diff --git a/src-migrate/modules/product-detail/components/PriceAction.tsx b/src-migrate/modules/product-detail/components/PriceAction.tsx index a3126cdd..a9b17f92 100644 --- a/src-migrate/modules/product-detail/components/PriceAction.tsx +++ b/src-migrate/modules/product-detail/components/PriceAction.tsx @@ -8,7 +8,6 @@ import { IProductDetail } from '~/types/product'; import { useProductDetail } from '../stores/useProductDetail'; import AddToCart from './AddToCart'; import AddToQuotation from './AddToQuotation'; -import Link from 'next/link'; import { getAuth } from '~/libs/auth'; type Props = { -- cgit v1.2.3 From 7350eb1edcfb7e9776fec70849ee0c64a795eda3 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Thu, 24 Oct 2024 11:35:14 +0700 Subject: add penawaran instan mobile --- src-migrate/modules/product-detail/components/AddToQuotation.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) (limited to 'src-migrate/modules') diff --git a/src-migrate/modules/product-detail/components/AddToQuotation.tsx b/src-migrate/modules/product-detail/components/AddToQuotation.tsx index 09a7501d..f9b6c2b3 100644 --- a/src-migrate/modules/product-detail/components/AddToQuotation.tsx +++ b/src-migrate/modules/product-detail/components/AddToQuotation.tsx @@ -120,14 +120,14 @@ const AddToQuotation = ({ onClick={handleButton} color={'red'} colorScheme='white' - className='w-full border-2 p-2 hover:bg-slate-100 flex items-center' + className='w-full border-2 p-2 gap-1 hover:bg-slate-100 flex items-center' > Penawaran Harga Instan -- cgit v1.2.3