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>

3
src/Contexts/GlobalStateProvider.jsx
View File

@@ -12,6 +12,7 @@ const GlobalStateProvider = ({ children }) => {
const [isAuthenticate, setIsAuthenticate] = useState(false);
const [memberIfo, setMemberInfo] = useState();
const [communityMembers, setCommityMembers] = useState();
const [slideFromRight, setSlideFormRight] = useState(false);
const { colorMode, toggleColorMode } = useColorMode();
const [sponser, setSponser] = useState([
@@ -270,6 +271,8 @@ const GlobalStateProvider = ({ children }) => {
setSponser,
colorMode,
toggleColorMode,
slideFromRight,
setSlideFormRight
}}
>
{children}

21
src/Layout/DefaultLayout.jsx
View File

@@ -74,8 +74,7 @@ const DashboardLayout = () => {
const path = location.pathname;
const [isDrawerOpen, setIsDrawerOpen] = useState(false);
const [openDrawerClick, setOpenDrawerClick] = useState(true);
const { setIsAuthenticate, colorMode, toggleColorMode } = useContext(GlobalStateContext);
const [slideFromRight, setSlideFormRight] = useState(false);
const { setIsAuthenticate, colorMode, toggleColorMode, setSlideFormRight, slideFromRight } = useContext(GlobalStateContext);
const [isSplashVisible, setSplashVisible] = useState(true);
@@ -341,7 +340,7 @@ const DashboardLayout = () => {
style={{
width: isDrawerOpen || openDrawerClick ? 232 : 74,
transition: "width 0.3s ease-in-out", // Smooth transition for width change
overflow: "hidden", // Hide overflow to prevent content overflow during transition
// overflow: "hidden",
backgroundColor: "#0041180A",
position: "relative",
// backgroundColor: "#002F0F",
@@ -376,8 +375,8 @@ const DashboardLayout = () => {
</div>
<Box
className="ps-2 pb-5 scroll-bar pe-1"
style={{ height: "90%", overflowY: "scroll", overflowX: "hidden" }}
className="ps-2 scroll-bar pe-1"
style={{ height: "90%", overflowY: "scroll", overflowX: "hidden" ,paddingBottom:'5rem'}}
>
<Accordion m={0} allowToggle>
{nav.map(({ title, type, Icon, submenu, path }, index) => {
@@ -543,9 +542,9 @@ const DashboardLayout = () => {
width: 18,
height: 26,
position: "absolute",
right: 0,
right: -19,
bottom: 28,
zIndex: 333,
zIndex: 99,
}}
>
{isDrawerOpen || openDrawerClick ? (
@@ -594,7 +593,7 @@ const DashboardLayout = () => {
style={{
width: isDrawerOpen || openDrawerClick ? 232 : 74,
transition: "width 0.3s ease-in-out", // Smooth transition for width change
overflow: "hidden", // Hide overflow to prevent content overflow during transition
// overflow: "hidden",
backgroundColor: "#0041180A",
position: "relative",
// backgroundColor: "#002F0F",
@@ -803,13 +802,13 @@ const DashboardLayout = () => {
width: 18,
height: 26,
position: "absolute",
left: 0,
left: -18,
bottom: 28,
zIndex: 333,
zIndex: 99,
}}
>
{isDrawerOpen || openDrawerClick ? (
<ArrowRightIcon className="web-text-small " />
<ArrowRightIcon className="web-text-small " />
) : (
<ArrowLeftIcon className="web-text-small" />
)}

6
src/Pages/Master/Sponser/Sponsers.jsx
View File

@@ -28,7 +28,7 @@ import CustomAlertDialog from "../../../Components/CustomAlertDialog";
const formatDate = (date) => new Date(date).toLocaleDateString(); // Simple date formatter
const Sponser = () => {
const { sponser, setSponser } = useContext(GlobalStateContext);
const { sponser, setSponser,slideFromRight } = useContext(GlobalStateContext);
const [searchTerm, setSearchTerm] = useState("");
const [isLoading, setIsLoading] = useState(true);
const [deleteAlert, setDeleteAlert] = useState(false);
@@ -85,7 +85,7 @@ const Sponser = () => {
const extractedArray = filteredData?.map((item) => ({
id: item?.id,
"Sponser name": (
<Text
<Text justifyContent={slideFromRight? 'right': 'left' }
as={"span"}
color={"gray.600"}
className="d-flex align-items-center fw-bold web-text-small"
@@ -94,7 +94,7 @@ const Sponser = () => {
</Text>
),
Address: (
<Box w={350} isTruncated={true}>
<Box w={350} isTruncated={true} >
<Text as={"span"} color={"teal.900"}>
{item.sponserAddress}
</Text>