From 46c208194cb80be3a4ce2d42ad817551b9b2a18d Mon Sep 17 00:00:00 2001
From: "HATEC\\SPVDEV001" <tri.susilo@altama.co.id>
Date: Thu, 27 Jul 2023 10:08:28 +0700
Subject: bugs fix variant page

---
 .../components/Product/ProductMobileVariant.jsx    | 75 +++++++++++++++++++++-
 1 file changed, 72 insertions(+), 3 deletions(-)

(limited to 'src/lib/product/components/Product/ProductMobileVariant.jsx')

diff --git a/src/lib/product/components/Product/ProductMobileVariant.jsx b/src/lib/product/components/Product/ProductMobileVariant.jsx
index 958b00cc..e0ba90c3 100644
--- a/src/lib/product/components/Product/ProductMobileVariant.jsx
+++ b/src/lib/product/components/Product/ProductMobileVariant.jsx
@@ -15,6 +15,8 @@ import { createSlug } from '@/core/utils/slug'
 import BottomPopup from '@/core/components/elements/Popup/BottomPopup'
 import whatsappUrl from '@/core/utils/whatsappUrl'
 import { gtagAddToCart } from '@/core/utils/googleTag'
+import odooApi from '@/core/api/odooApi'
+import { Button, Spinner } from 'flowbite-react'
 
 const ProductMobileVariant = ({ product, wishlist, toggleWishlist }) => {
   const router = useRouter()
@@ -24,6 +26,8 @@ const ProductMobileVariant = ({ product, wishlist, toggleWishlist }) => {
   const [informationTab, setInformationTab] = useState(informationTabOptions[0].value)
   const [addCartAlert, setAddCartAlert] = useState(false)
 
+  const [isLoadingSLA, setIsLoadingSLA] = useState(true)
+
   const getLowestPrice = () => {
     const lowest = product.price
     return lowest
@@ -68,16 +72,26 @@ const ProductMobileVariant = ({ product, wishlist, toggleWishlist }) => {
     if (!validAction()) return
     gtagAddToCart(activeVariant, quantity)
     updateItemCart({
-      productId: activeVariant.id,
+      productId: variant,
       quantity,
-      selected: true
+      programLineId: null,
+      selected: true,
+      source: null
     })
     setAddCartAlert(true)
   }
 
   const handleClickBuy = () => {
     if (!validAction()) return
-    router.push(`/shop/checkout?productId=${activeVariant.id}&quantity=${quantity}`)
+
+    updateItemCart({
+      productId: product.id,
+      quantity,
+      programLineId: null,
+      selected: true,
+      source : 'buy'
+    })
+    router.push(`/shop/checkout?source=buy`)
   }
 
   const productSimilarQuery = [
@@ -86,6 +100,16 @@ const ProductMobileVariant = ({ product, wishlist, toggleWishlist }) => {
     `fq=-manufacture_id_i:${product.manufacture?.id || 0}`
   ].join('&')
 
+  useEffect(() => {
+    const fetchData = async () => {
+      const dataSLA = await odooApi('GET', `/api/v1/product_variant/${product.id}/stock`)
+      product.sla = dataSLA
+
+      setIsLoadingSLA(false)
+    }
+    fetchData()
+  }, [product])
+
   return (
     <MobileView>
       <Image
@@ -203,6 +227,51 @@ const ProductMobileVariant = ({ product, wishlist, toggleWishlist }) => {
           active={informationTab == 'specification'}
           className='rounded border border-gray_r-6 divide-y divide-gray_r-6'
         >
+          <SpecificationContent label='Ketersediaan'>
+            <span>
+              {isLoadingSLA ? (
+                <Button color='gray'>
+                  <Spinner aria-label='Alternate spinner button example' />
+                  <span className='pl-3'>Loading...</span>
+                </Button>
+              ) : product?.sla?.slaDate != '-' ? (
+                <button
+                  type='button'
+                  title={`Masa Persiapan Barang ${product?.sla?.slaDate}`}
+                  className={`flex gap-x-1 items-center p-2 h-8 rounded-lg w-full ${
+                    product?.sla?.slaDate === 'indent' ? 'bg-indigo-900' : 'btn-light'
+                  }`}
+                >
+                  <div
+                    className={`flex-1 text-sm  ${
+                      product?.sla?.slaDate === 'indent' ? 'text-white' : ''
+                    }`}
+                  >
+                    {product?.sla?.slaDate}
+                  </div>
+                  <div className='flex-end'>
+                    <svg
+                      aria-hidden='true'
+                      fill='none'
+                      stroke='currentColor'
+                      stroke-width='1.5'
+                      className={`w-7 h-7 text-sm ${
+                        product?.sla?.slaDate === 'indent' ? 'text-white' : ''
+                      }`}
+                    >
+                      <path
+                        d='M11.25 11.25l.041-.02a.75.75 0 011.063.852l-.708 2.836a.75.75 0 001.063.853l.041-.021M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9-3.75h.008v.008H12V8.25z'
+                        stroke-linecap='round'
+                        stroke-linejoin='round'
+                      ></path>
+                    </svg>
+                  </div>
+                </button>
+              ): (
+                '-'
+              )}
+            </span>
+          </SpecificationContent>
           <SpecificationContent label='Nomor SKU'>
             <span>SKU-{product?.id}</span>
           </SpecificationContent>
-- 
cgit v1.2.3

