From 702f43a7190d65c2370e7019311cc26c2cc0eafd Mon Sep 17 00:00:00 2001
From: "HATEC\\SPVDEV001" <tri.susilo@altama.co.id>
Date: Tue, 6 Jun 2023 17:01:23 +0700
Subject: program promotion

---
 src/lib/promotinProgram/components/HomePage.jsx | 69 +++++++++++++++++++++++++
 1 file changed, 69 insertions(+)
 create mode 100644 src/lib/promotinProgram/components/HomePage.jsx

(limited to 'src/lib/promotinProgram/components/HomePage.jsx')

diff --git a/src/lib/promotinProgram/components/HomePage.jsx b/src/lib/promotinProgram/components/HomePage.jsx
new file mode 100644
index 00000000..93134117
--- /dev/null
+++ b/src/lib/promotinProgram/components/HomePage.jsx
@@ -0,0 +1,69 @@
+import React, { useState } from 'react'
+import { Swiper, SwiperSlide } from 'swiper/react'
+import 'swiper/swiper.min.css'
+import Image from '@/core/components/elements/Image/Image'
+import useDevice from '@/core/hooks/useDevice'
+
+const HomePage = () => {
+  const [activeTab, setActiveTab] = useState('Tab 1')
+
+  const { isMobile, isDesktop } = useDevice()
+  const handleTabClick = (label) => {
+    setActiveTab(label)
+  }
+
+  const tabItems = [
+    { label: 'Tab 1', content: 'Content for Tab 1' },
+    { label: 'Tab 2', content: 'Content for Tab 2' },
+    { label: 'Tab 3', content: 'Content for Tab 3' },
+    { label: 'Tab 4', content: 'Content for Tab 4' },
+    { label: 'Tab 5', content: 'Content for Tab 5' },
+    { label: 'Tab 6', content: 'Content for Tab 6' },
+    { label: 'Tab 7', content: 'Content for Tab 7' },
+    { label: 'Tab 8', content: 'Content for Tab 8' },
+    { label: 'Tab 9', content: 'Content for Tab 9' },
+    { label: 'Tab 10', content: 'Content for Tab 10' }
+  ]
+
+  return (
+    <div className='px-4 sm:px-0'>
+      <div className='flex justify-between items-center mb-4'>
+        <div className='font-medium sm:text-h-lg'>{activeTab}</div>
+      </div>
+      <Swiper slidesPerView={isMobile ? 3.5 : 7.5} spaceBetween={isMobile ? 12 : 20}>
+        {tabItems.map((item, index) => (
+          <SwiperSlide key={index}>
+            <button
+              className={`py-1 px-2 rounded border flex justify-center items-center h-30 ${
+                activeTab === item.label ? 'border-red-500' : 'border-gray_r-6'
+              }`}
+              onClick={() => handleTabClick(item.label)}
+            >
+              {' '}
+              <Image
+                src='https://erp.indoteknik.com/api/image/x_manufactures/x_logo_manufacture/10'
+                alt=''
+                className='h-full w-full object-contain object-center'
+              />
+            </button>
+          </SwiperSlide>
+        ))}
+      </Swiper>
+
+      <div className='mt-4'>
+        {tabItems.map((item, index) => (
+          <div
+            key={index}
+            className={`${
+              activeTab === item.label ? 'block' : 'hidden'
+            } bg-gray-100 p-4 rounded-md`}
+          >
+            {item.content}
+          </div>
+        ))}
+      </div>
+    </div>
+  )
+}
+
+export default HomePage
-- 
cgit v1.2.3


From eb4ae7be05ed97bd02b7f3e9cc56393f435188e2 Mon Sep 17 00:00:00 2001
From: "HATEC\\SPVDEV001" <tri.susilo@altama.co.id>
Date: Wed, 14 Jun 2023 13:22:20 +0700
Subject: layout promotion program di detail product dan layout modal popup

---
 src/lib/promotinProgram/components/HomePage.jsx | 152 ++++++++++++++++--------
 1 file changed, 100 insertions(+), 52 deletions(-)

(limited to 'src/lib/promotinProgram/components/HomePage.jsx')

diff --git a/src/lib/promotinProgram/components/HomePage.jsx b/src/lib/promotinProgram/components/HomePage.jsx
index 93134117..9ebd82dc 100644
--- a/src/lib/promotinProgram/components/HomePage.jsx
+++ b/src/lib/promotinProgram/components/HomePage.jsx
@@ -1,68 +1,116 @@
-import React, { useState } from 'react'
+import React, { use, useEffect, useState } from 'react'
 import { Swiper, SwiperSlide } from 'swiper/react'
 import 'swiper/swiper.min.css'
 import Image from '@/core/components/elements/Image/Image'
 import useDevice from '@/core/hooks/useDevice'
