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

transation modal

Browse Source
This commit is contained in:
YasinShaikh123
2024-07-30 13:30:34 +05:30
parent dd4119e019
commit 125c5233ff
10 changed files with 605 additions and 202 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/Components/DataTable/DataTable.jsx
View File

@@ -10,6 +10,7 @@ import {
Skeleton,
TableCaption,
Box,
Text,
} from "@chakra-ui/react";
import { DragDropContext, Droppable, Draggable } from "react-beautiful-dnd";
import EmptySearchList from "../EmptySearchList";
@@ -28,7 +29,8 @@ const DataTable = ({
setMouseEntered,
setMouseEnteredId,
caption,
isDraggable
isDraggable,
capTitle
}) => {
const navigate = useNavigate();
const { slideFromRight } = useContext(GlobalStateContext);
@@ -61,6 +63,8 @@ const DataTable = ({
<DragDropContext onDragEnd={handleDragEnd}>
<Droppable droppableId="table">
{(provided) => (
<>
{/* */}
<Table size="sm" {...provided.droppableProps} ref={provided.innerRef}>
<TableCaption p={0}>{caption}</TableCaption>
<Thead backgroundColor="gray.50">
@@ -143,6 +147,11 @@ const DataTable = ({
{provided.placeholder}
</Tbody>
</Table>
<Box>
<Text>{capTitle}</Text>
<Box mb={2}>{caption}</Box>
</Box>
</>
)}
</Droppable>
</DragDropContext>

319
src/Pages/IO_Management/ViewIO/HeaderModal/Cancle.jsx
View File

@@ -1,63 +1,266 @@
import {
Box,
Button,
FormControl,
FormLabel,
Input,
Modal,
ModalBody,
ModalCloseButton,
ModalContent,
ModalFooter,
ModalHeader,
ModalOverlay,
Text,
Textarea,
} from "@chakra-ui/react";
const Cancle = ({ isOpen, onClose }) => {
Box,
Button,
FormControl,
FormLabel,
HStack,
Input,
Modal,
ModalBody,
ModalCloseButton,
ModalContent,
ModalFooter,
ModalHeader,
ModalOverlay,
Switch,
Table,
Tbody,
Text,
Textarea,
Th,
Tr,
} from "@chakra-ui/react";
import DataTable from "../../../../Components/DataTable/DataTable";
import { useState } from "react";
import { AddIcon } from "@chakra-ui/icons";
const Cancle = ({ isOpen, onClose }) => {
// ====================================================[Table Setup]================================================================
const tableHeadRow = [
"Sr No.",
"Client Id",
"First name",
"Last Name",
"Invested Amount",
"Distribution %",
"Exit Amount",
];
const filteredData = [
{
id: 1,
},
{
id: 1,
},
{
id: 1,
},
{
id: 1,
},
{
id: 1,
},
{
id: 1,
},
];
const [extractedArray, setExtractedArray] = useState(
filteredData?.map((item, index) => ({
id: item?.id,
"Sr No.": (
<Box
w={9}
display={"flex"}
alignItems={"center"}
isTruncated={true}
h={25}
>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
{index + 1}
</Text>
</Box>
),
"Client Id": (
<Box w={100} isTruncated={true}>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
BH0000000
</Text>
</Box>
),
"First name": (
<Box minW={24} isTruncated={true}>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
Faisal
</Text>
</Box>
),
"Last Name": (
<Box minW={24} isTruncated={true}>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
Aljalahma
</Text>
</Box>
),
"Invested Amount": (
<Box minW={24} isTruncated={true}>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
$100,000
</Text>
</Box>
),
"Distribution %": (
<Box minW={19} isTruncated={true}>
<Text
textAlign={"right"}
as={"span"}
color={"teal.900"}
fontWeight={"500"}
>
26.0 %
</Text>
</Box>
),
"Exit Amount": (
<Box minW={24} isTruncated={true}>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
$100,000
</Text>
</Box>
),
}))
);
const Total = () => {
return (
<Modal isCentered isOpen={isOpen} onClose={onClose}>
<ModalOverlay />
<ModalContent>
<ModalHeader fontSize={'md'}>Cancel</ModalHeader>
<ModalCloseButton />
<ModalBody>
<FormControl mb={"15px"} >
<FormLabel as={"label"} fontSize={"sm"} fontWeight={500}>Comment</FormLabel>
<Textarea
size="sm"
rounded={'sm'}
textAlign={'start'}
rows={3}
focusBorderColor="forestGreen.300"
fontSize={"sm"} placeholder="Enter comments here..." />
</FormControl>
</ModalBody>
<ModalFooter>
<Button
bg={"hsla(139, 100%, 14%, 1)"}
mr={3}
color={"#fff"}
_hover={{
bg: "hsl(139deg 98.99% 26.59%)",
}}
size={'sm'}
rounded={"sm"}
<Table size="sm">
<Tbody backgroundColor="gray.50">
<Tr>
<Th
textAlign={"left"}
p={3}
width="90px"
color={"#004118"}
whiteSpace="normal"
wordBreak="normal"
overflowWrap="normal"
>
Save
</Button>
<Button
size={'sm'}
rounded={"sm"} mr={3} onClick={onClose}>
Close
</Button>
</ModalFooter>
</ModalContent>
</Modal>
Total
</Th>
<Th
textAlign={"center"}
p={3}
width="100px"
color={"#004118"}
whiteSpace="normal"
wordBreak="normal"
overflowWrap="normal"
>
{" "}
</Th>
<Th
textAlign={"center"}
p={3}
width="90px"
color={"#004118"}
whiteSpace="normal"
wordBreak="normal"
overflowWrap="normal"
>
{" "}
</Th>
<Th
textAlign={"center"}
p={3}
width="90px"
color={"#004118"}
whiteSpace="normal"
wordBreak="normal"
overflowWrap="normal"
>
{" "}
</Th>
<Th
textAlign={"left"}
p={3}
width="100px"
color={"#004118"}
whiteSpace="normal"
wordBreak="normal"
overflowWrap="normal"
>
$1,000,000
</Th>
<Th
textAlign={"left"}
p={3}
width="90px"
color={"#004118"}
whiteSpace="normal"
wordBreak="normal"
overflowWrap="normal"
>
100.0%
</Th>
<Th
textAlign={"center"}
p={3}
width="100px"
color={"#004118"}
whiteSpace="normal"
wordBreak="normal"
overflowWrap="normal"
>
$1,229,750
</Th>
</Tr>
</Tbody>
</Table>
);
};
export default Cancle;
return (
<Modal size={"xl"} isOpen={isOpen} onClose={onClose}>
<ModalOverlay />
<ModalContent maxW={1000}>
<ModalHeader fontSize={"md"}>Cancel Transaction</ModalHeader>
<ModalCloseButton />
<ModalBody>
<Text as="label" mb='5px' fontSize='sm' fontWeight={500}>Enter Cancellation Amount</Text>
<HStack mb={4}>
<Input focusBorderColor="forestGreen.400" placeholder="$00.00" size={"sm"} className="col" />
<Button
size={"sm"}
rounded={"sm"}
colorScheme="forestGreen"
>
Calculate
</Button>
</HStack>
<DataTable
emptyMessage={`We don't have any Sponers `}
tableHeadRow={tableHeadRow}
data={extractedArray}
setData={setExtractedArray}
caption={<Total />}
// isLoading={isLoading}
/>
</ModalBody>
<ModalFooter pt={0}>
<Button
bg={"hsla(139, 100%, 14%, 1)"}
mr={3}
color={"#fff"}
_hover={{
bg: "hsl(139deg 98.99% 26.59%)",
}}
size={'sm'}
rounded={"sm"}
>
Save
</Button>
<Button
size={'sm'}
rounded={"sm"} mr={3} onClick={onClose}>
Close
</Button>
</ModalFooter>
</ModalContent>
</Modal>
);
};
export default Cancle;

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

@@ -25,7 +25,6 @@ import { useState } from "react";
import { AddIcon } from "@chakra-ui/icons";
const DistributionInvestor = ({ isOpen, onClose }) => {
// ====================================================[Table Setup]================================================================
const tableHeadRow = [
"Sr No.",
@@ -49,68 +48,80 @@ const DistributionInvestor = ({ isOpen, onClose }) => {
},
{
id: 1,
},]
},
];
const [extractedArray, setExtractedArray] = useState(
filteredData?.map((item, index) => ({
id: item?.id,
"Sr No.":
<Box w={9} display={'flex'} alignItems={'center'} isTruncated={true} h={25}>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
{index + 1}
</Text>
</Box>,
"Sr No.": (
<Box
w={9}
display={"flex"}
alignItems={"center"}
isTruncated={true}
h={25}
>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
{index + 1}
</Text>
</Box>
),
"Client Id": (
<Box w={100} isTruncated={true}>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
BH00000001
BH00000001
</Text>
</Box>
),
"First name": (
<Box minW={24} isTruncated={true}>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
Faisal
Faisal
</Text>
</Box>
),
"Last Name": (
<Box minW={24} isTruncated={true}>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
Aljalahma
</Text>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
Aljalahma
</Text>
</Box>
),
"Amount": (
Amount: (
<Box minW={24} isTruncated={true}>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
$100,000 /-
</Text>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
$100,000 /-
</Text>
</Box>
),
"%": (
<Box minW={19} isTruncated={true}>
<Text textAlign={'right'} as={"span"} color={"teal.900"} fontWeight={"500"}>
26.0 %
</Text>
<Text
textAlign={"right"}
as={"span"}
color={"teal.900"}
fontWeight={"500"}
>
26.0 %
</Text>
</Box>
),
"($)": (
<Box minW={24} isTruncated={true}>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
$100,000 /-
</Text>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
$100,000 /-
</Text>
</Box>
),
}))
);
const Total = () => {
return (
<Table size="sm">
<Tbody backgroundColor="gray.50">
<Tr >
<Tr>
<Th
textAlign={"left"}
p={3}
@@ -175,7 +186,7 @@ const DistributionInvestor = ({ isOpen, onClose }) => {
wordBreak="normal"
overflowWrap="normal"
>
{" "}
100.0%
</Th>
<Th
textAlign={"center"}
@@ -186,7 +197,6 @@ const DistributionInvestor = ({ isOpen, onClose }) => {
wordBreak="normal"
overflowWrap="normal"
>
$100230
</Th>
</Tr>
@@ -195,35 +205,37 @@ const DistributionInvestor = ({ isOpen, onClose }) => {
);
};
return (
<Modal size={'xl'} isOpen={isOpen} onClose={onClose}>
<Modal size={"xl"} isOpen={isOpen} onClose={onClose}>
<ModalOverlay />
<ModalContent maxW={1000} >
<ModalHeader fontSize={"md"}>Distribution To investors</ModalHeader>
<ModalContent maxW={1000}>
<ModalHeader fontSize={"md"}>Distribution To Investor Transaction</ModalHeader>
<ModalCloseButton />
<ModalBody >
<ModalBody>
<Text as="label" mb='5px' fontSize='sm' fontWeight={500}>Amount to Distribute</Text>
<HStack mb={4}>
<Input placeholder="$00.00" size={"sm"} className="col" />
{/* <Input placeholder="$00.00" size={"sm"} className="col" /> */}
<Button
// leftIcon={<AddIcon />}
size={"sm"}
rounded={"sm"}
colorScheme="forestGreen"
>
Calculate
</Button>
</HStack>
<HStack mb={4} >
<Input placeholder="$00.00" size={'sm'} className="col" />
<Input placeholder="$00.00" size={'sm'} className="col" />
<Button leftIcon={<AddIcon />} size={'sm'} rounded={'sm'} colorScheme="forestGreen">Add</Button>
</HStack>
<DataTable
emptyMessage={`We don't have any Sponers `}
tableHeadRow={tableHeadRow}
data={extractedArray}
setData={setExtractedArray}
caption={<Total/>}
// isLoading={isLoading}
/>
<DataTable
emptyMessage={`We don't have any Sponers `}
tableHeadRow={tableHeadRow}
data={extractedArray}
setData={setExtractedArray}
caption={<Total />}
// isLoading={isLoading}
/>
</ModalBody>
{/* <ModalFooter>
<ModalFooter pt={0}>
<Button
bg={"hsla(139, 100%, 14%, 1)"}
mr={3}
@@ -241,10 +253,7 @@ const DistributionInvestor = ({ isOpen, onClose }) => {
rounded={"sm"} mr={3} onClick={onClose}>
Close
</Button>
</ModalFooter> */}
</ModalFooter>
</ModalContent>
</Modal>
);

2
src/Pages/IO_Management/ViewIO/HeaderModal/DistributionSponsor.jsx
View File

@@ -20,7 +20,7 @@ const DistributionSponsor = ({ isOpen, onClose }) => {
<Modal isOpen={isOpen} onClose={onClose}>
<ModalOverlay />
<ModalContent>
<ModalHeader fontSize={'md'}>Distribution from Sponsors</ModalHeader>
<ModalHeader fontSize={'md'}>Distribution from Sponsor Transaction</ModalHeader>
<ModalCloseButton />
<ModalBody>
<FormControl mb={"15px"}>

342
src/Pages/IO_Management/ViewIO/HeaderModal/Exit.jsx
View File

@@ -1,86 +1,266 @@
import {
Box,
Button,
FormControl,
FormLabel,
Input,
Modal,
ModalBody,
ModalCloseButton,
ModalContent,
ModalFooter,
ModalHeader,
ModalOverlay,
Text,
Textarea,
} from "@chakra-ui/react";
const Exit = ({ isOpen, onClose }) => {
Box,
Button,
FormControl,
FormLabel,
HStack,
Input,
Modal,
ModalBody,
ModalCloseButton,
ModalContent,
ModalFooter,
ModalHeader,
ModalOverlay,
Switch,
Table,
Tbody,
Text,
Textarea,
Th,
Tr,
} from "@chakra-ui/react";
import DataTable from "../../../../Components/DataTable/DataTable";
import { useState } from "react";
import { AddIcon } from "@chakra-ui/icons";
const Exit = ({ isOpen, onClose }) => {
// ====================================================[Table Setup]================================================================
const tableHeadRow = [
"Sr No.",
"Client Id",
"First name",
"Last Name",
"Invested Amount",
"Distribution %",
"Exit Amount",
];
const filteredData = [
{
id: 1,
},
{
id: 1,
},
{
id: 1,
},
{
id: 1,
},
{
id: 1,
},
{
id: 1,
},
];
const [extractedArray, setExtractedArray] = useState(
filteredData?.map((item, index) => ({
id: item?.id,
"Sr No.": (
<Box
w={9}
display={"flex"}
alignItems={"center"}
isTruncated={true}
h={25}
>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
{index + 1}
</Text>
</Box>
),
"Client Id": (
<Box w={100} isTruncated={true}>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
BH0000000
</Text>
</Box>
),
"First name": (
<Box minW={24} isTruncated={true}>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
Faisal
</Text>
</Box>
),
"Last Name": (
<Box minW={24} isTruncated={true}>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
Aljalahma
</Text>
</Box>
),
"Invested Amount": (
<Box minW={24} isTruncated={true}>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
$100,000
</Text>
</Box>
),
"Distribution %": (
<Box minW={19} isTruncated={true}>
<Text
textAlign={"right"}
as={"span"}
color={"teal.900"}
fontWeight={"500"}
>
26.0 %
</Text>
</Box>
),
"Exit Amount": (
<Box minW={24} isTruncated={true}>
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
$100,000
</Text>
</Box>
),
}))
);
const Total = () => {
return (
<Modal isOpen={isOpen} onClose={onClose}>
<ModalOverlay />
<ModalContent>
<ModalHeader fontSize={'md'}>Amount Invested</ModalHeader>
<ModalCloseButton />
<ModalBody>
<FormControl mb={"15px"}>
<FormLabel as={"label"} fontSize={"sm"} fontWeight={500}>
Date
</FormLabel>
<Input
placeholder="Select Date"
size="sm"
rounded={'sm'}
fontSize={"sm"}
focusBorderColor="forestGreen.300"
type="date"
/>
</FormControl>
<FormControl mb={"15px"} >
<FormLabel as={"label"} fontSize={"sm"} fontWeight={500}>IO NAV</FormLabel>
<Input
size="sm"
rounded={'sm'}
textAlign={'end'}
focusBorderColor="forestGreen.300"
fontSize={"sm"} placeholder="$00.00" />
</FormControl>
<FormControl mb={"15px"} >
<FormLabel as={"label"} fontSize={"sm"} fontWeight={500}>Distribution</FormLabel>
<Input
size="sm"
rounded={'sm'}
textAlign={'end'}
focusBorderColor="forestGreen.300"
fontSize={"sm"} placeholder="$00.00" />
</FormControl>
</ModalBody>
<ModalFooter>
<Button
bg={"hsla(139, 100%, 14%, 1)"}
mr={3}
color={"#fff"}
_hover={{
bg: "hsl(139deg 98.99% 26.59%)",
}}
size={'sm'}
rounded={"sm"}
<Table size="sm">
<Tbody backgroundColor="gray.50">
<Tr>
<Th
textAlign={"left"}
p={3}
width="90px"
color={"#004118"}
whiteSpace="normal"
wordBreak="normal"
overflowWrap="normal"
>
Save
</Button>
<Button
size={'sm'}
rounded={"sm"} mr={3} onClick={onClose}>
Close
</Button>
</ModalFooter>
</ModalContent>
</Modal>
Total
</Th>
<Th
textAlign={"center"}
p={3}
width="100px"
color={"#004118"}
whiteSpace="normal"
wordBreak="normal"
overflowWrap="normal"
>
{" "}
</Th>
<Th
textAlign={"center"}
p={3}
width="90px"
color={"#004118"}
whiteSpace="normal"
wordBreak="normal"
overflowWrap="normal"
>
{" "}
</Th>
<Th
textAlign={"center"}
p={3}
width="90px"
color={"#004118"}
whiteSpace="normal"
wordBreak="normal"
overflowWrap="normal"
>
{" "}
</Th>
<Th
textAlign={"left"}
p={3}
width="100px"
color={"#004118"}
whiteSpace="normal"
wordBreak="normal"
overflowWrap="normal"
>
$1,000,000
</Th>
<Th
textAlign={"left"}
p={3}
width="90px"
color={"#004118"}
whiteSpace="normal"
wordBreak="normal"
overflowWrap="normal"
>
100.0%
</Th>
<Th
textAlign={"center"}
p={3}
width="100px"
color={"#004118"}
whiteSpace="normal"
wordBreak="normal"
overflowWrap="normal"
>
$1,229,750
</Th>
</Tr>
</Tbody>
</Table>
);
};
export default Exit;
return (
<Modal size={"xl"} isOpen={isOpen} onClose={onClose}>
<ModalOverlay />
<ModalContent maxW={1000}>
<ModalHeader fontSize={"md"}>Exit Transaction</ModalHeader>
<ModalCloseButton />
<ModalBody>
<Text as="label" mb='5px' fontSize='sm' fontWeight={500}>Enter Exit Amount</Text>
<HStack mb={4}>
<Input focusBorderColor="forestGreen.400" placeholder="$00.00" size={"sm"} className="col" />
<Button
size={"sm"}
rounded={"sm"}
colorScheme="forestGreen"
>
Calculate
</Button>
</HStack>
<DataTable
emptyMessage={`We don't have any Sponers `}
tableHeadRow={tableHeadRow}
data={extractedArray}
setData={setExtractedArray}
caption={<Total />}
// isLoading={isLoading}
/>
</ModalBody>
<ModalFooter pt={0}>
<Button
bg={"hsla(139, 100%, 14%, 1)"}
mr={3}
color={"#fff"}
_hover={{
bg: "hsl(139deg 98.99% 26.59%)",
}}
size={'sm'}
rounded={"sm"}
>
Save
</Button>
<Button
size={'sm'}
rounded={"sm"} mr={3} onClick={onClose}>
Close
</Button>
</ModalFooter>
</ModalContent>
</Modal>
);
};
export default Exit;

2
src/Pages/IO_Management/ViewIO/HeaderModal/FeesExpenses.jsx
View File

@@ -21,7 +21,7 @@ const FeesExpenses = ({ isOpen, onClose }) => {
<Modal isOpen={isOpen} onClose={onClose}>
<ModalOverlay />
<ModalContent>
<ModalHeader fontSize={'md'}>Fees & Expenses</ModalHeader>
<ModalHeader fontSize={'md'}>Fees & Expenses Transaction</ModalHeader>
<ModalCloseButton />
<ModalBody>
<FormControl mb={"15px"}>

2
src/Pages/IO_Management/ViewIO/HeaderModal/UpdateIONav.jsx
View File

@@ -20,7 +20,7 @@ const UpdateIONav = ({ isOpen, onClose }) => {
<Modal isOpen={isOpen} onClose={onClose}>
<ModalOverlay />
<ModalContent>
<ModalHeader fontSize={'md'}>Update iO NAV</ModalHeader>
<ModalHeader fontSize={'md'}>Update iO NAV Transaction</ModalHeader>
<ModalCloseButton />
<ModalBody>
<FormControl mb={"15px"}>

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

@@ -94,8 +94,8 @@ const AddSponser = () => {
try {
const formData = {
...form,
// isActive: isSwitchOn,
};
isActive: isSwitchOn,
};
// Remove email field if it's an empty string
if (formData.email === '') {
delete formData.email;
@@ -129,7 +129,7 @@ const AddSponser = () => {
try {
const formData = {
...form,
// isActive: isSwitchOn,
isActive: isSwitchOn,
};
await createSponser(formData).then((response) => {
console.log(response);

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

@@ -42,6 +42,8 @@ const Sponser = () => {
const {data: sponsors,error,isLoading: isSponserLoading,} = useGetSponserMasterQuery({ page: 1, size: 20 });
console.log(sponsors?.data?.rows);
// ========================= [Toggle ToastBox] ==========================
// const handleUpdateStatus = debounce(async (id) => {

2
src/Services/investment.type.service.js
View File

@@ -41,7 +41,7 @@ export const investmentType = createApi({
updateInvestmentType: builder.mutation({
query: ({ data, id }) => ({
url: `/investmentType/admin/${id}`,
url: `/investmentType/admin/${id}`,
method: "PATCH",
body: data,
}),