You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
69 lines
2.1 KiB
69 lines
2.1 KiB
3 years ago
|
import React from "react";
|
||
|
|
||
|
const AddToCartCard = ({
|
||
|
numberOfSuggest,
|
||
|
sendingTime,
|
||
|
button,
|
||
|
price,
|
||
|
profit,
|
||
|
showProduct,
|
||
|
productName,
|
||
|
productImg,
|
||
|
productCat,
|
||
|
}) => {
|
||
|
const specialities = [
|
||
|
{
|
||
|
icon: "images/tick-circle.svg",
|
||
|
description: ` توصیه به خرید توسط ${numberOfSuggest} نفر`,
|
||
|
},
|
||
|
{
|
||
|
icon: "images/shield-tick.svg",
|
||
|
description: `زمان ارسال ${sendingTime} روز کاری پس از سفارش`,
|
||
|
},
|
||
|
{
|
||
|
icon: "images/delivery-icon.svg",
|
||
|
description: `گارانتی اصالت و سلامت فیزیکی`,
|
||
|
},
|
||
|
];
|
||
|
return (
|
||
|
<div className="w-full felx flex-col items-center justify-center mx-4 p-4 pt-0 bg-gray-100">
|
||
|
{showProduct && (
|
||
|
<div className="w-full max-w-8 flex justify-center items-center m-0 py-4 overflow-hidden">
|
||
|
<img
|
||
|
src={productImg}
|
||
|
alt="productImage"
|
||
|
className="max-w-[100px] ml-4 py-2 px-4 bg-gray-200 rounded"
|
||
|
/>
|
||
|
<div className="text-sm">
|
||
|
<h1 className="text-sm">{productName}</h1>
|
||
|
<p className="pt-2 text-xs text-blue-400">{productCat}</p>
|
||
|
</div>
|
||
|
</div>
|
||
|
)}
|
||
|
{specialities.map((item, index) => (
|
||
|
<div
|
||
|
key={index}
|
||
|
className="w-full flex items-center p-2 border-b border-solid border-gray-300"
|
||
|
>
|
||
|
{item.icon && <img src={item.icon} alt="" className="pl-3" />}
|
||
|
<p className="text-sm text-blue-400 text-right">{item.description}</p>
|
||
|
</div>
|
||
|
))}
|
||
|
<div className="w-full flex flex-col items-center justify-center p-4">
|
||
|
<h1 className="text-xl text-gray-500">
|
||
|
<span className="text-blue-400"> {price} </span>
|
||
|
تومان
|
||
|
</h1>
|
||
|
{profit && (
|
||
|
<h5 className="p-2 pb-0 text-xs text-blue-400">
|
||
|
با خرید این کالا {profit} تومان سود کنید
|
||
|
</h5>
|
||
|
)}
|
||
|
</div>
|
||
|
<div className="w-full flex justify-center">{button}</div>
|
||
|
</div>
|
||
|
);
|
||
|
};
|
||
|
|
||
|
export default AddToCartCard;
|