From 2ae81ef0325d8516ff7c50c1689a0d609f071dac Mon Sep 17 00:00:00 2001 From: "Siddhesh.More" Date: Wed, 2 Oct 2024 18:41:38 +0530 Subject: [PATCH] upated --- src/Components/DataTable/NormalTable.jsx | 100 ++++++++--- src/Layout/DefaultLayout.jsx | 4 +- src/Pages/Admin/Notification.jsx | 169 +++++++++++++++++- .../IO_Management/ViewIO/ViewIOdataHeader.jsx | 10 +- .../InvestorDetails/InvestorDetails.jsx | 27 ++- src/Pages/Master/Sponser/Sponsers.jsx | 34 ++-- src/Services/investor.details.service.js | 19 +- src/Services/io.service.js | 11 +- src/Services/token.serivce.js | 2 + 9 files changed, 327 insertions(+), 49 deletions(-) diff --git a/src/Components/DataTable/NormalTable.jsx b/src/Components/DataTable/NormalTable.jsx index 97abfe4..d1dd2c1 100644 --- a/src/Components/DataTable/NormalTable.jsx +++ b/src/Components/DataTable/NormalTable.jsx @@ -9,27 +9,52 @@ import { Tr, Skeleton, TableCaption, - Tfoot, + Checkbox, } from "@chakra-ui/react"; import EmptySearchList from "../EmptySearchList"; import { TABLE_PAGINATION } from "../../Constants/Paginations"; -const DataTable = ({ +const NormalTable = ({ data, isLoading, tableHeadRow, emptyMessage, centered, total, + showRadioButton, // Prop for showing the checkboxes + selectedRadio, + setSelectedRadio, // State for managing selected checkboxes }) => { - console.log(data); - const columnWidth = data && data[0] ? `${(100 / Object.keys(data[0]).length).toFixed(2)}%` : "auto"; + + // Toggle checkbox selection for individual rows + const handleCheckboxChange = (value) => { + setSelectedRadio((prev) => { + if (prev.includes(value)) { + // Remove if already selected + return prev.filter((id) => id !== value); + } else { + // Add to selected + return [...prev, value]; + } + }); + }; + + // Handle "Check All" checkbox + const handleCheckAllChange = () => { + if (selectedRadio.length === data.length) { + setSelectedRadio([]); // Deselect all if already selected + } else { + const allIds = data.map((item) => item.id); + setSelectedRadio(allIds); // Select all + } + }; + return ( - + {data?.length === 0 ? ( ) : ( @@ -37,26 +62,42 @@ const DataTable = ({ {total ? total : "Tanami v1.0.0"} - + + {showRadioButton && ( + + + + )} {tableHeadRow.map((heading, index) => ( - {isLoading ? : heading} - {/* {heading} */} ))} @@ -65,17 +106,18 @@ const DataTable = ({ {isLoading ? Array.from({ length: TABLE_PAGINATION?.size }).map( (_, index) => ( - + {tableHeadRow.map((_, i) => ( @@ -84,9 +126,26 @@ const DataTable = ({ ) ) : data?.map((item, index) => ( - + + {showRadioButton && ( + + handleCheckboxChange(item.id)} + /> + + )} {tableHeadRow.map((heading, i) => ( - { // dispach(loginUser(false)); setIsAuthenticate(false); Cookies.remove("isAuthenticated"); - localStorage.removeItem('refreshToken') - localStorage.removeItem('accessToken') - localStorage.removeItem('refreshTokenExp') + localStorage.clear(); navigate("/login"); }; diff --git a/src/Pages/Admin/Notification.jsx b/src/Pages/Admin/Notification.jsx index d4aaef1..5507eb9 100644 --- a/src/Pages/Admin/Notification.jsx +++ b/src/Pages/Admin/Notification.jsx @@ -1,6 +1,10 @@ import React, { useContext, useEffect, useState } from "react"; import { + Badge, Box, + Button, + Text, + Tooltip, useToast, } from "@chakra-ui/react"; import { useForm} from "react-hook-form"; @@ -15,6 +19,12 @@ import { } from "../../Services/contact.service"; import FullscreenLoaders from "../../Components/Loaders/FullscreenLoaders"; import ToastBox from "../../Components/ToastBox"; +import NormalTable from "../../Components/DataTable/NormalTable"; +import GlobalStateContext from "../../Contexts/GlobalStateContext"; +import { useGetInvestorsQuery } from "../../Services/investor.details.service"; +import { TABLE_PAGINATION } from "../../Constants/Paginations"; +import { generateSerialNumber } from "../../Constants/Constants"; +import { ViewIcon } from "@chakra-ui/icons"; export const notification = yup.object().shape({ investmentNameEnglish: yup @@ -47,6 +57,7 @@ const Notification = () => { const navigate = useNavigate(); const [form, setForm] = useState({}); const [isLoading, setIsLoading] = useState(false); + const [ selectedRadio, setSelectedRadio] = useState([]) const { control, @@ -64,6 +75,18 @@ const Notification = () => { isLoading: contactLoading, error, } = useGetContactQuery(); + + + const [pageSize, setPageSize] = useState(TABLE_PAGINATION?.size); + const [currentPage, setCurrentPage] = useState(TABLE_PAGINATION?.page); + const { + data: investorDetails, + isLoading: investorDetailsLoading, + // error, + } = useGetInvestorsQuery({ page: currentPage, size: pageSize }); + console.log(investorDetails); + + const [updateContact] = useUpdateContactMutation(); useEffect(() => { @@ -129,9 +152,20 @@ const Notification = () => { }, {}); const onSubmit = async (data) => { + + const dataToPass = { + ...data, + principal_xid:selectedRadio + } + + console.log(dataToPass); + + + + setIsLoading(true); try { - const res = await updateContact(data); + const res = await updateContact(dataToPass); if (res?.data?.statusCode === 200) { toast({ render: () => , @@ -145,6 +179,122 @@ const Notification = () => { } }; + + console.log(selectedRadio); + + + + // ====================================================[Table Setup]================================================================ + const tableHeadRow = [ + "Sr No", + "Client ID", + "First Name", + "Last Name", + "Country", + "Phone Number", + "E-mail ID", + "Type", + "KYC Status", + // "Status", + ]; + + const extractedArray = investorDetails?.data?.rows?.map((item, idx) => ({ + id: item?.id, + "Sr No": ( + + {/* {item.id} */} + {generateSerialNumber(idx,currentPage, pageSize )} + + + ), + "Client ID": ( + + + {item.clientReference_id} + + + ), + "First Name": ( + + + {item?.principal?.firstName} + + + ), + "Last Name": ( + + + {item?.principal?.lastName} + + + ), + Country: ( + + + {item?.country?.countryName} + + + ), + "Phone Number": ( + + + {item?.principal?.mobileNumber} + + + ), + "E-mail ID": ( + + + {item?.principal?.emailAddress} + + + ), + "Type": ( + + + + {item?.investor_type?.investorTypeName} + + + + ), + Status: ( + + + {item.ioStatus ? "Ban" : "Unban"} + + + ), + "KYC Status": ( + + + {item.KYCStatus ? "Completed" : "Not complete"} + + + ), + })); + return ( { errors={errors} onSubmit={handleSubmit(onSubmit)} btnLoading={isLoading} + > + + + + + + + + ); }; diff --git a/src/Pages/IO_Management/ViewIO/ViewIOdataHeader.jsx b/src/Pages/IO_Management/ViewIO/ViewIOdataHeader.jsx index 0e0bb9d..e41b1f9 100644 --- a/src/Pages/IO_Management/ViewIO/ViewIOdataHeader.jsx +++ b/src/Pages/IO_Management/ViewIO/ViewIOdataHeader.jsx @@ -182,8 +182,8 @@ const ViewIOdataHeader = ({ data, isLoading }) => { ? "#C6F6D5" : IODetails?.ioStatus?.statusAdmin === "Exited" ? "#FED7D7" - : IODetails?.ioStatus?.statusAdmin === "Canclled" - ? "orange.500" + : IODetails?.ioStatus?.statusAdmin === "Cancelled" + ? "#E9D8FD" : IODetails?.ioStatus?.statusAdmin === "DeActivate" ? "#E9D8FD" : null @@ -342,7 +342,7 @@ const ViewIOdataHeader = ({ data, isLoading }) => { - + { ? "green" : IODetails?.ioStatus?.statusAdmin === "Exited" ? "red" - : IODetails?.ioStatus?.statusAdmin === "Canclled" - ? "orange" + : IODetails?.ioStatus?.statusAdmin === "Cancelled" + ? "purple" : "purple" } > diff --git a/src/Pages/Investor_Management/InvestorDetails/InvestorDetails.jsx b/src/Pages/Investor_Management/InvestorDetails/InvestorDetails.jsx index c194dde..c654d91 100644 --- a/src/Pages/Investor_Management/InvestorDetails/InvestorDetails.jsx +++ b/src/Pages/Investor_Management/InvestorDetails/InvestorDetails.jsx @@ -49,7 +49,6 @@ const InvestorDetails = () => { const thirdField = useRef(); const { InvestorDetails, setInvestorDetails, slideFromRight } = useContext(GlobalStateContext); - const [searchTerm, setSearchTerm] = useState(""); const [isLoading, setIsLoading] = useState(true); const [deleteAlert, setDeleteAlert] = useState(false); const [actionId, setActionId] = useState(false); @@ -62,13 +61,35 @@ const InvestorDetails = () => { } = useDisclosure(); const btnRef = React.useRef(); + + // =========================== [Use State] ============================= const [pageSize, setPageSize] = useState(TABLE_PAGINATION?.size); const [currentPage, setCurrentPage] = useState(TABLE_PAGINATION?.page); + const [searchTerm, setSearchTerm] = useState(""); + const [debouncedSearchTerm, setDebouncedSearchTerm] = useState(""); + + // Debounce the search term to avoid making a request on every keystroke + useEffect(() => { + const handler = setTimeout(() => { + setDebouncedSearchTerm(searchTerm); + }, 500); // Adjust delay as needed + return () => { + clearTimeout(handler); + }; + }, [searchTerm]); const { data: investorDetails, isLoading: investorDetailsLoading, error, - } = useGetInvestorsQuery({ page: currentPage, size: pageSize }); + } = useGetInvestorsQuery({ + page: debouncedSearchTerm ? undefined : currentPage, // Omit pagination for search + size: debouncedSearchTerm ? undefined : pageSize, // Omit pagination for search + searchTerm: debouncedSearchTerm, + }, + { + skip: debouncedSearchTerm === "" && searchTerm !== "", // Skip if search is empty and it's not the initial request + } +); useEffect(() => { @@ -143,7 +164,7 @@ const InvestorDetails = () => { ]; - const extractedArray = filteredData?.map((item, idx) => ({ + const extractedArray = investorDetails?.data?.rows?.map((item, idx) => ({ id: item?.id, "Sr No": ( { const navigate = useNavigate(); const toast = useToast(); - - - - - const [searchTerm, setSearchTerm] = useState(""); - - - const [isLoading, setIsLoading] = useState(false); const [deleteAlert, setDeleteAlert] = useState(false); const [actionId, setActionId] = useState(false); @@ -46,9 +38,29 @@ const Sponser = () => { // =========================== [Use State] ============================= const [pageSize, setPageSize] = useState(TABLE_PAGINATION?.size); const [currentPage, setCurrentPage] = useState(TABLE_PAGINATION?.page); - const {data: sponsors,error,isLoading: isSponserLoading,} = useGetSponserMasterQuery({ page: currentPage, size: pageSize }); + const [searchTerm, setSearchTerm] = useState(""); + const [debouncedSearchTerm, setDebouncedSearchTerm] = useState(""); - // console.log(sponsors?.data?.rows); + // Debounce the search term to avoid making a request on every keystroke + useEffect(() => { + const handler = setTimeout(() => { + setDebouncedSearchTerm(searchTerm); + }, 500); // Adjust delay as needed + return () => { + clearTimeout(handler); + }; + }, [searchTerm]); + const { data: sponsors, error, isLoading: isSponserLoading } = useGetSponserMasterQuery( + { + page: debouncedSearchTerm ? undefined : currentPage, // Omit pagination for search + size: debouncedSearchTerm ? undefined : pageSize, // Omit pagination for search + searchTerm: debouncedSearchTerm, + }, + { + skip: debouncedSearchTerm === "" && searchTerm !== "", // Skip if search is empty and it's not the initial request + } + ); + console.log(sponsors?.data?.rows); // ==============================[Table Filter]======================== @@ -69,7 +81,7 @@ const Sponser = () => { "Action", ]; - const extractedArray = filteredData?.map((item, index) => ({ + const extractedArray = sponsors?.data?.rows?.map((item, index) => ({ "Sr No": ( ({ + getInvestors: builder.query({ - query: ({ page, size }) => - `/investorDetails/admin?page=${page}&size=${size}`, - providesTags: ["getInvestors"], - }), + query: ({ page, size, searchTerm }) => { + // Start with the base URL, including searchTerm + let baseURL = `/investorDetails/admin/?search_data=${searchTerm || ""}`; + + // Conditionally append page and size parameters if they are defined + if (page !== undefined && size !== undefined) { + baseURL += `&page=${page}&size=${size}`; + } + + return baseURL; + }, + providesTags: ["getInvestors"], + }), + // =====[get investment details ] getInvestorsDetailsById: builder.query({ diff --git a/src/Services/io.service.js b/src/Services/io.service.js index 885a49c..c557548 100644 --- a/src/Services/io.service.js +++ b/src/Services/io.service.js @@ -325,11 +325,18 @@ export const ioService = createApi({ // ======[Get All]===== + getSponserMaster: builder.query({ - query: ({ page, size }) => `/sponsor/admin?page=${page}&size=${size}`, + query: ({ page, size, searchTerm }) => { + let baseURL = `/sponsor/admin/?search_data=${searchTerm || ""}`; + if (page !== undefined && size !== undefined) { + baseURL += `&page=${page}&size=${size}`; // Only add pagination if both are defined + } + return baseURL; + }, providesTags: ["getSponser"], }), - + // ========[Delete Sponser]======== deleteSponser: builder.mutation({ diff --git a/src/Services/token.serivce.js b/src/Services/token.serivce.js index c739d96..4e63ec8 100644 --- a/src/Services/token.serivce.js +++ b/src/Services/token.serivce.js @@ -71,6 +71,8 @@ export const baseQuery = async (args, api, extraOptions) => { } } catch (err) { console.error("Failed to refresh token:", err); + localStorage.clear(); + window.location.href = '/login'; // Redirect to login page // Handle refresh failure (e.g., redirect to login) } }