From b59d8b0aed8b4ba2a00e89f36712b8741007a894 Mon Sep 17 00:00:00 2001 From: mahdi Date: Tue, 26 Apr 2022 11:09:50 +0430 Subject: [PATCH] update App.js, src/components/CurrentDateShamsi/index.js and src/components/ProductSuggestion/index.js --- src/App.js | 20 +++-- src/components/CurrentDateShamsi/index.js | 13 ++- src/components/ProductSuggestion/index.js | 20 +++-- src/components/RoomCardInfo/images/flower.svg | 87 +++++++++++++++++++ .../RoomCardInfo/images/flower2.svg | 87 +++++++++++++++++++ .../RoomCardInfo/images/qr-code.svg | 8 ++ src/components/RoomCardInfo/index.js | 34 ++++++++ 7 files changed, 252 insertions(+), 17 deletions(-) create mode 100644 src/components/RoomCardInfo/images/flower.svg create mode 100644 src/components/RoomCardInfo/images/flower2.svg create mode 100644 src/components/RoomCardInfo/images/qr-code.svg create mode 100644 src/components/RoomCardInfo/index.js diff --git a/src/App.js b/src/App.js index bc68f9f..6b1d5cc 100644 --- a/src/App.js +++ b/src/App.js @@ -95,6 +95,7 @@ import DateTime from "./components/DateTime"; import CardDesign3 from "./components/CardDesign3"; import CustomToast2 from "./components/CustomToast2"; import ContactUsInfoCard from "./components/ContactUsInfoCard"; +import RoomCardInfo from "./components/RoomCardInfo"; function App() { return ( @@ -115,12 +116,12 @@ function App() { {/* */} {/* */} {/* */} - {/* */} + {/* */} {/* */} {/* */} {/* */} - {/* */} + {/* */} {/* */} {/* */} @@ -140,15 +141,16 @@ function App() { {/* */} {/* */} {/* */} - {/* */} + {/* */} - {/* */} + {/* */} - {/* */} + + {/* */} {/* *************************************************** mini components *************************************************** */} @@ -181,11 +183,11 @@ function App() { {/* */} {/* */} {/* */} - {/* */} - {/* */} + + - {/* */} - {/* */} + + {/* */} {/* */} diff --git a/src/components/CurrentDateShamsi/index.js b/src/components/CurrentDateShamsi/index.js index 7089903..933e866 100644 --- a/src/components/CurrentDateShamsi/index.js +++ b/src/components/CurrentDateShamsi/index.js @@ -3,14 +3,23 @@ import React from "react"; const CurrentDateShamsi = ({ color, fontSize }) => { const date = new Date(); const option = { - weekday: "long", year: "numeric", month: "numeric", day: "numeric", }; + const option2 = { + weekday: "long", + }; + const todayDate = date.toLocaleDateString("fa-IR", option); + const weekday = date.toLocaleDateString("fa-IR", option2); - return

{todayDate}

; + return ( +

+ {todayDate} + {weekday} +

+ ); }; export default CurrentDateShamsi; diff --git a/src/components/ProductSuggestion/index.js b/src/components/ProductSuggestion/index.js index d613349..3279af4 100644 --- a/src/components/ProductSuggestion/index.js +++ b/src/components/ProductSuggestion/index.js @@ -5,7 +5,7 @@ import plus from "./plus.svg"; import Button from "../Button"; const ProductSuggestion = ({ suggestions, selected }) => { - const [selectedProduct, setSelectedProduct] = useState(null); + const [selectedProduct, setSelectedProduct] = useState([]); return (
@@ -19,11 +19,13 @@ const ProductSuggestion = ({ suggestions, selected }) => {
setSelectedProduct(suggestion)} onClick={() => setSelectedProduct( - selectedProduct === suggestion ? null : suggestion + selectedProduct.includes(suggestion) + ? selectedProduct.filter((item) => item != suggestion) + : [...selectedProduct, suggestion] ) } > @@ -43,13 +45,19 @@ const ProductSuggestion = ({ suggestions, selected }) => { {/* {suggestion.selected && ( انتخاب شما )} */} - {selectedProduct === suggestion && ( + {selectedProduct.includes(suggestion) && ( انتخاب شما )} setSelectedProduct(suggestion)} + checked={selectedProduct.includes(suggestion)} + onClick={() => + setSelectedProduct( + selectedProduct.includes(suggestion) + ? selectedProduct.filter((item) => item != suggestion) + : [...selectedProduct, suggestion] + ) + } className="checkbox-input mt-4 cursor-pointer w-4 h-4" type="checkbox" /> diff --git a/src/components/RoomCardInfo/images/flower.svg b/src/components/RoomCardInfo/images/flower.svg new file mode 100644 index 0000000..58bbe1b --- /dev/null +++ b/src/components/RoomCardInfo/images/flower.svg @@ -0,0 +1,87 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/components/RoomCardInfo/images/flower2.svg b/src/components/RoomCardInfo/images/flower2.svg new file mode 100644 index 0000000..5818779 --- /dev/null +++ b/src/components/RoomCardInfo/images/flower2.svg @@ -0,0 +1,87 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/components/RoomCardInfo/images/qr-code.svg b/src/components/RoomCardInfo/images/qr-code.svg new file mode 100644 index 0000000..446fb6a --- /dev/null +++ b/src/components/RoomCardInfo/images/qr-code.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/src/components/RoomCardInfo/index.js b/src/components/RoomCardInfo/index.js new file mode 100644 index 0000000..aec1954 --- /dev/null +++ b/src/components/RoomCardInfo/index.js @@ -0,0 +1,34 @@ +import React from "react"; + +import qrCode from "./images/qr-code.svg"; +import flower2 from "./images/flower2.svg"; + +const RoomCardInfo = ({ items }) => { + return ( +
+ {items.map((item, index) => ( +
+

{item.name}

+
+ ))} + qr-code +
+ ); +}; + +export default RoomCardInfo; + +RoomCardInfo.defaultProps = { + items: [ + { + name: "کامران هوشمند", + subItems: [ + { + enterData: "1400/11/13", + expireData: "1400/11/20", + roomNumber: "B14 سالن شهید عباسی", + }, + ], + }, + ], +};