tieptk/nguyencongpc_nextjs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
tieptk
2026-03-13 13:54:45 +07:00
parent a8e30f32a0
commit 25111ff10e
120 changed files with 4213 additions and 4859 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
src/components/Deal/ItemDeal.tsx
View File

@@ -1,23 +1,21 @@
'use client';
import React, { useState } from 'react';
import { parse } from 'date-fns';
import Link from 'next/link';
import Image from 'next/image';
import CounDown from '@/components/Common/CounDown';
import CountDown from '@/components/Common/CountDown';
import { DealType } from '@/types';
import { formatCurrency } from '@/lib/formatPrice';
type ItemDealProps = {
Item: DealType;
item: DealType;
};
const ItemDeal: React.FC<ItemDealProps> = ({ Item }) => {
const ItemDeal: React.FC<ItemDealProps> = ({ item }) => {
const [now] = useState(() => Date.now());
const deadline = parse(item.to_time, 'dd-MM-yyyy, h:mm a', new Date()).getTime();
// ép kiểu to_time sang số (timestamp) hoặc Date
const deadline = parse(Item.to_time, 'dd-MM-yyyy, h:mm a', new Date()).getTime();
// chỉ hiển thị nếu deadline còn lớn hơn thời gian hiện tại
if (deadline <= now) {
return null;
}
@@ -25,31 +23,31 @@ const ItemDeal: React.FC<ItemDealProps> = ({ Item }) => {
return (
<div className="product-item">
<div className="item-deal">
<Link href={Item.product_info.productUrl} className="product-image position-relative">
<Link href={item.product_info.productUrl} className="product-image position-relative">
<Image
src={Item.product_info.productImage.large}
src={item.product_info.productImage.large}
width={250}
height={250}
alt={Item.product_info.productName}
alt={item.product_info.productName}
/>
</Link>
<div className="product-info flex-1">
<Link href={Item.product_info.productUrl}>
<h3 className="product-title line-clamp-3">{Item.product_info.productName}</h3>
<Link href={item.product_info.productUrl}>
<h3 className="product-title line-clamp-3">{item.product_info.productName}</h3>
</Link>
<div className="product-martket-main flex items-center">
{Item.product_info.marketPrice > 0 && (
{Number(item.product_info.marketPrice) > 0 && (
<>
<p className="product-market-price">
{Item.product_info.marketPrice.toLocaleString()} ₫
{formatCurrency(item.product_info.marketPrice)} đ
</p>
<div className="product-percent-price">-{Item.product_info.price_off || 0}%</div>
<div className="product-percent-price">-{item.product_info.price_off || 0}%</div>
</>
)}
</div>
<div className="product-price-main font-bold">
{Item.product_info.price > '0'
? `${formatCurrency(Item.product_info.price)}đ`
{item.product_info.price > '0'
? `${formatCurrency(item.product_info.price)}đ`
: 'Liên hệ'}
</div>
<div className="p-quantity-sale">
@@ -57,24 +55,20 @@ const ItemDeal: React.FC<ItemDealProps> = ({ Item }) => {
<div className="bg-gradient"></div>
{(() => {
const percentRemaining =
((Number(Item.quantity) - Number(Item.sale_quantity)) / Number(Item.quantity)) *
((Number(item.quantity) - Number(item.sale_quantity)) / Number(item.quantity)) *
100;
return (
<>
<p className="js-line-deal-left" style={{ width: `${percentRemaining}%` }}></p>
</>
);
return <p className="js-line-deal-left" style={{ width: `${percentRemaining}%` }}></p>;
})()}
<span>
Còn {Number(Item.quantity) - Number(Item.sale_quantity)}/{Number(Item.quantity)} sản
Còn {Number(item.quantity) - Number(item.sale_quantity)}/{Number(item.quantity)} sản
phẩm
</span>
</div>
<div className="js-item-deal-time js-item-time-25404">
<div className="time-deal-page flex items-center justify-center gap-2">
<div>Kết thúc sau: </div>
<CounDown deadline={Item.to_time} />
<div>Kết thúc sau:</div>
<CountDown deadline={item.to_time} />
</div>
</div>
<a href="javascript:buyNow(25404)" className="buy-now-deal">