From 9522eea367ab57c8990e4cdd6968e3b252666a70 Mon Sep 17 00:00:00 2001 From: YasinShaikh123 <123150391+YasinShaikh123@users.noreply.github.com> Date: Wed, 17 Jul 2024 11:52:28 +0530 Subject: [PATCH] 17-07-update --- src/Components/DataTable/DataTable.jsx | 2 +- src/Contexts/GlobalStateProvider.jsx | 158 +++++++++++ src/Pages/Admin/Academy.jsx | 22 -- src/Pages/Admin/BankInvestor.jsx | 226 ++++++++++++++- src/Pages/Admin/Contact.jsx | 135 +++++++-- .../Admin/ManageAcademy/AcademicDocuments.jsx | 242 ++++++++++++++++ .../ManageAcademy/AcademicDocumentsAdd.jsx | 73 +++++ .../Admin/ManageAcademy/AcademicVideo.jsx | 243 ++++++++++++++++ .../Admin/ManageAcademy/AcademicVideoAdd.jsx | 72 +++++ .../Admin/ManageAcademy/Academicdetails.jsx | 261 ++++++++++++++++++ .../ManageAcademy/AcademicdetailsEdit.jsx | 105 +++++++ src/Pages/Admin/ManageAcademy/Academy.jsx | 74 +++++ .../IO_Management/EditIO/InvestmentEdit.jsx | 2 +- .../Master/ExchangeRate/EditExchangeRate.jsx | 2 +- .../Master/ExchangeRate/ExchangeRate.jsx | 4 +- .../InvestmentType/AddInvestmentType.jsx | 38 +-- .../Master/InvestmentType/InvestmentType.jsx | 2 +- src/Pages/Master/Sponser/AddSponser.jsx | 2 +- .../WithDrawal/DrawalView/ViewHistory.jsx | 4 +- src/Routes/Routes.js | 3 +- src/assets/accademicbanner.png | Bin 0 -> 12644 bytes 21 files changed, 1571 insertions(+), 99 deletions(-) delete mode 100644 src/Pages/Admin/Academy.jsx create mode 100644 src/Pages/Admin/ManageAcademy/AcademicDocuments.jsx create mode 100644 src/Pages/Admin/ManageAcademy/AcademicDocumentsAdd.jsx create mode 100644 src/Pages/Admin/ManageAcademy/AcademicVideo.jsx create mode 100644 src/Pages/Admin/ManageAcademy/AcademicVideoAdd.jsx create mode 100644 src/Pages/Admin/ManageAcademy/Academicdetails.jsx create mode 100644 src/Pages/Admin/ManageAcademy/AcademicdetailsEdit.jsx create mode 100644 src/Pages/Admin/ManageAcademy/Academy.jsx create mode 100644 src/assets/accademicbanner.png diff --git a/src/Components/DataTable/DataTable.jsx b/src/Components/DataTable/DataTable.jsx index 50bb3a8..f8636b6 100644 --- a/src/Components/DataTable/DataTable.jsx +++ b/src/Components/DataTable/DataTable.jsx @@ -17,7 +17,7 @@ import { useNavigate } from "react-router-dom"; import GlobalStateContext from "../../Contexts/GlobalStateContext"; const DataTable = ({ - data, + data, setData, isLoading, tableHeadRow, diff --git a/src/Contexts/GlobalStateProvider.jsx b/src/Contexts/GlobalStateProvider.jsx index b8a573d..aa52d7f 100644 --- a/src/Contexts/GlobalStateProvider.jsx +++ b/src/Contexts/GlobalStateProvider.jsx @@ -1780,6 +1780,156 @@ const GlobalStateProvider = ({ children }) => { }, ]); + const [bankInvestor, setBankInvestor] = useState([ + { + id: 1, + date:"02-Jan-2024", + clientId: "SA00000001", + firstName: "John", + lastName: "David", + country: "Saudi Arabia", + phoneNumber: "8940035906", + mailId: "john@gmail.com", + status: "Completed", + }, + { + id: 2, + date:"02-Jan-2024", + clientId: "SA00000001", + firstName: "John", + lastName: "David", + country: "Saudi Arabia", + phoneNumber: "8940035906", + mailId: "john@gmail.com", + status: "Incompleted", + }, + { + id: 3, + date:"02-Jan-2024", + clientId: "SA00000001", + firstName: "John", + lastName: "David", + country: "Saudi Arabia", + phoneNumber: "8940035906", + mailId: "john@gmail.com", + status: "Completed", + }, + { + id: 4, + date:"02-Jan-2024", + clientId: "SA00000001", + firstName: "John", + lastName: "David", + country: "Saudi Arabia", + phoneNumber: "8940035906", + mailId: "john@gmail.com", + status: "Incompleted", + }, + { + id: 5, + date:"02-Jan-2024", + clientId: "SA00000001", + firstName: "John", + lastName: "David", + country: "Saudi Arabia", + phoneNumber: "8940035906", + mailId: "john@gmail.com", + status: "Completed", + }, + { + id: 6, + date:"02-Jan-2024", + clientId: "SA00000001", + firstName: "John", + lastName: "David", + country: "Saudi Arabia", + phoneNumber: "8940035906", + mailId: "john@gmail.com", + status: "Incompleted", + }, + { + id: 7, + date:"02-Jan-2024", + clientId: "SA00000001", + firstName: "John", + lastName: "David", + country: "Saudi Arabia", + phoneNumber: "8940035906", + mailId: "john@gmail.com", + status: "Incompleted", + }, + { + id: 8, + date:"02-Jan-2024", + clientId: "SA00000001", + firstName: "John", + lastName: "David", + country: "Saudi Arabia", + phoneNumber: "8940035906", + mailId: "john@gmail.com", + status: "Completed", + }, + { + id: 9, + date:"02-Jan-2024", + clientId: "SA00000001", + firstName: "John", + lastName: "David", + country: "Saudi Arabia", + phoneNumber: "8940035906", + mailId: "john@gmail.com", + status: "Completed", + }, + { + id: 10, + date:"02-Jan-2024", + clientId: "SA00000001", + firstName: "John", + lastName: "David", + country: "Saudi Arabia", + phoneNumber: "8940035906", + mailId: "john@gmail.com", + status: "Incompleted", + }, + ]); + + const [manageAcademy , setManageAcademy] = useState([ + { + id: 1, + header:"Investing in Private Equity", + content: "Private equity investing involve...", + bannerImage: "John", + }, + { + id: 2, + header:"Investing in Private Equity", + content: "Private equity investing involve...", + bannerImage: "John", + }, + { + id: 3, + header:"Investing in Private Equity", + content: "Private equity investing involve...", + bannerImage: "John", + }, + ]) + + const [manageVideo , setManageVideo] = useState([ + { + id: 1, + name:"Investing in Private Equity", + videoUploaded: "Video.mp4", + }, + ]) + + const [academicDocuments , setAcademicDocuments] = useState([ + { + id: 1, + fullName:"Investing in Private Equity", + document: "Video.mp4", + }, + ]) + return ( { setDepositRequest, depositHistory, setDepositHistory, + bankInvestor, + setBankInvestor, + manageAcademy, + setManageAcademy, + manageVideo, + setManageVideo, + academicDocuments, + setAcademicDocuments, }} > {children} diff --git a/src/Pages/Admin/Academy.jsx b/src/Pages/Admin/Academy.jsx deleted file mode 100644 index f7f3a24..0000000 --- a/src/Pages/Admin/Academy.jsx +++ /dev/null @@ -1,22 +0,0 @@ -import { Box, Image, Text } from "@chakra-ui/react" -// import error from "../assets/Error.svg" -import robot from "../../assets/robot.png" -// import robot from "../assets/robot.png" -const Academy = () => { - return ( - - - - {/* The requested URL was not found on this server. */} - - ) -} - -export default Academy \ No newline at end of file diff --git a/src/Pages/Admin/BankInvestor.jsx b/src/Pages/Admin/BankInvestor.jsx index cde3502..7bf6f4f 100644 --- a/src/Pages/Admin/BankInvestor.jsx +++ b/src/Pages/Admin/BankInvestor.jsx @@ -1,12 +1,199 @@ -import { Box, HStack, Image, Input, Text } from "@chakra-ui/react"; -// import error from "../assets/Error.svg" -import robot from "../../assets/robot.png"; +import { + Avatar, + Badge, + Box, + Button, + HStack, + Input, + Menu, + MenuButton, + MenuItem, + MenuList, + Portal, + Select, + Switch, + Tag, + Text, + Tooltip, + useDisclosure, + useToast, +} from "@chakra-ui/react"; +import React, { useContext, useEffect, useState,useRef } from "react"; +import { HiDotsVertical } from "react-icons/hi"; +import { Link, Link as RouterLink,useNavigate } from "react-router-dom"; +import { + AddIcon, + DeleteIcon, + EditIcon, + EmailIcon, + ViewIcon, +} from "@chakra-ui/icons"; +import GlobalStateContext from "../../Contexts/GlobalStateContext"; +import { debounce } from "../Master/Sponser/AddSponser"; import { OPACITY_ON_LOAD } from "../../Layout/animations"; -import { useState } from "react"; +import DataTable from "../../Components/DataTable/DataTable"; +import CustomAlertDialog from "../../Components/CustomAlertDialog"; import Pagination from "../../Components/Pagination"; -// import robot from "../assets/robot.png" +import ToastBox from "../../Components/ToastBox"; + +const formatDate = (date) => new Date(date).toLocaleDateString(); // Simple date formatter + const BankInvestor = () => { + const navigate = useNavigate(); + const toast = useToast(); + const thirdField = useRef(); + const { bankInvestor, setBankInvestor, slideFromRight } = + useContext(GlobalStateContext); const [searchTerm, setSearchTerm] = useState(""); + const [isLoading, setIsLoading] = useState(true); + const [deleteAlert, setDeleteAlert] = useState(false); + const [actionId, setActionId] = useState(false); + const [mouseEntered, setMouseEntered] = useState(false); + const [mouseEnteredId, setMouseEnteredId] = useState(""); + const {isOpen: isEditOpen,onOpen: onEditOpen,onClose: onEditClose,} = useDisclosure(); + const btnRef = React.useRef() + + useEffect(() => { + // Simulate loading + const timer = setTimeout(() => { + setIsLoading(false); + }, 1500); + + // Cleanup the timer on component unmount + return () => clearTimeout(timer); + }, []); + + // ====================================================[Table Setup]================================================================ + const tableHeadRow = [ + "Sr N/O", + "Client ID", + "First Name", + "Last Name", + "Country", + "Phone Number", + "E-mail ID", + "KYC Status", + "Action", + ]; + + const handleUpdateStatus = debounce((id) => { + setBankInvestor((prevData) => + prevData.map((bankInvestor) => + bankInvestor.id === id ? { ...bankInvestor } : bankInvestor + ) + ); + toast({ + render: () => , + }); + }, 300); + + // ====================================================[Table Filter]================================================================ + const filteredData = bankInvestor?.filter((item) => { + // Filter by name (case insensitive) + const name = item.firstName; + const searchLower = searchTerm.toLowerCase(); + const nameMatches = name?.toLowerCase().includes(searchLower); + + // Filter by status + // const status = item.status; + // const statusLower = status ? "active" : "inactive"; + + // const statusMatches = + // statusFilter === "all" || + // (statusFilter === "active" && status === true) || + // (statusFilter === "inactive" && status === false); + + return nameMatches; + }); + + const extractedArray = filteredData?.map((item) => ({ + id: item?.id, + "Sr N/O": ( + + {item.id} + + ), + "Client ID": ( + + + {item.clientId} + + + ), + "First Name": ( + + + {item.firstName} + + + ), + "Last Name": ( + + + {item.lastName} + + + ), + Country: ( + + + {item.country} + + + ), + "Phone Number": ( + + + {item.phoneNumber} + + + ), + "E-mail ID": ( + + + {item.mailId} + + + ), + "KYC Status": ( + + + {item.status} + + + ), + Action: ( + handleUpdateStatus(item.id)} + isChecked={item.status} + /> + ), + })); + + const handleDelete = () => { + const updatedInvestorDetails = InvestorDetails.filter( + (sponsor) => sponsor.id !== actionId + ); + + setTimeout(() => { + setInvestorDetails(updatedInvestorDetails); + setDeleteAlert(false); + setIsLoading(false); + }, 100); + setIsLoading(true); + }; + + const handleEdit = (id) => { + setActionId(id); + onEditOpen(); + }; return ( @@ -21,6 +208,7 @@ const BankInvestor = () => { spacing="24px" > { focusBorderColor="green.500" value={searchTerm} onChange={(e) => setSearchTerm(e.target.value)} - > - {/* - - */} - + /> + + + + + + + setDeleteAlert(false)} + isOpen={deleteAlert} + message={"Are you sure you want to delete sponers?"} + alertHandler={handleDelete} + isLoading={isLoading} + /> ); }; diff --git a/src/Pages/Admin/Contact.jsx b/src/Pages/Admin/Contact.jsx index f6047af..84a952b 100644 --- a/src/Pages/Admin/Contact.jsx +++ b/src/Pages/Admin/Contact.jsx @@ -1,22 +1,117 @@ -import { Box, Image, Text } from "@chakra-ui/react" -// import error from "../assets/Error.svg" -import robot from "../../assets/robot.png" -// import robot from "../assets/robot.png" -const Contact = () => { - return ( - - - - {/* The requested URL was not found on this server. */} - - ) +import React, { useContext, useState } from "react"; +import { + Box, + Divider, + FormControl, + FormLabel, + Heading, + Input, + Select, + Textarea, + Button, + Text, +} from "@chakra-ui/react"; +import { useForm, Controller } from "react-hook-form"; +import { yupResolver } from "@hookform/resolvers/yup"; +import * as yup from "yup"; +import { useNavigate } from "react-router-dom"; +import { v4 as uuidv4 } from "uuid"; +import GlobalStateContext from "../../Contexts/GlobalStateContext"; +import { OPACITY_ON_LOAD } from "../../Layout/animations"; +import FormInputMain from "../../Components/FormInputMain"; + +export const addSponser = yup.object().shape({ + phoneNumber: yup.string().required("Phone Number is required"), + emailId: yup.string().required("E-mail ID is required"), + WebsiteURL: yup.string().required("Website URL is required"), +}); + +export function debounce(func, delay) { + let debounceTimer; + return function (...args) { + clearTimeout(debounceTimer); + debounceTimer = setTimeout(() => func.apply(this, args), delay); + }; } -export default Contact \ No newline at end of file +const Contact = () => { + const navigate = useNavigate(); + + const { sponser, setSponser } = useContext(GlobalStateContext); + const { + control, + + handleSubmit, + formState: { errors }, + } = useForm({ + resolver: yupResolver(addSponser), + }); + + console.log(errors); + + + // console.log(selectedBannerImageData); + + const formFields = [ + { + label: "Phone Number", + placeHolder:" ", + name: "phoneNumber", + type: "text", + isRequired: true, + section: "Add Details", + }, + { + label: "E-mail ID ", + name: "emailId", + placeHolder:" ", + type: "text", + isRequired: true, + section: "Add Details", + }, + { + label: "Website URL", + name: "WebsiteURL", + placeHolder:" ", + type: "text", + isRequired: true, + section: "Add Details", + }, + ]; + + const groupedFields = formFields.reduce((groups, field) => { + const { section } = field; + if (!groups[section]) { + groups[section] = []; + } + groups[section].push(field); + return groups; + }, {}); + + const onSubmit = (data) => { + console.log(data); + setSponser([ + { + ...data, + status: true, + id: uuidv4(), + createdAt: new Date().toISOString(), + }, + ...sponser, + ]); + navigate("/sponser"); + }; + + return ( + + + + ); +}; + +export default Contact; diff --git a/src/Pages/Admin/ManageAcademy/AcademicDocuments.jsx b/src/Pages/Admin/ManageAcademy/AcademicDocuments.jsx new file mode 100644 index 0000000..07ea827 --- /dev/null +++ b/src/Pages/Admin/ManageAcademy/AcademicDocuments.jsx @@ -0,0 +1,242 @@ +import { + Box, + Button, + HStack, + Image, + Input, + Link, + Text, + Tooltip, + useDisclosure, + useToast, + } from "@chakra-ui/react"; + import React, { useContext, useEffect, useState } from "react"; + import { AddIcon, CheckIcon, CloseIcon, DeleteIcon, EditIcon, ViewIcon } from "@chakra-ui/icons"; + import DataTable from "../../../Components/DataTable/DataTable"; + import Pagination from "../../../Components/Pagination"; + import CustomAlertDialog from "../../../Components/CustomAlertDialog"; + import { OPACITY_ON_LOAD } from "../../../Layout/animations"; + import GlobalStateContext from "../../../Contexts/GlobalStateContext"; +import AcademicDocumentsAdd from "./AcademicDocumentsAdd"; + + const AcademicDocuments = () => { + const toast = useToast(); + const { slideFromRight, academicDocuments, setAcademicDocuments } = + useContext(GlobalStateContext); + const [searchTerm, setSearchTerm] = useState(""); + const [isLoading, setIsLoading] = useState(true); + const [deleteAlert, setDeleteAlert] = useState(false); + const [actionId, setActionId] = useState(false); + const [mouseEntered, setMouseEntered] = useState(false); + const [mouseEnteredId, setMouseEnteredId] = useState(""); + const { isOpen, onOpen, onClose } = useDisclosure(); + + useEffect(() => { + // Simulate loading + const timer = setTimeout(() => { + setIsLoading(false); + }, 1500); + + // Cleanup the timer on component unmount + return () => clearTimeout(timer); + }, []); + + // ====================================================[Table Filter]================================================================ + const filteredData = academicDocuments.filter((item) => { + // Filter by name (case insensitive) + const name = item.fullName; + const searchLower = searchTerm.toLowerCase(); + const nameMatches = name.toLowerCase().includes(searchLower); + return nameMatches; + }); + + // ====================================================[Table Setup]================================================================ + const tableHeadRow = [ + "Sr No.", + "File Name", + "Document", + "Action", + ]; + + const extractedArray = filteredData?.map((item, index) => ({ + id: item?.id, + "Sr No.": ( + + {index + 1}. + + ), + "File Name": ( + + {item.fullName} + + ), + "Document": ( + + {item.document} + + ), + Action: ( + + + + + + + + + + + + + + ), + })); + + const handleDelete = () => { + const deleteHistory = sponser.filter((sponsor) => sponsor.id !== actionId); + + setTimeout(() => { + setSponser(deleteHistory); + setDeleteAlert(false); + setIsLoading(false); + }, 100); + setIsLoading(true); + }; + + return ( + + + + setSearchTerm(e.target.value)} + /> + + + + + + + + + + + + + + setDeleteAlert(false)} + isOpen={deleteAlert} + message={"Are you sure you want to delete sponers?"} + alertHandler={handleDelete} + isLoading={isLoading} + /> + + ); + }; + + export default AcademicDocuments; + \ No newline at end of file diff --git a/src/Pages/Admin/ManageAcademy/AcademicDocumentsAdd.jsx b/src/Pages/Admin/ManageAcademy/AcademicDocumentsAdd.jsx new file mode 100644 index 0000000..2d54821 --- /dev/null +++ b/src/Pages/Admin/ManageAcademy/AcademicDocumentsAdd.jsx @@ -0,0 +1,73 @@ +import { + Box, + Button, + Drawer, + DrawerBody, + DrawerCloseButton, + DrawerContent, + DrawerFooter, + DrawerHeader, + DrawerOverlay, + FormControl, + FormLabel, + Grid, + Input, + Textarea, + useDisclosure, + } from "@chakra-ui/react"; + import React from "react"; + + const AcademicDocumentsAdd = ({ isOpen, onClose }) => { + return ( + <> + + + + + Academic Documents + + + + Name + + + + Document + + + + + + + + + + + + + ); + }; + + export default AcademicDocumentsAdd; + \ No newline at end of file diff --git a/src/Pages/Admin/ManageAcademy/AcademicVideo.jsx b/src/Pages/Admin/ManageAcademy/AcademicVideo.jsx new file mode 100644 index 0000000..ffd7b8a --- /dev/null +++ b/src/Pages/Admin/ManageAcademy/AcademicVideo.jsx @@ -0,0 +1,243 @@ +import { + Box, + Button, + HStack, + Image, + Input, + Link, + Text, + Tooltip, + useDisclosure, + useToast, + } from "@chakra-ui/react"; + import React, { useContext, useEffect, useState } from "react"; + import { AddIcon, CheckIcon, CloseIcon, DeleteIcon, EditIcon, ViewIcon } from "@chakra-ui/icons"; + import DataTable from "../../../Components/DataTable/DataTable"; + import Pagination from "../../../Components/Pagination"; + import CustomAlertDialog from "../../../Components/CustomAlertDialog"; + import { OPACITY_ON_LOAD } from "../../../Layout/animations"; + import GlobalStateContext from "../../../Contexts/GlobalStateContext"; + import banner from "../../../assets/accademicbanner.png"; +import AcademicVideoAdd from "./AcademicVideoAdd"; + + const AcademicVideo = () => { + const toast = useToast(); + const { slideFromRight, manageVideo, setManageVideo } = + useContext(GlobalStateContext); + const [searchTerm, setSearchTerm] = useState(""); + const [isLoading, setIsLoading] = useState(true); + const [deleteAlert, setDeleteAlert] = useState(false); + const [actionId, setActionId] = useState(false); + const [mouseEntered, setMouseEntered] = useState(false); + const [mouseEnteredId, setMouseEnteredId] = useState(""); + const { isOpen, onOpen, onClose } = useDisclosure(); + + useEffect(() => { + // Simulate loading + const timer = setTimeout(() => { + setIsLoading(false); + }, 1500); + + // Cleanup the timer on component unmount + return () => clearTimeout(timer); + }, []); + + // ====================================================[Table Filter]================================================================ + const filteredData = manageVideo.filter((item) => { + // Filter by name (case insensitive) + const name = item.name; + const searchLower = searchTerm.toLowerCase(); + const nameMatches = name.toLowerCase().includes(searchLower); + return nameMatches; + }); + + // ====================================================[Table Setup]================================================================ + const tableHeadRow = [ + "Sr No.", + "Name", + "Video Uploaded", + "Action", + ]; + + const extractedArray = filteredData?.map((item, index) => ({ + id: item?.id, + "Sr No.": ( + + {index + 1}. + + ), + Name: ( + + {item.name} + + ), + "Video Uploaded": ( + + {item.videoUploaded} + + ), + Action: ( + + + + + + + + + + + + + + ), + })); + + const handleDelete = () => { + const deleteHistory = sponser.filter((sponsor) => sponsor.id !== actionId); + + setTimeout(() => { + setSponser(deleteHistory); + setDeleteAlert(false); + setIsLoading(false); + }, 100); + setIsLoading(true); + }; + + return ( + + + + setSearchTerm(e.target.value)} + /> + + + + + + + + + + + + + + setDeleteAlert(false)} + isOpen={deleteAlert} + message={"Are you sure you want to delete sponers?"} + alertHandler={handleDelete} + isLoading={isLoading} + /> + + ); + }; + + export default AcademicVideo; + \ No newline at end of file diff --git a/src/Pages/Admin/ManageAcademy/AcademicVideoAdd.jsx b/src/Pages/Admin/ManageAcademy/AcademicVideoAdd.jsx new file mode 100644 index 0000000..f09de45 --- /dev/null +++ b/src/Pages/Admin/ManageAcademy/AcademicVideoAdd.jsx @@ -0,0 +1,72 @@ +import { + Box, + Button, + Drawer, + DrawerBody, + DrawerCloseButton, + DrawerContent, + DrawerFooter, + DrawerHeader, + DrawerOverlay, + FormControl, + FormLabel, + Grid, + Input, + Textarea, + useDisclosure, +} from "@chakra-ui/react"; +import React from "react"; + +const AcademicVideoAdd = ({ isOpen, onClose }) => { + return ( + <> + + + + + Academic Video + + + + Name + + + + Video Upload + + + + + + + + + + + + + ); +}; + +export default AcademicVideoAdd; diff --git a/src/Pages/Admin/ManageAcademy/Academicdetails.jsx b/src/Pages/Admin/ManageAcademy/Academicdetails.jsx new file mode 100644 index 0000000..5617377 --- /dev/null +++ b/src/Pages/Admin/ManageAcademy/Academicdetails.jsx @@ -0,0 +1,261 @@ +import { + Box, + Button, + HStack, + Image, + Input, + Link, + Text, + Tooltip, + useDisclosure, + useToast, + } from "@chakra-ui/react"; + import React, { useContext, useEffect, useState } from "react"; + import { + AddIcon, + DeleteIcon, + EditIcon, + ViewIcon, + } from "@chakra-ui/icons"; + import DataTable from "../../../Components/DataTable/DataTable"; + import Pagination from "../../../Components/Pagination"; + import CustomAlertDialog from "../../../Components/CustomAlertDialog"; + import { OPACITY_ON_LOAD } from "../../../Layout/animations"; + import GlobalStateContext from "../../../Contexts/GlobalStateContext"; + import banner from "../../../assets/accademicbanner.png"; + import AcademicdetailsEdit from "./AcademicdetailsEdit"; + + const Academicdetails = () => { + const toast = useToast(); + const { slideFromRight, manageAcademy, setManageAcademy } = + useContext(GlobalStateContext); + const [searchTerm, setSearchTerm] = useState(""); + const [isLoading, setIsLoading] = useState(true); + const [deleteAlert, setDeleteAlert] = useState(false); + const [actionId, setActionId] = useState(false); + const [mouseEntered, setMouseEntered] = useState(false); + const [mouseEnteredId, setMouseEnteredId] = useState(""); + const { isOpen, onOpen, onClose } = useDisclosure(); + + useEffect(() => { + // Simulate loading + const timer = setTimeout(() => { + setIsLoading(false); + }, 1500); + + // Cleanup the timer on component unmount + return () => clearTimeout(timer); + }, []); + + // ====================================================[Table Filter]================================================================ + const filteredData = manageAcademy.filter((item) => { + // Filter by name (case insensitive) + const name = item.header; + const searchLower = searchTerm.toLowerCase(); + const nameMatches = name.toLowerCase().includes(searchLower); + return nameMatches; + }); + + // ====================================================[Table Setup]================================================================ + const tableHeadRow = [ + "Sr No.", + "Header", + "Content", + "Banner Image", + "Action", + ]; + + const extractedArray = filteredData?.map((item, index) => ({ + id: item?.id, + "Sr No.": ( + + {index + 1}. + + ), + Header: ( + + {item.header} + + ), + Content: ( + + {item.content} + + ), + "Banner Image": ( + + + + ), + Action: ( + + + + + + + + + + + + + + ), + })); + + const handleDelete = () => { + const deleteHistory = sponser.filter((sponsor) => sponsor.id !== actionId); + + setTimeout(() => { + setSponser(deleteHistory); + setDeleteAlert(false); + setIsLoading(false); + }, 100); + setIsLoading(true); + }; + + return ( + + + + setSearchTerm(e.target.value)} + /> + + + + + + + + + + + + + + setDeleteAlert(false)} + isOpen={deleteAlert} + message={"Are you sure you want to delete sponers?"} + alertHandler={handleDelete} + isLoading={isLoading} + /> + + ); + }; + + export default Academicdetails; + \ No newline at end of file diff --git a/src/Pages/Admin/ManageAcademy/AcademicdetailsEdit.jsx b/src/Pages/Admin/ManageAcademy/AcademicdetailsEdit.jsx new file mode 100644 index 0000000..5e48448 --- /dev/null +++ b/src/Pages/Admin/ManageAcademy/AcademicdetailsEdit.jsx @@ -0,0 +1,105 @@ +import { + Box, + Button, + Drawer, + DrawerBody, + DrawerCloseButton, + DrawerContent, + DrawerFooter, + DrawerHeader, + DrawerOverlay, + FormControl, + FormLabel, + Grid, + Input, + Textarea, + useDisclosure, +} from "@chakra-ui/react"; +import React from "react"; + +const AcademicdetailsEdit = ({ isOpen, onClose }) => { + return ( + <> + + + + + manage Academy + + + + + Header (English) + + + + Header (Arabic) + + + + Content (English) +