49 lines
1.7 KiB
TypeScript
49 lines
1.7 KiB
TypeScript
'use client';
|
|
import React from 'react';
|
|
import Link from 'next/link';
|
|
import { Swiper, SwiperSlide } from 'swiper/react';
|
|
import { Autoplay, Navigation, Pagination } from 'swiper/modules';
|
|
import { FaCaretRight } from 'react-icons/fa';
|
|
|
|
import { ListDealData } from '@/data/deal';
|
|
|
|
import CounDown from '@components/Common/CounDown';
|
|
import ProductItem from './ProductItem';
|
|
|
|
const BoxProductDeal: React.FC = () => {
|
|
return (
|
|
<div className="box-product-deal boder-radius-10">
|
|
<div className="box-title-deal flex items-center justify-between">
|
|
<div className="title-deal flex items-center justify-center gap-10">
|
|
<i className="sprite sprite-icon-deal-home"></i>
|
|
<h2 className="title font-bold">Giá tốt mỗi ngày</h2>
|
|
<span className="text-time-deal-home color-white fz-16 font-bold">Kết thúc sau</span>
|
|
<div className="global-time-deal flex items-center gap-2">
|
|
<CounDown deadline={'31-01-2026, 9:30 am'} />
|
|
</div>
|
|
</div>
|
|
<Link href="/deal" className="button-deal color-white mb-10 flex items-center">
|
|
Xem thêm khuyến mãi <FaCaretRight size={16} />
|
|
</Link>
|
|
</div>
|
|
<div className="box-list-item-deal swiper-box-deal">
|
|
<Swiper
|
|
modules={[Autoplay, Navigation, Pagination]}
|
|
spaceBetween={12}
|
|
slidesPerView={6}
|
|
loop={true}
|
|
navigation={true}
|
|
>
|
|
{ListDealData.map((Item, index) => (
|
|
<SwiperSlide key={index}>
|
|
<ProductItem item={Item} />
|
|
</SwiperSlide>
|
|
))}
|
|
</Swiper>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default BoxProductDeal;
|