This commit is contained in:
2024-10-03 13:48:09 +05:30
parent cfd811708a
commit c51ae9081f
4 changed files with 56 additions and 16 deletions

View File

@@ -75,7 +75,7 @@ const NormalTable = ({
textTransform={"none"}
>
<Checkbox
isChecked={selectedRadio.length === data.length}
isChecked={selectedRadio?.length === data?.length}
onChange={handleCheckAllChange}
colorScheme="forestGreen"

View File

@@ -38,6 +38,8 @@ import { formatCurrency } from "../../../Components/CurrencyInput";
import { FiRefreshCw } from "react-icons/fi";
import { useGetIOByIdQuery } from "../../../Services/io.service";
import { RepeatIcon } from "@chakra-ui/icons";
import { exportToExcel } from "../../../Constants/Constants";
import { LuFileSpreadsheet } from "react-icons/lu";
const rotate = keyframes`
from {
@@ -124,6 +126,8 @@ const Investors = ({ data }) => {
});
}, 300);
// Table filter
const filteredData = IODetails?.investors?.filter((item) => {
const name = item.firstName;
@@ -132,6 +136,22 @@ const Investors = ({ data }) => {
return nameMatches;
});
const customHeaders = [
{ label: "Client ID", key: "clientReference_id" },
{ label: "First Name", key: "firstName" }, // Nested property
{ label: "Last Name", key: "lastName" }, // Nested property
{ label: "Investment amount", key: "InvestedAmount_USD" }, // Nested property
{ label: "Percentage", key: "Investor_Holidings" }, // Nested property
{ label: "Market Value", key: "Market_Value" }, // Nested property
{ label: "Return on Investment", key: "Return_On_Investment" }, // Nested property
{ label: "Distribution", key: "Distribution_Amt" }, // Simple property
{ label: "Distribution Percent", key: "Distribution_Per" }, // Simple property // Simple property
{ label: "Total Return", key: "Total_Return" }, // Simple property
{ label: "Total return on Investment", key: "Total_Return_On_Investment" },
];
const extractedArray = filteredData?.map((item, index) => ({
id: item?.id,
"Client ID": (
@@ -430,6 +450,9 @@ const Investors = ({ data }) => {
setIsRefetchLoading(false);
};
return (
<Box {...OPACITY_ON_LOAD} pb={0}>
<Box bg="white.500">
@@ -439,7 +462,7 @@ const Investors = ({ data }) => {
pb={3}
spacing="24px"
>
<span>
<Box display={'flex'} gap={3}>
<Input
type="search"
width={300}
@@ -450,9 +473,25 @@ const Investors = ({ data }) => {
value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)}
/>
<Button
onClick={() =>
exportToExcel(IODetails?.investors, customHeaders)
}
leftIcon={<LuFileSpreadsheet />}
colorScheme="forestGreen"
size={"sm"}
variant={"outline"}
rounded={"sm"}
fontSize={"xs"}
w={100}
me={2}
>
Export xls
</Button>
<Box as="span">
<Icon
ms={3}
ms={0}
animation={
isRefetchLoading ? `${rotate} 1s linear infinite` : "none"
}
@@ -467,7 +506,7 @@ const Investors = ({ data }) => {
cursor={"pointer"}
/>
</Box>
</span>
</Box>
<HStack
bg={"#C6F6D5"}

View File

@@ -84,7 +84,7 @@ const InvestorDetails = () => {
} = useGetInvestorsQuery({
page: debouncedSearchTerm ? undefined : currentPage, // Omit pagination for search
size: debouncedSearchTerm ? undefined : pageSize, // Omit pagination for search
searchTerm: debouncedSearchTerm,
search: debouncedSearchTerm,
},
{
skip: debouncedSearchTerm === "" && searchTerm !== "", // Skip if search is empty and it's not the initial request
@@ -335,7 +335,7 @@ const InvestorDetails = () => {
/>
<HStack className="col" display={"flex"} alignItems={"center"}>
<Select
{/* <Select
focusBorderColor="green.500"
size={"sm"}
fontSize={"xs"}
@@ -348,9 +348,9 @@ const InvestorDetails = () => {
<option value="all">All</option>
<option value="ban">Ban</option>
<option value="unban">UnBan</option>
</Select>
</Select> */}
<Select
{/* <Select
focusBorderColor="green.500"
size={"sm"}
fontSize={"xs"}
@@ -363,7 +363,7 @@ const InvestorDetails = () => {
<option value="all">All</option>
<option value="ban">Ban</option>
<option value="unban">UnBan</option>
</Select>
</Select> */}
<Select
focusBorderColor="green.500"
@@ -371,11 +371,11 @@ const InvestorDetails = () => {
fontSize={"xs"}
cursor={"pointer"}
>
<option value="" defaultValue={"all"} disabled hidden>
<option value="all" defaultValue={"all"} disabled hidden>
Status
</option>
<option value="all">All</option>
<option value="all">Status</option>
<option value="ban">Ban</option>
<option value="unban">UnBan</option>
</Select>
@@ -386,10 +386,10 @@ const InvestorDetails = () => {
fontSize={"xs"}
cursor={"pointer"}
>
<option value="" defaultValue={"all"} disabled hidden>
<option value="all" defaultValue={"all"} disabled hidden>
KYC Status
</option>
<option value="all">All</option>
<option value="all">KYC Status</option>
<option value="completed">Completed</option>
<option value="incompleted">Incompleted</option>
</Select>
@@ -400,9 +400,10 @@ const InvestorDetails = () => {
fontSize={"xs"}
cursor={"pointer"}
>
<option value="" defaultValue={"all"} disabled hidden>
<option value="all" defaultValue={"all"} disabled hidden>
Country
</option>
<option value="all">All</option>
<option value="behrain">Behrain</option>
<option value="kuwait">Kuwait</option>
<option value="oman">Oman</option>

View File

@@ -13,9 +13,9 @@ export const investorDetails = createApi({
endpoints: (builder) => ({
getInvestors: builder.query({
query: ({ page, size, searchTerm }) => {
query: ({ page, size, search }) => {
// Start with the base URL, including searchTerm
let baseURL = `/investorDetails/admin/?search_data=${searchTerm || ""}`;
let baseURL = `/investorDetails/admin/?search=${search || ""}`;
// Conditionally append page and size parameters if they are defined
if (page !== undefined && size !== undefined) {