summaryrefslogtreecommitdiff
path: root/src/pages
diff options
context:
space:
mode:
Diffstat (limited to 'src/pages')
-rw-r--r--src/pages/index.jsx42
-rw-r--r--src/pages/shop/category/[slug].jsx9
-rw-r--r--src/pages/shop/promo/[slug].tsx8
-rw-r--r--src/pages/shop/promo/index.jsx40
-rw-r--r--src/pages/shop/promo/index.tsx186
5 files changed, 89 insertions, 196 deletions
diff --git a/src/pages/index.jsx b/src/pages/index.jsx
index 8af963fb..30a7ac1f 100644
--- a/src/pages/index.jsx
+++ b/src/pages/index.jsx
@@ -1,6 +1,5 @@
import dynamic from 'next/dynamic';
-import { useRef } from 'react';
-
+import { useEffect, useRef, useState } from 'react';
import { HeroBannerSkeleton } from '@/components/skeleton/BannerSkeleton';
import { PopularProductSkeleton } from '@/components/skeleton/PopularProductSkeleton';
import Seo from '@/core/components/Seo';
@@ -11,8 +10,10 @@ import { FlashSaleSkeleton } from '@/lib/flashSale/skeleton/FlashSaleSkeleton';
import PreferredBrandSkeleton from '@/lib/home/components/Skeleton/PreferredBrandSkeleton';
import PromotinProgram from '@/lib/promotinProgram/components/HomePage';
import PagePopupIformation from '~/modules/popup-information';
-import useProductDetail from '~/modules/product-detail/stores/useProductDetail';
+import CategoryPilihan from '../lib/home/components/CategoryPilihan';
+import odooApi from '@/core/api/odooApi';
import { getAuth } from '~/libs/auth';
+// import { getAuth } from '~/libs/auth';
const BasicLayout = dynamic(() =>
import('@/core/components/layouts/BasicLayout')
@@ -54,12 +55,23 @@ const BannerSection = dynamic(() =>
const CategoryHomeId = dynamic(() =>
import('@/lib/home/components/CategoryHomeId')
);
+
+const CategoryDynamic = dynamic(() =>
+ import('@/lib/home/components/CategoryDynamic')
+);
+
+const CategoryDynamicMobile = dynamic(() =>
+ import('@/lib/home/components/CategoryDynamicMobile')
+);
+
const CustomerReviews = dynamic(() =>
import('@/lib/review/components/CustomerReviews')
);
const ServiceList = dynamic(() => import('@/lib/home/components/ServiceList'));
-export default function Home() {
+
+
+export default function Home({categoryId}) {
const bannerRef = useRef(null);
const wrapperRef = useRef(null);
@@ -70,6 +82,18 @@ export default function Home() {
bannerRef.current?.querySelector(':first-child')?.clientHeight + 'px';
};
+ useEffect(() => {
+ const loadCategories = async () => {
+ const getCategories = await odooApi('GET', '/api/v1/category/child?partner_id='+{categoryId})
+ if(getCategories){
+ setDataCategories(getCategories)
+ }
+ }
+ loadCategories()
+ }, [])
+
+ const [dataCategories, setDataCategories] = useState([])
+
return (
<BasicLayout>
<Seo
@@ -107,6 +131,7 @@ export default function Home() {
</div>
<div className='my-16 flex flex-col gap-y-8'>
+ <div className='my-16 flex flex-col gap-y-8'>
<ServiceList />
<div id='flashsale'>
<PreferredBrand />
@@ -117,10 +142,13 @@ export default function Home() {
</>
)}
<PromotinProgram />
+ <CategoryPilihan categories={dataCategories}/>
+ <CategoryDynamic/>
<CategoryHomeId />
<BannerSection />
<CustomerReviews />
</div>
+ </div>
</div>
</DesktopView>
@@ -150,6 +178,10 @@ export default function Home() {
<DelayRender renderAfter={600}>
<PromotinProgram />
</DelayRender>
+ <DelayRender renderAfter={600}>
+ <CategoryPilihan categories={dataCategories}/>
+ <CategoryDynamicMobile/>
+ </DelayRender>
<DelayRender renderAfter={800}>
<PopularProduct />
</DelayRender>
@@ -164,4 +196,4 @@ export default function Home() {
</MobileView>
</BasicLayout>
);
-}
+} \ No newline at end of file
diff --git a/src/pages/shop/category/[slug].jsx b/src/pages/shop/category/[slug].jsx
index 1afe30bf..11840d47 100644
--- a/src/pages/shop/category/[slug].jsx
+++ b/src/pages/shop/category/[slug].jsx
@@ -5,6 +5,8 @@ import { useRouter } from 'next/router';
import Seo from '@/core/components/Seo';
import { getIdFromSlug, getNameFromSlug } from '@/core/utils/slug';
import Breadcrumb from '@/lib/category/components/Breadcrumb';
+import { useEffect, useState } from 'react';
+import odooApi from '@/core/api/odooApi';
const BasicLayout = dynamic(() =>
import('@/core/components/layouts/BasicLayout')
@@ -12,10 +14,14 @@ const BasicLayout = dynamic(() =>
const ProductSearch = dynamic(() =>
import('@/lib/product/components/ProductSearch')
);
+const CategorySection = dynamic(() =>
+ import('@/lib/product/components/CategorySection')
+)
export default function CategoryDetail() {
const router = useRouter();
const { slug = '', page = 1 } = router.query;
+ const [dataCategories, setDataCategories] = useState([])
const categoryName = getNameFromSlug(slug);
const categoryId = getIdFromSlug(slug);
@@ -43,8 +49,9 @@ export default function CategoryDetail() {
<Breadcrumb categoryId={categoryId} />
+
{!_.isEmpty(router.query) && (
- <ProductSearch query={query} prefixUrl={`/shop/category/${slug}`} />
+ <ProductSearch query={query} categories ={categoryId} prefixUrl={`/shop/category/${slug}`} />
)}
</BasicLayout>
);
diff --git a/src/pages/shop/promo/[slug].tsx b/src/pages/shop/promo/[slug].tsx
index bd69c071..aaee1249 100644
--- a/src/pages/shop/promo/[slug].tsx
+++ b/src/pages/shop/promo/[slug].tsx
@@ -91,7 +91,7 @@ export default function PromoDetail() {
setCurrentPage(pageNumber)
try {
- const items = await fetchPromoItemsSolr(`type_value_s:${Array.isArray(slug) ? slug[0] : slug}`);
+ const items = await fetchPromoItemsSolr(`type_value_s:${Array.isArray(slug) ? slug[0] : slug}`,0,100);
setPromoItems(items);
if (items.length === 0) {
@@ -147,16 +147,16 @@ export default function PromoDetail() {
const response = await fetchVariantSolr(`id:${item.product_id} AND ${combinedQuery}`);
const product = response.response.docs[0];
const product_id = product.id;
- const response2 = await fetchPromoItemsSolr(`type_value_s:${Array.isArray(slug) ? slug[0] : slug} AND product_ids:${product_id} AND ${combinedQueryPrice}`);
+ const response2 = await fetchPromoItemsSolr(`type_value_s:${Array.isArray(slug) ? slug[0] : slug} AND product_ids:${product_id} AND ${combinedQueryPrice}`,0,100);
return response2;
}else if(combinedQuery){
const response = await fetchVariantSolr(`id:${item.product_id} AND ${combinedQuery}`);
const product = response.response.docs[0];
const product_id = product.id;
- const response2 = await fetchPromoItemsSolr(`type_value_s:${Array.isArray(slug) ? slug[0] : slug} AND product_ids:${product_id} `);
+ const response2 = await fetchPromoItemsSolr(`type_value_s:${Array.isArray(slug) ? slug[0] : slug} AND product_ids:${product_id} `,0,100);
return response2;
} else {
- const response = await fetchPromoItemsSolr(`id:${item.id}`);
+ const response = await fetchPromoItemsSolr(`id:${item.id}`,0,100);
return response;
}
} catch (fetchError) {
diff --git a/src/pages/shop/promo/index.jsx b/src/pages/shop/promo/index.jsx
new file mode 100644
index 00000000..01a11aad
--- /dev/null
+++ b/src/pages/shop/promo/index.jsx
@@ -0,0 +1,40 @@
+import Seo from '@/core/components/Seo'
+import BasicLayout from '@/core/components/layouts/BasicLayout';
+import { Breadcrumb, BreadcrumbItem, BreadcrumbLink } from '@chakra-ui/react';
+import Link from 'next/link';
+import Promo from '~/pages/shop/promo';
+
+import React from 'react';
+
+const PromoPage = () => {
+ return (
+ <BasicLayout>
+ <Seo title='Promo Indoteknik.com' />
+ <div className='container mx-auto py-4 md:py-6 pb-0'>
+ <Breadcrumb>
+ <BreadcrumbItem>
+ <BreadcrumbLink
+ as={Link}
+ href='/'
+ className='!text-danger-500 whitespace-nowrap'
+ >
+ Home
+ </BreadcrumbLink>
+ </BreadcrumbItem>
+
+ <BreadcrumbItem isCurrentPage>
+ <BreadcrumbLink className='whitespace-nowrap'>
+ Promo
+ </BreadcrumbLink>
+ </BreadcrumbItem>
+ </Breadcrumb>
+
+ <div className='h-10' />
+
+ <Promo />
+ </div>
+ </BasicLayout>
+ );
+};
+
+export default PromoPage;
diff --git a/src/pages/shop/promo/index.tsx b/src/pages/shop/promo/index.tsx
deleted file mode 100644
index 7ec4f6b0..00000000
--- a/src/pages/shop/promo/index.tsx
+++ /dev/null
@@ -1,186 +0,0 @@
-import dynamic from 'next/dynamic'
-import { useEffect, useState } from 'react'
-import { useRouter } from 'next/router'
-import Seo from '../../../core/components/Seo.jsx'
-import Promocrumb from '../../../lib/promo/components/Promocrumb.jsx'
-import { fetchPromoItemsSolr } from '../../../api/promoApi.js'
-import LogoSpinner from '../../../core/components/elements/Spinner/LogoSpinner.jsx'
-import ProductPromoCard from '../../../../src-migrate/modules/product-promo/components/Card.tsx'
-import { IPromotion } from '../../../../src-migrate/types/promotion.ts'
-import React from 'react'
-import { SolrResponse } from "../../../../src-migrate/types/solr.ts";
-
-const BasicLayout = dynamic(() => import('../../../core/components/layouts/BasicLayout.jsx'))
-
-export default function Promo() {
- const router = useRouter()
- const { slug = '' } = router.query
- const [promoItems, setPromoItems] = useState<any[]>([])
- const [promoData, setPromoData] = useState<IPromotion[] | null>(null)
- const [loading, setLoading] = useState(true)
- const [currentPage, setCurrentPage] = useState(1)
- const [fetchingData, setFetchingData] = useState(false)
-
- useEffect(() => {
- const loadPromo = async () => {
- try {
- const items = await fetchPromoItemsSolr(`*:*`)
-
-
- setPromoItems(items)
-
-
- if (items.length === 0) {
- setPromoData([])
- setLoading(false);
- return;
- }
-
- const promoDataPromises = items.map(async (item) => {
- const queryParams = new URLSearchParams({ q: `id:${item.id}` })
-
-
- try {
- const response = await fetch(`/solr/promotion_program_lines/select?${queryParams.toString()}`)
-
- if (!response.ok) {
- throw new Error(`HTTP error! status: ${response.status}`)
- }
-
- const data: SolrResponse<any[]> = await response.json()
-
-
- const promotions = await map(data.response.docs)
- return promotions;
- } catch (fetchError) {
- console.error("Error fetching promotion data:", fetchError)
- return [];
- }
- });
-
- const promoDataArray = await Promise.all(promoDataPromises);
- const mergedPromoData = promoDataArray.reduce((accumulator, currentValue) => accumulator.concat(currentValue), []);
- setPromoData(mergedPromoData);
- setTimeout(() => setLoading(false), 120); // Menambahkan delay 200ms sebelum mengubah status loading
- } catch (loadError) {
- console.error("Error loading promo items:", loadError)
- setLoading(false);
- }
- }
-
- if (slug) {
- loadPromo()
- }
- }, [slug])
-
- const map = async (promotions: any[]): Promise<IPromotion[]> => {
- const result: IPromotion[] = []
-
- for (const promotion of promotions) {
- const data: IPromotion = {
- id: promotion.id,
- program_id: promotion.program_id_i,
- name: promotion.name_s,
- type: {
- value: promotion.type_value_s,
- label: promotion.type_label_s,
- },
- limit: promotion.package_limit_i,
- limit_user: promotion.package_limit_user_i,
- limit_trx: promotion.package_limit_trx_i,
- price: promotion.price_f,
- total_qty: promotion.total_qty_i,
- products: JSON.parse(promotion.products_s),
- free_products: JSON.parse(promotion.free_products_s),
- }
-
- result.push(data)
- }
-
- return result
- }
-
-
-
-
- useEffect(() => {
- const handleScroll = () => {
- if (
- !fetchingData &&
- window.innerHeight + document.documentElement.scrollTop >= 0.95 * document.documentElement.offsetHeight
- ) {
- // User has scrolled to 95% of page height
-
- setTimeout(() => setFetchingData(true), 120);
- setCurrentPage((prevPage) => prevPage + 1)
- }
- }
-
- window.addEventListener('scroll', handleScroll)
- return () => window.removeEventListener('scroll', handleScroll)
- }, [fetchingData])
-
- useEffect(() => {
- if (fetchingData) {
- // Fetch more data
- // You may need to adjust this logic according to your API
- fetchMoreData()
- }
- }, [fetchingData])
-
- const fetchMoreData = async () => {
- try {
- // Add a delay of approximately 150ms
- setTimeout(async () => {
- // Fetch more data
- // Update promoData state with the new data
- }, 150)
- } catch (error) {
- console.error('Error fetching more data:', error)
- } finally {
- setTimeout(() => setFetchingData(false), 120);
-
- }
- }
-
- const visiblePromotions = promoData?.slice(0, currentPage * 12)
-
- return (
- <BasicLayout>
- <Seo
- title={`Promo ${Array.isArray(slug) ? slug[0] : slug} Terkini`}
- description='B2B Marketplace MRO & Industri dengan Layanan Pembayaran Tempo, Faktur Pajak, Online Quotation, Garansi Resmi & Harga Kompetitif'
- />
- {/* <Promocrumb brandName={capitalizeFirstLetter(Array.isArray(slug) ? slug[0] : slug)} /> */}
- <div className='container mx-auto mt-1 flex mb-1'>
- <div className=''>
- <h1 className='font-semibold'>Semua Promo di Indoteknik</h1>
- </div>
- </div>
- {loading ? (
- <div className='container flex justify-center my-4'>
- <LogoSpinner width={48} height={48} />
- </div>
- ) : promoData && promoItems.length >= 1 ? (
- <>
- <div className='flex flex-wrap justify-center'>
- {visiblePromotions?.map((promotion) => (
- <div key={promotion.id} className="min-w-[40px] max-w-[400px] mr-[20px] mb-[20px] sm:w-full md:w-1/2 lg:w-1/3 xl:w-1/4">
- <ProductPromoCard promotion={promotion} />
- </div>
- ))}
- </div>
- {fetchingData && (
- <div className='container flex justify-center my-4'>
- <LogoSpinner width={48} height={48} />
- </div>
- )}
- </>
- ) : (
- <div className="text-center my-8">
- <p>Belum ada promo pada kategori ini</p>
- </div>
- )}
- </BasicLayout>
- )
-}