arrow down left fixed

master
mahdi andalib 3 years ago
parent f2516b9fb8
commit 4ad4a5bbe9
  1. 19
      src/components/ReactTable4/BasicTable.js
  2. 6
      src/components/ReactTable4/Buttons.js
  3. 8
      src/components/ReactTable4/MOCK_DATA.json

@ -272,7 +272,7 @@ const BasicTable = ({ settingsIcon }) => {
{row.isExpanded ? ( {row.isExpanded ? (
<tr> <tr>
<td colSpan={headerGroups[0].headers.length}> <td colSpan={headerGroups[0].headers.length}>
{renderRowSubComponent({ row: row.original })} {renderRowSubComponent({ rows: row.original })}
{/* {renderRowSubComponent({ row: row.values })} */} {/* {renderRowSubComponent({ row: row.values })} */}
</td> </td>
</tr> </tr>
@ -367,11 +367,20 @@ const BasicTable = ({ settingsIcon }) => {
); );
}; };
function renderRowSubComponent({ row }) { function renderRowSubComponent({ rows }) {
const persian = {
weight: "وزن",
pageNumber: "تعداد صفحات",
pageType: "نوع کاغذ",
bookNumber: "شماره شابک",
publisher: "انتشارات",
author: "نویسنده",
bookType: "قطع",
publishedYear: "سال انتشار",
};
return ( return (
<div className="pl-2 pr-5 bg-blue-200"> <div className="flex flex-row items-center bg-indigo-100 border-r-4 border-blue-600 p-2">
مبلغ: {row.history} مبلغ: {rows.history}
<br />
<button className="bg-blue-400">ویرایش</button> <button className="bg-blue-400">ویرایش</button>
</div> </div>
); );

@ -7,11 +7,13 @@ import { useState } from "react";
export function Buttons({ row }) { export function Buttons({ row }) {
const [activeDetails, setActiveDetails] = useState(null); const [activeDetails, setActiveDetails] = useState(null);
return ( return (
<div className="flex flex-row items-center justify-end mx-1"> <div
className="flex flex-row items-center justify-end mx-1"
{...row.getToggleRowExpandedProps()}
>
<button <button
className="flex flex-row items-center justify-around p-2 rounded border border-gray-300 mx-1" className="flex flex-row items-center justify-around p-2 rounded border border-gray-300 mx-1"
onClick={() => setActiveDetails(!activeDetails)} onClick={() => setActiveDetails(!activeDetails)}
{...row.getToggleRowExpandedProps()}
> >
جزیات جزیات
<img <img

@ -17,7 +17,7 @@
"user-job": "مهندس ساختمان", "user-job": "مهندس ساختمان",
"order-status": 2, "order-status": 2,
"order-level": 2, "order-level": 2,
"history": "مهدی" "history": "tggg"
}, },
{ {
"name": "مک بوک پرو", "name": "مک بوک پرو",
@ -27,7 +27,7 @@
"user-job": "مهندس ساختمان", "user-job": "مهندس ساختمان",
"order-status": 3, "order-status": 3,
"order-level": 3, "order-level": 3,
"history": "مهدی" "history": "aaa"
}, },
{ {
"name": "تبلت", "name": "تبلت",
@ -37,7 +37,7 @@
"user-job": "مهندس ساختمان", "user-job": "مهندس ساختمان",
"order-status": 4, "order-status": 4,
"order-level": 4, "order-level": 4,
"history": "مهدی" "history": "ff"
}, },
{ {
"name": "کتاب جدید", "name": "کتاب جدید",
@ -47,6 +47,6 @@
"user-job": "طناز", "user-job": "طناز",
"order-status": 5, "order-status": 5,
"order-level": 5, "order-level": 5,
"history": "مهدی" "history": "sfda"
} }
] ]

Loading…
Cancel
Save