+import odooApi from '@/core/api/odooApi'
+import { LazyLoadComponent } from 'react-lazy-load-image-component'
+import ProductSlider from '@/lib/product/components/ProductSlider'
+import ProductCard from '@/lib/product/components/ProductCard'
+import { PopularProductSkeleton } from '@/components/skeleton/PopularProductSkeleton'
+
+const { useQuery } = require('react-query')
+const { getPromotionHome } = require('../api/homepageApi')
+const { getProductPromotionHome } = require('../api/homepageApi')
 
 const HomePage = () => {
-  const [activeTab, setActiveTab] = useState('Tab 1')
+  const [activeTab, setActiveTab] = useState(null)
+  const [activeId, setActiveId] = useState(null)
+  const [activeBanner, setActiveBanner] = useState(null)
+  const [parentPromotions, setparentPromotions] = useState(null)
+
+  const { data: titlePromotion } = useQuery('titlePromotion', getPromotionHome)
+  const { data: productPromotion, refetch: productPromotionRefetch } = useQuery(
+    ['productPromotion', activeId],
+    async () => {
+      if (!activeId) return null
+      return await getProductPromotionHome({ id: activeId })
+    }
+  )
+
+  useEffect(() => {
+    if (titlePromotion) {
+      setActiveTab(titlePromotion[0].name)
+      setActiveId(titlePromotion[0].id)
+      setparentPromotions(titlePromotion)
+      setActiveBanner(titlePromotion[0].banner)
+      productPromotionRefetch()
+    }
+  }, [titlePromotion])
+
+  useEffect(() => {
+    if (productPromotion) {
+      setparentPromotions(() => {
+        return parentPromotions.map((title) => {
+          if (title.id === activeId && title.products === undefined) {
+            return {
+              ...title,
+              products: productPromotion
+            }
+          }
+          return title
+        })
+      })
+    }
+  }, [productPromotion, parentPromotions, activeId])
 
   const { isMobile, isDesktop } = useDevice()
-  const handleTabClick = (label) => {
+  const handleTabClick = (id, label, banner) => {
     setActiveTab(label)
+    setActiveId(id)
+    setActiveBanner(banner)
   }
 
-  const tabItems = [
-    { label: 'Tab 1', content: 'Content for Tab 1' },
-    { label: 'Tab 2', content: 'Content for Tab 2' },
-    { label: 'Tab 3', content: 'Content for Tab 3' },
-    { label: 'Tab 4', content: 'Content for Tab 4' },
-    { label: 'Tab 5', content: 'Content for Tab 5' },
-    { label: 'Tab 6', content: 'Content for Tab 6' },
-    { label: 'Tab 7', content: 'Content for Tab 7' },
-    { label: 'Tab 8', content: 'Content for Tab 8' },
-    { label: 'Tab 9', content: 'Content for Tab 9' },
-    { label: 'Tab 10', content: 'Content for Tab 10' }
-  ]
-
   return (
-    <div className='px-4 sm:px-0'>
-      <div className='flex justify-between items-center mb-4'>
-        <div className='font-medium sm:text-h-lg'>{activeTab}</div>
-      </div>
-      <Swiper slidesPerView={isMobile ? 3.5 : 7.5} spaceBetween={isMobile ? 12 : 20}>
-        {tabItems.map((item, index) => (
-          <SwiperSlide key={index}>
-            <button
-              className={`py-1 px-2 rounded border flex justify-center items-center h-30 ${
-                activeTab === item.label ? 'border-red-500' : 'border-gray_r-6'
-              }`}
-              onClick={() => handleTabClick(item.label)}
-            >
-              {' '}
-              <Image
-                src='https://erp.indoteknik.com/api/image/x_manufactures/x_logo_manufacture/10'
-                alt=''
-                className='h-full w-full object-contain object-center'
-              />
-            </button>
-          </SwiperSlide>
-        ))}
-      </Swiper>
-
-      <div className='mt-4'>
-        {tabItems.map((item, index) => (
-          <div
-            key={index}
-            className={`${
-              activeTab === item.label ? 'block' : 'hidden'
-            } bg-gray-100 p-4 rounded-md`}
-          >
-            {item.content}
-          </div>
-        ))}
+    activeBanner && (
+      <div className='px-4 sm:px-0'>
+        <div className='flex justify-between items-center mb-4'>
+          <div className='font-medium sm:text-h-lg'>{activeTab}</div>
+        </div>
+        <div className='mb-4'>
+          <Image src={activeBanner} alt='' className='h-full w-full object-contain object-center' />
+        </div>
+        <Swiper slidesPerView={isMobile ? 3.5 : 7.5} spaceBetween={isMobile ? 12 : 20}>
+          {titlePromotion?.map((item, index) => (
+            <SwiperSlide key={index}>
+              <button
+                className={`py-1 px-2 rounded border flex justify-center items-center h-30 ${
+                  activeTab === item.name ? 'border-red-500' : 'border-gray_r-6'
+                }`}
+                onClick={() => handleTabClick(item.id, item.name, item.banner)}
+              >
+                {' '}
+                <Image
+                  src={item.icon}
+                  alt=''
+                  className='h-full w-full object-contain object-center'
+                />
+              </button>
+            </SwiperSlide>
+          ))}
+        </Swiper>
+        <div className='mt-4 relative  min-h-[150px]'>
+          {parentPromotions &&
+            parentPromotions?.map((item, index) => (
+              <div
+                key={index}
+                className={`${activeId === item.id ? 'block' : 'hidden'}  rounded-md`}
+              >
+                {item.products ? (
+                  <ProductSlider
+                    key={index}
+                    products={{
+                      products: item.products
+                    }}
+                  />
+                ) : (
+                  <PopularProductSkeleton />
+                )}
+              </div>
+            ))}
+        </div>
       </div>
-    </div>
+    )
   )
 }
 
-- 
cgit v1.2.3


From e4b4f2c09ebd819acc204c2e58288fe9fc6294ea Mon Sep 17 00:00:00 2001
From: "HATEC\\SPVDEV001" <tri.susilo@altama.co.id>
Date: Thu, 15 Jun 2023 15:45:43 +0700
Subject: get dan delete cart

---
 src/lib/promotinProgram/components/HomePage.jsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'src/lib/promotinProgram/components/HomePage.jsx')

