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.
 
 
 

115 lines
4.3 KiB

//
// import React, { useState } from "react";
// import productImg from "./product-chair.svg";
// import plus from "./plus.svg";
// const ProductSuggestion = ({ suggestions, selected }) => {
// const [selectedProduct, setSelectedProduct] = useState([]);
// const addToSelected = (obj) => {
// if (selectedProduct.indexOf(obj) === -1) {
// setSelectedProduct(() => [...selectedProduct, obj]);
// } else {
// setSelectedProduct(() =>
// selectedProduct.splice(selectedProduct.indexOf(obj), 1)
// );
// }
// };
// return (
// <section className="m-10 border-2 border-gray-300 p-4 rounded-lg">
// <h2 className="text-center text-lg font-bold text-productPrice">
// این کالاها برای خرید به شما پیشنهام می دهیم
// </h2>
// {/* product design */}
// <div className="flex flex-row flex-wrap justify-center items-center mt-20">
// {suggestions.map((suggestion, index) => (
// <div
// className="flex flex-col sm:flex-row mb-7"
// key={index}
// onClick={() => setSelectedProduct(suggestion)}
// >
// <img src={suggestion.plusIcon} alt="" className="mx-4" />
// <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" : ""}`}
// >
// <img
// src={suggestion.productImage}
// alt=""
// className="w-full h-full"
// />
// <h2 className="my-3 text-sm text-productPrice">
// {suggestion.productTitle}
// </h2>
// <p className="text-sm text-lightBlueTextColor">
// {suggestion.productPrice}
// <span className="mr-1 text-xs text-black">تومان</span>
// </p>
// <div className="flex flex-col items-center mt-3">
// {suggestion.selected && (
// <span className="text-xs">انتخاب شما</span>
// )}
// <input
// checked={selectedProduct.indexOf(suggestion) > -1}
// onClick={() => setSelectedProduct(suggestion)}
// className="checkbox-input mt-4 cursor-pointer w-4 h-4"
// type="checkbox"
// />
// </div>
// </div>
// </div>
// ))}
// </div>
// {/* bottom */}
// <div className="flex flex-col justify-center items-center mt-10">
// <div className="flex flex-row mb-5">
// <p className="text-sm sm:text-base text-productPrice font-bold">
// جمع لوازم اختیاری خریداری شده
// <span> 56/894/400 </span>
// تومان
// </p>
// <span className="text-lightBlueTextColor text-sm sm:text-base mr-1 font-bold">
// 1 کالا
// </span>
// </div>
// <p className="text-xs sm:text-sm font-light mb-2 text-gray-600">
// در صورت تمایل می توانید موارد بالا را به سبد خرید اضافه کنید
// </p>
// <button className="my-2 text-white rounded bg-blueBgColor p-2 text-sm">
// اضافه کردن 1 مورد به سبد خرید
// </button>
// </div>
// </section>
// );
// };
// export default ProductSuggestion;
// ProductSuggestion.defaultProps = {
// suggestions: [
// {
// productImage: productImg,
// productTitle: "لپ تاپ گیمینگ ایسوس",
// productPrice: "750000",
// plusIcon: null,
// },
// {
// productImage: productImg,
// productTitle: "مانیتور 40 اینچ",
// productPrice: "3.000.000",
// plusIcon: plus,
// },
// {
// productImage: productImg,
// productTitle: "ماوس گیمینگ",
// productPrice: "650/000",
// plusIcon: plus,
// },
// {
// productImage: productImg,
// productTitle: "لپ تاپ مک بوک پرو 2022",
// productPrice: "2000",
// plusIcon: plus,
// },
// ],
// };