From 7a70b37c3019c6922e6c3443fa0182a2824395da Mon Sep 17 00:00:00 2001 From: mahdi andalib Date: Mon, 21 Feb 2022 12:56:23 +0330 Subject: [PATCH] updated more details component --- src/components/ReactTable4/Buttons.js | 8 +- .../ReactTable4/RenderRowSubComponent.js | 271 ++++++++++++++++++ 2 files changed, 275 insertions(+), 4 deletions(-) create mode 100644 src/components/ReactTable4/RenderRowSubComponent.js diff --git a/src/components/ReactTable4/Buttons.js b/src/components/ReactTable4/Buttons.js index 4701c29..6bb6fca 100644 --- a/src/components/ReactTable4/Buttons.js +++ b/src/components/ReactTable4/Buttons.js @@ -1,9 +1,9 @@ +import { useState } from "react"; + import arrowIcon from "./arrow-icon.svg"; import more from "./more2.svg"; import edit from "./edit.svg"; -import { useState } from "react"; - export const Buttons = ({ row, addTab }) => { const [activeDetails, setActiveDetails] = useState(null); return ( @@ -13,7 +13,7 @@ export const Buttons = ({ row, addTab }) => { onClick={() => setActiveDetails(!activeDetails)} {...row.getToggleRowExpandedProps()} > - جزپیات + جزئیات { > - + ); }; diff --git a/src/components/ReactTable4/RenderRowSubComponent.js b/src/components/ReactTable4/RenderRowSubComponent.js new file mode 100644 index 0000000..d4dee15 --- /dev/null +++ b/src/components/ReactTable4/RenderRowSubComponent.js @@ -0,0 +1,271 @@ +import React from "react"; + +const RenderRowSubComponent = ({ columns, addTab, row }) => { + console.log(row); + + return ( +
+ {/* right */} +
+ {/* 1 */} +
+
+

+ نام و نام خانوادگی: + {row.name} +

+
+ {/* 2 */} +
+
+

+ تاریخ سفارش: + {row.order_date} +

+
+ {/* 3 */} +
+
+

+ مبلغ سفارش: + {row.order_price} +

+
+ {/* 4 */} +
+
+

+ شماره سفارش: + {row.order_number} +

+
+ {/* 5 */} +
+
+

+ شغل کاربر: + {row.user_job} +

+
+ {/* 6 */} +
+
+

+ وضعیت سفارش: + + {columns[5].Cell({ value: row.order_status })} + +

+
+ {/* 7 */} +
+
+

+ سطح اهمیت: + + {columns[6].Cell({ value: row.order_level })} + +

+
+ {/* 8 */} +
+
+

+ محل تولد: + {row.birth_place} +

+
+ {/* 9 */} +
+
+

+ تلفن محل کار: + {row.office_phone} +

+
+ {/* 10 */} +
+
+

+ تحصیلات: + {row.education} +

+
+ {/* 11 */} +
+
+

+ تاریخ تولد: + {row.birth_day} +

+
+ {/* 12 */} +
+
+

+ شغل: + {row.job} +

+
+ {/* 13 */} +
+
+

+ دانشگاه: + {row.uni} +

+
+ {/* 14 */} +
+
+

+ رشته تحصیلی: + {row.field_study} +

+
+ {/* 15 */} +
+
+

+ اخلاق: + {row.behaviour} +

+
+ {/* 16 */} +
+
+

+ نشانی: + {row.address} +

+
+
+ {/* left */} +
+ + +
+
+ ); +}; + +export default RenderRowSubComponent;