diff options
| author | it-fixcomart <it@fixcomart.co.id> | 2024-08-06 10:21:43 +0700 |
|---|---|---|
| committer | it-fixcomart <it@fixcomart.co.id> | 2024-08-06 10:21:43 +0700 |
| commit | 1ce47f63e967d32d8e6026c0f2e8da931d23fd4c (patch) | |
| tree | 9e644c8d07e844a40d932943b79c60a6267475db /src-migrate/modules/product-promo | |
| parent | 0f4938c0f9ce12d60bac2eb012a98b818fcd5110 (diff) | |
<iman> update add to cart pop up
Diffstat (limited to 'src-migrate/modules/product-promo')
| -rw-r--r-- | src-migrate/modules/product-promo/components/AddToCart.tsx | 56 |
1 files changed, 54 insertions, 2 deletions
diff --git a/src-migrate/modules/product-promo/components/AddToCart.tsx b/src-migrate/modules/product-promo/components/AddToCart.tsx index 10904f90..8567dad8 100644 --- a/src-migrate/modules/product-promo/components/AddToCart.tsx +++ b/src-migrate/modules/product-promo/components/AddToCart.tsx @@ -16,6 +16,9 @@ import LazyLoad from 'react-lazy-load' import ProductSimilar from '../../../../src/lib/product/components/ProductSimilar'; import { IProductDetail } from '~/types/product'; import { useProductCartContext } from '@/contexts/ProductCartContext' +import { createSlug } from '~/libs/slug' +import formatCurrency from '~/libs/formatCurrency' +import { useProductDetail } from '../../product-detail/stores/useProductDetail'; type Props = { promotion: IPromotion product: IProductDetail @@ -24,10 +27,12 @@ type Props = { type Status = 'idle' | 'loading' | 'success' const ProductPromoAddToCart = ({product, promotion }: Props) => { + const auth = getAuth() const toast = useToast() const router = useRouter() + const {askAdminUrl} = useProductDetail(); const [status, setStatus] = useState<Status>('idle') const { productCart, setRefreshCart, setProductCart, refreshCart, isLoading, setIsloading } = useProductCartContext() @@ -126,8 +131,55 @@ const ProductPromoAddToCart = ({product, promotion }: Props) => { height={80} /> </div> - <div className='ml-3 flex flex-1 items-center font-normal'> - {product.name} + <div className='ml-3 flex flex-1 items-start font-medium justify-center flex-col gap-y-1'> + {!!product.manufacture.name ? ( + <Link + href={createSlug('/shop/brands/', product.manufacture.name, product.manufacture.id.toString())} + className=' hover:underline' + color={"red"} + > + {product.manufacture.name} + </Link> + ) : '-'} + <p className='text-ellipsis overflow-hidden'> + {product.name} + </p> + <p> + {product.code} + </p> + {!!product.lowest_price && product.lowest_price.price > 0 && ( + <> + <div className='flex items-end gap-x-2'> + {product.lowest_price.discount_percentage > 0 && ( + <> + <div className='badge-solid-red'> + {Math.floor(product.lowest_price.discount_percentage)}% + </div> + <div className='text-gray_r-11 line-through text-[11px] sm:text-caption-2'> + Rp {formatCurrency(product.lowest_price.price || 0)} + </div> + </> + )} + <div className='text-danger-500 font-semibold'> + Rp {formatCurrency(product.lowest_price.price_discount || 0)} + </div> + </div> + </> + )} + + {!!product.lowest_price && product.lowest_price.price === 0 && ( + <span> + Hubungi kami untuk dapatkan harga terbaik,{' '} + <Link + href={askAdminUrl} + target='_blank' + className='font-medium underline' + color={'red'} + > + klik disini + </Link> + </span> + )} </div> <div className='ml-3 flex items-center font-normal'> <Link |