diff --git a/src/lib/promotinProgram/components/HomePage.jsx b/src/lib/promotinProgram/components/HomePage.jsx
index 9ebd82dc..8d159899 100644
--- a/src/lib/promotinProgram/components/HomePage.jsx
+++ b/src/lib/promotinProgram/components/HomePage.jsx
@@ -6,7 +6,6 @@ import useDevice from '@/core/hooks/useDevice'
 import odooApi from '@/core/api/odooApi'
 import { LazyLoadComponent } from 'react-lazy-load-image-component'
 import ProductSlider from '@/lib/product/components/ProductSlider'
-import ProductCard from '@/lib/product/components/ProductCard'
 import { PopularProductSkeleton } from '@/components/skeleton/PopularProductSkeleton'
 
 const { useQuery } = require('react-query')
@@ -28,8 +27,9 @@ const HomePage = () => {
     }
   )
 
+
   useEffect(() => {
-    if (titlePromotion) {
+    if (titlePromotion && titlePromotion.length > 0) {
       setActiveTab(titlePromotion[0].name)
       setActiveId(titlePromotion[0].id)
       setparentPromotions(titlePromotion)
-- 
cgit v1.2.3


From 637c22f1886cecf7307ced88dc951134d466a3fa Mon Sep 17 00:00:00 2001
From: "HATEC\\SPVDEV001" <tri.susilo@altama.co.id>
Date: Mon, 19 Jun 2023 15:46:03 +0700
Subject: checkout

---
 src/lib/promotinProgram/components/HomePage.jsx | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

(limited to 'src/lib/promotinProgram/components/HomePage.jsx')

diff --git a/src/lib/promotinProgram/components/HomePage.jsx b/src/lib/promotinProgram/components/HomePage.jsx
index 8d159899..c0968161 100644
--- a/src/lib/promotinProgram/components/HomePage.jsx
+++ b/src/lib/promotinProgram/components/HomePage.jsx
@@ -27,7 +27,6 @@ const HomePage = () => {
     }
   )
 
-
   useEffect(() => {
     if (titlePromotion && titlePromotion.length > 0) {
       setActiveTab(titlePromotion[0].name)
@@ -36,11 +35,11 @@ const HomePage = () => {
       setActiveBanner(titlePromotion[0].banner)
       productPromotionRefetch()
     }
-  }, [titlePromotion])
+  }, [titlePromotion, productPromotionRefetch])
 
   useEffect(() => {
     if (productPromotion) {
-      setparentPromotions(() => {
+      setparentPromotions((parentPromotions) => {
         return parentPromotions.map((title) => {
           if (title.id === activeId && title.products === undefined) {
             return {
@@ -52,7 +51,7 @@ const HomePage = () => {
         })
       })
     }
-  }, [productPromotion, parentPromotions, activeId])
+  }, [productPromotion, activeId])
 
   const { isMobile, isDesktop } = useDevice()
   const handleTabClick = (id, label, banner) => {
-- 
cgit v1.2.3

