From cb69cf4e6633bb9192cd7bdc0a0063541f67102f Mon Sep 17 00:00:00 2001 From: "HATEC\\SPVDEV001" Date: Wed, 5 Jul 2023 17:01:24 +0700 Subject: promotion program cart dan variant --- src/lib/product/components/Product/Product.jsx | 2 +- .../product/components/Product/ProductDesktop.jsx | 73 +++++++++++++++++----- 2 files changed, 57 insertions(+), 18 deletions(-) (limited to 'src/lib/product') diff --git a/src/lib/product/components/Product/Product.jsx b/src/lib/product/components/Product/Product.jsx index 9521cbe4..9649fd21 100644 --- a/src/lib/product/components/Product/Product.jsx +++ b/src/lib/product/components/Product/Product.jsx @@ -29,7 +29,7 @@ const Product = ({ product }) => { return ( <> - + ) } diff --git a/src/lib/product/components/Product/ProductDesktop.jsx b/src/lib/product/components/Product/ProductDesktop.jsx index d15e84d1..946529ce 100644 --- a/src/lib/product/components/Product/ProductDesktop.jsx +++ b/src/lib/product/components/Product/ProductDesktop.jsx @@ -19,17 +19,19 @@ import PromotionType from '@/lib/promotinProgram/components/PromotionType' import useAuth from '@/core/hooks/useAuth' import odooApi from '@/core/api/odooApi' -const ProductDesktop = ({ product, wishlist, toggleWishlist }) => { +const ProductDesktop = ({ products, wishlist, toggleWishlist }) => { const router = useRouter() const auth = useAuth() const { slug } = router.query + const [quantityActive, setQuantity] = useState(null) const [lowestPrice, setLowestPrice] = useState(null) + const [product, setProducts] = useState(products) const [addCartAlert, setAddCartAlert] = useState(false) const [promotionType, setPromotionType] = useState(false) const [promotionActiveId, setPromotionActiveId] = useState(null) - const [quantity, setQuantity] = useState(null) + const [selectVariantPromoActive, setSelectVariantPromoActive] = useState(null) const getLowestPrice = useCallback(() => { const prices = product.variants.map((variant) => variant.price) @@ -50,11 +52,13 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => { const setVariantQuantityRef = (variantId) => (element) => { if (element) { - setQuantity(element.value) + let variantIndex = product.variants.findIndex((varian) => varian.id == variantId) + product.variants[variantIndex].quantity = element.value } variantQuantityRefs.current[variantId] = element } + const validQuantity = (quantity) => { let isValid = true if (!quantity || quantity < 1 || isNaN(parseInt(quantity))) { @@ -70,13 +74,25 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => { return } const quantity = variantQuantityRefs.current[variantId].value + if (!validQuantity(quantity)) return - updateItemCart({ - productId: variantId, - quantity, - programLineId:promotionActiveId, - selected: true - }) + if(product.variants.length > 1){ + let variantIndex = product.variants.findIndex((varian) => varian.id == variantId) + updateItemCart({ + productId: variantId, + quantity, + programLineId: product.variants[variantIndex].programActive, + selected: true + }) + }{ + updateItemCart({ + productId: variantId, + quantity, + programLineId: promotionActiveId, + selected: true + }) + } + setAddCartAlert(true) } @@ -97,6 +113,11 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => { } } + const handlePromoClick = (variantId) => { + setSelectVariantPromoActive(variantId) + setPromotionType(true) + } + const productSimilarQuery = [ product?.name, `fq=-product_id_i:${product.id}`, @@ -180,7 +201,7 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => { variantId={product.variants[0].id} setPromotionActiveId={setPromotionActiveId} promotionActiveId={promotionActiveId} - quantity={quantity} + quantity={quantityActive} > @@ -369,30 +390,40 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => { type='number' className='form-input w-16 py-2 text-center bg-gray_r-1' ref={setVariantQuantityRef(variant.id)} + onChange={setVariantQuantityRef(variant.id)} defaultValue={1} /> - {index == 0 ? ( + {variant.programActive ? ( setPromotionType(true)} + onClick={() => handlePromoClick(variant.id)} className='cursor-pointer' > ) : ( -
+ variant.hasProgram ? (
+ handlePromoClick(variant.id)} + className='cursor-pointer' + > +
):(
setPromotionType(true)} className='cursor-pointer' > -
+
) + )}