ViewIOdata and ViewIO page created.
This commit is contained in:
@@ -25,7 +25,7 @@ const GlobalStateProvider = ({ children }) => {
|
||||
{
|
||||
id: 1,
|
||||
sponserName: "John Doe",
|
||||
sponserNameArabic:"الرجاء إدخال القيمة",
|
||||
sponserNameArabic: "الرجاء إدخال القيمة",
|
||||
mobileNo: "1234567890",
|
||||
sponserAddress: "123 Main St, Springfield, USA",
|
||||
accountHolderName: "John Doe",
|
||||
@@ -46,7 +46,7 @@ const GlobalStateProvider = ({ children }) => {
|
||||
{
|
||||
id: 2,
|
||||
sponserName: "Jane Smith",
|
||||
sponserNameArabic:"الرجاء إدخال القيمة",
|
||||
sponserNameArabic: "الرجاء إدخال القيمة",
|
||||
mobileNo: "9876543210",
|
||||
sponserAddress: "456 Oak St, Metropolis, USA",
|
||||
accountHolderName: "Jane Smith",
|
||||
@@ -67,7 +67,7 @@ const GlobalStateProvider = ({ children }) => {
|
||||
{
|
||||
id: 3,
|
||||
sponserName: "Alice Johnson",
|
||||
sponserNameArabic:"الرجاء إدخال القيمة",
|
||||
sponserNameArabic: "الرجاء إدخال القيمة",
|
||||
mobileNo: "1231231234",
|
||||
sponserAddress: "789 Pine St, Gotham, USA",
|
||||
accountHolderName: "Alice Johnson",
|
||||
@@ -88,7 +88,7 @@ const GlobalStateProvider = ({ children }) => {
|
||||
{
|
||||
id: 4,
|
||||
sponserName: "Bob Brown",
|
||||
sponserNameArabic:"الرجاء إدخال القيمة",
|
||||
sponserNameArabic: "الرجاء إدخال القيمة",
|
||||
mobileNo: "3213214321",
|
||||
sponserAddress: "101 Maple St, Smallville, USA",
|
||||
accountHolderName: "Bob Brown",
|
||||
@@ -109,7 +109,7 @@ const GlobalStateProvider = ({ children }) => {
|
||||
{
|
||||
id: 5,
|
||||
sponserName: "Charlie Davis",
|
||||
sponserNameArabic:"الرجاء إدخال القيمة",
|
||||
sponserNameArabic: "الرجاء إدخال القيمة",
|
||||
mobileNo: "5555555555",
|
||||
sponserAddress: "202 Birch St, Star City, USA",
|
||||
accountHolderName: "Charlie Davis",
|
||||
@@ -130,7 +130,7 @@ const GlobalStateProvider = ({ children }) => {
|
||||
{
|
||||
id: 6,
|
||||
sponserName: "Daniel Evans",
|
||||
sponserNameArabic:"الرجاء إدخال القيمة",
|
||||
sponserNameArabic: "الرجاء إدخال القيمة",
|
||||
mobileNo: "4444444444",
|
||||
sponserAddress: "303 Cedar St, Central City, USA",
|
||||
accountHolderName: "Daniel Evans",
|
||||
@@ -151,7 +151,7 @@ const GlobalStateProvider = ({ children }) => {
|
||||
{
|
||||
id: 7,
|
||||
sponserName: "Ella Fitzgerald",
|
||||
sponserNameArabic:"الرجاء إدخال القيمة",
|
||||
sponserNameArabic: "الرجاء إدخال القيمة",
|
||||
mobileNo: "3333333333",
|
||||
sponserAddress: "404 Elm St, Coast City, USA",
|
||||
accountHolderName: "Ella Fitzgerald",
|
||||
@@ -172,7 +172,7 @@ const GlobalStateProvider = ({ children }) => {
|
||||
{
|
||||
id: 8,
|
||||
sponserName: "Frank Green",
|
||||
sponserNameArabic:"الرجاء إدخال القيمة",
|
||||
sponserNameArabic: "الرجاء إدخال القيمة",
|
||||
mobileNo: "2222222222",
|
||||
sponserAddress: "505 Ash St, Keystone City, USA",
|
||||
accountHolderName: "Frank Green",
|
||||
@@ -193,7 +193,7 @@ const GlobalStateProvider = ({ children }) => {
|
||||
{
|
||||
id: 9,
|
||||
sponserName: "Grace Hall",
|
||||
sponserNameArabic:"الرجاء إدخال القيمة",
|
||||
sponserNameArabic: "الرجاء إدخال القيمة",
|
||||
mobileNo: "1111111111",
|
||||
sponserAddress: "606 Willow St, Hub City, USA",
|
||||
accountHolderName: "Grace Hall",
|
||||
@@ -214,7 +214,7 @@ const GlobalStateProvider = ({ children }) => {
|
||||
{
|
||||
id: 10,
|
||||
sponserName: "Henry Ingram",
|
||||
sponserNameArabic:"الرجاء إدخال القيمة",
|
||||
sponserNameArabic: "الرجاء إدخال القيمة",
|
||||
mobileNo: "6666666666",
|
||||
sponserAddress: "707 Spruce St, Fawcett City, USA",
|
||||
accountHolderName: "Henry Ingram",
|
||||
@@ -235,7 +235,7 @@ const GlobalStateProvider = ({ children }) => {
|
||||
{
|
||||
id: 11,
|
||||
sponserName: "Grace Hall",
|
||||
sponserNameArabic:"الرجاء إدخال القيمة",
|
||||
sponserNameArabic: "الرجاء إدخال القيمة",
|
||||
mobileNo: "1111111111",
|
||||
sponserAddress: "606 Willow St, Hub City, USA",
|
||||
accountHolderName: "Grace Hall",
|
||||
@@ -256,7 +256,7 @@ const GlobalStateProvider = ({ children }) => {
|
||||
{
|
||||
id: 12,
|
||||
sponserName: "Henry Ingram",
|
||||
sponserNameArabic:"الرجاء إدخال القيمة",
|
||||
sponserNameArabic: "الرجاء إدخال القيمة",
|
||||
mobileNo: "6666666666",
|
||||
sponserAddress: "707 Spruce St, Fawcett City, USA",
|
||||
accountHolderName: "Henry Ingram",
|
||||
@@ -275,7 +275,7 @@ const GlobalStateProvider = ({ children }) => {
|
||||
createdAt: "6",
|
||||
},
|
||||
]);
|
||||
|
||||
|
||||
const [investmentType, setInvestmentType] = useState([
|
||||
// {
|
||||
// id: 1,
|
||||
@@ -340,7 +340,6 @@ const GlobalStateProvider = ({ children }) => {
|
||||
status: true,
|
||||
},
|
||||
]);
|
||||
|
||||
|
||||
const [investment, setInvestment] = useState([
|
||||
// {
|
||||
@@ -1211,6 +1210,36 @@ const GlobalStateProvider = ({ children }) => {
|
||||
},
|
||||
]);
|
||||
|
||||
const [viewIO, setViewIO] = useState([
|
||||
{
|
||||
id: 1,
|
||||
DealID: "UWE3424992",
|
||||
DealName: "K-Prime",
|
||||
SponsorName: "KKR",
|
||||
IOstatus: "Open",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
DealID: "UWE3424992",
|
||||
DealName: "K-Prime",
|
||||
SponsorName: "KKR",
|
||||
IOstatus: "Pending",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
DealID: "UWE3424992",
|
||||
DealName: "K-Prime",
|
||||
SponsorName: "KKR",
|
||||
IOstatus: "Close",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
DealID: "UWE3424992",
|
||||
DealName: "K-Prime",
|
||||
SponsorName: "KKR",
|
||||
IOstatus: "Open",
|
||||
},
|
||||
]);
|
||||
|
||||
return (
|
||||
<GlobalStateContext.Provider
|
||||
@@ -1249,7 +1278,9 @@ const GlobalStateProvider = ({ children }) => {
|
||||
deleteHistory,
|
||||
setDeleteHistory,
|
||||
deleteRequest,
|
||||
setDeleteRequest
|
||||
setDeleteRequest,
|
||||
viewIO,
|
||||
setViewIO,
|
||||
}}
|
||||
>
|
||||
{children}
|
||||
|
||||
296
src/Pages/IO_Management/ViewIOTable.jsx
Normal file
296
src/Pages/IO_Management/ViewIOTable.jsx
Normal file
@@ -0,0 +1,296 @@
|
||||
import {
|
||||
Avatar,
|
||||
Badge,
|
||||
Box,
|
||||
Button,
|
||||
HStack,
|
||||
Input,
|
||||
Menu,
|
||||
MenuButton,
|
||||
MenuItem,
|
||||
MenuList,
|
||||
Portal,
|
||||
Select,
|
||||
Switch,
|
||||
Tag,
|
||||
Text,
|
||||
Tooltip,
|
||||
useToast,
|
||||
} from "@chakra-ui/react";
|
||||
import React, { useContext, useEffect, useState } from "react";
|
||||
import { OPACITY_ON_LOAD } from "../../Layout/animations";
|
||||
import DataTable from "../../Components/DataTable/DataTable";
|
||||
import { HiDotsVertical } from "react-icons/hi";
|
||||
import { Link, Link as RouterLink, useNavigate } from "react-router-dom";
|
||||
import {
|
||||
AddIcon,
|
||||
CheckIcon,
|
||||
CloseIcon,
|
||||
DeleteIcon,
|
||||
EditIcon,
|
||||
EmailIcon,
|
||||
ViewIcon,
|
||||
} from "@chakra-ui/icons";
|
||||
import Pagination from "../../Components/Pagination";
|
||||
import GlobalStateContext from "../../Contexts/GlobalStateContext";
|
||||
import CustomAlertDialog from "../../Components/CustomAlertDialog";
|
||||
import ToastBox from "../../Components/ToastBox";
|
||||
// import { debounce } from "./AddIOCharges";
|
||||
|
||||
const formatDate = (date) => new Date(date).toLocaleDateString(); // Simple date formatter
|
||||
|
||||
const ViewIOTable = () => {
|
||||
const navigate = useNavigate();
|
||||
const toast = useToast();
|
||||
const { viewIO, setViewIO, 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("");
|
||||
|
||||
useEffect(() => {
|
||||
// Simulate loading
|
||||
const timer = setTimeout(() => {
|
||||
setIsLoading(false);
|
||||
}, 1500);
|
||||
|
||||
// Cleanup the timer on component unmount
|
||||
return () => clearTimeout(timer);
|
||||
}, []);
|
||||
|
||||
// ====================================================[Table Setup]================================================================
|
||||
const tableHeadRow = [
|
||||
"Sr.no",
|
||||
"Deal ID",
|
||||
"Deal Name",
|
||||
"Sponsor Name",
|
||||
"IO status",
|
||||
"Action",
|
||||
];
|
||||
|
||||
// const handleUpdateStatus = debounce((id) => {
|
||||
// setInvestmentType((prevInvestmentType) =>
|
||||
// prevInvestmentType.map((investmentType) =>
|
||||
// investmentType.id === id
|
||||
// ? { ...investmentType, status: !investmentType.status }
|
||||
// : investmentType
|
||||
// )
|
||||
// );
|
||||
// toast({
|
||||
// render: () => <ToastBox message={"Status changed succesfully.!"} />,
|
||||
// });
|
||||
// }, 300);
|
||||
|
||||
// ====================================================[Table Filter]================================================================
|
||||
const filteredData = viewIO.filter((item) => {
|
||||
// Filter by name (case insensitive)
|
||||
const name = item.DealName;
|
||||
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, index) => ({
|
||||
"Sr.no": (
|
||||
<Text
|
||||
justifyContent={slideFromRight ? "right" : "left"}
|
||||
as={"span"}
|
||||
color={"teal.900"}
|
||||
fontWeight={"500"}
|
||||
className="d-flex align-items-center web-text-small"
|
||||
>
|
||||
{index + 1}
|
||||
</Text>
|
||||
),
|
||||
"Deal ID": (
|
||||
<Text
|
||||
justifyContent={slideFromRight ? "right" : "left"}
|
||||
as={"span"}
|
||||
color={"teal.900"}
|
||||
fontWeight={"500"}
|
||||
className="d-flex align-items-center web-text-small"
|
||||
>
|
||||
{item.DealID}
|
||||
</Text>
|
||||
),
|
||||
"Deal Name": (
|
||||
<Box w={"auto"} isTruncated={true}>
|
||||
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
|
||||
{item.DealName}
|
||||
</Text>
|
||||
</Box>
|
||||
),
|
||||
"Sponsor Name": (
|
||||
<Box w={"auto"} isTruncated={true}>
|
||||
<Text as={"span"} color={"teal.900"} fontWeight={"500"}>
|
||||
{item.SponsorName}
|
||||
</Text>
|
||||
</Box>
|
||||
),
|
||||
"IO status": (
|
||||
<Box w={"auto"} isTruncated={true}>
|
||||
<Badge
|
||||
as={"span"}
|
||||
color={
|
||||
item.IOstatus === "Open"
|
||||
? "#00B69B"
|
||||
: item.IOstatus === "Pending"
|
||||
? "#6226EF"
|
||||
: "#EF3826"
|
||||
}
|
||||
colorScheme={
|
||||
item.IOstatus === "Open"
|
||||
? "green"
|
||||
: item.IOstatus === "Pending"
|
||||
? "purple"
|
||||
: "red"
|
||||
}
|
||||
fontWeight={"500"}
|
||||
padding={"5px 15px"}
|
||||
rounded={"10px"}
|
||||
width={"100px"}
|
||||
marginRight={"25px"}
|
||||
>
|
||||
{item.IOstatus}
|
||||
</Badge>
|
||||
</Box>
|
||||
),
|
||||
|
||||
Action: (
|
||||
<Box display={"flex"} justifyContent={"space-evenly"}>
|
||||
<Tooltip
|
||||
rounded={"sm"}
|
||||
fontSize={"xs"}
|
||||
label="View"
|
||||
bg="#fff"
|
||||
color={"green.500"}
|
||||
placement="top"
|
||||
>
|
||||
<Button
|
||||
_hover={{ color: "green.500" }}
|
||||
// transition={"0.5s all"}
|
||||
onClick={() => {
|
||||
navigate(`/view-io/${item.id}`);
|
||||
}}
|
||||
color="green.300"
|
||||
rounded={"sm"}
|
||||
size={"xs"}
|
||||
>
|
||||
<ViewIcon />
|
||||
</Button>
|
||||
</Tooltip>
|
||||
|
||||
<Tooltip
|
||||
rounded={"sm"}
|
||||
fontSize={"xs"}
|
||||
label="Delete"
|
||||
bg="#fff"
|
||||
color={"red.500"}
|
||||
placement="top"
|
||||
>
|
||||
<Button
|
||||
onClick={() => {
|
||||
setActionId(item?.id);
|
||||
setDeleteAlert(true);
|
||||
}}
|
||||
_hover={{ color: "red.500" }}
|
||||
// transition={"0.5s all"}
|
||||
color="red.300"
|
||||
rounded={"sm"}
|
||||
size={"xs"}
|
||||
>
|
||||
<DeleteIcon />
|
||||
</Button>
|
||||
</Tooltip>
|
||||
</Box>
|
||||
),
|
||||
}));
|
||||
|
||||
const handleDelete = () => {
|
||||
const viewIO = viewIO.filter((viewIO) => viewIO.id !== actionId);
|
||||
|
||||
setTimeout(() => {
|
||||
setViewIO(viewIO);
|
||||
setDeleteAlert(false);
|
||||
setIsLoading(false);
|
||||
}, 100);
|
||||
setIsLoading(true);
|
||||
};
|
||||
|
||||
return (
|
||||
<Box {...OPACITY_ON_LOAD} overflowY={"scroll"} height={"100vh"} pb={38}>
|
||||
<Box bg="white.500">
|
||||
<HStack
|
||||
display={"flex"}
|
||||
justifyContent={"space-between"}
|
||||
ps={1}
|
||||
pe={1}
|
||||
pb={4}
|
||||
pt={4}
|
||||
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 display={"flex"} alignItems={"center"}>
|
||||
<Pagination totalItems={10} />
|
||||
|
||||
{/* <Link to={"/investment-type/add-investment"}>
|
||||
<Button
|
||||
leftIcon={<AddIcon />}
|
||||
colorScheme={"green"}
|
||||
rounded={"sm"}
|
||||
size={"sm"}
|
||||
>
|
||||
Add Investment
|
||||
</Button>
|
||||
</Link> */}
|
||||
</HStack>
|
||||
</HStack>
|
||||
</Box>
|
||||
|
||||
<DataTable
|
||||
emptyMessage={`We don't have any Sponers `}
|
||||
tableHeadRow={tableHeadRow}
|
||||
data={extractedArray}
|
||||
isLoading={isLoading}
|
||||
viewActionId={actionId}
|
||||
setViewActionId={setActionId}
|
||||
// totalPages={10}
|
||||
|
||||
setMouseEnteredId={setMouseEnteredId}
|
||||
setMouseEntered={setMouseEntered}
|
||||
/>
|
||||
|
||||
<CustomAlertDialog
|
||||
onClose={() => setDeleteAlert(false)}
|
||||
isOpen={deleteAlert}
|
||||
message={"Are you sure you want to delete sponers?"}
|
||||
alertHandler={handleDelete}
|
||||
isLoading={isLoading}
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
export default ViewIOTable;
|
||||
63
src/Pages/IO_Management/ViewIOdata.jsx
Normal file
63
src/Pages/IO_Management/ViewIOdata.jsx
Normal file
@@ -0,0 +1,63 @@
|
||||
import { Box } from "@chakra-ui/react";
|
||||
import { useNavigate, useParams } from "react-router-dom";
|
||||
import GlobalStateContext from "../../Contexts/GlobalStateContext";
|
||||
import { useContext, useEffect, useState } from "react";
|
||||
import FormInputView from "../../Components/FormInputView";
|
||||
import { useForm } from "react-hook-form"; // assuming react-hook-form is used
|
||||
import { OPACITY_ON_LOAD } from "../../Layout/animations";
|
||||
import { ArrowBackIcon } from "@chakra-ui/icons";
|
||||
|
||||
const ViewIOdata = () => {
|
||||
const navigate = useNavigate();
|
||||
const params = useParams();
|
||||
const { viewIO } = useContext(GlobalStateContext);
|
||||
const { reset } = useForm(); // assuming react-hook-form
|
||||
|
||||
const id = params?.id;
|
||||
const foundObject = viewIO.find((item) =>
|
||||
console.log(item?.id.toString() == id.toString())
|
||||
);
|
||||
|
||||
if (!foundObject) {
|
||||
return <Box>Loading...</Box>;
|
||||
}
|
||||
|
||||
const formFields = [
|
||||
{
|
||||
label: "Deal ID",
|
||||
value: foundObject.DealID,
|
||||
},
|
||||
{
|
||||
label: "Sponsor name",
|
||||
value: foundObject.SponsorName,
|
||||
},
|
||||
{
|
||||
label: "IO status",
|
||||
value: foundObject.IOstatus,
|
||||
},
|
||||
];
|
||||
|
||||
const groupedFields = formFields.reduce((groups, field) => {
|
||||
const { section } = field;
|
||||
if (!groups[section]) {
|
||||
groups[section] = [];
|
||||
}
|
||||
groups[section].push(field);
|
||||
return groups;
|
||||
}, {});
|
||||
|
||||
return (
|
||||
<Box {...OPACITY_ON_LOAD} overflowY={"scroll"} height={"100vh"} pb={14}>
|
||||
<span
|
||||
onClick={() => navigate(-1)}
|
||||
style={{ fontSize: "15px", cursor: "pointer" }}
|
||||
>
|
||||
<ArrowBackIcon cursor={"pointer"} /> Back
|
||||
</span>
|
||||
<FormInputView groupedFields={groupedFields} />
|
||||
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
export default ViewIOdata;
|
||||
@@ -35,7 +35,7 @@ const formatDateValue = (date) => {
|
||||
return [year, month, day].join("-");
|
||||
};
|
||||
|
||||
const EditExchangeRate = ({ id, setIsLoading }) => {
|
||||
const EditExchangeRate = ({ id, setIsLoading, updateHistory }) => {
|
||||
const btnRef = useRef();
|
||||
const { isOpen, onOpen, onClose } = useDisclosure();
|
||||
const { rateExchange, setRateExchange } = useContext(GlobalStateContext);
|
||||
@@ -57,6 +57,7 @@ const EditExchangeRate = ({ id, setIsLoading }) => {
|
||||
|
||||
const handleSave = () => {
|
||||
setIsLoading(true);
|
||||
const previousRate = foundObject.rate;
|
||||
const updatedExchange = rateExchange.map((item) =>
|
||||
item.id === id
|
||||
? {
|
||||
@@ -69,6 +70,7 @@ const EditExchangeRate = ({ id, setIsLoading }) => {
|
||||
);
|
||||
setTimeout(() => {
|
||||
setRateExchange(updatedExchange);
|
||||
updateHistory(id, previousRate, parseFloat(rate), new Date(effectFrom));
|
||||
setIsLoading(false);
|
||||
setAlert(false);
|
||||
onClose();
|
||||
@@ -78,19 +80,17 @@ const EditExchangeRate = ({ id, setIsLoading }) => {
|
||||
|
||||
return (
|
||||
<>
|
||||
<Button
|
||||
leftIcon={<TbEdit/>}
|
||||
ref={btnRef}
|
||||
onClick={onOpen}
|
||||
// colorScheme="forestGreen"
|
||||
color={"green.500"}
|
||||
size={"xs"}
|
||||
variant={"ghost"}
|
||||
rounded={'md'}
|
||||
ms={"auto"}
|
||||
>
|
||||
Edit
|
||||
</Button>
|
||||
<Button
|
||||
leftIcon={<TbEdit />}
|
||||
ref={btnRef}
|
||||
onClick={onOpen}
|
||||
// colorScheme="forestGreen"
|
||||
color={"green.500"}
|
||||
size={"xs"}
|
||||
variant={"ghost"}
|
||||
>
|
||||
Edit
|
||||
</Button>
|
||||
<Drawer
|
||||
isOpen={isOpen}
|
||||
placement="right"
|
||||
@@ -140,7 +140,7 @@ const EditExchangeRate = ({ id, setIsLoading }) => {
|
||||
</FormControl>
|
||||
|
||||
<FormControl mb={4}>
|
||||
<FormLabel fontSize={"sm"}>Exchange rate</FormLabel>
|
||||
<FormLabel fontSize={"sm"}>Rate</FormLabel>
|
||||
<Input
|
||||
type="number"
|
||||
placeholder="Type rate here..."
|
||||
|
||||
230
src/Pages/Master/ExchangeRate/ExchangeHistroy.jsx
Normal file
230
src/Pages/Master/ExchangeRate/ExchangeHistroy.jsx
Normal file
@@ -0,0 +1,230 @@
|
||||
import {
|
||||
Box,
|
||||
Button,
|
||||
Drawer,
|
||||
DrawerBody,
|
||||
DrawerCloseButton,
|
||||
DrawerContent,
|
||||
DrawerFooter,
|
||||
DrawerHeader,
|
||||
DrawerOverlay,
|
||||
FormControl,
|
||||
FormLabel,
|
||||
Input,
|
||||
Text,
|
||||
useDisclosure,
|
||||
} from "@chakra-ui/react";
|
||||
import React, { useContext, useRef, useState, useEffect } from "react";
|
||||
import GlobalStateContext from "../../../Contexts/GlobalStateContext";
|
||||
import CustomAlertDialog from "../../../Components/CustomAlertDialog";
|
||||
import { MdHistory } from "react-icons/md";
|
||||
|
||||
// Convert date to YYYY-MM-DD format
|
||||
const formatDate = (dateString) => {
|
||||
if (!dateString) return "Invalid Date";
|
||||
let date = new Date(dateString);
|
||||
if (isNaN(date.getTime())) {
|
||||
// Try to handle different formats
|
||||
const parts = dateString.split(/[- :]/);
|
||||
if (parts.length >= 3) {
|
||||
date = new Date(parts[0], parts[1] - 1, parts[2]);
|
||||
}
|
||||
}
|
||||
if (isNaN(date.getTime())) {
|
||||
return "Invalid Date";
|
||||
}
|
||||
const options = {
|
||||
weekday: "short",
|
||||
year: "numeric",
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
};
|
||||
return date.toLocaleDateString("en-US", options);
|
||||
};
|
||||
|
||||
const ExchangeHistory = ({ id, setIsLoading, history }) => {
|
||||
const btnRef = useRef();
|
||||
const { isOpen, onOpen, onClose } = useDisclosure();
|
||||
const { rateExchange, setRateExchange } = useContext(GlobalStateContext);
|
||||
|
||||
const foundObject = rateExchange.find((item) => item.id === id);
|
||||
|
||||
const [effectFrom, setEffectFrom] = useState("");
|
||||
const [effectTill, setEffectTill] = useState("");
|
||||
const [newRate, setNewRate] = useState("");
|
||||
const [alert, setAlert] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (foundObject) {
|
||||
setEffectFrom(formatDate(foundObject.effectFrom));
|
||||
// setEffectTill(formatDate(foundObject.effectTill));
|
||||
setNewRate(foundObject.rate);
|
||||
}
|
||||
}, [foundObject]);
|
||||
|
||||
// const handleSave = () => {
|
||||
// setIsLoading(true);
|
||||
// const updatedExchange = rateExchange.map((item) =>
|
||||
// item.id === id
|
||||
// ? {
|
||||
// ...item,
|
||||
// effectFrom: new Date(effectFrom),
|
||||
// rate: parseFloat(newRate),
|
||||
// }
|
||||
// : item
|
||||
// );
|
||||
// setTimeout(() => {
|
||||
// setRateExchange(updatedExchange);
|
||||
// setIsLoading(false);
|
||||
// setAlert(false);
|
||||
// onClose();
|
||||
// }, 100);
|
||||
// setIsLoading(true);
|
||||
// };
|
||||
|
||||
return (
|
||||
<>
|
||||
<Button
|
||||
leftIcon={<MdHistory />}
|
||||
ref={btnRef}
|
||||
onClick={onOpen}
|
||||
color={"green.500"}
|
||||
size={"xs"}
|
||||
variant={"ghost"}
|
||||
rounded={"md"}
|
||||
ms={"auto"}
|
||||
>
|
||||
History
|
||||
</Button>
|
||||
<Drawer
|
||||
isOpen={isOpen}
|
||||
placement="right"
|
||||
onClose={onClose}
|
||||
finalFocusRef={btnRef}
|
||||
>
|
||||
<DrawerOverlay />
|
||||
<DrawerContent>
|
||||
<DrawerCloseButton />
|
||||
<DrawerHeader fontSize={"md"}>Exchange History</DrawerHeader>
|
||||
|
||||
<DrawerBody>
|
||||
{/* <FormControl mb={4}>
|
||||
<FormLabel fontSize={"sm"}>Previous exchange rate</FormLabel>
|
||||
<Text fontSize={"sm"}>{foundObject?.rate}</Text>
|
||||
</FormControl> */}
|
||||
|
||||
<Box mt={4}>
|
||||
{history &&
|
||||
history.map((entry, index) => {
|
||||
console.log("entry:", entry); // Log the date for debugging
|
||||
return (
|
||||
<>
|
||||
{id === entry.id ? (
|
||||
<Box key={index}>
|
||||
<Box
|
||||
mt={2}
|
||||
display={"flex"}
|
||||
alignItems={"end"}
|
||||
justifyContent={"space-between"}
|
||||
>
|
||||
<Box>
|
||||
<Text fontSize={"sm"} marginBottom={"0px"}>
|
||||
<strong>Previous Rate:</strong>
|
||||
</Text>
|
||||
<Text fontSize={"sm"}>
|
||||
{entry.previousRate}{" "}
|
||||
<Text as={"span"} fontSize={"sm"}>
|
||||
{foundObject?.toCurr}
|
||||
</Text>
|
||||
</Text>
|
||||
</Box>
|
||||
|
||||
<Box>
|
||||
<Text fontSize={"sm"} marginBottom={"0px"}>
|
||||
<strong>Effect Till:</strong>
|
||||
</Text>
|
||||
<Text fontSize={"sm"}>
|
||||
{formatDate(entry.effectFrom)}
|
||||
</Text>
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
<Box
|
||||
display={"flex"}
|
||||
alignItems={"end"}
|
||||
justifyContent={"space-between"}
|
||||
>
|
||||
<Box>
|
||||
<Text fontSize={"sm"} marginBottom={"0px"}>
|
||||
<strong>New Rate:</strong>
|
||||
</Text>
|
||||
<Text fontSize={"sm"}>
|
||||
{" "}
|
||||
{entry?.newRate}{" "}
|
||||
<Text as={"span"} fontSize={"sm"}>
|
||||
{foundObject?.toCurr}
|
||||
</Text>
|
||||
</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fontSize={"sm"} marginBottom={"0px"}>
|
||||
<strong>Effect From:</strong>
|
||||
</Text>
|
||||
<Text fontSize={"sm"}>
|
||||
{formatDate(entry.effectFrom)}
|
||||
</Text>
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
) : (
|
||||
""
|
||||
)}
|
||||
</>
|
||||
);
|
||||
})}
|
||||
|
||||
{/* <Text fontSize={"sm"} marginBottom={"0px"}>
|
||||
<strong>New Rate:</strong>
|
||||
</Text>
|
||||
<Text fontSize={"sm"}>
|
||||
{" "}
|
||||
{foundObject?.rate} {foundObject?.toCurr}
|
||||
</Text> */}
|
||||
</Box>
|
||||
</DrawerBody>
|
||||
|
||||
<DrawerFooter>
|
||||
<Button
|
||||
variant="outline"
|
||||
colorScheme={"green"}
|
||||
rounded={"sm"}
|
||||
size={"sm"}
|
||||
mr={3}
|
||||
onClick={onClose}
|
||||
>
|
||||
Close
|
||||
</Button>
|
||||
{/*
|
||||
<Button
|
||||
colorScheme={"green"}
|
||||
rounded={"sm"}
|
||||
size={"sm"}
|
||||
onClick={() => setAlert(true)}
|
||||
>
|
||||
Save
|
||||
</Button> */}
|
||||
</DrawerFooter>
|
||||
</DrawerContent>
|
||||
</Drawer>
|
||||
|
||||
<CustomAlertDialog
|
||||
isOpen={alert}
|
||||
onClose={() => setAlert(false)}
|
||||
// alertHandler={handleSave}
|
||||
message={"Are you sure you want to update rates?"}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default ExchangeHistory;
|
||||
@@ -28,6 +28,7 @@ import CustomAlertDialog from "../../../Components/CustomAlertDialog";
|
||||
import ToastBox from "../../../Components/ToastBox";
|
||||
import { formatDate } from "../../../Components/Functions/UTCConvertor";
|
||||
import EditExchangeRate from "./EditExchangeRate";
|
||||
import ExchangeHistory from "./ExchangeHistroy";
|
||||
|
||||
const ExchangeRate = () => {
|
||||
const toast = useToast();
|
||||
@@ -39,6 +40,7 @@ const ExchangeRate = () => {
|
||||
const [actionId, setActionId] = useState(false);
|
||||
const [mouseEntered, setMouseEntered] = useState(false);
|
||||
const [mouseEnteredId, setMouseEnteredId] = useState("");
|
||||
const [history, setHistory] = useState([]);
|
||||
|
||||
useEffect(() => {
|
||||
// Simulate loading
|
||||
@@ -50,6 +52,13 @@ const ExchangeRate = () => {
|
||||
return () => clearTimeout(timer);
|
||||
}, []);
|
||||
|
||||
const updateHistory = (id, previousRate, newRate, effectFrom) => {
|
||||
setHistory((prevHistory) => [
|
||||
...prevHistory,
|
||||
{ id, effectFrom, previousRate, newRate },
|
||||
]);
|
||||
};
|
||||
|
||||
// ====================================================[Table Filter]================================================================
|
||||
const filteredData = rateExchange.filter((item) => {
|
||||
// Filter by name (case insensitive)
|
||||
@@ -152,8 +161,18 @@ const ExchangeRate = () => {
|
||||
// <Button colorScheme="green" size={"xs"} variant={"ghost"}>
|
||||
// Edit
|
||||
// </Button>
|
||||
|
||||
<EditExchangeRate setIsLoading={setIsLoading} id={item.id} />
|
||||
<>
|
||||
<EditExchangeRate
|
||||
setIsLoading={setIsLoading}
|
||||
id={item.id}
|
||||
updateHistory={updateHistory}
|
||||
/>
|
||||
<ExchangeHistory
|
||||
setIsLoading={setIsLoading}
|
||||
id={item.id}
|
||||
history={history}
|
||||
/>
|
||||
</>
|
||||
),
|
||||
}));
|
||||
|
||||
|
||||
@@ -1,8 +1,6 @@
|
||||
import React, { useContext, useState } from "react";
|
||||
import { OPACITY_ON_LOAD } from "../../../Layout/animations";
|
||||
import {
|
||||
Box,
|
||||
} from "@chakra-ui/react";
|
||||
import { Box } from "@chakra-ui/react";
|
||||
import { useForm, Controller } from "react-hook-form";
|
||||
import { yupResolver } from "@hookform/resolvers/yup";
|
||||
import * as yup from "yup";
|
||||
@@ -45,7 +43,6 @@ export function debounce(func, delay) {
|
||||
}
|
||||
|
||||
const AddInvestmentType = () => {
|
||||
|
||||
const navigate = useNavigate();
|
||||
const [bannerImageData, setBannerImageData] = useState(null);
|
||||
const { investmentType, setInvestmentType } = useContext(GlobalStateContext);
|
||||
@@ -133,55 +130,56 @@ const AddInvestmentType = () => {
|
||||
section: "Personal Details",
|
||||
},
|
||||
{
|
||||
label: "Mobile no",
|
||||
name: "mobileNo",
|
||||
type: "number",
|
||||
isRequired: true,
|
||||
section: "Personal Details",
|
||||
},
|
||||
{
|
||||
label: "Investment address",
|
||||
name: "investmentAddress",
|
||||
label: "Description Name",
|
||||
name: "description",
|
||||
type: "text",
|
||||
isRequired: true,
|
||||
section: "Personal Details",
|
||||
},
|
||||
{
|
||||
label: "Bank name",
|
||||
name: "bankName",
|
||||
label: "Description Name (Arabic)",
|
||||
name: "descriptionArabic",
|
||||
type: "text",
|
||||
isRequired: true,
|
||||
section: "Bank Details",
|
||||
},
|
||||
{
|
||||
label: "Account Name",
|
||||
name: "accountNumber",
|
||||
type: "text",
|
||||
isRequired: true,
|
||||
section: "Bank Details",
|
||||
},
|
||||
{
|
||||
label: "SWIFT/BIC Code",
|
||||
name: "swiftCode",
|
||||
type: "number",
|
||||
isRequired: true,
|
||||
section: "Bank Details",
|
||||
},
|
||||
{
|
||||
label: "Account Email",
|
||||
name: "bankEmail",
|
||||
type: "text",
|
||||
isRequired: true,
|
||||
section: "Bank Details",
|
||||
},
|
||||
{
|
||||
label: "Annual yeild",
|
||||
name: "annualyield",
|
||||
type: "number",
|
||||
helperText: "Please enter value in percentage",
|
||||
isRequired: true,
|
||||
section: "Investment Object Details",
|
||||
arabic: true,
|
||||
section: "Personal Details",
|
||||
},
|
||||
// {
|
||||
// label: "Bank name",
|
||||
// name: "bankName",
|
||||
// type: "text",
|
||||
// isRequired: true,
|
||||
// section: "Bank Details",
|
||||
// },
|
||||
// {
|
||||
// label: "Account Name",
|
||||
// name: "accountNumber",
|
||||
// type: "text",
|
||||
// isRequired: true,
|
||||
// section: "Bank Details",
|
||||
// },
|
||||
// {
|
||||
// label: "SWIFT/BIC Code",
|
||||
// name: "swiftCode",
|
||||
// type: "number",
|
||||
// isRequired: true,
|
||||
// section: "Bank Details",
|
||||
// },
|
||||
// {
|
||||
// label: "Account Email",
|
||||
// name: "bankEmail",
|
||||
// type: "text",
|
||||
// isRequired: true,
|
||||
// section: "Bank Details",
|
||||
// },
|
||||
// {
|
||||
// label: "Annual yeild",
|
||||
// name: "annualyield",
|
||||
// type: "number",
|
||||
// helperText: "Please enter value in percentage",
|
||||
// isRequired: true,
|
||||
// section: "Investment Object Details",
|
||||
// },
|
||||
];
|
||||
|
||||
const groupedFields = formFields.reduce((groups, field) => {
|
||||
@@ -206,7 +204,6 @@ const AddInvestmentType = () => {
|
||||
navigate("/investment-type");
|
||||
};
|
||||
|
||||
|
||||
return (
|
||||
<Box {...OPACITY_ON_LOAD} overflowY={"scroll"} height={"100vh"} pb={14}>
|
||||
<FormInputMain
|
||||
|
||||
@@ -280,12 +280,12 @@ const InvestmentType = () => {
|
||||
}));
|
||||
|
||||
const handleDelete = () => {
|
||||
const updatedSponsors = sponser.filter(
|
||||
(sponsor) => sponsor.id !== actionId
|
||||
const IOtype = investmentType.filter(
|
||||
(investmentType) => investmentType.id !== actionId
|
||||
);
|
||||
|
||||
setTimeout(() => {
|
||||
setSponser(updatedSponsors);
|
||||
setInvestmentType(IOtype);
|
||||
setDeleteAlert(false);
|
||||
setIsLoading(false);
|
||||
}, 100);
|
||||
|
||||
@@ -1,24 +1,22 @@
|
||||
import {
|
||||
Box,
|
||||
} from "@chakra-ui/react";
|
||||
import { Box } from "@chakra-ui/react";
|
||||
import { useNavigate, useParams } from "react-router-dom";
|
||||
import GlobalStateContext from "../../../Contexts/GlobalStateContext";
|
||||
import { useContext, useEffect, useState } from "react";
|
||||
import FormInputView from "../../../Components/FormInputView";
|
||||
import { useForm } from "react-hook-form"; // assuming react-hook-form is used
|
||||
import { OPACITY_ON_LOAD } from "../../../Layout/animations";
|
||||
import { ArrowBackIcon } from "@chakra-ui/icons";
|
||||
|
||||
const ViewInvestmentType = () => {
|
||||
const navigate = useNavigate();
|
||||
const params = useParams();
|
||||
const { investmentType } = useContext(GlobalStateContext);
|
||||
const { investmentType } = useContext(GlobalStateContext);
|
||||
const { reset } = useForm(); // assuming react-hook-form
|
||||
|
||||
|
||||
const id = params?.id;
|
||||
const foundObject = investmentType.find((item) => item?.id.toString() === id.toString());
|
||||
|
||||
|
||||
const foundObject = investmentType.find(
|
||||
(item) => item?.id.toString() === id.toString()
|
||||
);
|
||||
|
||||
if (!foundObject) {
|
||||
return <Box>Loading...</Box>;
|
||||
@@ -34,54 +32,55 @@ const ViewInvestmentType = () => {
|
||||
},
|
||||
{
|
||||
label: "Investment Name (Arabic)",
|
||||
value: foundObject.investmentName,
|
||||
value: foundObject.investmentNameArabic,
|
||||
type: "text",
|
||||
isRequired: true,
|
||||
arabic: true,
|
||||
section: "Personal Details",
|
||||
},
|
||||
{
|
||||
label: "Mobile no",
|
||||
value: foundObject.mobileNo,
|
||||
type: "number",
|
||||
label: "Description",
|
||||
value: foundObject.description,
|
||||
type: "text",
|
||||
isRequired: true,
|
||||
arabic: true,
|
||||
section: "Personal Details",
|
||||
},
|
||||
{
|
||||
label: "Investment address",
|
||||
value: foundObject.investmentAddress,
|
||||
label: "Description Arabic",
|
||||
value: foundObject.descriptionArabic,
|
||||
type: "text",
|
||||
isRequired: true,
|
||||
section: "Personal Details",
|
||||
},
|
||||
{
|
||||
label: "Bank name",
|
||||
value: foundObject.bankName,
|
||||
type: "text",
|
||||
isRequired: true,
|
||||
section: "Bank Details",
|
||||
},
|
||||
{
|
||||
label: "Account Name",
|
||||
value: foundObject.accountNumber,
|
||||
type: "text",
|
||||
isRequired: true,
|
||||
section: "Bank Details",
|
||||
},
|
||||
{
|
||||
label: "SWIFT/BIC Code",
|
||||
value: foundObject.swiftCode,
|
||||
type: "text",
|
||||
isRequired: true,
|
||||
section: "Bank Details",
|
||||
},
|
||||
{
|
||||
label: "Account Email",
|
||||
value: foundObject.bankEmail,
|
||||
type: "text",
|
||||
isRequired: true,
|
||||
section: "Bank Details",
|
||||
},
|
||||
// {
|
||||
// label: "Bank name",
|
||||
// value: foundObject.bankName,
|
||||
// type: "text",
|
||||
// isRequired: true,
|
||||
// section: "Bank Details",
|
||||
// },
|
||||
// {
|
||||
// label: "Account Name",
|
||||
// value: foundObject.accountNumber,
|
||||
// type: "text",
|
||||
// isRequired: true,
|
||||
// section: "Bank Details",
|
||||
// },
|
||||
// {
|
||||
// label: "SWIFT/BIC Code",
|
||||
// value: foundObject.swiftCode,
|
||||
// type: "text",
|
||||
// isRequired: true,
|
||||
// section: "Bank Details",
|
||||
// },
|
||||
// {
|
||||
// label: "Account Email",
|
||||
// value: foundObject.bankEmail,
|
||||
// type: "text",
|
||||
// isRequired: true,
|
||||
// section: "Bank Details",
|
||||
// },
|
||||
];
|
||||
|
||||
const groupedFields = formFields.reduce((groups, field) => {
|
||||
@@ -95,9 +94,13 @@ const ViewInvestmentType = () => {
|
||||
|
||||
return (
|
||||
<Box {...OPACITY_ON_LOAD} overflowY={"scroll"} height={"100vh"} pb={14}>
|
||||
<FormInputView
|
||||
groupedFields={groupedFields}
|
||||
/>
|
||||
<span
|
||||
onClick={() => navigate(-1)}
|
||||
style={{ fontSize: "15px", cursor: "pointer" }}
|
||||
>
|
||||
<ArrowBackIcon cursor={"pointer"} /> Back
|
||||
</span>
|
||||
<FormInputView groupedFields={groupedFields} />
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -12,6 +12,8 @@ import CreateIO from "../Pages/IO_Management/CreateIO";
|
||||
import Create from "../Pages/IO_Management/InputComponents";
|
||||
import ViewIO from "../Pages/IO_Management/ViewIO";
|
||||
import View from "../Pages/IO_Management/ViewIO";
|
||||
import ViewIOTable from "../Pages/IO_Management/ViewIOTable";
|
||||
import ViewIOdata from "../Pages/IO_Management/ViewIOdata";
|
||||
import InvestorPendingRequest from "../Pages/InvestorUpgrade/InvestorRequest";
|
||||
import UpgradeHistory from "../Pages/InvestorUpgrade/UpgradeHistory";
|
||||
import upgradeHistory from "../Pages/InvestorUpgrade/UpgradeHistory";
|
||||
@@ -49,7 +51,8 @@ export const RouteLink = [
|
||||
|
||||
// ===============[ IO Management]===============
|
||||
{ path: "/create-io", Component: CreateIO },
|
||||
{ path: "/view-io", Component: ViewIO },
|
||||
{ path: "/view-io", Component: ViewIOTable },
|
||||
{ path: "/view-io/:id", Component: ViewIOdata },
|
||||
|
||||
// ===============[ Investor Management]===============
|
||||
{ path: "/investor-details", Component: InvestorDetails },
|
||||
|
||||
Reference in New Issue
Block a user