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

[ Displlay order updated ]

Browse Source
This commit is contained in:
Siddhesh More
2024-08-22 12:10:07 +05:30
parent fb39e32b95
commit 323d09f88d
22 changed files with 1209 additions and 259 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/Components/CurrencyInput.jsx
View File

@@ -38,7 +38,6 @@ const CurrencyInput = forwardRef(({ value, onChange, ...props }, ref) => {
{...props}
ref={ref} // Forward ref here
type="text"
colorScheme='forestGreen'
value={formatCurrency(value)}
onChange={handleChange}
/>

3
src/Pages/IO_Management/CreateIO/CreateIO.jsx
View File

@@ -16,6 +16,7 @@ import { useParams } from "react-router-dom";
import FullscreenLoaders from "../../../Components/Loaders/FullscreenLoaders";
import { useGetIOprepopulateDataQuery } from "../../../Services/io.service";
import UnderConstruction from "../../UnderConstruction";
import Destribution from "./Destribution";
const CreateIO = () => {
const id = useParams()?.id;
@@ -74,7 +75,7 @@ const CreateIO = () => {
},
{
label: "Distribution to Investors",
Content: IONAVDetails,
Content: Destribution,
isDisabled: id ? false : true,
},
];

220
src/Pages/IO_Management/CreateIO/Destribution.jsx
View File

@@ -1,9 +1,219 @@
import React from 'react'
import React, { useContext, useEffect, useRef, useState } from 'react'
import GlobalStateContext from '../../../Contexts/GlobalStateContext';
import { Box, HStack, Input,Text, Table, Tbody, Th, Tr, Avatar, useDisclosure,Button } from '@chakra-ui/react';
import { OPACITY_ON_LOAD } from '../../../Layout/animations';
import Pagination from '../../../Components/Pagination';
import NormalTable from '../../../Components/DataTable/NormalTable';
import CustomAlertDialog from '../../../Components/CustomAlertDialog';
import { formatDatee } from '../../../Components/FormField';
import { AddIcon } from '@chakra-ui/icons';
import AddIONav from './AddIONav';
const Distribution = () => {
return (
<div>Distribution</div>
const Destribution = () => {
const { navDetails, setNavDetails, IODetails } =
useContext(GlobalStateContext);
const firstField = useRef();
const { isOpen, onOpen, onClose } = useDisclosure();
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("");
console.log(IODetails?.ioNAVHistory);
useEffect(() => {
// Simulate loading
const timer = setTimeout(() => {
setIsLoading(false);
}, 1500);
// Cleanup the timer on component unmount
return () => clearTimeout(timer);
}, []);
// Table setup
const tableHeadRow = [
// "Sr.No",
"Date",
"Amount",
"% of Investment"
];
// Table filter
const filteredData = IODetails?.distributionToInvestor?.filter((item) => {
const name = item?.transactionAmount;
const searchLower = searchTerm.toLowerCase();
const nameMatches = name.toLowerCase().includes(searchLower);
return nameMatches;
}).sort((b, a) => new Date(a.transactionDate) - new Date(b.transactionDate));
const extractedArray=filteredData?.map((item, index) => ({
id: item?.id,
"Sr.No": <Text
justifyContent={"start"}
as={"span"}
color={"teal.900"}
fontWeight={"500"}
className="d-flex align-items-start web-text-small"
>{item?.id}</Text>,
"Date": (
<Text
justifyContent={"center"}
as={"span"}
color={"teal.900"}
fontWeight={"500"}
className="d-flex align-items-center web-text-small"
>
{formatDatee(item.transactionDate)}
</Text>
),
"Amount": (
<Text
justifyContent={"center"}
as={"span"}
color={"teal.900"}
fontWeight={"500"}
className="d-flex align-items-center web-text-small"
>
{/* {`${item.transactionAmount}`} */}
{`$${parseFloat(item.transactionAmount||0).toLocaleString()}`}
</Text>
),
"% of Investment": (
<Text
justifyContent={"center"}
as={"span"}
color={"teal.900"}
fontWeight={"500"}
className="d-flex align-items-center web-text-small"
>
---
</Text>
),
}));
const handleDelete = () => {
const updatedNav = navDetails.filter(
(sponsor) => sponsor.id !== actionId
);
setTimeout(() => {
setNavDetails(updatedNav);
setDeleteAlert(false);
setIsLoading(false);
}, 100);
setIsLoading(true);
};
const Total = () => {
return (
<Table size="sm">
<Tbody>
<Tr backgroundColor="gray.50">
<Th
textAlign={"center"}
p={3}
width="105px"
color={"#004118"}
whiteSpace="normal"
wordBreak="normal"
overflowWrap="normal"
>
Total
</Th>
<Th
textAlign={"center"}
p={3}
width="90px"
color={"#004118"}
whiteSpace="normal"
wordBreak="normal"
overflowWrap="normal"
>
{IODetails?.total_distributeToInvestor_amt?.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}
</Th>
<Th
textAlign={"center"}
p={3}
width="100px"
color={"#004118"}
whiteSpace="normal"
wordBreak="normal"
overflowWrap="normal"
>
{" "}
</Th>
</Tr>
</Tbody>
</Table>
);
};
return (<Box {...OPACITY_ON_LOAD} pb={0}>
<Box bg="white.500">
<HStack
display={"flex"}
justifyContent={"space-between"}
pb={3}
spacing="24px"
>
<Input
type="search"
width={300}
placeholder="Search..."
size="sm"
rounded="sm"
focusBorderColor="green.500"
value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)}
/>
</HStack>
</Box>
<NormalTable
centered={true}
emptyMessage={`We don't have any Sponers`}
tableHeadRow={tableHeadRow}
data={extractedArray}
isLoading={isLoading}
viewActionId={actionId}
setViewActionId={setActionId}
total={<Total/>}
setMouseEnteredId={setMouseEnteredId}
setMouseEntered={setMouseEntered}
/>
<CustomAlertDialog
onClose={() => setDeleteAlert(false)}
isOpen={deleteAlert}
message={"Are you sure you want to delete sponers?"}
alertHandler={handleDelete}
isLoading={isLoading}
/>
<AddIONav
isOpen={isOpen}
onClose={onClose}
firstField={firstField} />
</Box>
)
}
export default Distribution
export default Destribution

30
src/Pages/IO_Management/CreateIO/IOArtifacts.jsx
View File

@@ -22,7 +22,7 @@ import {
} from "@chakra-ui/icons";
import IOArtifactsAdd from "../IOArtifactsAdd";
import IOArtifactsVideo from "./IOArtifactsVideo";
import SetDisplayOrder from "./SetDisplayOrder";
import SetDisplayOrder from "./SetDisplayOrderKeyMerits";
import { useParams } from "react-router-dom";
import {
useDeleteImageArtifactsMutation,
@@ -32,6 +32,8 @@ import {
import { getFileNameFromPath } from "../../../Constants/Constants";
import ImageViewer from "../../../Components/ImageViewer";
import ToastBox from "../../../Components/ToastBox";
import SetDisplayOrderIOArtifactsImages from "./SetDisplayOrderIOArtifactsImages";
import SetDisplayOrderIOArtifactsVideo from "./SetDisplayOrderIOArtifactsVideo";
const IOArtifacts = ({ enableNextTab, index, data }) => {
const toast = useToast()
@@ -143,7 +145,14 @@ const IOArtifacts = ({ enableNextTab, index, data }) => {
const tableHeadRow = ["Sr.no", "File Name", "View image", "Action"];
const extractedArray = IObyID?.data?.artifactsImage?.map((item, index) => ({
console.log(IObyID?.data?.artifactsImage);
// console.log(filteredData);
const sortedDataImage = [...(IObyID?.data?.artifactsImage || [])]?.sort(
(a, b) => a?.displayOrder - b?.displayOrder
);
const extractedArray = sortedDataImage?.map((item, index) => ({
"Sr.no": (
<Text
justifyContent={slideFromRight ? "right" : "left"}
@@ -246,6 +255,17 @@ const IOArtifacts = ({ enableNextTab, index, data }) => {
),
}));
console.log(IObyID?.data?.artifactsVideo);
// console.log(filteredData);
const sortedDataVideo = [...(IObyID?.data?.artifactsVideo || [])]?.sort(
(a, b) => a?.displayOrder - b?.displayOrder
);
const tableHeadRowTwo = [
"Sr.no",
"File Name",
@@ -253,7 +273,7 @@ const IOArtifacts = ({ enableNextTab, index, data }) => {
"Action",
];
const extractedArrayTwo = IObyID?.data?.artifactsVideo?.map(
const extractedArrayTwo = sortedDataVideo?.map(
(item, index) => ({
"Sr.no": (
<Text
@@ -354,7 +374,7 @@ const IOArtifacts = ({ enableNextTab, index, data }) => {
<HStack>
{IObyID?.data?.artifactsImage?.length !== 0 &&<SetDisplayOrder data={IObyID?.data?.artifactsImage} />}
{IObyID?.data?.artifactsImage?.length !== 0 &&<SetDisplayOrderIOArtifactsImages data={sortedDataImage} />}
<Button
leftIcon={<AddIcon />}
onClick={onOpen}
@@ -390,7 +410,7 @@ const IOArtifacts = ({ enableNextTab, index, data }) => {
Manage IO videos
</Box>
<HStack>
{IObyID?.data?.artifactsVideo?.length !== 0 &&<SetDisplayOrder data={IObyID?.data?.artifactsVideo} />}
{IObyID?.data?.artifactsVideo?.length !== 0 &&<SetDisplayOrderIOArtifactsVideo data={sortedDataVideo} />}
<Button
leftIcon={<AddIcon />}
onClick={onOpenVideo}

5
src/Pages/IO_Management/CreateIO/IODetails.jsx
View File

@@ -607,6 +607,11 @@ const IODetails = ({ enableNextTab, index, data }) => {
toast({
render: () => <ToastBox message={res?.error?.data?.message } status={"error"} />,
});
} else if(res?.error?.status === 500){
setIsLoading(false);
toast({
render: () => <ToastBox message={res?.error?.data?.message } status={"error"} />,
});
}
} else {
try {

2
src/Pages/IO_Management/CreateIO/IONAVDetails.jsx
View File

@@ -184,8 +184,6 @@ const IONAVDetails = () => {
</HStack> */}
{IODetails?.isInvestedAmount ? <Button onClick={onOpen} leftIcon={<AddIcon/>} colorScheme="forestGreen" size={'sm'} rounded={'sm'} fontSize={'xs'} >Add IO NAV</Button>:null}
</HStack>
</Box>

11
src/Pages/IO_Management/CreateIO/InvestmentDocument.jsx
View File

@@ -33,7 +33,8 @@ import {
import ToastBox from "../../../Components/ToastBox";
import { getFileNameFromPath } from "../../../Constants/Constants";
import { TbFileTypeDocx } from "react-icons/tb";
import SetDisplayOrder from "./SetDisplayOrder";
import SetDisplayOrder from "./SetDisplayOrderKeyMerits";
import SetDisplayOrderIODocuments from "./SetDisplayOrderIODocuments";
const downloadFile = (filePath, fileName) => {
@@ -134,6 +135,10 @@ const InvestmentDocument = ({ control, errors, enableNextTab, index, }) => {
item?.documentName?.toLowerCase().includes(searchTerm.toLowerCase())
);
const sortedData = filteredData?.sort(
(a, b) => a.displayOrder - b.displayOrder
);
const handleView = (id) => {
setActionId(id);
onViewOpen();
@@ -168,7 +173,7 @@ const InvestmentDocument = ({ control, errors, enableNextTab, index, }) => {
}
};
const extractedArray = filteredData?.map((item, index) => ({
const extractedArray = sortedData?.map((item, index) => ({
"Sr.no": (
<Text
justifyContent={slideFromRight ? "right" : "left"}
@@ -300,7 +305,7 @@ const InvestmentDocument = ({ control, errors, enableNextTab, index, }) => {
<Box display="flex" justifyContent="end" mb={4} gap={2}>
{filteredData?.length !== 0 &&<SetDisplayOrder data={filteredData} />}
{filteredData?.length !== 0 &&<SetDisplayOrderIODocuments data={filteredData} />}
<Button
leftIcon={<AddIcon />}
onClick={onOpen}

28
src/Pages/IO_Management/CreateIO/Investors.jsx
View File

@@ -21,6 +21,7 @@ import {
Thead,
Tooltip,
Tr,
keyframes,
useToast,
} from "@chakra-ui/react";
import React, { useContext, useEffect, useState } from "react";
@@ -38,6 +39,17 @@ import { FiRefreshCw } from "react-icons/fi";
import { useGetIOByIdQuery } from "../../../Services/io.service";
import { RepeatIcon } from "@chakra-ui/icons";
const rotate = keyframes`
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
`;
const formatDate = (date) => new Date(date).toLocaleDateString(); // Simple date formatter
const Investors = ({data}) => {
@@ -46,14 +58,11 @@ const Investors = ({data}) => {
const toast = useToast();
const { investors, setInvestors, slideFromRight, IODetails } =
useContext(GlobalStateContext);
console.log(params?.id);
const [ isRefetchLoading, setIsRefetchLoading ] = useState(false)
const {
data: IObyID,
isLoading: IObyIDisLoading,
error: IObyIDerror,
refetch
} = useGetIOByIdQuery(id, { skip: !id });
@@ -396,8 +405,10 @@ const Investors = ({data}) => {
};
const handleRefresh = () =>{
refetch()
const handleRefresh = async() =>{
setIsRefetchLoading(true)
await refetch()
setIsRefetchLoading(false)
}
return (
@@ -421,7 +432,8 @@ const Investors = ({data}) => {
value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)}
/>
<Icon ms={3} bg={"gray.100"} onClick={handleRefresh} fontWeight={600} as={RepeatIcon} boxSize={8} p={2} rounded={'md'} _hover={{bg:'gray.100'}} cursor={'pointer'} />
<Icon ms={3}
animation={IObyIDisLoading ? `${rotate} 1s linear infinite` : "none"} bg={"gray.100"} onClick={handleRefresh} fontWeight={600} as={RepeatIcon} boxSize={8} p={2} rounded={'md'} _hover={{bg:'gray.100'}} cursor={'pointer'} />
</span>
<HStack bg={'#C6F6D5'} ps={4} pe={4} pt={1.5} pb={1.5} rounded={'md'} boxShadow={'sm'} display={"flex"} alignItems={"end"} flexDirection={'column'} >

8
src/Pages/IO_Management/CreateIO/KeyMerits.jsx
View File

@@ -32,7 +32,7 @@ import {
import FullscreenLoaders from "../../../Components/Loaders/FullscreenLoaders";
import ToastBox from "../../../Components/ToastBox";
import KeyMeritsEdit from "../KeyMeritsEdit";
import SetDisplayOrder from "./SetDisplayOrder";
import SetDisplayOrder from "./SetDisplayOrderKeyMerits";
const KeyMerits = ({ enableNextTab, index, data: prepopData }) => {
const toast = useToast();
@@ -71,7 +71,7 @@ const KeyMerits = ({ enableNextTab, index, data: prepopData }) => {
const filteredData = IODetails?.keyMerits?.filter((item) => {
// Filter by name (case insensitive)
const name = item.meritsHeader;
const name = item?.meritsHeader;
const searchLower = searchTerm.toLowerCase();
const nameMatches = name.toLowerCase().includes(searchLower);
@@ -80,7 +80,7 @@ const KeyMerits = ({ enableNextTab, index, data: prepopData }) => {
// console.log(filteredData);
const sortedData = filteredData?.sort(
(a, b) => a.displayOder - b.displayOder
(a, b) => a.displayOrder - b.displayOrder
);
const handleDelete = async () => {
@@ -97,6 +97,8 @@ const KeyMerits = ({ enableNextTab, index, data: prepopData }) => {
} catch (error) {}
};
const extractedArray = sortedData?.map((item, index) => ({
id: item.id,
"Sr.no": (

189
src/Pages/IO_Management/CreateIO/SetDisplayOrderIOArtifactsImages.jsx Normal file
View File

@@ -0,0 +1,189 @@
import React, { useState, useEffect } from "react";
import {
Modal,
ModalOverlay,
ModalContent,
ModalHeader,
ModalFooter,
ModalBody,
ModalCloseButton,
useDisclosure,
Button,
Box,
Text,
Image,
HStack,
useToast,
Link,
Badge,
} from "@chakra-ui/react";
import { AddIcon, DragHandleIcon, ExternalLinkIcon } from "@chakra-ui/icons";
import DataTable from "../../../Components/DataTable/DataTable";
import { useSetDisplayOrderIOArtifactsImageMutation } from "../../../Services/io.service";
import ToastBox from "../../../Components/ToastBox";
const SetDisplayOrderIOArtifactsImages = ({ data, }) => {
console.log(data);
const toast = useToast();
const { isOpen, onOpen, onClose } = useDisclosure();
const [isLoading, setIsLoading] = useState(false);
const tableHeadRow = ["", "File Name", "View image"];
const [extractedArray, setExtractedArray] = useState([]);
const [displayOrder, setDisplayOrder] = useState(null);
const [resetDisplayOrder] = useSetDisplayOrderIOArtifactsImageMutation();
// Update state when `data` prop changes
useEffect(() => {
if (data) {
const formattedData = data?.map((item, index) => ({
id: item?.id,
displayOrder: index + 1, // Add displayOrder property
"": (
<Box w={"20px"} isTruncated={true}>
<DragHandleIcon />
</Box>
),
"File Name": (
<Box isTruncated={true}>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
{item.artifactName}
</Text>
</Box>
),
"View image": (
<Text
color={"green.500"}
justifyContent={"left"}
as={"span"}
fontWeight={"500"}
className="d-flex align-items-center web-text-small"
>
<Badge
px={2}
py={0.5}
display={"flex"}
alignItems={"center"}
textTransform={"inherit"}
fontWeight={500}
colorScheme={"forestGreen"}
>
<Link
href={import.meta.env.VITE_IMAGE_URL + item?.artifactPathName}
isExternal
>
<Box
// onClick={() => {
// setImageSrc(item?.artifactPathName);
// onOpenImageViewer();
// }}
as="span"
cursor={"pointer"}
>
View
</Box>{" "}
<ExternalLinkIcon />
</Link>
</Badge>
</Text>
),
}));
setExtractedArray(formattedData);
}
}, [data]);
// Log the updated order in the desired format whenever `extractedArray` changes
useEffect(() => {
const displayOrderArray = extractedArray.map((item, index) => ({
id: item.id,
displayOrder: index + 1,
}));
setDisplayOrder(displayOrderArray);
}, [extractedArray]);
const handleSetOrder = async () => {
setIsLoading(true);
const data = {
displayOrder: displayOrder,
};
try {
const res = await resetDisplayOrder({ data });
console.log(res?.data?.statusCode);
if (res?.data?.statusCode === 200) {
toast({
render: () => <ToastBox message={res?.data?.message} />,
});
onClose();
}
setIsLoading(false);
} catch (error) {
console.log(res);
setIsLoading(false);
}
};
return (
<>
<Button
leftIcon={<AddIcon />}
size={"sm"}
fontSize={"xs"}
rounded={"sm"}
variant={"outline"}
colorScheme="forestGreen"
onClick={onOpen}
>
Set Display Order
</Button>
<Modal isCentered size={"xl"} isOpen={isOpen} onClose={onClose}>
<ModalOverlay />
<ModalContent>
<ModalHeader fontSize={"lg"}>Set Display Order</ModalHeader>
<ModalCloseButton />
<ModalBody>
<DataTable
emptyMessage={`We don't have any Sponsors`}
tableHeadRow={tableHeadRow}
data={extractedArray}
setData={setExtractedArray}
isDraggable={true}
/>
</ModalBody>
<ModalFooter>
<Button
size={"sm"}
fontSize={"xs"}
rounded={"sm"}
variant={"outline"}
colorScheme="forestGreen"
mr={3}
onClick={onClose}
>
Reset order
</Button>
<Button
size={"sm"}
fontSize={"xs"}
rounded={"sm"}
colorScheme="forestGreen"
variant="solid"
onClick={handleSetOrder}
isLoading={isLoading}
>
Set order
</Button>
</ModalFooter>
</ModalContent>
</Modal>
</>
);
};
export default SetDisplayOrderIOArtifactsImages;

174
src/Pages/IO_Management/CreateIO/SetDisplayOrderIOArtifactsVideo.jsx Normal file
View File

@@ -0,0 +1,174 @@
import React, { useState, useEffect } from "react";
import {
Modal,
ModalOverlay,
ModalContent,
ModalHeader,
ModalFooter,
ModalBody,
ModalCloseButton,
useDisclosure,
Button,
Box,
Text,
Image,
HStack,
useToast,
Badge,
Link,
} from "@chakra-ui/react";
import { AddIcon, DragHandleIcon, ExternalLinkIcon } from "@chakra-ui/icons";
import DataTable from "../../../Components/DataTable/DataTable";
import { useSetDisplayOrderIOArtifactsVideoMutation } from "../../../Services/io.service";
import ToastBox from "../../../Components/ToastBox";
const SetDisplayOrderIOArtifactsVideo = ({ data, }) => {
const toast = useToast();
const { isOpen, onOpen, onClose } = useDisclosure();
const [isLoading, setIsLoading] = useState(false);
const tableHeadRow = ["", "File Name", "Video streaming URL"];
const [extractedArray, setExtractedArray] = useState([]);
const [displayOrder, setDisplayOrder] = useState(null);
const [resetDisplayOrder] = useSetDisplayOrderIOArtifactsVideoMutation();
// Update state when `data` prop changes
useEffect(() => {
if (data) {
const formattedData = data.map((item, index) => ({
id: item?.id,
displayOrder: index + 1, // Add displayOrder property
"": (
<Box w={"20px"} isTruncated={true}>
<DragHandleIcon />
</Box>
),
"File Name": (
<Box isTruncated={true}>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
{item.artifactName}
</Text>
</Box>
),
"Video streaming URL": (
<Text
color={"green.500"}
justifyContent={"left"}
as={"span"}
fontWeight={"500"}
className="d-flex align-items-center web-text-small"
>
<Badge
px={2}
py={0.5}
display={"flex"}
alignItems={"center"}
textTransform={"inherit"}
fontWeight={500}
colorScheme={"forestGreen"}
>
<Link href={item?.artifactStreamingURL} isExternal>
<Box as="span">View</Box> <ExternalLinkIcon />
</Link>
</Badge>
</Text>
),
}));
setExtractedArray(formattedData);
}
}, [data]);
// Log the updated order in the desired format whenever `extractedArray` changes
useEffect(() => {
const displayOrderArray = extractedArray.map((item, index) => ({
id: item.id,
displayOrder: index + 1,
}));
setDisplayOrder(displayOrderArray);
}, [extractedArray]);
const handleSetOrder = async () => {
setIsLoading(true);
const data = {
displayOrder: displayOrder,
};
try {
const res = await resetDisplayOrder({ data });
console.log(res?.data?.statusCode);
if (res?.data?.statusCode === 200) {
toast({
render: () => <ToastBox message={res?.data?.message} />,
});
onClose();
}
setIsLoading(false);
} catch (error) {
console.log(res);
setIsLoading(false);
}
};
return (
<>
<Button
leftIcon={<AddIcon />}
size={"sm"}
fontSize={"xs"}
rounded={"sm"}
variant={"outline"}
colorScheme="forestGreen"
onClick={onOpen}
>
Set Display Order
</Button>
<Modal isCentered size={"xl"} isOpen={isOpen} onClose={onClose}>
<ModalOverlay />
<ModalContent>
<ModalHeader fontSize={"lg"}>Set Display Order</ModalHeader>
<ModalCloseButton />
<ModalBody>
<DataTable
emptyMessage={`We don't have any Sponsors`}
tableHeadRow={tableHeadRow}
data={extractedArray}
setData={setExtractedArray}
isDraggable={true}
/>
</ModalBody>
<ModalFooter>
<Button
size={"sm"}
fontSize={"xs"}
rounded={"sm"}
variant={"outline"}
colorScheme="forestGreen"
mr={3}
onClick={onClose}
>
Reset order
</Button>
<Button
size={"sm"}
fontSize={"xs"}
rounded={"sm"}
colorScheme="forestGreen"
variant="solid"
onClick={handleSetOrder}
isLoading={isLoading}
>
Set order
</Button>
</ModalFooter>
</ModalContent>
</Modal>
</>
);
};
export default SetDisplayOrderIOArtifactsVideo;

165
src/Pages/IO_Management/CreateIO/SetDisplayOrderIODocuments.jsx Normal file
View File

@@ -0,0 +1,165 @@
import React, { useState, useEffect } from "react";
import {
Modal,
ModalOverlay,
ModalContent,
ModalHeader,
ModalFooter,
ModalBody,
ModalCloseButton,
useDisclosure,
Button,
Box,
Text,
Image,
HStack,
useToast,
} from "@chakra-ui/react";
import { AddIcon, DragHandleIcon } from "@chakra-ui/icons";
import DataTable from "../../../Components/DataTable/DataTable";
import { useSetDisplayOrderIODocumentsMutation } from "../../../Services/io.service";
import ToastBox from "../../../Components/ToastBox";
import { GrDocumentPdf } from "react-icons/gr";
import { TbFileTypeDocx } from "react-icons/tb";
const SetDisplayOrderIODocuments = ({ data, }) => {
const toast = useToast();
const { isOpen, onOpen, onClose } = useDisclosure();
const [isLoading, setIsLoading] = useState(false);
const tableHeadRow = ["", "Type", "File name"];
const [extractedArray, setExtractedArray] = useState([]);
const [displayOrder, setDisplayOrder] = useState(null);
const [resetDisplayOrder] = useSetDisplayOrderIODocumentsMutation();
// Update state when `data` prop changes
useEffect(() => {
if (data) {
const formattedData = data.map((item, index) => ({
id: item?.id,
displayOrder: index + 1, // Add displayOrder property
"": (
<Box maxW={"20px"} isTruncated={true}>
<DragHandleIcon />
</Box>
),
Type: (
<Text
justifyContent={"left"}
as="span"
color="teal.900"
fontWeight="500"
className="d-flex align-items-center"
fontSize={"xl"}
>
{item.documentType === "application/pdf" ? (
<GrDocumentPdf />
) : (
<TbFileTypeDocx fontSize={21} />
)}
</Text>
),
"File name": (
<Text as="span" color="teal.900" fontWeight="500">
{item.documentName}
</Text>
),
}));
setExtractedArray(formattedData);
}
}, [data]);
// Log the updated order in the desired format whenever `extractedArray` changes
useEffect(() => {
const displayOrderArray = extractedArray.map((item, index) => ({
id: item.id,
displayOrder: index + 1,
}));
setDisplayOrder(displayOrderArray);
}, [extractedArray]);
const handleSetOrder = async () => {
setIsLoading(true);
const data = {
displayOrder: displayOrder,
};
try {
const res = await resetDisplayOrder({ data });
console.log(res?.data?.statusCode);
if (res?.data?.statusCode === 200) {
toast({
render: () => <ToastBox message={res?.data?.message} />,
});
onClose();
}
setIsLoading(false);
} catch (error) {
console.log(res);
setIsLoading(false);
}
};
return (
<>
<Button
leftIcon={<AddIcon />}
size={"sm"}
fontSize={"xs"}
rounded={"sm"}
variant={"outline"}
colorScheme="forestGreen"
onClick={onOpen}
>
Set Display Order
</Button>
<Modal isCentered size={"xl"} isOpen={isOpen} onClose={onClose}>
<ModalOverlay />
<ModalContent>
<ModalHeader fontSize={"lg"}>Set Display Order</ModalHeader>
<ModalCloseButton />
<ModalBody>
<DataTable
emptyMessage={`We don't have any Sponsors`}
tableHeadRow={tableHeadRow}
data={extractedArray}
setData={setExtractedArray}
isDraggable={true}
/>
</ModalBody>
<ModalFooter>
<Button
size={"sm"}
fontSize={"xs"}
rounded={"sm"}
variant={"outline"}
colorScheme="forestGreen"
mr={3}
onClick={onClose}
>
Reset order
</Button>
<Button
size={"sm"}
fontSize={"xs"}
rounded={"sm"}
colorScheme="forestGreen"
variant="solid"
onClick={handleSetOrder}
isLoading={isLoading}
>
Set order
</Button>
</ModalFooter>
</ModalContent>
</Modal>
</>
);
};
export default SetDisplayOrderIODocuments;

10
src/Pages/IO_Management/CreateIO/SetDisplayOrder.jsx → src/Pages/IO_Management/CreateIO/SetDisplayOrderKeyMerits.jsx
View File

@@ -21,7 +21,7 @@ import DataTable from "../../../Components/DataTable/DataTable";
import { useSetDisplayOrderMutation } from "../../../Services/io.service";
import ToastBox from "../../../Components/ToastBox";
const SetDisplayOrder = ({ data }) => {
const SetDisplayOrderKeyMerits = ({ data, }) => {
const toast = useToast();
const { isOpen, onOpen, onClose } = useDisclosure();
const [isLoading, setIsLoading] = useState(false);
@@ -57,6 +57,10 @@ const SetDisplayOrder = ({ data }) => {
</Box>
),
Icon: item?.icon?.iconFilePath && (
<Box
display={"flex"}
justifyContent={"center"}
alignItems={"center"}>
<Image
rounded={"md"}
display={"flex"}
@@ -66,7 +70,7 @@ const SetDisplayOrder = ({ data }) => {
src={import.meta.env.VITE_IMAGE_URL + item?.icon?.iconFilePath}
w={8}
h={8}
/>
/></Box>
),
}));
setExtractedArray(formattedData);
@@ -164,4 +168,4 @@ const SetDisplayOrder = ({ data }) => {
);
};
export default SetDisplayOrder;
export default SetDisplayOrderKeyMerits;

1
src/Pages/IO_Management/ViewIO/HeaderModal/AmountInvested.jsx
View File

@@ -50,6 +50,7 @@ const AmountInvested = ({ isOpen, onClose }) => {
const [isLoading, setIsLoading] = useState(false);
const { IODetails } = useContext(GlobalStateContext);
const [amountInvested] = useAmountIvestmentMutation();
useEffect(() => {
if (IODetails?.totalAmtInvestmentInUSD) {

76
src/Pages/IO_Management/ViewIO/HeaderModal/DistributionInvestor.jsx
View File

@@ -27,7 +27,7 @@ import {
import NormalData from "../../../../Components/DataTable/NormalTable";
import { useState } from "react";
import { AddIcon } from "@chakra-ui/icons";
import { useGetDistributionInvestorMutation } from "../../../../Services/io.service";
import { useGetDistributedToInvestorMutation, useGetDistributionInvestorMutation, useUpdateExitToInvestorMutation } from "../../../../Services/io.service";
import { useParams } from "react-router-dom";
import { useEffect } from "react";
import { Controller, useForm } from "react-hook-form";
@@ -36,17 +36,20 @@ import { yupResolver } from "@hookform/resolvers/yup";
import ToastBox from "../../../../Components/ToastBox";
import CurrencyInput from "../../../../Components/CurrencyInput";
import { IoCalculator } from "react-icons/io5";
import { debounce } from "../../../Master/Sponser/AddSponser";
export const investor = yup.object().shape({
amount: yup.string().required("Amount is required"),
});
const DistributionInvestor = ({ isOpen, onClose }) => {
const DistributionInvestor = ({ isOpen, onClose, exit }) => {
const params = useParams();
const toast = useToast();
const id = params?.id;
const [ isCalculateLoading, setIsCalculateLoading ] = useState(false)
const [ isFinalCalculateLoading, setIsFinalCalculateLoading ] = useState(false)
const [ calcualtedData, setCalculatedDate ] = useState(null)
const [ isCalcualtedData, setIsCalcualtedData ] = useState(false)
// const {
// data:IObyID,
@@ -55,6 +58,8 @@ const DistributionInvestor = ({ isOpen, onClose }) => {
// } = useGetDistributionInvestorMutation(id);
const [getDistributionInvestment] = useGetDistributionInvestorMutation();
const [getFinalDistributionInvestment] = useGetDistributedToInvestorMutation();
const [ updateExitToInvestor ] = useUpdateExitToInvestorMutation()
const {
control,
@@ -64,6 +69,7 @@ const DistributionInvestor = ({ isOpen, onClose }) => {
} = useForm({
resolver: yupResolver(investor),
});
// useEffect(()=>{
// try {
@@ -128,7 +134,7 @@ const DistributionInvestor = ({ isOpen, onClose }) => {
Amount: (
<Box minW={24} isTruncated={true}>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
{item?.amount}
{item?.amount?.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}
</Text>
</Box>
),
@@ -212,7 +218,7 @@ const DistributionInvestor = ({ isOpen, onClose }) => {
wordBreak="normal"
overflowWrap="normal"
>
{calcualtedData?.totalInvestedAmt?.toFixed(2)?.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}
{calcualtedData?.totalInvestedAmt?.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}
</Th>
<Th
textAlign={"left"}
@@ -234,7 +240,7 @@ const DistributionInvestor = ({ isOpen, onClose }) => {
wordBreak="normal"
overflowWrap="normal"
>
{calcualtedData?.distributed_amt?.toFixed(2)?.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}
{calcualtedData?.distributed_amt?.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}
</Th>
</Tr>
</Tbody>
@@ -243,7 +249,6 @@ const DistributionInvestor = ({ isOpen, onClose }) => {
};
const onSubmit = async (data) => {
console.log(data);
setIsCalculateLoading(true)
try {
@@ -257,6 +262,7 @@ const DistributionInvestor = ({ isOpen, onClose }) => {
),
})
setIsCalculateLoading(false)
setIsCalcualtedData(false)
} else if(res?.data?.statusCode === 200){
setCalculatedDate(res?.data?.data)
toast({
@@ -265,6 +271,7 @@ const DistributionInvestor = ({ isOpen, onClose }) => {
),
})
setIsCalculateLoading(false)
setIsCalcualtedData(true)
}
@@ -273,10 +280,56 @@ const DistributionInvestor = ({ isOpen, onClose }) => {
}
};
console.log(errors);
const onFinalSubmit = async (data) => {
setIsFinalCalculateLoading(true)
if (!isCalcualtedData) {
setIsFinalCalculateLoading(false)
return toast({
render: () => (
<ToastBox message={"Please calculate investment first."} status="warn" />
),
})
}
const finalData = {
transactionAmount: data?.amount,
};
try {
const res = await exit ? updateExitToInvestor({id,data: finalData }) :getFinalDistributionInvestment({id,data: finalData });
console.log(finalData);
if (res?.error?.status === 401) {
toast({
render: () => (
<ToastBox message={res?.error?.data?.message} status="error" />
),
});
} else if (res?.data?.statusCode === 200) {
toast({
render: () => <ToastBox message={res?.data?.message} />,
});
handleClose()
}
} catch (error) {
console.error("An error occurred:", error);
} finally {
handleClose()
}
};
const handleClose = () => {
onClose()
setIsFinalCalculateLoading(false)
reset()
}
return (
<Modal size={"xl"} isOpen={isOpen} onClose={onClose}>
<Modal size={"xl"} isOpen={isOpen} onClose={handleClose}>
<ModalOverlay />
<ModalContent maxW={1000}>
<ModalHeader fontSize={"md"}>
@@ -291,13 +344,12 @@ const DistributionInvestor = ({ isOpen, onClose }) => {
{/* <Input placeholder="$00.00" size={"sm"} className="col" /> */}
<FormControl isInvalid={errors.amount}>
<FormLabel textAlign={'right'} fontSize={"sm"} > Amount to Distribute</FormLabel>
<Box display={"flex"} justifyContent={'end'} alignItems={"end"} gap={0}>
<Box display={"flex"} justifyContent={'end'} alignItems={"end"} gap={2}>
<Controller
name="amount"
control={control}
render={({ field }) => (
<CurrencyInput
rounded={0}
w={'18%'}
{...field}
@@ -319,7 +371,7 @@ const DistributionInvestor = ({ isOpen, onClose }) => {
Calculate
</Button>
</Box>
<FormErrorMessage fontSize={"xs"} fontWeight={500}>
<FormErrorMessage display={'flex'} justifyContent={'end'} pe={125} fontSize={"xs"} fontWeight={500}>
{errors.amount?.message}
</FormErrorMessage>
</FormControl>
@@ -346,6 +398,8 @@ const DistributionInvestor = ({ isOpen, onClose }) => {
}}
size={"sm"}
rounded={"sm"}
onClick={handleSubmit(onFinalSubmit)}
isLoading={isFinalCalculateLoading}
>
Save
</Button>

2
src/Pages/IO_Management/ViewIO/ViewIOTable.jsx
View File

@@ -81,7 +81,7 @@ const ViewIOTable = () => {
"Goal Amount",
"Holding Period",
"IO Status",
"Preview",
// "Preview",
"Action",
];

5
src/Pages/IO_Management/ViewIO/ViewIOdata.jsx
View File

@@ -36,6 +36,7 @@ import IOCashDetails from "../CreateIO/IOCashDetails";
import IONAVDetails from "../CreateIO/IONAVDetails";
import { useGetIOprepopulateDataQuery } from "../../../Services/io.service";
import UnderConstruction from "../../UnderConstruction";
import Destribution from "../CreateIO/Destribution";
const ViewIOdata = () => {
@@ -59,8 +60,8 @@ const ViewIOdata = () => {
// { label: "Investors", content: <UnderConstruction h={'75vh'} /> },
{ label: "IO Cash Details", content: <IOCashDetails data={data?.data} /> },
{ label: "IO NAV Details", content: <IONAVDetails data={data?.data} /> },
// { label: "Distribution to Investors", content: <IONAVDetails data={data?.data} /> },
{ label: "Distribution to Investors", content: <UnderConstruction h={'75vh'} /> },
{ label: "Distribution to Investors", content: <Destribution data={data?.data} /> },
// { label: "Distribution to Investors", content: <UnderConstruction h={'75vh'} /> },
];
return (

376
src/Pages/IO_Management/ViewIO/ViewIOdataHeader.jsx
View File

@@ -44,14 +44,13 @@ import Loader01 from "../../../Components/Loaders/Loader01";
// import { formatCurrency } from "../../../Components/CurrencyInput";
// import { removeTrailingZeros } from "../../../Constants/Constants";
const ViewIOdataHeader = ({data, isLoading}) => {
const ViewIOdataHeader = ({ data, isLoading }) => {
const params = useParams();
const id = params?.id;
const { isOpen, onOpen, onClose } = useDisclosure();
const btnRef = useRef();
const { IODetails, isIOloading } = useContext(GlobalStateContext);
const {
isOpen: isInvestmentOpen,
onOpen: onInvestmentOpen,
@@ -104,17 +103,16 @@ const ViewIOdataHeader = ({data, isLoading}) => {
fontWeight: "400",
};
console.log(import.meta.env.VITE_IMAGE_URL +
IODetails?.artifactsImage?.[0]?.artifactPathName);
console.log(
import.meta.env.VITE_IMAGE_URL +
IODetails?.artifactsImage?.[0]?.artifactPathName
);
const menu = [
{
id:1,
title:"Amount Invested",
onClickFunction: onInvestmentOpen
id: 1,
title: "Amount Invested",
onClickFunction: onInvestmentOpen,
},
// {
// id:2,
@@ -127,47 +125,44 @@ const ViewIOdataHeader = ({data, isLoading}) => {
// onClickFunction:onDistSponsorOpen
// },
{
id:6,
title:"Distribution To Investors",
onClickFunction:onDistInvestorOpen
id: 6,
title: "Distribution To Investors",
onClickFunction: onDistInvestorOpen,
},
{
id:5,
title:"Update IO NAV",
onClickFunction:onUpdateNavOpen
id: 5,
title: "Update IO NAV",
onClickFunction: onUpdateNavOpen,
},
{
id:8,
title:"Exit",
onClickFunction:onExitOpen
id: 8,
title: "Exit",
onClickFunction: onExitOpen,
},
{
id:9,
title:"Cancel",
onClickFunction:onCancleOpen
id: 9,
title: "Cancel",
onClickFunction: onCancleOpen,
},
{
id:10,
title:"Update IO Status",
onClickFunction:onUpdateStatusOpen
id: 10,
title: "Update IO Status",
onClickFunction: onUpdateStatusOpen,
},
]
];
// console.log(IODetails?.mainTranscation);
// Extract titles from apiTransaction
const apiTransactionTitles = IODetails?.mainTranscation?.map(
(transaction) => transaction.id
);
// Filter menu items
const filteredMenu = menu?.filter((item) =>
apiTransactionTitles?.includes(item.id)
);
// Extract titles from apiTransaction
const apiTransactionTitles = IODetails?.mainTranscation?.map(transaction => transaction.id);
// Filter menu items
const filteredMenu = menu?.filter(item => apiTransactionTitles?.includes(item.id));
return (
IODetails?.investmentNameEnglish ?
return IODetails?.investmentNameEnglish ? (
<Box
display={"flex"}
alignItems={"center"}
@@ -183,7 +178,7 @@ const filteredMenu = menu?.filter(item => apiTransactionTitles?.includes(item.id
: IODetails?.ioStatus?.statusAdmin === "Closed"
? "#C6F6D5"
: IODetails?.ioStatus?.statusAdmin === "Exited"
? "red.500"
? "#FED7D7"
: IODetails?.ioStatus?.statusAdmin === "Canclled"
? "orange.500"
: IODetails?.ioStatus?.statusAdmin === "DeActivate"
@@ -200,130 +195,163 @@ const filteredMenu = menu?.filter(item => apiTransactionTitles?.includes(item.id
boxShadow={"md"}
position={"relative"}
>
<HStack gap={8}>
<Box h={100} w={200} p={1.5}>
{/* <Image rounded={'md'} h={"100%"} src={ " https://tanami.betadelivery.com/" + IODetails?.ioName} alt={IODetails?.ioName}/> */}
{IODetails?.artifactsImage?.[0]?.artifactPathName ? (
<Image
rounded={"md"}
h={"100%"}
w={"100%"}
objectFit={"cover"}
src={
import.meta.env.VITE_IMAGE_URL +
IODetails?.artifactsImage?.[0]?.artifactPathName
}
alt={IODetails?.ioName}
/>
) : (
<Box
w={"100%"}
h={"100%"}
display={"flex"}
justifyContent={"center"}
alignItems={"center"}
bg={"#fff"}
rounded={"md"}
>
<Icon color={"gray.700"} as={GrGallery} />
</Box>
)}
</Box>
<Box display={"flex"} w={"auto"} flexDirection={"column"} gap={2}>
<Text as={"span"} fontSize={"xs"} color={"gray.500"} fontWeight={"500"}>
IO Name
</Text>
<Text as={"span"} fontSize={"sm"} fontWeight={"500"}>
{IODetails?.investmentNameEnglish
? IODetails?.investmentNameEnglish
: "---"}
</Text>
</Box>
<Box h={100} w={200} p={1.5}>
{/* <Image rounded={'md'} h={"100%"} src={ " https://tanami.betadelivery.com/" + IODetails?.ioName} alt={IODetails?.ioName}/> */}
{IODetails?.artifactsImage?.[0]?.artifactPathName ? (
<Image
rounded={"md"}
h={"100%"}
w={"100%"}
objectFit={"cover"}
src={
import.meta.env.VITE_IMAGE_URL +
IODetails?.artifactsImage?.[0]?.artifactPathName
}
alt={IODetails?.ioName}
/>
) : (
<Box
w={"100%"}
h={"100%"}
display={"flex"}
justifyContent={"center"}
alignItems={"center"}
bg={"#fff"}
rounded={"md"}
>
<Icon color={"gray.700"} as={GrGallery} />
</Box>
)}
</Box>
<Box display={"flex"} flexDirection={"column"} gap={2}>
<Text as={"span"} fontSize={"xs"} color={"gray.500"} fontWeight={"500"}>
Sponsor Name
</Text>
<Text as={"span"} fontSize={"sm"} fontWeight={"500"}>
{IODetails?.sponsor?.sponsorName
? IODetails?.sponsor?.sponsorName
: "---"}
</Text>
</Box>
<Box display={"flex"} w={"auto"} flexDirection={"column"} gap={2}>
<Text
as={"span"}
fontSize={"xs"}
color={"gray.500"}
fontWeight={"500"}
>
IO Name
</Text>
<Text as={"span"} fontSize={"sm"} fontWeight={"500"}>
{IODetails?.investmentNameEnglish
? IODetails?.investmentNameEnglish
: "---"}
</Text>
</Box>
<Box display={"flex"} flexDirection={"column"} gap={2}>
<Text
as={"span"}
fontSize={"xs"}
color={"gray.500"}
fontWeight={"500"}
>
Sponsor Name
</Text>
<Text as={"span"} fontSize={"sm"} fontWeight={"500"}>
{IODetails?.sponsor?.sponsorName
? IODetails?.sponsor?.sponsorName
: "---"}
</Text>
</Box>
</HStack>
<HStack gap={8} me={20}>
<Box display={"flex"} flexDirection={"column"} gap={2}>
<Text
as={"span"}
textAlign={"center"}
fontSize={"xs"}
color={"gray.500"}
fontWeight={"500"}
>
IO Status
</Text>
<Badge
rounded={"full"}
pt={0}
pb={0.5}
ps={4}
pe={4}
textTransform={"none"}
// variant={"solid"}
colorScheme={
IODetails?.ioStatus?.statusAdmin === "Draft"
? "gray"
: IODetails?.ioStatus?.statusAdmin === "Processing"
? "yellow"
: IODetails?.ioStatus?.statusAdmin === "Open"
? "blue"
: IODetails?.ioStatus?.statusAdmin === "Closed"
? "green"
: IODetails?.ioStatus?.statusAdmin === "Exited"
? "red"
: IODetails?.ioStatus?.statusAdmin === "Canclled"
? "orange"
: "purple"
}
>
{IODetails?.ioStatus?.statusAdmin
? IODetails?.ioStatus?.statusAdmin
: "---"}
</Badge>
</Box>
<Box display={"flex"} flexDirection={"column"} gap={2}>
<Text as={"span"} textAlign={'center'} fontSize={"xs"} color={"gray.500"} fontWeight={"500"}>
IO Status
</Text>
<Badge
rounded={"full"}
pt={0}
pb={0.5}
ps={4}
pe={4}
textTransform={"none"}
// variant={"solid"}
colorScheme={
IODetails?.ioStatus?.statusAdmin === "Draft"
? "gray"
: IODetails?.ioStatus?.statusAdmin === "Processing"
? "yellow"
: IODetails?.ioStatus?.statusAdmin === "Open"
? "blue"
: IODetails?.ioStatus?.statusAdmin === "Closed"
? "green"
: IODetails?.ioStatus?.statusAdmin === "Exited"
? "red"
: IODetails?.ioStatus?.statusAdmin === "Canclled"
? "orange"
: "purple"
}
>
{IODetails?.ioStatus?.statusAdmin
? IODetails?.ioStatus?.statusAdmin
: "---"}
</Badge>
</Box>
<Box display={"flex"} flexDirection={"column"} gap={2}>
<Text
as={"span"}
fontSize={"xs"}
color={"gray.500"}
fontWeight={"500"}
>
IO MV
</Text>
<Text as={"span"} fontSize={"sm"} fontWeight={"500"}>
{/* {IODetails?.ioNAV ? formatCurrency(removeTrailingZeros(IODetails?.ioNAV)) : "00.00"} */}
{parseFloat(IODetails?.ioNAV || 0).toLocaleString(undefined, {
minimumFractionDigits: 2,
maximumFractionDigits: 2,
})}
</Text>
</Box>
<Box display={"flex"} flexDirection={"column"} gap={2}>
<Text as={"span"} fontSize={"xs"} color={"gray.500"} fontWeight={"500"}>
IO MV
</Text>
<Text as={"span"} fontSize={"sm"} fontWeight={"500"}>
{/* {IODetails?.ioNAV ? formatCurrency(removeTrailingZeros(IODetails?.ioNAV)) : "00.00"} */}
{parseFloat(IODetails?.ioNAV||0).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}
</Text>
</Box>
<Box display={"flex"} flexDirection={"column"} gap={2}>
<Text as={"span"} fontSize={"xs"} color={"gray.500"} fontWeight={"500"}>
IO cash
</Text>
<Text as={"span"} fontSize={"sm"} fontWeight={"500"}>
{/* {IODetails?.ioCash ? formatCurrency(removeTrailingZeros(IODetails?.ioCash)) : "00.00"} */}
{parseFloat(IODetails?.ioCash||0).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}
</Text>
</Box>
<Box display={"flex"} flexDirection={"column"} gap={2}>
<Text as={"span"} fontSize={"xs"} color={"gray.500"} fontWeight={"500"}>
IO NAV
</Text>
<Text as={"span"} fontSize={"sm"} fontWeight={"500"}>
{/* {IODetails?.ioMVNAV ? formatCurrency(removeTrailingZeros(IODetails?.ioMVNAV)) : "00.00"} */}
{parseFloat(IODetails?.ioMVNAV||0).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}
</Text>
</Box>
<Box display={"flex"} flexDirection={"column"} gap={2}>
<Text
as={"span"}
fontSize={"xs"}
color={"gray.500"}
fontWeight={"500"}
>
IO cash
</Text>
<Text as={"span"} fontSize={"sm"} fontWeight={"500"}>
{/* {IODetails?.ioCash ? formatCurrency(removeTrailingZeros(IODetails?.ioCash)) : "00.00"} */}
{parseFloat(IODetails?.ioCash || 0).toLocaleString(undefined, {
minimumFractionDigits: 2,
maximumFractionDigits: 2,
})}
</Text>
</Box>
<Box display={"flex"} flexDirection={"column"} gap={2}>
<Text
as={"span"}
fontSize={"xs"}
color={"gray.500"}
fontWeight={"500"}
>
IO NAV
</Text>
<Text as={"span"} fontSize={"sm"} fontWeight={"500"}>
{/* {IODetails?.ioMVNAV ? formatCurrency(removeTrailingZeros(IODetails?.ioMVNAV)) : "00.00"} */}
{parseFloat(IODetails?.ioMVNAV || 0).toLocaleString(undefined, {
minimumFractionDigits: 2,
maximumFractionDigits: 2,
})}
</Text>
</Box>
</HStack>
<Box
@@ -356,29 +384,39 @@ const filteredMenu = menu?.filter(item => apiTransactionTitles?.includes(item.id
Tansaction
</MenuItem>
{filteredMenu?.map(({id, title, onClickFunction})=><MenuItem key={id} onClick={onClickFunction} className="border-bottom">
{title}
</MenuItem>)}
{filteredMenu?.map(({ id, title, onClickFunction }) => (
<MenuItem
key={id}
onClick={onClickFunction}
className="border-bottom"
>
{title}
</MenuItem>
))}
</MenuList>
</Menu>
{/* Modals */}
<AmountInvested isOpen={isInvestmentOpen} onClose={onInvestmentClose} />
<FeesExpenses isOpen={isFeesOpen} onClose={onFeesClose} />
<Exit isOpen={isExitOpen} onClose={onExitClose} />
{/* <Exit isOpen={isExitOpen} onClose={onExitClose} /> */}
<Cancle isOpen={isCancleOpen} onClose={onCancleClose} />
<DistributionSponsor
isOpen={isDistSponsorOpen}
onClose={onDistSponsorClose}
/>
<DistributionInvestor
exit={false}
isOpen={isDistInvestorOpen}
onClose={onDistInvestorClose}
/>
<DistributionInvestor
exit={true}
isOpen={isExitOpen}
onClose={onExitClose}
/>
<UpdateIONav isOpen={isUpdateNavOpen} onClose={onUpdateNavClose} />
<UpdateIOStatus
status={IODetails?.nextStatus}
@@ -386,9 +424,8 @@ const filteredMenu = menu?.filter(item => apiTransactionTitles?.includes(item.id
onClose={onUpdateStatusClose}
/>
</Box>
</Box>:
</Box>
) : (
<Box
display={"flex"}
alignItems={"center"}
@@ -403,7 +440,10 @@ const filteredMenu = menu?.filter(item => apiTransactionTitles?.includes(item.id
// bgGradient='linear(to-r, #ffd54f, #caf5d8)'
// bgGradient='linear(to-r, #caf5d8, #a8e6cf)'
boxShadow={"md"}
> <Loader01 /></Box>
>
{" "}
<Loader01 />
</Box>
);
};

23
src/Pages/Investor_Management/InvestorDetails/InvestorDetails.jsx
View File

@@ -181,8 +181,8 @@ const InvestorDetails = () => {
),
"Investor Type": (
<Box w={"auto"} isTruncated={true}>
<Text as={"span"} color={"purple"}>
<Badge colorScheme="purple" variant={'solid'} fontWeight={"500"} px={2} py={0.5}>
<Text as={"span"} >
<Badge colorScheme="green" variant={'outline'} fontWeight={"700"} px={2} py={0.5}>
{item?.investor_type?.investorTypeName}
</Badge>
</Text>
@@ -191,29 +191,30 @@ const InvestorDetails = () => {
Status: (
<Box w={"auto"} isTruncated={true}>
<Badge
fontWeight={"500"}
// textTransform={"none"}
fontWeight={"700"}
textTransform={"none"}
colorScheme={item.ioStatus ? "red" : "green"}
px={2}
py={0.5}
variant={'solid'}
>
{item.ioStatus ? "Ban" : "Unban"}
</Badge>
</Box>
),
"KYC Status": (
<Box w={"auto"} isTruncated={true}>
<Badge
fontWeight={"500"}
// textTransform={"none"}
colorScheme={item.kycStatus ? "blue" : "red"}
<Box w={"auto"} display={'flex'} alignItems={'center'} isTruncated={true}>
<Text
as={'span'}
fontWeight={"700"}
textTransform={"none"}
color={item.kycStatus ? "blue.500" : "red.500"}
px={2}
py={0.5}
variant={'solid'}
>
{item.KYCStatus ? "Completed" : "Not complete"}
</Badge>
</Text>
</Box>
),
Action: (

4
src/Pages/Master/ExchangeRate/EditExchangeRate.jsx
View File

@@ -158,12 +158,12 @@ const EditExchangeRate = ({ id, setIsLoading }) => {
</Box>
</Box>
<FormControl mb={4}>
{/* <FormControl mb={4}>
<FormLabel fontSize={"sm"}>Last effective date</FormLabel>
<Text color={'gray.500'} fontSize={"sm"}>
{formatDate(foundObject?.effectiveFrom)}
</Text>
</FormControl>
</FormControl> */}
<FormControl mb={4}>
<FormLabel fontSize={"sm"}>Effective from</FormLabel>
<Text fontSize={"sm"}>

16
src/Services/Key.merits.service.js
View File

@@ -16,11 +16,27 @@ export const keyMerits = createApi({
providesTags: ["getKeyMerits"],
}),
setDisplayOrder: builder.mutation({
query: ({ data }) => ({
url: `/io/admin/key-merits/resetDisplayOrder`,
method: "PATCH",
body: data,
}),
invalidatesTags: ["getIOById"],
}),
}),
});
// Export hooks for usage in functional components
export const {
useGetKeyMeritsQuery,
useSetDisplayOrderMutation
} =
keyMerits;

119
src/Services/io.service.js
View File

@@ -50,7 +50,7 @@ export const ioService = createApi({
method: "PATCH",
body: data,
}),
invalidatesTags: ["getIOById", "getIO","prePopulate"],
invalidatesTags: ["getIOById", "getIO", "prePopulate"],
}),
// =====[Key Merits]
@@ -125,9 +125,6 @@ export const ioService = createApi({
providesTags: ["getArtifactsVideo"],
}),
// =====[createImageArtifacts]
createImageArtifacts: builder.mutation({
query: ({ data, id }) => ({
@@ -139,9 +136,6 @@ export const ioService = createApi({
invalidatesTags: ["getIOById"],
}),
updateImageArtifacts: builder.mutation({
query: ({ data, id }) => ({
url: `/io/admin/artifact/image/byId/${id}`,
@@ -151,9 +145,6 @@ export const ioService = createApi({
invalidatesTags: ["getIOById"],
}),
// =====[createVideoArtifacts]
createVideoArtifacts: builder.mutation({
query: ({ data, id }) => ({
@@ -190,14 +181,6 @@ export const ioService = createApi({
invalidatesTags: ["getIOById"],
}),
setDisplayOrder: builder.mutation({
query: ({ data }) => ({
url: `/io/artifact/artifactImage/resetDisplayOrder/`,
method: "PATCH",
body: data,
}),
invalidatesTags: ["getIOById"],
}),
updateStatusIo: builder.mutation({
query: ({ data, id }) => ({
@@ -205,7 +188,7 @@ export const ioService = createApi({
method: "POST",
body: data,
}),
invalidatesTags: ["getIOById", 'getIO'],
invalidatesTags: ["getIOById", "getIO"],
}),
createIoCash: builder.mutation({
@@ -218,7 +201,6 @@ export const ioService = createApi({
invalidatesTags: ["getIOById"],
}),
createIoNav: builder.mutation({
query: ({ data, id }) => ({
url: `/io/admin/transaction/${id}/io-nav/`,
@@ -229,30 +211,95 @@ export const ioService = createApi({
invalidatesTags: ["getIOById"],
}),
// =====[ Amount Investment ] ======
amountIvestment : builder.mutation({
amountIvestment: builder.mutation({
query: ({ data, id }) => ({
url: `/io/admin/amount-invested/${id}`,
url: `/io/admin/transaction/${id}/amount-invested`,
method: "POST",
body: data,
}),
invalidatesTags: ["getIOById"],
}),
// ======== [ Distribution Transaction ] ========
getDistributionInvestor : builder.mutation({
query: ({id,data}) => ({
getDistributionInvestor: builder.mutation({
query: ({ id, data }) => ({
url: `/io/admin/transaction/${id}/calculate-distribution-amt`,
method: "POST",
body: data,
}),
invalidatesTags: ["getIOById"],
}),
getDistributedToInvestor: builder.mutation({
query: ({ id, data }) => ({
url: `/io/admin/transaction/${id}/distributed-to-investor`,
method: "POST",
body: data,
}),
invalidatesTags: ["getIOById"],
}),
updateExitToInvestor: builder.mutation({
query: ({ id, data }) => ({
url: `/io/admin/transaction/${id}/exit`,
method: "POST",
body: data,
}),
invalidatesTags: ["getIOById"],
}),
// ==============[ Displaye Orders ]===============
setDisplayOrder: builder.mutation({
query: ({ data }) => ({
url: `/io/admin/key-merits/resetDisplayOrder`,
method: "PATCH",
body: data,
}),
invalidatesTags: ["getIOById"],
}),
setDisplayOrderIODocuments: builder.mutation({
query: ({ data }) => ({
url: `/io/admin/document/resetDisplayOrder`,
method: "PATCH",
body: data,
}),
invalidatesTags: ["getIOById"],
}),
setDisplayOrderIOArtifactsImage: builder.mutation({
query: ({ data }) => ({
url: `/io/admin/artifact/image/resetDisplayOrder`,
method: "PATCH",
body: data,
}),
invalidatesTags: ["getIOById"],
}),
setDisplayOrderIOArtifactsVideo: builder.mutation({
query: ({ data }) => ({
url: `/io/admin/artifact/video/resetDisplayOrder`,
method: "PATCH",
body: data,
}),
invalidatesTags: ["getIOById"],
}),
}),
});
@@ -283,19 +330,25 @@ export const {
useCreateVideoArtifactsMutation,
useDeleteVideoArtifactsMutation,
useDeleteImageArtifactsMutation,
useSetDisplayOrderMutation,
useSetDisplayOrderMutation,
useSetDisplayOrderIODocumentsMutation,
useSetDisplayOrderIOArtifactsImageMutation,
useSetDisplayOrderIOArtifactsVideoMutation,
useCreateIoCashMutation,
useCreateIoNavMutation,
useUpdateStatusIoMutation,
useAmountIvestmentMutation,
useGetDistributionInvestorMutation,
useGetDistributedToInvestorMutation,
useUpdateExitToInvestorMutation,
} = ioService;