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') 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