diff --git a/src/App.js b/src/App.js index 60651c2..773ec53 100644 --- a/src/App.js +++ b/src/App.js @@ -65,7 +65,7 @@ function App() { {/* */} {/* */} {/* */} - {/* */} + {/* */} {/* */} {/* */} @@ -83,9 +83,9 @@ function App() { {/* */} {/* */} {/* */} - {/* */} - {/* */} - + + {/* */} + {/* */} ); diff --git a/src/components/Table/Design1/index.js b/src/components/Table/Design1/index.js index c1337cc..6cf6bc7 100644 --- a/src/components/Table/Design1/index.js +++ b/src/components/Table/Design1/index.js @@ -1,11 +1,21 @@ -import React from "react"; +import React, { useState } from "react"; import arrowDown from "./arrow-down.svg"; import arrowUp from "./arrow-up.svg"; const TableDesign1 = ({ tableItems, tableSubItems }) => { + const [sortedField, setSortedField] = useState(null); + + if (sortedField !== null) { + tableSubItems.sort((a, b) => { + if (a.payedPrice > b.payedPrice) { + return -1; + } + }); + } + return ( -
+
@@ -13,7 +23,7 @@ const TableDesign1 = ({ tableItems, tableSubItems }) => { {tableItems.map((tableItem, index) => ( - + {tableSubItems.map((tableSubItem, i) => ( - + @@ -133,13 +146,25 @@ TableDesign1.defaultProps = { title: "مایکروویر سامسونگ مدل", status: true, date: "1400/09/21", - payedPrice: 2400000, + payedPrice: 73, + }, + { + title: "آزمون آنلاین درس علوم تجربی", + status: false, + date: "1400/09/21", + payedPrice: 75, + }, + { + title: "مایکروویر سامسونگ مدل", + status: true, + date: "1400/09/21", + payedPrice: 25, }, { title: "آزمون آنلاین درس علوم تجربی", status: false, date: "1400/09/21", - payedPrice: 2400000, + payedPrice: 27, }, ], }; diff --git a/src/components/testtttt/Testttt.js b/src/components/testtttt/Testttt.js index 523e2d8..39a4a31 100644 --- a/src/components/testtttt/Testttt.js +++ b/src/components/testtttt/Testttt.js @@ -1,15 +1,34 @@ import React from "react"; // import "./Testttt.scss"; -import book from "../../assets/images/book.svg"; -import bookCover from "../../assets/images/book-white-cover.svg"; +import book from "./book.svg"; +import bookCover from "./book-white-cover.svg"; export const Testttt = ({ bookBackCoverBg }) => { return ( -
-
mahdi
+
+
+
+ +
+
+
- ); + ); }; export default Testttt; diff --git a/src/components/testtttt/book-white-cover.svg b/src/components/testtttt/book-white-cover.svg new file mode 100644 index 0000000..89ce43b --- /dev/null +++ b/src/components/testtttt/book-white-cover.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/components/testtttt/book.svg b/src/components/testtttt/book.svg new file mode 100644 index 0000000..12fcd6e --- /dev/null +++ b/src/components/testtttt/book.svg @@ -0,0 +1,8 @@ + + + + + + + +
{ className="w-4 cursor-pointer" /> @@ -51,11 +61,12 @@ const TableDesign1 = ({ tableItems, tableSubItems }) => { src={arrowUp} alt="" className="w-4 cursor-pointer" + // onClick={() => setSortedField} /> @@ -71,11 +82,13 @@ const TableDesign1 = ({ tableItems, tableSubItems }) => { src={arrowUp} alt="" className="w-4 cursor-pointer" + onClick={() => setSortedField()} /> setSortedField()} /> @@ -85,7 +98,7 @@ const TableDesign1 = ({ tableItems, tableSubItems }) => {
{tableSubItem.title}