diff options
| author | it-fixcomart <it@fixcomart.co.id> | 2024-08-07 15:22:39 +0700 |
|---|---|---|
| committer | it-fixcomart <it@fixcomart.co.id> | 2024-08-07 15:22:39 +0700 |
| commit | 86a715473aca30e277c1857bbcb6e6e9283e13f4 (patch) | |
| tree | 8f89f550b16380078ac460ef80f954ed503c9237 /src | |
| parent | 3b785b0bce7cf27a377716c8dca300a996daff0c (diff) | |
<iman> update all promo
Diffstat (limited to 'src')
| -rw-r--r-- | src/core/components/elements/Navbar/NavbarDesktop.jsx | 19 | ||||
| -rw-r--r-- | src/lib/flashSale/components/FlashSaleNonDisplay.jsx | 66 |
2 files changed, 76 insertions, 9 deletions
diff --git a/src/core/components/elements/Navbar/NavbarDesktop.jsx b/src/core/components/elements/Navbar/NavbarDesktop.jsx index 78e7f54a..cc5ea611 100644 --- a/src/core/components/elements/Navbar/NavbarDesktop.jsx +++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx @@ -255,6 +255,16 @@ const NavbarDesktop = () => { rel="noreferrer" > <p className="absolute inset-0 flex justify-center items-center group-hover:scale-105 group-hover:text-red-500 transition-transform duration-200 z-10">Semua Promo</p> + {showPopup && ( + <Image + src='/images/penawaran-terbatas.jpg' + alt='penawaran terbatas' + width={1440} + height={160} + quality={100} + className={`fixed ${isTop ? 'top-[155px]' : 'top-[80px]'} rounded-3xl left-[645px] w-40 h-12 p-2 z-50 transition-all duration-300 animate-pulse`} + /> + )} </Link> {/* {showPopup && router.pathname === '/' && ( <div className={`fixed ${isTop ? 'top-[170px]' : 'top-[90px]'} rounded-3xl left-[700px] w-fit object-center bg-green-50 text-xs font-medium text-green-700 ring-1 ring-inset ring-green-600/20 text-center p-2 z-50 transition-all duration-300`}> @@ -263,15 +273,6 @@ const NavbarDesktop = () => { </p> </div> )} */} - {showPopup && router.pathname === '/' && ( - <Image - src='/images/penawaran-terbatas.svg' - alt='penawaran terbatas' - width={144} - height={3} - className={`fixed ${isTop ? 'top-[-275px]' : 'top-[-345px]'} rounded-3xl left-[680px] w-48 h-full p-2 z-50 transition-all duration-300`} - /> - )} <Link diff --git a/src/lib/flashSale/components/FlashSaleNonDisplay.jsx b/src/lib/flashSale/components/FlashSaleNonDisplay.jsx new file mode 100644 index 00000000..85807fad --- /dev/null +++ b/src/lib/flashSale/components/FlashSaleNonDisplay.jsx @@ -0,0 +1,66 @@ +import Image from 'next/image'; +import { useEffect, useState } from 'react'; + +import CountDown from '@/core/components/elements/CountDown/CountDown'; +import productSearchApi from '@/lib/product/api/productSearchApi'; +import ProductSlider from '@/lib/product/components/ProductSlider'; + +import flashSaleApi from '../api/flashSaleApi'; +import { FlashSaleSkeleton } from '../skeleton/FlashSaleSkeleton'; + +const FlashSaleNonDisplay = () => { + const [flashSales, setFlashSales] = useState(null); + const [isLoading, setIsLoading] = useState(true); + + useEffect(() => { + const loadFlashSales = async () => { + const dataFlashSales = await flashSaleApi(); + setFlashSales(dataFlashSales); + setIsLoading(false); + }; + loadFlashSales(); + }, []); + + if (isLoading) { + return <FlashSaleSkeleton />; + } + + return ( + flashSales?.length > 0 && ( + <div className='px-4 sm:px-0 grid grid-cols-1 gap-y-8'> + {flashSales.map((flashSale, index) => ( + <div key={index}> + <div className='flex gap-x-3 mb-4 justify-between sm:justify-start'> + <div className='font-medium sm:text-h-lg mt-1.5'> + Penawaran Terbatas + </div> + </div> + + <div className='relative'> + <FlashSaleProduct flashSaleId={flashSale.pricelistId} /> + </div> + </div> + ))} + </div> + ) + ); +}; + +const FlashSaleProduct = ({ flashSaleId }) => { + const [products, setProducts] = useState(null); + + useEffect(() => { + const loadProducts = async () => { + const dataProducts = await productSearchApi({ + query: `fq=-flashsale_id_i:${flashSaleId}&fq=flashsale_price_f:[1 TO *]&limit=500&orderBy=flashsale_discount_f desc`, + operation: 'AND', + }); + setProducts(dataProducts.response); + }; + loadProducts(); + }, [flashSaleId]); + + return <ProductSlider products={products} />; +}; + +export default FlashSaleNonDisplay; |
