From 4aa0b60f933d01ae5607fcba90eb70e5b47b79e7 Mon Sep 17 00:00:00 2001 From: Reza_ashrafi Date: Tue, 11 Jan 2022 15:57:04 +0330 Subject: [PATCH] reza added Product suggestion --- src/components/Comments/index.js | 10 +- src/components/ProductSuggestion/index.js | 97 +++++++++++++++++++ src/components/ProductSuggestion/plus.svg | 3 + .../ProductSuggestion/product-chair.svg | 8 ++ src/redux/data.js | 11 +++ src/utils/comments.js | 26 +++-- 6 files changed, 144 insertions(+), 11 deletions(-) create mode 100644 src/components/ProductSuggestion/index.js create mode 100644 src/components/ProductSuggestion/plus.svg create mode 100644 src/components/ProductSuggestion/product-chair.svg diff --git a/src/components/Comments/index.js b/src/components/Comments/index.js index 16175e8..2de0124 100644 --- a/src/components/Comments/index.js +++ b/src/components/Comments/index.js @@ -69,6 +69,14 @@ Comments.defaultProps = { userImage : userImage, rate : 4, }, - + { + id: 5, + pid: null, + username : 'رضا رحمانی', + date : new Date(), + text : 'به زودی می‌ فهمند که اشتباه کرده‌ اند و عظمت هر ملتی بر روی خرابه‌ های وطن خودش می‌باشد', + userImage : userImage, + rate : 4, + }, ], } diff --git a/src/components/ProductSuggestion/index.js b/src/components/ProductSuggestion/index.js new file mode 100644 index 0000000..4d3da53 --- /dev/null +++ b/src/components/ProductSuggestion/index.js @@ -0,0 +1,97 @@ +import React, { useState } from "react"; + +import productImg from "./product-chair.svg"; +import plus from "./plus.svg"; + +const ProductSuggestion = ({ suggestions }) => { + const [selectedProduct, setSelectedProduct] = useState(null); + + return ( +
+

+ این کالاها برای خرید به شما پیشنهام می دهیم +

+ {/* product design */} +
+ {suggestions.map((suggestion, index) => ( +
+
setSelectedProduct(suggestion)} + > + +

+ {suggestion.productTitle} +

+

+ {suggestion.productPrice} + تومان +

+
+ انتخاب شما + +
+
+ {Number(index) !== suggestions.length - 1 && ( + + )} +
+ ))} +
+ {/* bottom */} +
+
+

+ جمع لوازم اختیاری خریداری شده + 56/894/400 + تومان +

+ + 1 کالا + +
+

+ در صورت تمایل می توانید موارد بالا را به سبد خرید اضافه کنید +

+ +
+
+ ); +}; + +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, + }, + ], +}; diff --git a/src/components/ProductSuggestion/plus.svg b/src/components/ProductSuggestion/plus.svg new file mode 100644 index 0000000..adc93a9 --- /dev/null +++ b/src/components/ProductSuggestion/plus.svg @@ -0,0 +1,3 @@ + + + + diff --git a/src/components/ProductSuggestion/product-chair.svg b/src/components/ProductSuggestion/product-chair.svg new file mode 100644 index 0000000..f5bb26c --- /dev/null +++ b/src/components/ProductSuggestion/product-chair.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/src/redux/data.js b/src/redux/data.js index 7ef0ab6..2ad72de 100644 --- a/src/redux/data.js +++ b/src/redux/data.js @@ -29,6 +29,7 @@ import Comments from "../components/Comments"; import Feedback from "../components/Feedback"; import Features from '../components/Features'; import Blogs from "../components/Blogs"; +import ProductSuggestion from "../components/ProductSuggestion"; const components = [ { @@ -543,6 +544,16 @@ const components = [ code: null, }, }, + { + name: "Product Suggestion", + author: "Andalib", + props: [], + content: { + name: "Product Suggestion", + component: , + code: null, + }, + }, ]; export default components; diff --git a/src/utils/comments.js b/src/utils/comments.js index 6d64ddb..5b6cfd8 100644 --- a/src/utils/comments.js +++ b/src/utils/comments.js @@ -1,16 +1,22 @@ export const connectToParent = (list) => { - let comments = [] - for(let item of list){ - comments.push({...item, child : []}); + let comments = []; + for (let item of list) { + comments.push({ ...item, child: [] }); } - for(let comment1 of comments){ - if(comment1.pid !== null){ - const index = comments.indexOf(comments.filter((comment2) => comment2.id === comment1.pid)[0]); - comments[index] = {...comments[index], child : [comment1]}; - }else{ - console.log('nist :(') + for (let comment1 of comments) { + if (comment1.pid !== null) { + const index = comments.indexOf( + comments.filter((comment2) => comment2.id === comment1.pid)[0] + ); + comments[index] = { + ...comments[index], + child: [...comments[index].child, comment1], + }; + } else { + } } + // comments = comments.filter((comment) => comment.pid === null); console.log(comments); -} \ No newline at end of file +};