Siddhesh.More/tanami-admin-panel
1
0
Fork 0
Code Issues 4 Pull Requests Packages Projects Releases 2 Wiki Activity

Merge branch 'dev' of http://git.wdipl.com/Siddhesh.More/tanami-admin-panel into dev

Browse Source
This commit is contained in:
Siddhesh More
2024-06-25 19:24:26 +05:30
parent d99d9a0b65 e89dfbf55a
commit f7eb249e34
4 changed files with 75 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

101
src/Components/DataTable/DataTable.jsx
View File

@@ -1,4 +1,4 @@
import React from "react";
import React, { useContext } from "react";
import {
Table,
TableContainer,
@@ -15,23 +15,42 @@ import EmptySearchList from "../EmptySearchList";
import Pagination from "../Pagination";
import { useNavigate } from "react-router-dom";
const DataTable = ({ data, isLoading, tableHeadRow, emptyMessage, totalPages, viewActionId,
import GlobalStateContext from "../../Contexts/GlobalStateContext";
const DataTable = ({
data,
isLoading,
tableHeadRow,
emptyMessage,
totalPages,
setMouseEntered,
setMouseEnteredId, }) => {
const navigate = useNavigate()
const columnWidth = data && data[0] ? `${(100 / Object.keys(data[0]).length).toFixed(2)}%` : "auto";
setMouseEnteredId,
}) => {
const navigate = useNavigate();
const { slideFromRight } = useContext(GlobalStateContext);
const columnWidth =
data && data[0]
? `${(100 / Object.keys(data[0]).length).toFixed(2)}%`
: "auto";
return (
<TableContainer overflowX={"hidden"} className="h-auto mb-3 w-100">
{data?.length === 0 ? (
<EmptySearchList message={emptyMessage} />
) : (
<Table size="sm">
{/* <TableCaption><Pagination totalItems={totalPages} /></TableCaption> */}
<TableCaption>Tanami v1.0</TableCaption>
<Thead backgroundColor="gray.50">
<Table size="sm">
{/* <TableCaption><Pagination totalItems={totalPages} /></TableCaption> */}
<TableCaption>Tanami v1.0</TableCaption>
<Thead backgroundColor="gray.50">
<Tr>
{tableHeadRow.map((heading, index) => (
<Th key={index} p={3} w={"auto"} color={"#004118"}>
<Th
textAlign={slideFromRight ? "right" : "left"}
key={index}
p={3}
w={"auto"}
color={"#004118"}
>
{isLoading ? <Skeleton height="20px" /> : heading}
{/* {heading} */}
</Th>
@@ -44,6 +63,7 @@ const DataTable = ({ data, isLoading, tableHeadRow, emptyMessage, totalPages, vi
<Tr key={index}>
{tableHeadRow.map((_, i) => (
<Td
textAlign={slideFromRight ? "right" : "left"}
key={i}
style={{
whiteSpace: "nowrap",
@@ -58,46 +78,43 @@ const DataTable = ({ data, isLoading, tableHeadRow, emptyMessage, totalPages, vi
</Tr>
))
: data?.map((item, index) => (
<Tr
// onMouseEnter={(e) => {
// e.currentTarget.style.backgroundColor = "transparent"; // Change the background color on hover
// e.currentTarget.style.transition = "0.1s";
// e.currentTarget.style.boxShadow =
// "rgba(0, 0, 0, 0.24) 0px 1px 8px";
// setMouseEntered(true);
// setMouseEnteredId(item.id);
// }}
// onMouseLeave={(e) => {
// e.currentTarget.style.backgroundColor = "transparent"; // Revert to default background color on hover out
// e.currentTarget.style.transition = "0.3s";
// e.currentTarget.style.boxShadow = "none";
// setMouseEntered(false);
// }}
transition={'0.5s all'}
_hover={{
bg:"green.50",
cursor: "pointer",
}} key={index}>
<Tr
// onMouseEnter={(e) => {
// e.currentTarget.style.backgroundColor = "transparent"; // Change the background color on hover
// e.currentTarget.style.transition = "0.1s";
// e.currentTarget.style.boxShadow =
// "rgba(0, 0, 0, 0.24) 0px 1px 8px";
// setMouseEntered(true);
// setMouseEnteredId(item.id);
// }}
// onMouseLeave={(e) => {
// e.currentTarget.style.backgroundColor = "transparent"; // Revert to default background color on hover out
// e.currentTarget.style.transition = "0.3s";
// e.currentTarget.style.boxShadow = "none";
// setMouseEntered(false);
// }}
transition={"0.5s all"}
_hover={{
bg: "green.50",
cursor: "pointer",
}}
key={index}
>
{tableHeadRow.map((heading, i) => (
<Td
onClick={
i === tableHeadRow.length - 1 || i === 0
? null
: () => navigate(`edit-sponser/${item.id}`) // Define the onClick handler for other cells
}
// color={"gray.600"}
textAlign={slideFromRight ? "right" : "left"}
color={"gray.600"}
key={i}
style={{
whiteSpace: "nowrap",
textOverflow: "ellipsis",
}}
className="web-text-small"
onClick={
i === tableHeadRow.length - 1 || i === 0
? null
: () => navigate(`edit-sponser/${item.id}`) // Define the onClick handler for other cells
}
>
{item[heading]}
</Td>