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.
99 lines
3.2 KiB
99 lines
3.2 KiB
import React from "react"; |
|
|
|
import circleTick from "../../assets/icons/vuesax-linear-tick-circle.svg"; |
|
import shieldTick from "../../assets/icons/vuesax-linear-shield-tick.svg"; |
|
import linearGroup from "../../assets/icons/vuesax-linear-group.svg"; |
|
|
|
const AddToCartCard = ({ |
|
numberOfSuggest, |
|
sendingTime, |
|
button, |
|
price, |
|
profit, |
|
showProduct, |
|
productName, |
|
productImg, |
|
productCat, |
|
footer, |
|
}) => { |
|
const specialities = [ |
|
{ |
|
icon: circleTick, |
|
description: `${window.t( |
|
"توصیه به خرید توسط" |
|
)} ${numberOfSuggest} ${window.t("نفر")}`, |
|
}, |
|
{ |
|
icon: linearGroup, |
|
description: `${window.t("زمان ارسال")} ${sendingTime} ${window.t( |
|
"روز کاری پس از سفارش" |
|
)}`, |
|
}, |
|
{ |
|
icon: shieldTick, |
|
description: `${window.t("گارانتی اصالت و سلامت فیزیکی")}`, |
|
}, |
|
]; |
|
return ( |
|
<> |
|
<div className="felx flex-col bg-grayF7 p-4 pt-0 w-full mx-4 items-center justify-center"> |
|
{showProduct && ( |
|
<div className="flex w-full max-w-8 overflow-hidden items-center py-4 m-0 justify-center"> |
|
<img |
|
src={productImg} |
|
style={{ maxWidth: "100px" }} |
|
className="py-2 px-4 bg-grayF4 rounded ml-4" |
|
/> |
|
<div className="text-sm"> |
|
<h1 className="text-sm">{productName}</h1> |
|
<p className=" text-xs pt-2 text-blueC0">{productCat}</p> |
|
</div> |
|
</div> |
|
)} |
|
{specialities.map((item, index) => ( |
|
<div |
|
className="flex items-center p-2 w-full border-0 border-b border-solid border-gray-300" |
|
key={index} |
|
> |
|
{item.icon && <img src={item.icon} className="pl-3" />} |
|
<p className="text-sm text-blue52 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-blueC0"> {price} </span> |
|
{window.t("تومان")} |
|
</h1> |
|
{profit && ( |
|
<h5 className="text-xs p-2 pb-0 text-blue52"> |
|
{window.t("با خرید این کالا")} {profit} |
|
{window.t("تومان سود کنید")} |
|
</h5> |
|
)} |
|
</div> |
|
<div className="w-full flex justify-center">{button}</div> |
|
</div> |
|
{footer && ( |
|
<div className="flex bg-grayF7 p-4 w-full mx-4 items-center mt-4 max-w-xs"> |
|
{footer == "SendBack" && ( |
|
<> |
|
<img src={specialities[0].icon} className="pl-3" /> |
|
<div className="text-sm"> |
|
<h3 className="text-blue52"> |
|
{window.t("بازگشت بی چون و چرا")} |
|
</h3> |
|
<p> |
|
{window.t( |
|
"ما خیلی خوب هستیم و دوستتون داریم در صورتی که از کالایی خوشتون نیومد میتونید بی قید و شرط بسش بدید" |
|
)} |
|
</p> |
|
</div> |
|
</> |
|
)} |
|
</div> |
|
)} |
|
</> |
|
); |
|
}; |
|
|
|
export default AddToCartCard;
|
|
|