زدن صفحه تکی محصولات-کامپوننت اضافه کردن به سبد خرید
This commit is contained in:
@@ -84,7 +84,7 @@ const faqs = [
|
||||
export default function Home() {
|
||||
const [activeTab, setActiveTab] = useState(0);
|
||||
const brands = ["NTN", "KOYO", "NACHI", "TIMKEN", "FAG", "SKF"];
|
||||
const latestArticles = articles.slice(-3);
|
||||
const latestArticles = articles.slice(-4);
|
||||
const featuredProducts = products.slice(0, 10);
|
||||
const [startIndex, setStartIndex] = useState(0);
|
||||
|
||||
@@ -333,7 +333,7 @@ export default function Home() {
|
||||
</div>
|
||||
|
||||
{/* grid */}
|
||||
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||
<div className="grid md:grid-cols-3 lg:grid-cols-4 gap-6">
|
||||
{latestArticles.map((article, i) => (
|
||||
<ArticleCard key={i} article={article} />
|
||||
))}
|
||||
|
||||
@@ -2,8 +2,8 @@ import ScrollToTop from '@/components/scrolltop';
|
||||
import { products } from '@/lib/data';
|
||||
import { notFound } from 'next/navigation';
|
||||
import Image from "next/image";
|
||||
import ProductCartAction from '@/components/cartaction';
|
||||
|
||||
// تعریف دقیق پارامترهایی که از URL میآیند
|
||||
interface PageProps {
|
||||
params: Promise<{
|
||||
id: string;
|
||||
@@ -11,68 +11,229 @@ interface PageProps {
|
||||
}>;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
export default async function SingleProductPage({ params }: PageProps) {
|
||||
const resolvedParams = await params;
|
||||
|
||||
|
||||
const product = products.find((p) => p.id.toString() === resolvedParams.id);
|
||||
|
||||
// ۳. اگر محصول با این ID در دیتابیس نبود
|
||||
if (!product) {
|
||||
notFound();
|
||||
}
|
||||
|
||||
const formattedPrice = product.price
|
||||
? Number(product.price.toString().replace(/,/g, '')).toLocaleString('fa-IR')
|
||||
: null;
|
||||
|
||||
return (
|
||||
<div className="container mx-auto p-8 max-w-4xl">
|
||||
<div className="bg-white rounded-xl shadow-lg p-6 flex flex-col md:flex-row gap-8 border border-gray-100">
|
||||
<ScrollToTop />
|
||||
<div className="bg-[#f8f9fc] min-h-screen py-8" dir="rtl">
|
||||
<div className="mx-auto px-4 lg:px-8 container max-w-7xl">
|
||||
<ScrollToTop />
|
||||
|
||||
<div className="w-full md:w-1/3 flex justify-center bg-gray-50 rounded-lg p-4">
|
||||
<Image
|
||||
src={product.image}
|
||||
width={300}
|
||||
height={300}
|
||||
alt={product.title}
|
||||
className="object-contain"
|
||||
/>
|
||||
{/* مسیر راهنما */}
|
||||
<div className="text-sm text-gray-500 mb-6 flex items-center gap-2">
|
||||
<span>خانه</span> > <span>محصولات</span> > <span className="text-gray-800 font-semibold">{product.title}</span>
|
||||
</div>
|
||||
|
||||
<div className="w-full md:w-2/3 flex flex-col justify-between">
|
||||
<div>
|
||||
<h1 className="text-3xl font-bold text-gray-800 mb-2">{product.title}</h1>
|
||||
<p className="text-gray-500 font-semibold mb-6">برند: {product.brand}</p>
|
||||
|
||||
<div className="space-y-3 bg-gray-50 p-4 rounded-lg">
|
||||
<div className="flex justify-between border-b pb-2">
|
||||
<span className="text-gray-600">قطر داخلی (L):</span>
|
||||
<span className="font-bold" dir="ltr">{product.l}</span>
|
||||
{/*
|
||||
کانتینر اصلی گرید (Grid)
|
||||
موبایل: 1 ستون
|
||||
دسکتاپ: 12 ستون
|
||||
*/}
|
||||
<div className="grid grid-cols-1 lg:grid-cols-12 gap-6 lg:gap-8">
|
||||
|
||||
{/* ========================================= */}
|
||||
{/* بخش 1: معرفی محصول (بالای ستون راست) */}
|
||||
{/* دسکتاپ: 8 ستون عرض دارد. موبایل: اولین آیتم نمایش داده میشود */}
|
||||
{/* ========================================= */}
|
||||
<div className="lg:col-span-8 order-1 lg:order-none">
|
||||
<div className="bg-white rounded-3xl shadow-sm p-6 md:p-8 flex flex-col md:flex-row gap-8 items-center border border-gray-100">
|
||||
{/* باکس تصویر */}
|
||||
<div className="w-full md:w-[52%] h-72 rounded-2xl bg-[linear-gradient(135deg,#f8f9fc_0%,#e2e8f0_100%)] flex items-center justify-center p-6 relative">
|
||||
{product.badge && (
|
||||
<span className="absolute top-4 right-4 bg-orange-500 text-white text-xs font-bold px-2 py-1 rounded-md">
|
||||
{product.badge}
|
||||
</span>
|
||||
)}
|
||||
<Image
|
||||
src={product.image}
|
||||
width={250}
|
||||
height={250}
|
||||
alt={product.title}
|
||||
className="object-contain mix-blend-multiply"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex justify-between">
|
||||
<span className="text-gray-600">قطر خارجی (D):</span>
|
||||
<span className="font-bold" dir="ltr">{product.d}</span>
|
||||
|
||||
<div className="flex-1 w-full">
|
||||
<div className="inline-block px-3 py-1 bg-gray-100 text-gray-700 rounded-lg text-sm font-bold mb-4 tracking-wider">
|
||||
{product.brand}
|
||||
</div>
|
||||
<h1 className="text-3xl font-bold text-gray-800 mb-6 leading-relaxed">
|
||||
{product.title}
|
||||
</h1>
|
||||
|
||||
<p className='text-gray-500 text-[13px] mb-8'>
|
||||
طراحی شده برای عملکرد در دورهای بالا با آببندی کامل پلاستیکی (Rubber Seal). مناسب برای الکتروموتور و گیربکس.
|
||||
</p>
|
||||
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div className="bg-gray-50 p-4 rounded-2xl flex flex-col items-center justify-center text-center border border-gray-100">
|
||||
<span className="text-gray-500 text-sm mb-2">تحمل بار ($C$)</span>
|
||||
<span className="font-bold text-gray-800 text-lg" dir="ltr">{product.loadCapacity}</span>
|
||||
</div>
|
||||
<div className="bg-gray-50 p-4 rounded-2xl flex flex-col items-center justify-center text-center border border-gray-100">
|
||||
<span className="text-gray-500 text-sm mb-2">سرعت نهایی</span>
|
||||
<span className="font-bold text-gray-800 text-lg" dir="ltr">{product.maxSpeed}</span>
|
||||
</div>
|
||||
<div className="bg-gray-50 p-4 rounded-2xl flex flex-col items-center justify-center text-center border border-gray-100">
|
||||
<span className="text-gray-500 text-sm mb-2">نوع آببند</span>
|
||||
<span className="font-bold text-gray-800 text-lg" dir="ltr">{product.sealType}</span>
|
||||
</div>
|
||||
<div className="bg-gray-50 p-4 rounded-2xl flex flex-col items-center justify-center text-center border border-gray-100">
|
||||
<span className="text-gray-500 text-sm mb-2">محدوده دما</span>
|
||||
<span className="font-bold text-gray-800 text-lg" dir="ltr">{product.tempRange}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="mt-8 flex justify-between items-center border-t pt-4">
|
||||
<span className={`px-4 py-2 rounded-full font-bold text-sm ${product.stock ? "bg-green-100 text-green-800" : "bg-red-100 text-red-800"}`}>
|
||||
{product.stock ? "موجود در انبار" : "ناموجود"}
|
||||
</span>
|
||||
|
||||
{product.price ? (
|
||||
<span className="text-2xl font-bold text-blue-600">{product.price} تومان</span>
|
||||
) : (
|
||||
<span className="text-xl font-bold text-gray-700 flex items-center gap-2">
|
||||
نیاز به استعلام
|
||||
</span>
|
||||
)}
|
||||
{/* ========================================= */}
|
||||
{/* بخش 2: سایدبار و دکمه خرید (ستون چپ) */}
|
||||
{/* دسکتاپ: 4 ستون عرض دارد و 2 ردیف طول دارد (row-span-2) تا کنار هر دو بخش راست بماند */}
|
||||
{/* موبایل: با order-2 بین بخش معرفی و مشخصات قرار میگیرد */}
|
||||
{/* ========================================= */}
|
||||
<div className="lg:col-span-4 col-span-2 lg:row-span-2 order-2 lg:order-none relative h-full">
|
||||
{/* کانتینر استیکی */}
|
||||
<div className="flex flex-col gap-4 lg:sticky lg:top-[20px] pb-8">
|
||||
|
||||
<div className="bg-white rounded-[2rem] shadow-[0_4px_20px_-10px_rgba(0,0,0,0.05)] p-5 border border-gray-100 text-center">
|
||||
{product.stock ? (
|
||||
<div className="bg-[#eaf8ee] text-[#28a745] py-3 rounded-2xl text-sm font-bold mb-4">
|
||||
موجود در انبار شیراز
|
||||
</div>
|
||||
) : (
|
||||
<div className="bg-red-50 text-red-500 py-3 rounded-2xl text-sm font-bold mb-4">
|
||||
ناموجود - نیاز به تامین
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="bg-[#f8f9fa] rounded-2xl py-6 mb-6 flex flex-col items-center justify-center">
|
||||
<span className="text-gray-500 text-sm mb-2">قیمت مصرفکننده:</span>
|
||||
{formattedPrice ? (
|
||||
<>
|
||||
<span className="text-3xl font-extrabold text-[#1a2332] tracking-tight">{formattedPrice}</span>
|
||||
<span className="text-gray-500 text-sm mt-2">تومان</span>
|
||||
</>
|
||||
) : (
|
||||
<span className="text-2xl font-extrabold text-[#1a2332]">استعلام قیمت</span>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<ProductCartAction product={product} />
|
||||
|
||||
<div className="flex flex-col gap-3 text-[13px] text-gray-500 mt-4 border-t border-gray-100 pt-6">
|
||||
<div className="flex items-center gap-2 justify-center">
|
||||
<span>ضمانت اصالت دائم کالا</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-2 justify-center">
|
||||
<span>ارسال فوری (شیراز ۲ ساعته)</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-2 justify-center">
|
||||
<span>فاکتور رسمی شرکتی</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-white rounded-3xl p-5 shadow-[0_4px_20px_-10px_rgba(0,0,0,0.05)] border border-gray-100 hidden lg:flex justify-between items-center cursor-pointer hover:bg-gray-50 transition-colors">
|
||||
<div className="flex flex-col gap-1 text-right">
|
||||
<span className="font-extrabold text-[#1a2332] text-sm">دانلود دیتاشیت</span>
|
||||
<span className="text-xs text-gray-400 font-sans tracking-wide" dir="ltr">PDF • 1.2 MB • English</span>
|
||||
</div>
|
||||
<div className="w-12 h-12 bg-red-50 rounded-xl flex items-center justify-center text-red-400 shrink-0">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" className="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M7 21h10a2 2 0 002-2V9.414a1 1 0 00-.293-.707l-5.414-5.414A1 1 0 0012.586 3H7a2 2 0 00-2 2v14a2 2 0 002 2z" />
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-[#121826] rounded-3xl p-5 shadow-lg hidden lg:flex justify-between items-center cursor-pointer hover:bg-[#1a2332] transition-colors relative overflow-hidden">
|
||||
<div className="flex flex-col gap-1 z-10 text-right">
|
||||
<span className="font-extrabold text-white text-sm">نیاز به مشاوره؟</span>
|
||||
<span className="text-xs text-gray-400">تماس مستقیم با مهندسین</span>
|
||||
</div>
|
||||
<div className="w-12 h-12 bg-white/10 rounded-xl flex items-center justify-center text-white z-10 backdrop-blur-sm shrink-0">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" className="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z" />
|
||||
</svg>
|
||||
</div>
|
||||
<div className="absolute top-0 right-0 w-32 h-32 bg-white/5 rounded-full -mr-10 -mt-10 blur-2xl"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* ========================================= */}
|
||||
{/* بخش 3: مشخصات ابعادی (پایین ستون راست) */}
|
||||
{/* دسکتاپ: 8 ستون عرض دارد و به طور خودکار زیر بخش معرفی قرار میگیرد */}
|
||||
{/* موبایل: با order-3 در انتهای صفحه قرار میگیرد */}
|
||||
{/* ========================================= */}
|
||||
<div className="lg:col-span-8 order-3 lg:order-none">
|
||||
<div className="bg-white rounded-3xl shadow-sm p-6 md:p-8 border border-gray-100">
|
||||
<div className="flex justify-between items-center mb-8 border-b border-gray-100 pb-4">
|
||||
<h2 className="text-xl font-bold text-gray-800">مشخصات ابعادی دقیق</h2>
|
||||
<span className="text-sm text-gray-400">واحد: میلیمتر (mm)</span>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col md:flex-row gap-12 items-center">
|
||||
<div className="w-full md:w-1/2 bg-[#121826] rounded-2xl aspect-[4/3] relative flex items-center justify-center overflow-hidden">
|
||||
<div className="w-48 h-48 border border-gray-600 rounded-full flex items-center justify-center relative">
|
||||
<div className="w-20 h-20 border border-gray-600 rounded-full"></div>
|
||||
<div className="absolute w-full h-[1px] bg-orange-500"></div>
|
||||
<div className="absolute h-1/2 w-[1px] bg-orange-500 top-1/2 right-1/2"></div>
|
||||
|
||||
<div className="absolute top-1/2 -mt-5 left-[60%] text-orange-400 text-xs font-mono px-1 z-10" dir="ltr">
|
||||
{"$D=" + (product.l ? product.l.replace('mm', '').trim() : '') + "$"}
|
||||
</div>
|
||||
<div className="absolute top-[60%] right-1/2 text-orange-400 text-xs font-mono px-1 z-10" dir="ltr">
|
||||
{"$d=" + (product.d ? product.d.replace('mm', '').trim() : '') + "$"}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full md:w-1/2">
|
||||
<table className="w-full text-right text-sm">
|
||||
<tbody>
|
||||
<tr className="border-b border-gray-50">
|
||||
<td className="py-3 text-gray-500">قطر داخلی ($d$)</td>
|
||||
<td className="py-3 font-bold text-gray-800 text-left" dir="ltr">{product.d}</td>
|
||||
</tr>
|
||||
<tr className="border-b border-gray-50">
|
||||
<td className="py-3 text-gray-500">قطر خارجی ($D$)</td>
|
||||
<td className="py-3 font-bold text-gray-800 text-left" dir="ltr">{product.l}</td>
|
||||
</tr>
|
||||
<tr className="border-b border-gray-50">
|
||||
<td className="py-3 text-gray-500">پهنا ($B$)</td>
|
||||
<td className="py-3 font-bold text-gray-800 text-left" dir="ltr">{product.width}</td>
|
||||
</tr>
|
||||
<tr className="border-b border-gray-50">
|
||||
<td className="py-3 text-gray-500">وزن خالص</td>
|
||||
<td className="py-3 font-bold text-gray-800 text-left" dir="ltr">{product.weight}</td>
|
||||
</tr>
|
||||
<tr className="border-b border-gray-50">
|
||||
<td className="py-3 text-gray-500">جنس قفسه</td>
|
||||
<td className="py-3 font-bold text-gray-800 text-left" dir="ltr">{product.cageMaterial}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="py-3 text-gray-500">کد بینالمللی</td>
|
||||
<td className="py-3 font-bold text-gray-800 text-left" dir="ltr">{product.intCode}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -28,7 +28,7 @@ export default function ArticleCard({ article }: { article: Article }) {
|
||||
|
||||
return (
|
||||
<Link href={`/blog/${articleSlug}`} className="group block h-full">
|
||||
<div className="bg-white rounded-[2rem] border border-gray-100 shadow-sm transition-all duration-500 flex flex-col h-[95%] overflow-hidden">
|
||||
<div className="bg-white rounded-[1rem] border border-gray-100 shadow-sm transition-all duration-500 flex flex-col h-[100%] overflow-hidden">
|
||||
|
||||
{/* بخش تصویر با نسبت ابعاد متناسب (مربعیتر) */}
|
||||
<div className="relative aspect-[16/11] w-full overflow-hidden">
|
||||
@@ -43,7 +43,7 @@ export default function ArticleCard({ article }: { article: Article }) {
|
||||
</div>
|
||||
|
||||
{/* محتوای متنی */}
|
||||
<div className="p-6 flex flex-col flex-grow">
|
||||
<div className="p-4 flex flex-col flex-grow">
|
||||
{/* تاریخ مقاله */}
|
||||
<div className="flex items-center gap-2 text-gray-400 text-[10px] mb-3 font-semibold uppercase tracking-wider">
|
||||
<Calendar size={13} className="text-yellow-500" />
|
||||
|
||||
74
components/cartaction.tsx
Normal file
74
components/cartaction.tsx
Normal file
@@ -0,0 +1,74 @@
|
||||
'use client';
|
||||
|
||||
import { Plus, Minus, Trash2 } from "lucide-react";
|
||||
import { useCart } from "./context/cartcontext";
|
||||
interface ProductCartActionProps {
|
||||
product: any;
|
||||
}
|
||||
|
||||
export default function ProductCartAction({ product }: ProductCartActionProps) {
|
||||
const { addToCart, decreaseQuantity, cart } = useCart();
|
||||
|
||||
// بررسی وجود و تعداد محصول در سبد خرید
|
||||
const cartItem = cart.find((item) => item.id === product.id);
|
||||
const quantity = cartItem ? cartItem.quantity : 0;
|
||||
|
||||
const handleIncrease = (e: React.MouseEvent) => {
|
||||
e.preventDefault();
|
||||
addToCart(product);
|
||||
};
|
||||
|
||||
const handleDecrease = (e: React.MouseEvent) => {
|
||||
e.preventDefault();
|
||||
decreaseQuantity(product.id);
|
||||
};
|
||||
|
||||
// اگر محصول ناموجود بود
|
||||
if (!product.stock) {
|
||||
return (
|
||||
<div className="flex gap-3 mb-8 h-[52px]">
|
||||
<button disabled className="w-full rounded-xl font-bold text-white bg-gray-300 cursor-not-allowed">
|
||||
ناموجود در انبار
|
||||
</button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="flex gap-3 mb-8 h-[52px]">
|
||||
{quantity > 0 ? (
|
||||
// حالت ۲: محصول در سبد خرید وجود دارد (نمایش کنترلر کم و زیاد)
|
||||
<div className="flex-1 flex items-center justify-between bg-white border-2 border-[#f59e0b] rounded-xl px-4 shadow-sm transition-all">
|
||||
<button
|
||||
onClick={handleIncrease}
|
||||
className="text-gray-500 hover:text-green-600 transition-colors p-2 cursor-pointer"
|
||||
>
|
||||
<Plus size={20} />
|
||||
</button>
|
||||
|
||||
<span className="text-xl font-bold text-gray-800 w-8 text-center">
|
||||
{quantity}
|
||||
</span>
|
||||
|
||||
<button
|
||||
onClick={handleDecrease}
|
||||
className="text-gray-500 hover:text-red-500 transition-colors p-2 cursor-pointer"
|
||||
>
|
||||
{quantity === 1 ? <Trash2 size={20} /> : <Minus size={20} />}
|
||||
</button>
|
||||
</div>
|
||||
) : (
|
||||
// حالت ۱: پیشفرض (دکمه نارنجی افزودن به سبد مطابق با تصویر)
|
||||
<>
|
||||
<button
|
||||
onClick={handleIncrease}
|
||||
className="flex-1 rounded-xl font-bold text-white transition-all flex items-center justify-center gap-2 bg-[#f59e0b] hover:bg-amber-600 shadow-lg shadow-amber-500/20 cursor-pointer"
|
||||
>
|
||||
افزودن به سبد
|
||||
</button>
|
||||
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -70,7 +70,7 @@ export default function Footer() {
|
||||
<ul className="space-y-4 text-sm">
|
||||
<li className="flex items-center gap-2">
|
||||
<MapPin size={16} className="text-yellow-500" />
|
||||
قزوین، مینودر
|
||||
شیراز،معالی اباد
|
||||
</li>
|
||||
|
||||
<li className="flex items-center gap-2">
|
||||
|
||||
@@ -296,7 +296,7 @@ export function Header() {
|
||||
{/* User/Cart Actions */}
|
||||
<div className='flex items-center order-3 gap-2'>
|
||||
{/* دراپداون سبد خرید */}
|
||||
<div className="relative group z-50 before:absolute before:-inset-x-5 before:-inset-y-3 before:content-['']">
|
||||
<div className="relative group before:absolute before:-inset-x-5 before:-inset-y-3 before:content-['']">
|
||||
|
||||
<Link href="/cart" className="flex items-center justify-center p-2.5 bg-white border border-gray-300/60 rounded-xl text-gray-700 hover:bg-gray-50 transition relative z-10">
|
||||
<ShoppingCart className="w-4 h-4 text-gray-500" strokeWidth={1.8} />
|
||||
|
||||
113
lib/data.tsx
113
lib/data.tsx
@@ -1,14 +1,21 @@
|
||||
|
||||
export const products = [
|
||||
{
|
||||
id: "1",
|
||||
title: "بلبرینگ شبکهای 22220",
|
||||
image: "/src/img/1.jpg",
|
||||
l: "120 mm",
|
||||
l: "120 mm", // نمایانگر D
|
||||
d: "60 mm",
|
||||
brand: "K",
|
||||
price: null,
|
||||
stock: true,
|
||||
width: "33 mm",
|
||||
weight: "1.52 kg",
|
||||
cageMaterial: "Brass",
|
||||
intCode: "22220-E1",
|
||||
loadCapacity: "kN 156.0",
|
||||
maxSpeed: "r/min 4,300",
|
||||
tempRange: "C° 150+ / 30-",
|
||||
sealType: "Open",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
@@ -20,59 +27,107 @@ export const products = [
|
||||
price: "450,000",
|
||||
badge: "جدید",
|
||||
stock: false,
|
||||
width: "9 mm",
|
||||
weight: "0.032 kg",
|
||||
cageMaterial: "Polyamide",
|
||||
intCode: "7200-B-TVP",
|
||||
loadCapacity: "kN 5.4",
|
||||
maxSpeed: "r/min 28,000",
|
||||
tempRange: "C° 120+ / 30-",
|
||||
sealType: "Open",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "رولبرینگ مخروطی 30205",
|
||||
image: "/src/img/3.jpg",
|
||||
l: "20 mm",
|
||||
d: "52 mm",
|
||||
l: "52 mm", // مقدار L و D جابجا بود، تصحیح شد
|
||||
d: "25 mm",
|
||||
brand: "KOYO",
|
||||
price: "870,000",
|
||||
badge: "-8%",
|
||||
stock: true,
|
||||
width: "16.25 mm",
|
||||
weight: "0.15 kg",
|
||||
cageMaterial: "Steel",
|
||||
intCode: "30205-A",
|
||||
loadCapacity: "kN 34.5",
|
||||
maxSpeed: "r/min 9,500",
|
||||
tempRange: "C° 120+ / 30-",
|
||||
sealType: "Open",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
title: "بلبرینگ شیار عمیق 6204",
|
||||
image: "/src/img/4.jpg",
|
||||
l: "20 mm",
|
||||
d: "47 mm",
|
||||
l: "47 mm",
|
||||
d: "20 mm",
|
||||
brand: "SKF",
|
||||
price: "1,250,000",
|
||||
badge: "پرفروش",
|
||||
stock: false,
|
||||
width: "14 mm",
|
||||
weight: "0.106 kg",
|
||||
cageMaterial: "Sheet Metal",
|
||||
intCode: "6204-2RSH/C3",
|
||||
loadCapacity: "kN 13.5",
|
||||
maxSpeed: "r/min 10,000",
|
||||
tempRange: "C° 100+ / 40-",
|
||||
sealType: "Double Seal",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
title: "بلبرینگ استوانهای NU220",
|
||||
image: "/src/img/5.jpg",
|
||||
l: "200 mm",
|
||||
d: "85 mm",
|
||||
l: "180 mm",
|
||||
d: "100 mm",
|
||||
brand: "NSK",
|
||||
price: "2,400,000",
|
||||
badge: "پیشنهادی",
|
||||
stock: true,
|
||||
width: "34 mm",
|
||||
weight: "3.75 kg",
|
||||
cageMaterial: "Machined Brass",
|
||||
intCode: "NU220-EM1",
|
||||
loadCapacity: "kN 255.0",
|
||||
maxSpeed: "r/min 3,800",
|
||||
tempRange: "C° 150+ / 30-",
|
||||
sealType: "Open",
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
title: "رولبرینگ سوزنی NK20",
|
||||
image: "/src/img/6.jpg",
|
||||
l: "20 mm",
|
||||
d: "35 mm",
|
||||
l: "28 mm",
|
||||
d: "20 mm",
|
||||
brand: "INA",
|
||||
price: "690,000",
|
||||
stock: true,
|
||||
width: "16 mm",
|
||||
weight: "0.027 kg",
|
||||
cageMaterial: "Steel",
|
||||
intCode: "NK20/16",
|
||||
loadCapacity: "kN 12.8",
|
||||
maxSpeed: "r/min 18,000",
|
||||
tempRange: "C° 120+ / 20-",
|
||||
sealType: "Open",
|
||||
},
|
||||
{
|
||||
id: "7",
|
||||
title: "بوش بلبرینگ برنزی B1810",
|
||||
image: "/src/img/7.jpg",
|
||||
l: "28 mm",
|
||||
d: "45 mm",
|
||||
l: "45 mm",
|
||||
d: "28 mm",
|
||||
brand: "KBT",
|
||||
price: "330,000",
|
||||
stock: true,
|
||||
width: "25 mm",
|
||||
weight: "0.085 kg",
|
||||
cageMaterial: "Bronze",
|
||||
intCode: "B-1810-25",
|
||||
loadCapacity: "kN 8.5",
|
||||
maxSpeed: "r/min 1,200",
|
||||
tempRange: "C° 200+ / 50-",
|
||||
sealType: "None",
|
||||
},
|
||||
{
|
||||
id: "8",
|
||||
@@ -84,28 +139,52 @@ export const products = [
|
||||
price: "980,000",
|
||||
badge: "ویژه",
|
||||
stock: true,
|
||||
width: "16 mm",
|
||||
weight: "0.21 kg",
|
||||
cageMaterial: "Polyamide",
|
||||
intCode: "1206-TVH",
|
||||
loadCapacity: "kN 15.6",
|
||||
maxSpeed: "r/min 11,000",
|
||||
tempRange: "C° 120+ / 30-",
|
||||
sealType: "Open",
|
||||
},
|
||||
{
|
||||
id: "9",
|
||||
title: "رولبرینگ کفگرد 51206",
|
||||
image: "/src/img/2.jpg",
|
||||
l: "24 mm",
|
||||
d: "60 mm",
|
||||
l: "52 mm",
|
||||
d: "30 mm",
|
||||
brand: "NACHI",
|
||||
price: "1,080,000",
|
||||
stock: false,
|
||||
width: "16 mm",
|
||||
weight: "0.14 kg",
|
||||
cageMaterial: "Sheet Steel",
|
||||
intCode: "51206",
|
||||
loadCapacity: "kN 26.5",
|
||||
maxSpeed: "r/min 4,500",
|
||||
tempRange: "C° 100+ / 20-",
|
||||
sealType: "Open",
|
||||
},
|
||||
{
|
||||
id: "10",
|
||||
title: "بلبرینگ دوبل ردیفی 5206",
|
||||
image: "/src/img/3.jpg",
|
||||
l: "30 mm",
|
||||
d: "62 mm",
|
||||
l: "62 mm",
|
||||
d: "30 mm",
|
||||
brand: "SKF",
|
||||
price: "1,550,000",
|
||||
badge: "جدید",
|
||||
stock: true,
|
||||
},
|
||||
width: "23.8 mm",
|
||||
weight: "0.29 kg",
|
||||
cageMaterial: "Polyamide",
|
||||
intCode: "5206-A-2RS1",
|
||||
loadCapacity: "kN 30.5",
|
||||
maxSpeed: "r/min 7,500",
|
||||
tempRange: "C° 110+ / 30-",
|
||||
sealType: "Double Seal",
|
||||
}
|
||||
];
|
||||
|
||||
|
||||
|
||||
22
package-lock.json
generated
22
package-lock.json
generated
@@ -11,7 +11,8 @@
|
||||
"lucide-react": "^0.577.0",
|
||||
"next": "16.1.6",
|
||||
"react": "19.2.3",
|
||||
"react-dom": "19.2.3"
|
||||
"react-dom": "19.2.3",
|
||||
"swiper": "^12.1.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@tailwindcss/postcss": "^4",
|
||||
@@ -1667,6 +1668,25 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/swiper": {
|
||||
"version": "12.1.2",
|
||||
"resolved": "https://mirror-npm.runflare.com/swiper/-/swiper-12.1.2.tgz",
|
||||
"integrity": "sha512-4gILrI3vXZqoZh71I1PALqukCFgk+gpOwe1tOvz5uE9kHtl2gTDzmYflYCwWvR4LOvCrJi6UEEU+gnuW5BtkgQ==",
|
||||
"funding": [
|
||||
{
|
||||
"type": "patreon",
|
||||
"url": "https://www.patreon.com/swiperjs"
|
||||
},
|
||||
{
|
||||
"type": "open_collective",
|
||||
"url": "http://opencollective.com/swiper"
|
||||
}
|
||||
],
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">= 4.7.0"
|
||||
}
|
||||
},
|
||||
"node_modules/tailwindcss": {
|
||||
"version": "4.2.1",
|
||||
"resolved": "https://hub.megan.ir/repository/npm/tailwindcss/-/tailwindcss-4.2.1.tgz",
|
||||
|
||||
@@ -11,7 +11,8 @@
|
||||
"lucide-react": "^0.577.0",
|
||||
"next": "16.1.6",
|
||||
"react": "19.2.3",
|
||||
"react-dom": "19.2.3"
|
||||
"react-dom": "19.2.3",
|
||||
"swiper": "^12.1.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@tailwindcss/postcss": "^4",
|
||||
|
||||
Reference in New Issue
Block a user