diff --git a/src/Components/FormInputView.jsx b/src/Components/FormInputView.jsx index 922101b..d3c7394 100644 --- a/src/Components/FormInputView.jsx +++ b/src/Components/FormInputView.jsx @@ -16,6 +16,7 @@ const FormInputView = ({ {Object?.entries(groupedFields, groupedFieldsTwo).map( ([section, fields], index) => ( + {console.log(fields)} {section} @@ -27,7 +28,7 @@ const FormInputView = ({ flexWrap={"wrap"} gap={4} > - {fields.map(({ value, label, id, width }, key) => ( + {fields.map(({ value, label, id, width, btn }, key) => ( {label} diff --git a/src/Pages/IO_Management/CreateIO/CreateIO.jsx b/src/Pages/IO_Management/CreateIO/CreateIO.jsx index feaca28..a71369e 100644 --- a/src/Pages/IO_Management/CreateIO/CreateIO.jsx +++ b/src/Pages/IO_Management/CreateIO/CreateIO.jsx @@ -421,54 +421,13 @@ const CreateIO = () => { > {label} ))} - {/* - Investment Documents - - - Key Merits - - - IO artifacts - - - Investors - - - IO Cash detail - - - IO NAV detail - - - Distribution - */} + {tabs.map(({content}, index) => ( - + {content} ))} diff --git a/src/Pages/IO_Management/EditViewIO.jsx b/src/Pages/IO_Management/EditViewIO.jsx new file mode 100644 index 0000000..ad45014 --- /dev/null +++ b/src/Pages/IO_Management/EditViewIO.jsx @@ -0,0 +1,456 @@ +import React, { useContext, useEffect, useState } from "react"; +import { OPACITY_ON_LOAD } from "../../../Layout/animations"; +import { + Box, + Divider, + FormControl, + FormLabel, + Heading, + Input, + Select, + Textarea, + Button, + Text, + Image, + Tabs, + TabList, + Tab, + TabPanel, + TabPanels, + Tooltip, + Switch, + useDisclosure, +} from "@chakra-ui/react"; +import { useForm, Controller } from "react-hook-form"; +import { yupResolver } from "@hookform/resolvers/yup"; +import * as yup from "yup"; +import { + AddIcon, + CloseIcon, + DeleteIcon, + EditIcon, + ViewIcon, + WarningTwoIcon, +} from "@chakra-ui/icons"; +import { TiWarning } from "react-icons/ti"; +import GlobalStateContext from "../../../Contexts/GlobalStateContext"; +import { useNavigate } from "react-router-dom"; +import FormField from "../../../Components/FormField"; +import { v4 as uuidv4 } from "uuid"; +import AddIOCharges from "../AddIOCharges"; +import FormInputMain from "../../../Components/FormInputMain"; +import DataTable from "../../../Components/DataTable/DataTable"; +import { debounce } from "../../Master/Sponser/AddSponser"; +import CustomAlertDialog from "../../../Components/CustomAlertDialog"; +import { formatDate } from "../../../Components/Functions/UTCConvertor"; +import IODetails from "./IODetails"; +import KeyMerits from "./KeyMerits"; +import IOArtifacts from "./IOArtifacts"; +import Investors from "./Investors"; +import IOCashDetails from "./IOCashDetails"; +import IONAVDetails from "./IONAVDetails"; +import Distribution from "./Destribution"; +import InvestmentDocuments from "../InvestmentDocuments"; +import InvestmentDocument from "./InvestmentDocument"; + +const schema = yup.object().shape({ + ioName: yup.string().required("Arabic name is required"), + ioNameArabic: yup.string().required("Investment Object name is required"), + discription: yup.string().required("Sponser name is required"), + discriptionArabic: yup.string().required("Arabic name is required"), + typeName: yup.string().required("Investment Object name is required"), + typeNameArabic: yup.string().required("Sponser name is required"), + sponserName: yup.string().required("Arabic name is required"), + sponserNameArabic: yup + .string() + .required("Investment Object name is required"), + holdingPeriod: yup.string().required("Sponser name is required"), + ioStartus: yup.string().required("Investment Object name is required"), + ioStartusArabic: yup.string().required("Sponser name is required"), + goalAmount: yup.string().required("Arabic name is required"), + closingDate: yup.string().required("Investment Object name is required"), + minInvestment: yup.string().required("Sponser name is required"), + maxInvestment: yup.string().required("Arabic name is required"), + expectedReturn: yup.string().required("Investment Object name is required"), + originalValue: yup.string().required("Sponser name is required"), + keyname: yup.string().required("Arabic name is required"), + keyNameArabic: yup.string().required("Investment Object name is required"), + keyDescription: yup.string().required("Sponser name is required"), + keyDescriptionArabic: yup.string().required("Sponser name is required"), + docType: yup.string().required("Sponser name is required"), + + destributedAmount: yup + .number() + .required("Distributed Amount is required") + .positive("Must be a positive number"), + year: yup.string().required("Year is required"), + tenure: yup + .number() + .required("Tenure is required") + .positive("Must be a positive number"), + annualReturn: yup + .number() + .required("Annual Return is required") + .positive("Must be a positive number"), + miniInvest: yup + .number() + .required("Minimum Invest is required") + .positive("Must be a positive number"), + quaterly: yup.string().required("Quaterly is required"), + targetClose: yup.date().required("Target close date is required"), + annualyield: yup + .number() + .required("Annual Yield is required") + .positive("Must be a positive number"), + iconUpload: yup.mixed().required("Profile image is required"), + bannerImages: yup.mixed().required("Profile image is required"), + otherImage: yup.mixed().required("Profile image is required"), + docAttach: yup.mixed().required("Profile image is required"), + videos: yup.mixed().required("Profile image is required"), +}); + +const startYear = 2024; +const endYear = 2124; +const years = Array.from( + { length: endYear - startYear + 1 }, + (_, i) => startYear + i +).map((year) => ({ value: year, label: year })); + +const EditViewIO = () => { + const navigate = useNavigate(); + const { create, setCreate, sponser, setSponser, investment, setInvestment } = + useContext(GlobalStateContext); + const [bannerImageData, setBannerImageData] = useState(null); + const [otherImageData, setOtherImageData] = useState(null); + const [selectedBannerImageData, setSelectedBannerImageData] = useState(null); + const [selectedOtherImageData, setSelectedOtherImageData] = useState(null); + const [charges, setCharges] = useState([]); + const [totalCharge, setTotalCharge] = useState(0.0); + const [totalAmount, setTotalAmount] = useState(0.0); + + 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(""); + + const { + control, + handleSubmit, + reset, + watch, + setValue, + formState: { errors }, + } = useForm({ + resolver: yupResolver(schema), + }); + + const tabs = [ + { + label: "IO Details", + content: , + }, + { + label: "Investment documents", + content: , + }, + { + label: "Key merits", + content: , + }, + { + label: "IO artifacts", + content: , + }, + { + label: "Investors", + content: , + }, + { + label: "IO Cash Details", + content: , + }, + { + label: "IO NAV Details", + content: , + }, + { + label: "Distribution", + content: , + }, + ]; + + useEffect(() => { + // Simulate loading + const timer = setTimeout(() => { + setIsLoading(false); + }, 1500); + + // Cleanup the timer on component unmount + return () => clearTimeout(timer); + }, []); + + const destributedAmount = Number(watch().destributedAmount) || 0; + + useEffect(() => { + const calculateTotalCharge = () => { + const totalChargeValue = charges.reduce( + (acc, { value }) => acc + Number(value), + 0 + ); + setTotalCharge(totalChargeValue); + }; + + const calculateTotalAmount = () => { + const totalChargeValue = charges.reduce( + (acc, { value }) => acc + Number(value), + 0 + ); + setTotalAmount(destributedAmount + totalChargeValue); + }; + + calculateTotalCharge(); + calculateTotalAmount(); + }, [charges, destributedAmount]); + + const onSubmit = (data) => { + // setValue("banner_image", selectedBannerImageData); + data.banner_image = selectedBannerImageData; + const updatedData = { ...data, status: "Available" }; + console.log(selectedBannerImageData); + setInvestment([...investment, updatedData]); + navigate("/view-io"); + reset(); + }; + + // Extract options for the select input + const createOptions = create.map((item) => ({ + value: item.sponserName, + label: item.sponserName, + })); + + const handleBannerImageChange = (e) => { + const file = e.target.files[0]; + setBannerImageData(file); + if (file) { + const reader = new FileReader(); + reader.onloadend = () => { + setSelectedBannerImageData(reader.result); + }; + reader.readAsDataURL(file); + } + }; + + const { isOpen, onOpen, onClose } = useDisclosure(); + const firstField = React.useRef(); + + // Handler for file input + const handleOtherImageChange = (e) => { + const files = Array.from(e.target.files); + const newImageData = [...(otherImageData || []), ...files]; // Ensure otherImageData is an array + + setOtherImageData(newImageData); + + const readers = files.map((file) => { + return new Promise((resolve, reject) => { + const reader = new FileReader(); + reader.onloadend = () => { + resolve(reader.result); + }; + reader.onerror = reject; + reader.readAsDataURL(file); + }); + }); + + Promise.all(readers) + .then((results) => { + setSelectedOtherImageData([ + ...(selectedOtherImageData || []), + ...results, + ]); // Ensure selectedOtherImageData is an array + }) + .catch((error) => { + console.error("Error reading files:", error); + }); + }; + // Function to remove a specific image + const removeOtherImage = (index) => { + const newImageData = otherImageData.filter((_, i) => i !== index); + const newSelectedImageData = selectedOtherImageData.filter( + (_, i) => i !== index + ); + + setOtherImageData(newImageData); + setSelectedOtherImageData(newSelectedImageData); + }; + + const keyMerits = [ + { + label: "Name (English)", + placeHolder: " ", + name: "keyname", + type: "text", + isRequired: true, + section: " ", + width: "32.3%", + }, + { + label: "Name (Arabic)", + placeHolder: " ", + name: "keyNameArabic", + type: "text", + isRequired: true, + section: " ", + width: "32.3%", + }, + { + label: "Icon", + placeHolder: " ", + name: "iconUpload", + type: "fileNormal", + isRequired: true, + section: " ", + width: "32.3%", + }, + { + label: "Description (English)", + placeHolder: " ", + name: "keyDescription", + type: "textarea", + isRequired: true, + section: " ", + width: "32.3%", + }, + { + label: "Description (Arabic)", + placeHolder: " ", + name: "keyDescriptionArabic", + type: "textarea", + isRequired: true, + section: " ", + width: "32.3%", + }, + ]; + + const images = [ + { + label: "Banner Images ", + placeHolder: " ", + name: "bannerImages", + type: "fileNormal", + isRequired: true, + section: " ", + width: "32.3%", + }, + + { + label: "Other Images", + placeHolder: " ", + name: "otherImage", + type: "fileNormal", + isRequired: true, + section: " ", + width: "32.3%", + }, + ]; + + const documents = [ + { + label: "Type", + placeHolder: " ", + name: "docType", + type: "text", + isRequired: true, + section: " ", + width: "32.3%", + }, + { + label: "Attachment", + placeHolder: " ", + name: "type", + type: "docAttach", + isRequired: true, + section: " ", + width: "32.3%", + }, + ]; + + const Videos = [ + { + label: "Videos", + placeHolder: " ", + name: "videos", + type: "fileNormal", + isRequired: true, + section: " ", + width: "32.3%", + }, + ]; + + const groupedFieldsTwo = keyMerits.reduce((groups, field) => { + const { section } = field; + if (!groups[section]) { + groups[section] = []; + } + groups[section].push(field); + return groups; + }, {}); + + const groupedFieldsThree = images.reduce((groups, field) => { + const { section } = field; + if (!groups[section]) { + groups[section] = []; + } + groups[section].push(field); + return groups; + }, {}); + + const groupedFieldsFour = documents.reduce((groups, field) => { + const { section } = field; + if (!groups[section]) { + groups[section] = []; + } + groups[section].push(field); + return groups; + }, {}); + + const groupedFieldsFive = Videos.reduce((groups, field) => { + const { section } = field; + if (!groups[section]) { + groups[section] = []; + } + groups[section].push(field); + return groups; + }, {}); + + return ( + + + + {tabs.map(({ label }, index) => ( + + {label} + + ))} + + + + {tabs.map(({ content }, index) => ( + {content} + ))} + + + + ); +}; + +export default EditViewIO; diff --git a/src/Pages/IO_Management/ViewIO/ViewDistribution.jsx b/src/Pages/IO_Management/ViewIO/ViewDistribution.jsx new file mode 100644 index 0000000..2f0c529 --- /dev/null +++ b/src/Pages/IO_Management/ViewIO/ViewDistribution.jsx @@ -0,0 +1,7 @@ +import React from "react"; + +const ViewDistribution = () => { + return
ViewDistribution
; +}; + +export default ViewDistribution; diff --git a/src/Pages/IO_Management/ViewIO.jsx b/src/Pages/IO_Management/ViewIO/ViewIO.jsx similarity index 83% rename from src/Pages/IO_Management/ViewIO.jsx rename to src/Pages/IO_Management/ViewIO/ViewIO.jsx index 3561caf..87c7c40 100644 --- a/src/Pages/IO_Management/ViewIO.jsx +++ b/src/Pages/IO_Management/ViewIO/ViewIO.jsx @@ -15,11 +15,11 @@ import { // import error from "../assets/Error.svg" // import robot from "../../../assets/robot.png" import { useContext, useEffect, useState } from "react"; -import { OPACITY_ON_LOAD } from "../../Layout/animations"; -import InvestmentCard from "../../Components/InvestmentCard/InvestmentCard"; -import GlobalStateContext from "../../Contexts/GlobalStateContext"; -import Pagination from "../../Components/Pagination"; -import EmptySearchList from "../../Components/EmptySearchList"; +import { OPACITY_ON_LOAD } from "../../../Layout/animations"; +import InvestmentCard from "../../../Components/InvestmentCard/InvestmentCard"; +import Pagination from "../../../Components/Pagination"; +import EmptySearchList from "../../../Components/EmptySearchList"; +import GlobalStateContext from "../../../Contexts/GlobalStateContext"; const ExchangeRate = () => { const [searchTerm, setSearchTerm] = useState(""); @@ -27,6 +27,9 @@ const ExchangeRate = () => { const [isLoading, setIsLoading] = useState(true); const [statusFilter, setStatusFilter] = useState("all"); + + console.log(investment); + useEffect(() => { // Simulate loading const timer = setTimeout(() => { @@ -53,7 +56,7 @@ const ExchangeRate = () => { (statusFilter === "Upcomming" && status === "Upcomming") || (statusFilter === "Closed" && status === "Closed"); - return nameMatches && statusMatches; + return nameMatches && statusMatches; }); const availableInvestments = filteredData.filter( @@ -68,7 +71,7 @@ const ExchangeRate = () => { return ( - + {/* All */} {/* Available @@ -94,21 +97,22 @@ const ExchangeRate = () => { value={searchTerm} onChange={(e) => setSearchTerm(e.target.value)} /> - - - + + + {filteredData?.length === 0 ? ( diff --git a/src/Pages/IO_Management/ViewIOTable.jsx b/src/Pages/IO_Management/ViewIO/ViewIOTable.jsx similarity index 94% rename from src/Pages/IO_Management/ViewIOTable.jsx rename to src/Pages/IO_Management/ViewIO/ViewIOTable.jsx index 28d700a..5b5bd95 100644 --- a/src/Pages/IO_Management/ViewIOTable.jsx +++ b/src/Pages/IO_Management/ViewIO/ViewIOTable.jsx @@ -18,8 +18,8 @@ import { 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 { 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 { @@ -31,10 +31,10 @@ import { 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 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 @@ -50,6 +50,8 @@ const ViewIOTable = () => { const [mouseEntered, setMouseEntered] = useState(false); const [mouseEnteredId, setMouseEnteredId] = useState(""); + + console.log(viewIO); useEffect(() => { // Simulate loading const timer = setTimeout(() => { diff --git a/src/Pages/IO_Management/ViewIO/ViewIOartifacts.jsx b/src/Pages/IO_Management/ViewIO/ViewIOartifacts.jsx new file mode 100644 index 0000000..41b81de --- /dev/null +++ b/src/Pages/IO_Management/ViewIO/ViewIOartifacts.jsx @@ -0,0 +1,9 @@ +import React from 'react' + +const ViewIOartifacts = () => { + return ( +
ViewIOartifacts
+ ) +} + +export default ViewIOartifacts \ No newline at end of file diff --git a/src/Pages/IO_Management/ViewIO/ViewIOcash.jsx b/src/Pages/IO_Management/ViewIO/ViewIOcash.jsx new file mode 100644 index 0000000..48c4270 --- /dev/null +++ b/src/Pages/IO_Management/ViewIO/ViewIOcash.jsx @@ -0,0 +1,9 @@ +import React from 'react' + +const ViewIOcash = () => { + return ( +
ViewIOcash
+ ) +} + +export default ViewIOcash \ No newline at end of file diff --git a/src/Pages/IO_Management/ViewIO/ViewIOdata.jsx b/src/Pages/IO_Management/ViewIO/ViewIOdata.jsx new file mode 100644 index 0000000..a9fe68e --- /dev/null +++ b/src/Pages/IO_Management/ViewIO/ViewIOdata.jsx @@ -0,0 +1,84 @@ +import { + Box, + Button, + Input, + Tab, + TabList, + TabPanel, + TabPanels, + Tabs, + Text, +} 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"; +import CustomAlertDialog from "../../../Components/CustomAlertDialog"; +import ViewIOdataHeader from "./ViewIOdataHeader"; +import ViewIOdetails from "./ViewIOdetails"; +import ViewIOdocs from "./ViewIOdocs"; +import ViewKeyMerits from "./ViewKeyMerits"; +import ViewIOartifacts from "./ViewIOartifacts"; +import ViewInvestors from "./ViewInvestors"; +import ViewIOcash from "./ViewIOcash"; +import ViewIOnav from "./ViewIOnav"; +import ViewDistribution from "./ViewDistribution"; + +const ViewIOdata = () => { + const [isEditing, setIsEditing] = useState(false); + const navigate = useNavigate(); + + const tabs = [ + { label: "IO Details", content: }, + { label: "Investment documents", content: }, + { label: "Key merits", content: }, + { label: "IO artifacts", content: }, + { label: "Investors", content: }, + { label: "IO Cash Details", content: }, + { label: "IO NAV Details", content: }, + { label: "Distribution", content: }, + ]; + + return ( + + + navigate(-1)} + style={{ fontSize: "15px", cursor: "pointer" }} + > + Back + + + + + + + {tabs.map(({ label }, index) => ( + + {label} + + ))} + + + + {tabs.map(({ content }, index) => ( + {content} + ))} + + + + ); +}; + +export default ViewIOdata; diff --git a/src/Pages/IO_Management/ViewIOdataHeader.jsx b/src/Pages/IO_Management/ViewIO/ViewIOdataHeader.jsx similarity index 94% rename from src/Pages/IO_Management/ViewIOdataHeader.jsx rename to src/Pages/IO_Management/ViewIO/ViewIOdataHeader.jsx index 54f5369..c476aaf 100644 --- a/src/Pages/IO_Management/ViewIOdataHeader.jsx +++ b/src/Pages/IO_Management/ViewIO/ViewIOdataHeader.jsx @@ -1,5 +1,5 @@ import { Box, Image, Text } from "@chakra-ui/react"; -import header from "../../../src/assets/IOheader.png"; +import header from "../../../assets/IOheader.png"; const ViewIOdataHeader = () => { return ( diff --git a/src/Pages/IO_Management/ViewIO/ViewIOdetails.jsx b/src/Pages/IO_Management/ViewIO/ViewIOdetails.jsx new file mode 100644 index 0000000..640dcb0 --- /dev/null +++ b/src/Pages/IO_Management/ViewIO/ViewIOdetails.jsx @@ -0,0 +1,124 @@ +import { Box } from "@chakra-ui/react"; +import React, { useContext } from "react"; + +import { useNavigate, useParams } from "react-router-dom"; +import { useForm } from "react-hook-form"; +import GlobalStateContext from "../../../Contexts/GlobalStateContext"; +import DataTable from "../../../Components/DataTable/DataTable"; +import FormInputView from "../../../Components/FormInputView"; + +const ViewIOdetails = () => { + const params = useParams(); + const { viewIO } = useContext(GlobalStateContext); + console.log(viewIO); + const { reset } = useForm(); // assuming react-hook-form + + const id = params?.id; + const foundObject = viewIO?.find( + (item) => item?.id.toString() === id.toString() + ); + + const formFields = [ + { + label: "IO Name (English)", + value: foundObject.DealName, + width: "49%", + section: "", + }, + { + label: "IO Name (Arabic)", + value: foundObject.SponsorName, + width: "49%", + section: "", + }, + { + label: "Description (English)", + value: foundObject.IOstatus, + width: "49%", + section: "", + }, + { + label: "Description (Arabic)", + value: foundObject.IOstatus, + width: "49%", + section: "", + }, + { + label: "Investment Type (English)", + value: foundObject.DealName, + width: "49%", + section: "", + }, + { + label: "Investment Type (Arabic)", + value: foundObject.DealID, + width: "49%", + section: "", + }, + { + label: "Sponser Name (English)", + value: foundObject.IOstatus, + width: "49%", + section: "", + }, + { + label: "Goal Amount (English)", + value: foundObject.IOstatus, + width: "49%", + section: "", + }, + { + label: "Minimum Investment Amount (English)", + value: foundObject.IOstatus, + width: "32.3%", + section: "", + }, + { + label: "Maximum Investment Amount (English)", + value: foundObject.IOstatus, + width: "32.3%", + section: "", + }, + { + label: "Holding Period (English)", + value: foundObject.IOstatus, + width: "32.3%", + section: "", + }, + { + label: "Expected Return Estimated (English)", + value: foundObject.IOstatus, + width: "32.3%", + section: "", + }, + { + label: "Closing Date (English)", + value: foundObject.IOstatus, + width: "32.3%", + section: "", + }, + { + label: "IO Status (English)", + value: foundObject.IOstatus, + width: "32.3%", + section: "", + }, + ]; + + const groupedFields = formFields.reduce((groups, field) => { + const { section } = field; + if (!groups[section]) { + groups[section] = []; + } + groups[section].push(field); + return groups; + }, {}); + + if (!foundObject) { + return Loading...; + } + + return ; +}; + +export default ViewIOdetails; diff --git a/src/Pages/IO_Management/ViewIO/ViewIOdocs.jsx b/src/Pages/IO_Management/ViewIO/ViewIOdocs.jsx new file mode 100644 index 0000000..b43fce2 --- /dev/null +++ b/src/Pages/IO_Management/ViewIO/ViewIOdocs.jsx @@ -0,0 +1,7 @@ +import React from "react"; + +const ViewIOdocs = () => { + return
ViewIOdocs
; +}; + +export default ViewIOdocs; diff --git a/src/Pages/IO_Management/ViewIO/ViewIOnav.jsx b/src/Pages/IO_Management/ViewIO/ViewIOnav.jsx new file mode 100644 index 0000000..cfd68b6 --- /dev/null +++ b/src/Pages/IO_Management/ViewIO/ViewIOnav.jsx @@ -0,0 +1,9 @@ +import React from 'react' + +const ViewIOnav = () => { + return ( +
ViewIOnav
+ ) +} + +export default ViewIOnav \ No newline at end of file diff --git a/src/Pages/IO_Management/ViewIO/ViewInvestors.jsx b/src/Pages/IO_Management/ViewIO/ViewInvestors.jsx new file mode 100644 index 0000000..04b9123 --- /dev/null +++ b/src/Pages/IO_Management/ViewIO/ViewInvestors.jsx @@ -0,0 +1,9 @@ +import React from 'react' + +const ViewInvestors = () => { + return ( +
ViewInvestors
+ ) +} + +export default ViewInvestors \ No newline at end of file diff --git a/src/Pages/IO_Management/ViewIO/ViewKeyMerits.jsx b/src/Pages/IO_Management/ViewIO/ViewKeyMerits.jsx new file mode 100644 index 0000000..6f7c7db --- /dev/null +++ b/src/Pages/IO_Management/ViewIO/ViewKeyMerits.jsx @@ -0,0 +1,9 @@ +import React from 'react' + +const ViewKeyMerits = () => { + return ( +
ViewKeyMerits
+ ) +} + +export default ViewKeyMerits \ No newline at end of file diff --git a/src/Pages/IO_Management/ViewIOdata.jsx b/src/Pages/IO_Management/ViewIOdata.jsx deleted file mode 100644 index afd6d10..0000000 --- a/src/Pages/IO_Management/ViewIOdata.jsx +++ /dev/null @@ -1,225 +0,0 @@ -import { - Box, - Button, - Input, - Tab, - TabList, - TabPanel, - TabPanels, - Tabs, - Text, -} 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"; -import DataTable from "../../Components/DataTable/DataTable"; -import CustomAlertDialog from "../../Components/CustomAlertDialog"; -import FormInputMain from "../../Components/FormInputMain"; -import InvestmentDocuments from "./InvestmentDocuments"; -import ViewIOdataHeader from "./ViewIOdataHeader"; - -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) => item?.id.toString() === id.toString() - ); - - if (!foundObject) { - return Loading...; - } - - const formFields = [ - { - label: "IO Name (English)", - value: foundObject.DealName, - width: "49%", - section: "", - }, - { - label: "IO Name (Arabic)", - value: foundObject.SponsorName, - width: "49%", - section: "", - }, - { - label: "Description (English)", - value: foundObject.IOstatus, - width: "49%", - section: "", - }, - { - label: "Description (Arabic)", - value: foundObject.IOstatus, - width: "49%", - section: "", - }, - { - label: "Investment Type (English)", - value: foundObject.DealName, - width: "49%", - section: "", - }, - { - label: "Investment Type (Arabic)", - value: foundObject.DealID, - width: "49%", - section: "", - }, - { - label: "Sponser Name (English)", - value: foundObject.IOstatus, - width: "49%", - section: "", - }, - { - label: "Goal Amount (English)", - value: foundObject.IOstatus, - width: "49%", - section: "", - }, - { - label: "Minimum Investment Amount (English)", - value: foundObject.IOstatus, - width: "32.3%", - section: "", - }, - { - label: "Maximum Investment Amount (English)", - value: foundObject.IOstatus, - width: "32.3%", - section: "", - }, - { - label: "Holding Period (English)", - value: foundObject.IOstatus, - width: "32.3%", - section: "", - }, - { - label: "Expected Return Estimated (English)", - value: foundObject.IOstatus, - width: "32.3%", - section: "", - }, - { - label: "Closing Date (English)", - value: foundObject.IOstatus, - width: "32.3%", - section: "", - }, - { - label: "IO Status (English)", - value: foundObject.IOstatus, - width: "32.3%", - section: "", - }, - ]; - - const groupedFields = formFields.reduce((groups, field) => { - const { section } = field; - if (!groups[section]) { - groups[section] = []; - } - groups[section].push(field); - return groups; - }, {}); - - return ( - - - navigate(-1)} - style={{ fontSize: "15px", cursor: "pointer" }} - > - Back - - - - - - - - IO Details - - - Investment Documents - - - Key Merits - - - IO artifacts - - - Investors - - - IO Cash detail - - - IO NAV detail - - - Distribution - - - - - - - - - - - - - - - - - - - - - - - - ); -}; - -export default ViewIOdata; diff --git a/src/Routes/Routes.js b/src/Routes/Routes.js index fed20c5..e405292 100644 --- a/src/Routes/Routes.js +++ b/src/Routes/Routes.js @@ -10,10 +10,10 @@ import Users from "../Pages/Admin/Users"; import CreateIO from "../Pages/IO_Management/CreateIO/CreateIO"; // import CreateIO from "../Pages/IO_Management/InputComponents"; 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 ViewIO from "../Pages/IO_Management/ViewIO/ViewIO"; +import View from "../Pages/IO_Management/ViewIO/ViewIO"; +import ViewIOTable from "../Pages/IO_Management/ViewIO/ViewIOTable"; +import ViewIOdata from "../Pages/IO_Management/ViewIO/ViewIOdata"; import InvestorPendingRequest from "../Pages/InvestorUpgrade/InvestorRequest"; import UpgradeHistory from "../Pages/InvestorUpgrade/UpgradeHistory"; import upgradeHistory from "../Pages/InvestorUpgrade/UpgradeHistory";