From 3f849355048e5c280a35a5747577e5296b90e9fd Mon Sep 17 00:00:00 2001 From: Rafi Zadanly Date: Thu, 25 Jan 2024 15:27:27 +0700 Subject: Add all promo page --- src-migrate/modules/promo/components/Hero.tsx | 55 +++++++++++++++++++++++++++ 1 file changed, 55 insertions(+) create mode 100644 src-migrate/modules/promo/components/Hero.tsx (limited to 'src-migrate/modules/promo/components/Hero.tsx') diff --git a/src-migrate/modules/promo/components/Hero.tsx b/src-migrate/modules/promo/components/Hero.tsx new file mode 100644 index 00000000..63524509 --- /dev/null +++ b/src-migrate/modules/promo/components/Hero.tsx @@ -0,0 +1,55 @@ +import { Swiper, SwiperProps, SwiperSlide } from 'swiper/react'; +import style from '../styles/hero.module.css'; +import 'swiper/css' +import Image from 'next/image'; +import { useQuery } from 'react-query'; +import { getBanner } from '~/services/banner'; + +const swiperBanner: SwiperProps = { + autoplay: { + delay: 6000, + disableOnInteraction: false + }, + // modules: [Pagination, Autoplay], + loop: true, + className: 'h-[400px] w-full', + slidesPerView: 1.1, + spaceBetween: 10 +} + +const Hero = () => { + const bannerQuery = useQuery({ + queryKey: ['banner.all-promo'], + queryFn: () => getBanner({ type: 'all-promo' }) + }) + + const banners = bannerQuery.data || [] + + return ( +
+
+
Pasti Hemat & Untung Selama Belanja di Indoteknik.com!
+
+
Cari paket yang kami sediakan dengan penawaran harga & Nikmati kemudahan dalam setiap transaksi dengan fitur lengkap Pembayaran hingga barang sampai!
+
+ +
+ + {banners.map((banner, index) => ( + + {banner.name} + + ))} + +
+
+ ) +} + +export default Hero \ No newline at end of file -- cgit v1.2.3 From 8d8c43d90373aab6238773e291a48d65d55c52a2 Mon Sep 17 00:00:00 2001 From: Rafi Zadanly Date: Sat, 17 Feb 2024 10:23:23 +0700 Subject: Add voucher section --- src-migrate/modules/promo/components/Hero.tsx | 23 ++++++++++++++++------- 1 file changed, 16 insertions(+), 7 deletions(-) (limited to 'src-migrate/modules/promo/components/Hero.tsx') diff --git a/src-migrate/modules/promo/components/Hero.tsx b/src-migrate/modules/promo/components/Hero.tsx index 63524509..5470b93b 100644 --- a/src-migrate/modules/promo/components/Hero.tsx +++ b/src-migrate/modules/promo/components/Hero.tsx @@ -1,19 +1,21 @@ -import { Swiper, SwiperProps, SwiperSlide } from 'swiper/react'; -import style from '../styles/hero.module.css'; -import 'swiper/css' +import 'swiper/css'; + import Image from 'next/image'; +import { useEffect, useMemo } from 'react'; import { useQuery } from 'react-query'; +import { Swiper, SwiperProps, SwiperSlide } from 'swiper/react'; + import { getBanner } from '~/services/banner'; +import style from '../styles/hero.module.css'; const swiperBanner: SwiperProps = { autoplay: { delay: 6000, disableOnInteraction: false }, - // modules: [Pagination, Autoplay], - loop: true, + loop: false, className: 'h-[400px] w-full', - slidesPerView: 1.1, + slidesPerView: 1, spaceBetween: 10 } @@ -23,7 +25,14 @@ const Hero = () => { queryFn: () => getBanner({ type: 'all-promo' }) }) - const banners = bannerQuery.data || [] + const banners = useMemo(() => bannerQuery.data || [], [bannerQuery.data]); + + useEffect(() => { + if (banners.length > 1) { + swiperBanner.slidesPerView = 1.1; + swiperBanner.loop = true; + } + }, [banners]); return (
-- cgit v1.2.3 From 208b234320b6c42491a4e87a1c3db3abab9c1715 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Fri, 21 Jun 2024 10:52:28 +0700 Subject: update all-promotion --- src-migrate/modules/promo/components/Hero.tsx | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) (limited to 'src-migrate/modules/promo/components/Hero.tsx') diff --git a/src-migrate/modules/promo/components/Hero.tsx b/src-migrate/modules/promo/components/Hero.tsx index 5470b93b..d8bb0be4 100644 --- a/src-migrate/modules/promo/components/Hero.tsx +++ b/src-migrate/modules/promo/components/Hero.tsx @@ -3,26 +3,30 @@ import 'swiper/css'; import Image from 'next/image'; import { useEffect, useMemo } from 'react'; import { useQuery } from 'react-query'; -import { Swiper, SwiperProps, SwiperSlide } from 'swiper/react'; +import { Swiper, SwiperProps, SwiperSlide } from 'swiper/react'; import { getBanner } from '~/services/banner'; import style from '../styles/hero.module.css'; +import 'swiper/css/navigation'; +import { Navigation, Pagination } from 'swiper'; const swiperBanner: SwiperProps = { + modules:[Navigation, Pagination], autoplay: { delay: 6000, disableOnInteraction: false }, - loop: false, + loop: true, className: 'h-[400px] w-full', slidesPerView: 1, - spaceBetween: 10 + spaceBetween: 10, + navigation:true, } const Hero = () => { const bannerQuery = useQuery({ queryKey: ['banner.all-promo'], - queryFn: () => getBanner({ type: 'all-promo' }) + queryFn: () => getBanner({ type: 'banner-promotion' }) }) const banners = useMemo(() => bannerQuery.data || [], [bannerQuery.data]); @@ -47,7 +51,7 @@ const Hero = () => { {banners.map((banner, index) => ( {banner.name} Date: Wed, 26 Jun 2024 15:30:48 +0700 Subject: update all promotion --- src-migrate/modules/promo/components/Hero.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'src-migrate/modules/promo/components/Hero.tsx') diff --git a/src-migrate/modules/promo/components/Hero.tsx b/src-migrate/modules/promo/components/Hero.tsx index d8bb0be4..ad1d0046 100644 --- a/src-migrate/modules/promo/components/Hero.tsx +++ b/src-migrate/modules/promo/components/Hero.tsx @@ -8,10 +8,10 @@ import { Swiper, SwiperProps, SwiperSlide } from 'swiper/react'; import { getBanner } from '~/services/banner'; import style from '../styles/hero.module.css'; import 'swiper/css/navigation'; -import { Navigation, Pagination } from 'swiper'; +import { Navigation, Pagination, Autoplay } from 'swiper'; const swiperBanner: SwiperProps = { - modules:[Navigation, Pagination], + modules:[Navigation, Pagination, Autoplay], autoplay: { delay: 6000, disableOnInteraction: false -- cgit v1.2.3 From 595c5cd7b371c61874db47ae42819acca5fc5d16 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Sat, 29 Jun 2024 13:46:30 +0700 Subject: update mobile view --- src-migrate/modules/promo/components/Hero.tsx | 86 ++++++++++++++++++++------- 1 file changed, 63 insertions(+), 23 deletions(-) (limited to 'src-migrate/modules/promo/components/Hero.tsx') diff --git a/src-migrate/modules/promo/components/Hero.tsx b/src-migrate/modules/promo/components/Hero.tsx index ad1d0046..2701250d 100644 --- a/src-migrate/modules/promo/components/Hero.tsx +++ b/src-migrate/modules/promo/components/Hero.tsx @@ -8,7 +8,10 @@ import { Swiper, SwiperProps, SwiperSlide } from 'swiper/react'; import { getBanner } from '~/services/banner'; import style from '../styles/hero.module.css'; import 'swiper/css/navigation'; +import 'swiper/css/pagination'; import { Navigation, Pagination, Autoplay } from 'swiper'; +import MobileView from '../../../../src/core/components/views/MobileView'; +import DesktopView from '@/core/components/views/DesktopView'; const swiperBanner: SwiperProps = { modules:[Navigation, Pagination, Autoplay], @@ -20,8 +23,18 @@ const swiperBanner: SwiperProps = { className: 'h-[400px] w-full', slidesPerView: 1, spaceBetween: 10, - navigation:true, + pagination:true, } +const swiperBannerMob = { + autoplay: { + delay: 6000, + disableOnInteraction: false, + }, + modules: [Pagination, Autoplay], + loop: true, + className: 'border border-gray_r-6 min-h-full', + slidesPerView: 1, +}; const Hero = () => { const bannerQuery = useQuery({ @@ -35,33 +48,60 @@ const Hero = () => { if (banners.length > 1) { swiperBanner.slidesPerView = 1.1; swiperBanner.loop = true; + swiperBannerMobile.loop = true; } }, [banners]); + const swiperBannerMobile = { + ...swiperBannerMob, + pagination: { dynamicBullets: false, clickable: true }, + }; + return ( -
-
-
Pasti Hemat & Untung Selama Belanja di Indoteknik.com!
-
-
Cari paket yang kami sediakan dengan penawaran harga & Nikmati kemudahan dalam setiap transaksi dengan fitur lengkap Pembayaran hingga barang sampai!
-
+ <> + +
+
+
Pasti Hemat & Untung Selama Belanja di Indoteknik.com!
+
+
Cari paket yang kami sediakan dengan penawaran harga & Nikmati kemudahan dalam setiap transaksi dengan fitur lengkap Pembayaran hingga barang sampai!
+
-
- - {banners.map((banner, index) => ( - - {banner.name} - - ))} - -
-
+
+ + {banners.map((banner, index) => ( + + {banner.name} + + ))} + +
+
+ + + + {banners?.map((banner, index) => ( + + {banner.name} + + ))} + + + + ) } -- cgit v1.2.3 From 3fe75f5dcaf75e71d29d50f3fb0aa1b5fb443224 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Sat, 13 Jul 2024 10:37:34 +0700 Subject: update revisi banner all promotion --- src-migrate/modules/promo/components/Hero.tsx | 33 +++++++++++++-------------- 1 file changed, 16 insertions(+), 17 deletions(-) (limited to 'src-migrate/modules/promo/components/Hero.tsx') diff --git a/src-migrate/modules/promo/components/Hero.tsx b/src-migrate/modules/promo/components/Hero.tsx index 2701250d..b6e27270 100644 --- a/src-migrate/modules/promo/components/Hero.tsx +++ b/src-migrate/modules/promo/components/Hero.tsx @@ -4,14 +4,18 @@ import Image from 'next/image'; import { useEffect, useMemo } from 'react'; import { useQuery } from 'react-query'; import { Swiper, SwiperProps, SwiperSlide } from 'swiper/react'; - -import { getBanner } from '~/services/banner'; import style from '../styles/hero.module.css'; import 'swiper/css/navigation'; import 'swiper/css/pagination'; import { Navigation, Pagination, Autoplay } from 'swiper'; import MobileView from '../../../../src/core/components/views/MobileView'; import DesktopView from '@/core/components/views/DesktopView'; +import { getPromotionProgramSolr } from '~/services/promotionProgram'; + +interface IPromotionProgram { + banner_s: string; + name_s: string; +} const swiperBanner: SwiperProps = { modules:[Navigation, Pagination, Autoplay], @@ -39,18 +43,13 @@ const swiperBannerMob = { const Hero = () => { const bannerQuery = useQuery({ queryKey: ['banner.all-promo'], - queryFn: () => getBanner({ type: 'banner-promotion' }) - }) - - const banners = useMemo(() => bannerQuery.data || [], [bannerQuery.data]); + queryFn: getPromotionProgramSolr, + }); - useEffect(() => { - if (banners.length > 1) { - swiperBanner.slidesPerView = 1.1; - swiperBanner.loop = true; - swiperBannerMobile.loop = true; - } - }, [banners]); + const banners: IPromotionProgram[] = useMemo( + () => bannerQuery.data?.response?.docs || [], + [bannerQuery.data] + ); const swiperBannerMobile = { ...swiperBannerMob, @@ -72,8 +71,8 @@ const Hero = () => { {banners.map((banner, index) => ( {banner.name} { width={439} height={150} quality={100} - src={banner.image} - alt={banner.name} + src={banner.banner_s} + alt={banner.name_s} className='w-full h-full object-cover object-center rounded-2xl' /> -- cgit v1.2.3 From a42272ae50a5e8661db5ae534f08f475efb05665 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Wed, 17 Jul 2024 14:09:51 +0700 Subject: update all promotion --- src-migrate/modules/promo/components/Hero.tsx | 24 +++++++++++------------- 1 file changed, 11 insertions(+), 13 deletions(-) (limited to 'src-migrate/modules/promo/components/Hero.tsx') diff --git a/src-migrate/modules/promo/components/Hero.tsx b/src-migrate/modules/promo/components/Hero.tsx index b6e27270..7eb84270 100644 --- a/src-migrate/modules/promo/components/Hero.tsx +++ b/src-migrate/modules/promo/components/Hero.tsx @@ -10,11 +10,11 @@ import 'swiper/css/pagination'; import { Navigation, Pagination, Autoplay } from 'swiper'; import MobileView from '../../../../src/core/components/views/MobileView'; import DesktopView from '@/core/components/views/DesktopView'; -import { getPromotionProgramSolr } from '~/services/promotionProgram'; +import {bannerApi} from '../../../../src/api/bannerApi' interface IPromotionProgram { - banner_s: string; - name_s: string; + image: string ; + name: string; } const swiperBanner: SwiperProps = { @@ -41,20 +41,18 @@ const swiperBannerMob = { }; const Hero = () => { - const bannerQuery = useQuery({ - queryKey: ['banner.all-promo'], - queryFn: getPromotionProgramSolr, - }); + const heroBanner = useQuery('heroBannerSecondary', bannerApi({ type: 'banner-promotion' })) const banners: IPromotionProgram[] = useMemo( - () => bannerQuery.data?.response?.docs || [], - [bannerQuery.data] + () => heroBanner?.data || [], + [heroBanner.data] ); const swiperBannerMobile = { ...swiperBannerMob, pagination: { dynamicBullets: false, clickable: true }, }; + return ( <> @@ -71,8 +69,8 @@ const Hero = () => { {banners.map((banner, index) => ( {banner.name_s} { width={439} height={150} quality={100} - src={banner.banner_s} - alt={banner.name_s} + src={banner.image} + alt={banner.name} className='w-full h-full object-cover object-center rounded-2xl' /> -- cgit v1.2.3 From 30142ab6c6f37fb381264efd0dc94aa997b1a278 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Wed, 17 Jul 2024 15:14:43 +0700 Subject: update dynamic description --- src-migrate/modules/promo/components/Hero.tsx | 33 ++++++++++++++------------- 1 file changed, 17 insertions(+), 16 deletions(-) (limited to 'src-migrate/modules/promo/components/Hero.tsx') diff --git a/src-migrate/modules/promo/components/Hero.tsx b/src-migrate/modules/promo/components/Hero.tsx index 7eb84270..b91288dd 100644 --- a/src-migrate/modules/promo/components/Hero.tsx +++ b/src-migrate/modules/promo/components/Hero.tsx @@ -13,6 +13,8 @@ import DesktopView from '@/core/components/views/DesktopView'; import {bannerApi} from '../../../../src/api/bannerApi' interface IPromotionProgram { + headline_banner: string; + description_banner: string; image: string ; name: string; } @@ -58,27 +60,26 @@ const Hero = () => { <>
-
-
Pasti Hemat & Untung Selama Belanja di Indoteknik.com!
-
-
Cari paket yang kami sediakan dengan penawaran harga & Nikmati kemudahan dalam setiap transaksi dengan fitur lengkap Pembayaran hingga barang sampai!
-
- -
{banners.map((banner, index) => ( - - {banner.name} + +
+
{banner.headline_banner? banner.headline_banner : "Pasti Hemat & Untung Selama Belanja di Indoteknik.com!"}
+
+
{banner.description_banner? banner.description_banner : "Cari paket yang kami sediakan dengan penawaran harga & Nikmati kemudahan dalam setiap transaksi dengan fitur lengkap Pembayaran hingga barang sampai!"}
+
+
+ {banner.name} +
))} -
-- cgit v1.2.3 From e32af31e19d38bf5f94dc229bae012c5c5aea720 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Wed, 17 Jul 2024 16:25:58 +0700 Subject: update slug banner and card voucher --- src-migrate/modules/promo/components/Hero.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src-migrate/modules/promo/components/Hero.tsx') diff --git a/src-migrate/modules/promo/components/Hero.tsx b/src-migrate/modules/promo/components/Hero.tsx index b91288dd..801136e9 100644 --- a/src-migrate/modules/promo/components/Hero.tsx +++ b/src-migrate/modules/promo/components/Hero.tsx @@ -43,7 +43,7 @@ const swiperBannerMob = { }; const Hero = () => { - const heroBanner = useQuery('heroBannerSecondary', bannerApi({ type: 'banner-promotion' })) + const heroBanner = useQuery('heroBannerSecondary', bannerApi({ type: 'banner-semua-promo' })) const banners: IPromotionProgram[] = useMemo( () => heroBanner?.data || [], -- cgit v1.2.3 From 93c68dbc6a873fa84b14eb3d102013f42e53af8a Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Thu, 1 Aug 2024 16:19:45 +0700 Subject: update all promo --- src-migrate/modules/promo/components/Hero.tsx | 15 ++++++++------- 1 file changed, 8 insertions(+), 7 deletions(-) (limited to 'src-migrate/modules/promo/components/Hero.tsx') diff --git a/src-migrate/modules/promo/components/Hero.tsx b/src-migrate/modules/promo/components/Hero.tsx index 801136e9..110052ba 100644 --- a/src-migrate/modules/promo/components/Hero.tsx +++ b/src-migrate/modules/promo/components/Hero.tsx @@ -13,8 +13,8 @@ import DesktopView from '@/core/components/views/DesktopView'; import {bannerApi} from '../../../../src/api/bannerApi' interface IPromotionProgram { - headline_banner: string; - description_banner: string; + headlineBanner: string; + descriptionBanner: string; image: string ; name: string; } @@ -43,7 +43,7 @@ const swiperBannerMob = { }; const Hero = () => { - const heroBanner = useQuery('heroBannerSecondary', bannerApi({ type: 'banner-semua-promo' })) + const heroBanner = useQuery('allPromo', bannerApi({ type: 'banner-semua-promo' })); const banners: IPromotionProgram[] = useMemo( () => heroBanner?.data || [], @@ -55,7 +55,8 @@ const Hero = () => { pagination: { dynamicBullets: false, clickable: true }, }; - + console.log("banner",banners) + // console.log("headlineBanner",banners[0].headlineBanner) return ( <> @@ -64,9 +65,9 @@ const Hero = () => { {banners.map((banner, index) => (
-
{banner.headline_banner? banner.headline_banner : "Pasti Hemat & Untung Selama Belanja di Indoteknik.com!"}
+
{banner.headlineBanner? banner.headlineBanner : "Pasti Hemat & Untung Selama Belanja di Indoteknik.com!"}
-
{banner.description_banner? banner.description_banner : "Cari paket yang kami sediakan dengan penawaran harga & Nikmati kemudahan dalam setiap transaksi dengan fitur lengkap Pembayaran hingga barang sampai!"}
+
{banner.descriptionBanner? banner.descriptionBanner : "Cari paket yang kami sediakan dengan penawaran harga & Nikmati kemudahan dalam setiap transaksi dengan fitur lengkap Pembayaran hingga barang sampai!"}
{ alt={banner.name} width={666} height={450} - quality={100} + quality={90} className='w-full h-full object-fit object-center rounded-2xl' />
-- cgit v1.2.3 From 516db9ccbaf00bfc5b668ea425aa74b9ffe820c6 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Thu, 1 Aug 2024 16:46:29 +0700 Subject: delete console log --- src-migrate/modules/promo/components/Hero.tsx | 2 -- 1 file changed, 2 deletions(-) (limited to 'src-migrate/modules/promo/components/Hero.tsx') diff --git a/src-migrate/modules/promo/components/Hero.tsx b/src-migrate/modules/promo/components/Hero.tsx index 110052ba..c5f0afad 100644 --- a/src-migrate/modules/promo/components/Hero.tsx +++ b/src-migrate/modules/promo/components/Hero.tsx @@ -55,8 +55,6 @@ const Hero = () => { pagination: { dynamicBullets: false, clickable: true }, }; - console.log("banner",banners) - // console.log("headlineBanner",banners[0].headlineBanner) return ( <> -- cgit v1.2.3