|
|
|
@ -19,6 +19,7 @@ const ProductSuggestion = ({ suggestions, selected }) => { |
|
|
|
|
<div |
|
|
|
|
className={`flex flex-col items-center border rounded-md border-gray-300 p-5 mx-4 cursor-pointer transition-all ease-in-out duration-500
|
|
|
|
|
${selectedProduct === suggestion ? "bg-white" : ""}`}
|
|
|
|
|
onClick={() => setSelectedProduct(suggestion)} |
|
|
|
|
> |
|
|
|
|
<img |
|
|
|
|
src={suggestion.productImage} |
|
|
|
@ -32,12 +33,16 @@ const ProductSuggestion = ({ suggestions, selected }) => { |
|
|
|
|
{suggestion.productPrice} |
|
|
|
|
<span className="mr-1 text-xs text-black">تومان</span> |
|
|
|
|
</p> |
|
|
|
|
<div className="flex flex-col items-center mt-3"> |
|
|
|
|
{suggestion.selected && ( |
|
|
|
|
<div className="flex flex-col items-center"> |
|
|
|
|
{/* {suggestion.selected && ( |
|
|
|
|
<span className="text-xs">انتخاب شما</span> |
|
|
|
|
)} */} |
|
|
|
|
{selectedProduct === suggestion && ( |
|
|
|
|
<span className="text-xs mt-2">انتخاب شما</span> |
|
|
|
|
)} |
|
|
|
|
<input |
|
|
|
|
checked={suggestion.selected} |
|
|
|
|
// checked={suggestion.selected}
|
|
|
|
|
checked={selectedProduct === suggestion ? true : false} |
|
|
|
|
onClick={() => setSelectedProduct(suggestion)} |
|
|
|
|
className="checkbox-input mt-4 cursor-pointer w-4 h-4" |
|
|
|
|
type="checkbox" |
|
|
|
@ -79,28 +84,28 @@ ProductSuggestion.defaultProps = { |
|
|
|
|
productTitle: "لپ تاپ گیمینگ ایسوس", |
|
|
|
|
productPrice: "750000", |
|
|
|
|
plusIcon: null, |
|
|
|
|
selected: true, |
|
|
|
|
// selected: true,
|
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
productImage: productImg, |
|
|
|
|
productTitle: "مانیتور 40 اینچ", |
|
|
|
|
productPrice: "3.000.000", |
|
|
|
|
plusIcon: plus, |
|
|
|
|
selected: false, |
|
|
|
|
// selected: true,
|
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
productImage: productImg, |
|
|
|
|
productTitle: "ماوس گیمینگ", |
|
|
|
|
productPrice: "650/000", |
|
|
|
|
plusIcon: plus, |
|
|
|
|
selected: false, |
|
|
|
|
// selected: false,
|
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
productImage: productImg, |
|
|
|
|
productTitle: "لپ تاپ مک بوک پرو 2022", |
|
|
|
|
productPrice: "2000", |
|
|
|
|
plusIcon: plus, |
|
|
|
|
selected: false, |
|
|
|
|
// selected: false,
|
|
|
|
|
}, |
|
|
|
|
], |
|
|
|
|
}; |
|
|
|
|