ViewIOdata and ViewIO page created.

This commit is contained in:
rockyeverlast
2024-07-05 11:55:52 +05:30
parent a3b29bb2f6
commit 32af3ba451
10 changed files with 769 additions and 127 deletions

View File

@@ -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}

View 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;

View 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;

View File

@@ -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..."

View 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;

View File

@@ -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}
/>
</>
),
}));

View File

@@ -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

View File

@@ -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);

View File

@@ -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>
);
};

View File

@@ -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 },