diff --git a/src/Components/InvestmentCard/InvestmentCard.jsx b/src/Components/InvestmentCard/InvestmentCard.jsx index 13ed3af..81618c2 100644 --- a/src/Components/InvestmentCard/InvestmentCard.jsx +++ b/src/Components/InvestmentCard/InvestmentCard.jsx @@ -30,14 +30,14 @@ const InvestmentCard = ({ investment }) => { p={"14px"} rounded={"24px"} objectFit="cover" - w={"200px"} - h={"140px"} + w={"180px"} + h={"160px"} src={investment?.banner_image} alt={investment?.ioName} /> - - + + {investment?.ioName} { pb={0.5} fontSize={"xs"} ms={3} + fontWeight={'600'} > {investment?.status === "Available" ? "Available" @@ -62,68 +63,87 @@ const InvestmentCard = ({ investment }) => { : "Closed"} - - Sponsor: - + + Sponsor: + {investment?.sponserName} - - Ann return: - + + Ann return: + {investment?.annualReturn} - - Ann Yield: - + + Ann Yield: + {investment?.annualyield} - - Tenure: - - {investment?.tenure} - - - - Quaterly: - - {investment?.quaterly} - - - - - - Destributed Amount: - + + + + Tenure: + + {investment?.tenure} + + + + Quaterly: + + {investment?.quaterly} + + + + Destributed Amount: + {investment?.destributedAmount} - + + + + + Min.Invests: - - {investment?.minInvests} + + {investment?.miniInvest} - + Targ Close: - + {new Date(investment?.targetClose).toLocaleDateString()} - - Year: - + + Year: + {investment?.year} - - + + { { const [investmentType, setInvestmentType] = useState([ { id: 1, - investmentName: "John Doe", - mobileNo: "1234567890", - sponserAddress: "123 Main St, Springfield, USA", - accountHolderName: "John Doe", - bankName: "Example Bank", - accountNumber: "1234567890", - bankBranch: "Main Branch", - branchAddress: "456 Elm St, Springfield, USA", - ifscCode: "IFSC12345", - swiftCode: "SWIFT56789", - routingNumber: "987654321", - iban: "IBAN987654321", - accountType: "savings", - bankPhoneNumber: "9876543210", - bankEmail: "john.doe@example.com", + investmentName: "Michael Scott", + mobileNo: "0987654321", + investmentAddress: "1725 Slough Ave, Scranton, USA", + accountHolderName: "Michael Scott", + bankName: "Dunder Mifflin Bank", + accountNumber: "1111222233", + bankBranch: "Scranton Branch", + branchAddress: "101 Paper St, Scranton, USA", + ifscCode: "IFSC11111", + swiftCode: "SWIFT12345", + routingNumber: "123450987", + iban: "IBAN1111222233", + accountType: "checking", + bankPhoneNumber: "0987654321", + bankEmail: "michael.scott@example.com", status: true, createdAt: "45", }, { id: 2, - investmentName: "Jane Smith", - mobileNo: "9876543210", - sponserAddress: "456 Oak St, Metropolis, USA", - accountHolderName: "Jane Smith", - bankName: "Another Bank", - accountNumber: "0987654321", - bankBranch: "Downtown Branch", - branchAddress: "789 Pine St, Metropolis, USA", - ifscCode: "IFSC54321", - swiftCode: "SWIFT98765", - routingNumber: "123456789", - iban: "IBAN123456789", - accountType: "checking", - bankPhoneNumber: "1234567890", - bankEmail: "jane.smith@example.com", + investmentName: "Pam Beesly", + mobileNo: "1234509876", + investmentAddress: "3487 Palm St, Scranton, USA", + accountHolderName: "Pam Beesly", + bankName: "Dunder Mifflin Bank", + accountNumber: "4444555566", + bankBranch: "Scranton Branch", + branchAddress: "101 Paper St, Scranton, USA", + ifscCode: "IFSC44444", + swiftCode: "SWIFT54321", + routingNumber: "543211234", + iban: "IBAN4444555566", + accountType: "savings", + bankPhoneNumber: "1234509876", + bankEmail: "pam.beesly@example.com", status: false, createdAt: "45", }, { id: 3, - investmentName: "Alice Johnson", - mobileNo: "1231231234", - sponserAddress: "789 Pine St, Gotham, USA", - accountHolderName: "Alice Johnson", - bankName: "Gotham Bank", - accountNumber: "5678901234", - bankBranch: "Uptown Branch", - branchAddress: "101 Oak St, Gotham, USA", - ifscCode: "IFSC67890", - swiftCode: "SWIFT34567", + investmentName: "Jim Halpert", + mobileNo: "2345678901", + investmentAddress: "5701 Maple Ave, Scranton, USA", + accountHolderName: "Jim Halpert", + bankName: "Dunder Mifflin Bank", + accountNumber: "7777888899", + bankBranch: "Scranton Branch", + branchAddress: "101 Paper St, Scranton, USA", + ifscCode: "IFSC77777", + swiftCode: "SWIFT87654", routingNumber: "987654321", - iban: "IBAN345678901", + iban: "IBAN7777888899", accountType: "business", - bankPhoneNumber: "5556667777", - bankEmail: "alice.johnson@example.com", + bankPhoneNumber: "2345678901", + bankEmail: "jim.halpert@example.com", status: true, createdAt: "12", }, { id: 4, - investmentName: "Bob Brown", - mobileNo: "3213214321", - sponserAddress: "101 Maple St, Smallville, USA", - accountHolderName: "Bob Brown", - bankName: "Smallville Credit Union", - accountNumber: "5432109876", - bankBranch: "Main Street Branch", - branchAddress: "202 Pine St, Smallville, USA", - ifscCode: "IFSC43210", - swiftCode: "SWIFT87654", - routingNumber: "123456789", - iban: "IBAN567890123", + investmentName: "Dwight Schrute", + mobileNo: "3456789012", + investmentAddress: "1725 Slough Ave, Scranton, USA", + accountHolderName: "Dwight Schrute", + bankName: "Dunder Mifflin Bank", + accountNumber: "3333444455", + bankBranch: "Scranton Branch", + branchAddress: "101 Paper St, Scranton, USA", + ifscCode: "IFSC33333", + swiftCode: "SWIFT34567", + routingNumber: "765432109", + iban: "IBAN3333444455", accountType: "savings", - bankPhoneNumber: "8889990000", - bankEmail: "bob.brown@example.com", + bankPhoneNumber: "3456789012", + bankEmail: "dwight.schrute@example.com", status: true, createdAt: "7", }, { id: 5, - investmentName: "Charlie Davis", - mobileNo: "5555555555", - sponserAddress: "202 Birch St, Star City, USA", - accountHolderName: "Charlie Davis", - bankName: "Star City Bank", - accountNumber: "9876543210", - bankBranch: "Downtown Branch", - branchAddress: "303 Oak St, Star City, USA", + investmentName: "Stanley Hudson", + mobileNo: "4567890123", + investmentAddress: "202 Industrial St, Scranton, USA", + accountHolderName: "Stanley Hudson", + bankName: "Dunder Mifflin Bank", + accountNumber: "5555666677", + bankBranch: "Scranton Branch", + branchAddress: "101 Paper St, Scranton, USA", ifscCode: "IFSC55555", - swiftCode: "SWIFT00000", - routingNumber: "111223344", - iban: "IBAN999988887", + swiftCode: "SWIFT45678", + routingNumber: "876543210", + iban: "IBAN5555666677", accountType: "checking", - bankPhoneNumber: "1112223333", - bankEmail: "charlie.davis@example.com", + bankPhoneNumber: "4567890123", + bankEmail: "stanley.hudson@example.com", status: false, createdAt: "4", }, { id: 6, - investmentName: "Daniel Evans", - mobileNo: "4444444444", - sponserAddress: "303 Cedar St, Central City, USA", - accountHolderName: "Daniel Evans", - bankName: "Central City Bank", - accountNumber: "4444555566", - bankBranch: "Uptown Branch", - branchAddress: "404 Elm St, Central City, USA", - ifscCode: "IFSC44444", - swiftCode: "SWIFT11111", - routingNumber: "555666777", - iban: "IBAN4444555566", + investmentName: "Angela Martin", + mobileNo: "5678901234", + investmentAddress: "7777 Cat Ave, Scranton, USA", + accountHolderName: "Angela Martin", + bankName: "Dunder Mifflin Bank", + accountNumber: "8888999900", + bankBranch: "Scranton Branch", + branchAddress: "101 Paper St, Scranton, USA", + ifscCode: "IFSC88888", + swiftCode: "SWIFT56789", + routingNumber: "987654321", + iban: "IBAN8888999900", accountType: "business", - bankPhoneNumber: "4445556666", - bankEmail: "daniel.evans@example.com", + bankPhoneNumber: "5678901234", + bankEmail: "angela.martin@example.com", status: true, createdAt: "2", }, { id: 7, - investmentName: "Ella Fitzgerald", - mobileNo: "3333333333", - sponserAddress: "404 Elm St, Coast City, USA", - accountHolderName: "Ella Fitzgerald", - bankName: "Coast City Bank", - accountNumber: "3333444455", - bankBranch: "Downtown Branch", - branchAddress: "505 Cedar St, Coast City, USA", - ifscCode: "IFSC77777", - swiftCode: "SWIFT22222", - routingNumber: "888999000", - iban: "IBAN888999000", + investmentName: "Kevin Malone", + mobileNo: "6789012345", + investmentAddress: "3333 Cookie Ln, Scranton, USA", + accountHolderName: "Kevin Malone", + bankName: "Dunder Mifflin Bank", + accountNumber: "9999000011", + bankBranch: "Scranton Branch", + branchAddress: "101 Paper St, Scranton, USA", + ifscCode: "IFSC99999", + swiftCode: "SWIFT67890", + routingNumber: "876543210", + iban: "IBAN9999000011", accountType: "savings", - bankPhoneNumber: "7778889999", - bankEmail: "ella.fitzgerald@example.com", + bankPhoneNumber: "6789012345", + bankEmail: "kevin.malone@example.com", status: false, createdAt: "9", }, { id: 8, - investmentName: "Frank Green", - mobileNo: "2222222222", - sponserAddress: "505 Ash St, Keystone City, USA", - accountHolderName: "Frank Green", - bankName: "Keystone City Bank", - accountNumber: "2222333344", - bankBranch: "Main Branch", - branchAddress: "606 Birch St, Keystone City, USA", - ifscCode: "IFSC88888", - swiftCode: "SWIFT33333", - routingNumber: "444555666", - iban: "IBAN444555666", + investmentName: "Phyllis Vance", + mobileNo: "7890123456", + investmentAddress: "4545 Knitting Way, Scranton, USA", + accountHolderName: "Phyllis Vance", + bankName: "Dunder Mifflin Bank", + accountNumber: "0000111122", + bankBranch: "Scranton Branch", + branchAddress: "101 Paper St, Scranton, USA", + ifscCode: "IFSC00000", + swiftCode: "SWIFT78901", + routingNumber: "123456789", + iban: "IBAN0000111122", accountType: "checking", - bankPhoneNumber: "2222333444", - bankEmail: "frank.green@example.com", + bankPhoneNumber: "7890123456", + bankEmail: "phyllis.vance@example.com", status: true, createdAt: "8", }, { id: 9, - investmentName: "Grace Hall", - mobileNo: "1111111111", - sponserAddress: "606 Willow St, Hub City, USA", - accountHolderName: "Grace Hall", - bankName: "Hub City Bank", + investmentName: "Meredith Palmer", + mobileNo: "8901234567", + investmentAddress: "6666 Booze Blvd, Scranton, USA", + accountHolderName: "Meredith Palmer", + bankName: "Dunder Mifflin Bank", accountNumber: "1111222233", - bankBranch: "Downtown Branch", - branchAddress: "707 Cedar St, Hub City, USA", - ifscCode: "IFSC99999", - swiftCode: "SWIFT44444", - routingNumber: "555566677", - iban: "IBAN555566677", + bankBranch: "Scranton Branch", + branchAddress: "101 Paper St, Scranton, USA", + ifscCode: "IFSC11111", + swiftCode: "SWIFT89012", + routingNumber: "123450987", + iban: "IBAN1111222233", accountType: "business", - bankPhoneNumber: "1111222333", - bankEmail: "grace.hall@example.com", + bankPhoneNumber: "8901234567", + bankEmail: "meredith.palmer@example.com", status: true, - createdAt: "1", + createdAt: "1" }, { id: 10, - investmentName: "Henry Ingram", - mobileNo: "6666666666", - sponserAddress: "707 Spruce St, Fawcett City, USA", - accountHolderName: "Henry Ingram", - bankName: "Fawcett City Bank", - accountNumber: "6666777788", - bankBranch: "Main Street Branch", - branchAddress: "808 Oak St, Fawcett City, USA", - ifscCode: "IFSC66666", - swiftCode: "SWIFT55555", - routingNumber: "999000111", - iban: "IBAN999000111", + investmentName: "Ryan Howard", + mobileNo: "9012345678", + investmentAddress: "7777 Temp Way, Scranton, USA", + accountHolderName: "Ryan Howard", + bankName: "Dunder Mifflin Bank", + accountNumber: "2222333344", + bankBranch: "Scranton Branch", + branchAddress: "101 Paper St, Scranton, USA", + ifscCode: "IFSC22222", + swiftCode: "SWIFT90123", + routingNumber: "234561098", + iban: "IBAN2222333344", accountType: "savings", - bankPhoneNumber: "6666777888", - bankEmail: "henry.ingram@example.com", + bankPhoneNumber: "9012345678", + bankEmail: "ryan.howard@example.com", status: false, createdAt: "6", }, { id: 11, - investmentName: "Grace Hall", - mobileNo: "1111111111", - sponserAddress: "606 Willow St, Hub City, USA", - accountHolderName: "Grace Hall", - bankName: "Hub City Bank", - accountNumber: "1111222233", - bankBranch: "Downtown Branch", - branchAddress: "707 Cedar St, Hub City, USA", - ifscCode: "IFSC99999", - swiftCode: "SWIFT44444", - routingNumber: "555566677", - iban: "IBAN555566677", + investmentName: "Oscar Martinez", + mobileNo: "0123456789", + investmentAddress: "2222 Math St, Scranton, USA", + accountHolderName: "Oscar Martinez", + bankName: "Dunder Mifflin Bank", + accountNumber: "3333444455", + bankBranch: "Scranton Branch", + branchAddress: "101 Paper St, Scranton, USA", + ifscCode: "IFSC33333", + swiftCode: "SWIFT01234", + routingNumber: "345671209", + iban: "IBAN3333444455", accountType: "business", - bankPhoneNumber: "1111222333", - bankEmail: "grace.hall@example.com", + bankPhoneNumber: "0123456789", + bankEmail: "oscar.martinez@example.com", status: true, createdAt: "1", }, { id: 12, - investmentName: "Henry Ingram", - mobileNo: "6666666666", - sponserAddress: "707 Spruce St, Fawcett City, USA", - accountHolderName: "Henry Ingram", - bankName: "Fawcett City Bank", - accountNumber: "6666777788", - bankBranch: "Main Street Branch", - branchAddress: "808 Oak St, Fawcett City, USA", - ifscCode: "IFSC66666", - swiftCode: "SWIFT55555", - routingNumber: "999000111", - iban: "IBAN999000111", + investmentName: "Kelly Kapoor", + mobileNo: "9876543210", + investmentAddress: "4444 Fashion Ave, Scranton, USA", + accountHolderName: "Kelly Kapoor", + bankName: "Dunder Mifflin Bank", + accountNumber: "4444555566", + bankBranch: "Scranton Branch", + branchAddress: "101 Paper St, Scranton, USA", + ifscCode: "IFSC44444", + swiftCode: "SWIFT23456", + routingNumber: "456781320", + iban: "IBAN4444555566", accountType: "savings", - bankPhoneNumber: "6666777888", - bankEmail: "henry.ingram@example.com", + bankPhoneNumber: "9876543210", + bankEmail: "kelly.kapoor@example.com", status: false, createdAt: "6", }, ]); + const [investment, setInvestment] = useState([ // { @@ -901,6 +902,117 @@ const GlobalStateProvider = ({ children }) => { }, ]); + const [investorRequest, setInvestorRequest] = useState([ + { + id: uuidv4(), + date: getRandomDate(startDate, endDate), + Distribution: "lorem ipsum dummy text", + charge: "500", + year: "2024", + quater: "Q 1", + amount: 1000, + }, + { + id: uuidv4(), + date: getRandomDate(startDate, endDate), + Distribution: "lorem ipsum dummy text", + charge: "500", + year: "2024", + quater: "Q 1", + amount: 1000, + }, + { + id: uuidv4(), + date: getRandomDate(startDate, endDate), + Distribution: "lorem ipsum dummy text", + charge: "500", + year: "2024", + quater: "Q 1", + amount: 1000, + }, + { + id: uuidv4(), + date: getRandomDate(startDate, endDate), + Distribution: "lorem ipsum dummy text", + charge: "500", + year: "2024", + quater: "Q 1", + amount: 1000, + }, + { + id: uuidv4(), + date: getRandomDate(startDate, endDate), + Distribution: "lorem ipsum dummy text", + charge: "500", + year: "2024", + quater: "Q 1", + amount: 1000, + }, + { + id: uuidv4(), + date: getRandomDate(startDate, endDate), + Distribution: "lorem ipsum dummy text", + charge: "500", + year: "2024", + quater: "Q 1", + amount: 1000, + }, + { + id: uuidv4(), + date: getRandomDate(startDate, endDate), + Distribution: "lorem ipsum dummy text", + charge: "500", + year: "2024", + quater: "Q 1", + amount: 1000, + }, + { + id: uuidv4(), + date: getRandomDate(startDate, endDate), + Distribution: "lorem ipsum dummy text", + charge: "500", + year: "2024", + quater: "Q 1", + amount: 1000, + }, + { + id: uuidv4(), + date: getRandomDate(startDate, endDate), + Distribution: "lorem ipsum dummy text", + charge: "500", + year: "2024", + quater: "Q 1", + amount: 1000, + }, + { + id: uuidv4(), + date: getRandomDate(startDate, endDate), + Distribution: "lorem ipsum dummy text", + charge: "500", + year: "2024", + quater: "Q 1", + amount: 1000, + }, + { + id: uuidv4(), + date: getRandomDate(startDate, endDate), + Distribution: "lorem ipsum dummy text", + charge: "500", + year: "2024", + quater: "Q 1", + amount: 1000, + }, + { + id: uuidv4(), + date: getRandomDate(startDate, endDate), + Distribution: "lorem ipsum dummy text", + charge: "500", + year: "2024", + quater: "Q 1", + amount: 1000, + }, + ]); + return ( { viewHistory, setViewHistory, investmentType, - setInvestmentType + setInvestmentType, + investorRequest, + setInvestorRequest, }} > {children} diff --git a/src/Pages/IO_Management/CreateIO.jsx b/src/Pages/IO_Management/CreateIO.jsx index 3ca1e26..da94be8 100644 --- a/src/Pages/IO_Management/CreateIO.jsx +++ b/src/Pages/IO_Management/CreateIO.jsx @@ -67,7 +67,6 @@ const CreateIO = () => { const { 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([]); @@ -128,6 +127,97 @@ const CreateIO = () => { label: item.sponserName, })); + + const [investForm, setInvestForm] = useState( + [ + { + label: "Investment object name", + name: "ioName", + type: "text", + isRequired: true, + }, + { + label: "Investment object", + name: "ioNameArabic", + placeHolder: "الرجاء إدخال القيمة", + arabic: true, + isRequired: true, + }, + { + label: "Destributed Amount", + placeHolder: "$00.0", + helperText: "Please enter value in $", + name: "destributedAmount", + type: "number", + isRequired: true, + }, + { + label: "Min Invest", + placeHolder: "$00.00", + helperText: "Please enter value in $", + name: "miniInvest", + type: "number", + isRequired: true, + }, + { + label: "Year", + name: "year", + type: "select", + options: years, + isRequired: true, + }, + { + label: "Quaterly", + name: "quaterly", + type: "select", + options: [ + { label: "Q1", value: "Q1" }, + { label: "Q2", value: "Q2" }, + { label: "Q3", value: "Q3" }, + { label: "Q4", value: "Q4" }, + ], + isRequired: true, + }, + { + label: "Sponsers Name", + name: "sponserName", + type: "select", + options: sponserOptions, + isRequired: true, + }, + { + label: "Target close", + name: "targetClose", + type: "date", + isRequired: true, + }, + { + label: "Tenure", + name: "tenure", + type: "number", + isRequired: true, + }, + { + label: "Annual yeild", + placeHolder: "00.00%", + helperText: "Please enter value in percentage", + name: "annualyield", + type: "number", + isRequired: true, + }, + { + label: "Annual return", + placeHolder: "00.00%", + helperText: "Please enter value in percentage", + name: "annualReturn", + type: "number", + isRequired: true, + }, + ] + ); + + + const handleBannerImageChange = (e) => { const file = e.target.files[0]; setBannerImageData(file); @@ -172,7 +262,7 @@ const CreateIO = () => { // Function to remove a specific image const removeOtherImage = (index) => { const newImageData = otherImageData.filter((_, i) => i !== index); - const newSelectedImageData = selectedOtherImageData.filter( + const newSelectedImageData = selectedOtherImageData.filter( (_, i) => i !== index ); @@ -186,134 +276,21 @@ const CreateIO = () => { Investment Object Details - - - - - - - - - - - - - - - - - - - - - - + + {investForm.map((field, index) => ( + + ))} diff --git a/src/Pages/IO_Management/ViewIO.jsx b/src/Pages/IO_Management/ViewIO.jsx index 2b1d1ec..3561caf 100644 --- a/src/Pages/IO_Management/ViewIO.jsx +++ b/src/Pages/IO_Management/ViewIO.jsx @@ -68,7 +68,7 @@ const ExchangeRate = () => { return ( - + {/* All */} {/* Available diff --git a/src/Pages/InvestorUpgrade/InvestorRequest.jsx b/src/Pages/InvestorUpgrade/InvestorRequest.jsx new file mode 100644 index 0000000..87f945d --- /dev/null +++ b/src/Pages/InvestorUpgrade/InvestorRequest.jsx @@ -0,0 +1,220 @@ +import { + Avatar, + Badge, + Box, + Button, + HStack, + Input, + Text, + 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 Pagination from "../../Components/Pagination"; +import GlobalStateContext from "../../Contexts/GlobalStateContext"; +import CustomAlertDialog from "../../Components/CustomAlertDialog"; +import { formatDate } from "../../Components/Functions/UTCConvertor"; +// import { formatDate } from "../../Components/Functions/UTCConvertor"; + +const InvestorRequest = () => { + const toast = useToast(); + const { slideFromRight, investorRequest, setInvestorRequest } = + 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 Filter]================================================================ + const filteredData = investorRequest.filter((item) => { + // Filter by name (case insensitive) + const name = item.Distribution; + 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; + }); + + // ====================================================[Table Setup]================================================================ + const tableHeadRow = [ + "Sr No.", + "Date", + "Distribution Amount", + "Charges (USD)", + "Year", + "Quater", + "Amount", + ]; + + const extractedArray = filteredData?.map((item, index) => ({ + id: item?.id, + "Sr No.": ( + + {index + 1}. + + ), + "Date": ( + + {formatDate(item.date)} + + ), + "Distribution Amount": ( + + {item.Distribution} + + ), + "Charges (USD)": ( + + {item.charge} + {/* {formatDate(item.charge)} */} + + ), + Year: ( + + {item.year} + + ), + Quater: ( + + {item.quater} + + ), + + Amount: ( + + {item.amount} + + ), + })); + + const handleDelete = () => { + const updatedSponsors = sponser.filter( + (sponsor) => sponsor.id !== actionId + ); + + setTimeout(() => { + setSponser(updatedSponsors); + setDeleteAlert(false); + setIsLoading(false); + }, 100); + setIsLoading(true); + }; + + return ( + + + + setSearchTerm(e.target.value)} + /> + + + + + + + + + + setDeleteAlert(false)} + isOpen={deleteAlert} + message={"Are you sure you want to delete sponers?"} + alertHandler={handleDelete} + isLoading={isLoading} + /> + + ); +}; + +export default InvestorRequest; diff --git a/src/Pages/Master/InvestmentType/AddInvestmentType.jsx b/src/Pages/Master/InvestmentType/AddInvestmentType.jsx index d0669e1..b751bb1 100644 --- a/src/Pages/Master/InvestmentType/AddInvestmentType.jsx +++ b/src/Pages/Master/InvestmentType/AddInvestmentType.jsx @@ -1,88 +1,42 @@ -import React, { useContext, useState } from "react"; +import React, { useContext } from "react"; +import { OPACITY_ON_LOAD } from "../../../Layout/animations"; import { Box, Divider, - FormControl, - FormLabel, Heading, - Input, - Select, - Textarea, Button, Text, - Image, } 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, WarningTwoIcon } from "@chakra-ui/icons"; +import { WarningTwoIcon } from "@chakra-ui/icons"; import { TiWarning } from "react-icons/ti"; -import { useNavigate } from "react-router-dom"; -import { v4 as uuidv4 } from "uuid"; -import { OPACITY_ON_LOAD } from "../../../Layout/animations"; import GlobalStateContext from "../../../Contexts/GlobalStateContext"; +import { useNavigate } from "react-router-dom"; import FormField from "../../../Components/FormField"; +import { v4 as uuidv4 } from "uuid"; const schema = yup.object().shape({ - ioNameArabic: yup.string().required("Arabic name is required"), - ioName: yup.string().required("Investment Object name is required"), - sponserName: 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"), - banner_image: yup.mixed().required("Profile image is required"), - // .test( - // 'fileSize', - // 'File size is too large', - // value => value && value.size <= 10485760 // 10MB - // ) - // .test( - // 'fileType', - // 'Unsupported file format', - // value => value && ['image/jpg', 'image/jpeg', 'image/gif', 'image/png'].includes(value.type) - // ), - other_image: yup.mixed().required("Profile image is required"), - // .test( - // 'fileSize', - // 'File size is too large', - // value => value && value.size <= 10485760 // 10MB - // ) - // .test( - // 'fileType', - // 'Unsupported file format', - // value => value && ['image/jpg', 'image/jpeg', 'image/gif', 'image/png'].includes(value.type) - // ), + investmentName: yup.string().required("Investment name is required"), + mobileNo: yup.string().required("Mobile no is required"), + investmentAddress: yup.string().required("Investment address is required"), + + bankName: yup.string().required("Bank Name is required"), + accountNumber: yup.string().required("Account Number is required"), + swiftCode: yup.string().required("SWIFT/BIC Code is required"), + bankEmail: yup.string().email("Invalid email format"), + + // routingNumber: yup.string().required("Routing Number is required"), + // iban: yup.string().required("IBAN is required"), + // accountType: yup.string().required("Account Type is required"), + // bankPhoneNumber: yup.string().required("Bank Phone Number is required"), + // bankBranch: yup.string().required("Bank Branch is required"), + // branchAddress: yup.string().required("Branch Address is required"), + // ifscCode: yup.string().required("IFSC Code is required"), + // accountHolderName: yup.string().required("Account Holder's Name is required"), }); -const startYear = 2024; -const endYear = 2124; -// const years = Array.from({ length: endYear - startYear + 1 }, (_, i) => startYear + i); -const years = Array.from({ length: 2124 - 2024 + 1 }, (_, i) => 2024 + i).map( - (year) => ({ value: year, label: year }) -); - -console.log(years); - export function debounce(func, delay) { let debounceTimer; return function (...args) { @@ -91,225 +45,139 @@ export function debounce(func, delay) { }; } - - - const AddInvestmentType = () => { const navigate = useNavigate(); - const { 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 { investmentType, setInvestmentType } = + useContext(GlobalStateContext); const { control, handleSubmit, - reset, - setValue, formState: { errors }, } = useForm({ resolver: yupResolver(schema), - // defaultValues: { - // destributedAmount: 0, - // tenure: 0, - // annualReturn: 0, - // miniInvest: 0, - // annualyield: 0, - // }, }); console.log(errors); 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(); + setInvestmentType([ + { + ...data, + status: true, + id: uuidv4(), + createdAt: new Date().toISOString(), + }, + ...investmentType, + ]); + navigate("/investment-type"); }; - // Extract options for the select input - const sponserOptions = sponser.map((item) => ({ - value: item.sponserName, - label: item.sponserName, - })); - - - -const investForm = [ - { - label: "Investment object name", - name: "ioName", - type: "text", - isRequired: true, - }, - { - label: "Investment object", - name: "ioNameArabic", - placeHolder: "الرجاء إدخال القيمة", - arabic: true, - isRequired: true, - }, - { - label: "Destributed Amount", - placeHolder: "$00.0", - helperText: "Please enter value in $", - name: "destributedAmount", - type: "number", - isRequired: true, - }, - { - label: "Min Invest", - placeHolder: "$00.00", - helperText: "Please enter value in $", - name: "miniInvest", - type: "number", - isRequired: true, - }, - { - label: "Year", - name: "year", - type: "select", - options: years, - isRequired: true, - }, - { - label: "Quaterly", - name: "quaterly", - type: "select", - options: [ - { label: "Q1", value: "Q1" }, - { label: "Q2", value: "Q2" }, - { label: "Q3", value: "Q3" }, - { label: "Q4", value: "Q4" }, - ], - isRequired: true, - }, - { - label: "Sponsers Name", - name: "sponserName", - type: "select", - isRequired: true, - }, - { - label: "Target close", - name: "targetClose", - type: "date", - isRequired: true, - }, - { - label: "Tenure", - name: "tenure", - type: "number", - isRequired: true, - }, - { - label: "Annual yeild", - placeHolder: "00.00%", - helperText: "Please enter value in percentage", - name: "annualyield", - type: "number", - isRequired: true, - }, - { - label: "Annual return", - placeHolder: "00.00%", - helperText: "Please enter value in percentage", - name: "annualReturn", - type: "number", - isRequired: true, - }, -]; - - 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); - } - }; - -// 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); -}; return ( - +
- - Investment Object Details + + Personal Details - - {investForm.map((field, index) => ( + + - ))} + + + + + + + + + + Bank Details + + + {Array(1).fill( + + {/* */} + + + + + + )} + size={"sm"} + width={"49.5%"} + rounded={"sm"} + type="submit" + colorScheme="green" + > + Submit + - - {/* */} ); }; diff --git a/src/Pages/Master/InvestmentType/EditInvestmentType.jsx b/src/Pages/Master/InvestmentType/EditInvestmentType.jsx index bc2f65d..447bd30 100644 --- a/src/Pages/Master/InvestmentType/EditInvestmentType.jsx +++ b/src/Pages/Master/InvestmentType/EditInvestmentType.jsx @@ -1,22 +1,160 @@ -import { Box, Image, Text } from "@chakra-ui/react" -// import error from "../assets/Error.svg" -import robot from "../../../assets/robot.png" -// import robot from "../assets/robot.png" -const EditInvestmentType = () => { - return ( - - - - {/* The requested URL was not found on this server. */} - - ) -} +import { Box, Button, Divider, Heading } from "@chakra-ui/react"; +import { useParams } from "react-router-dom"; +import { useContext, useEffect, useState } from "react"; +import { useForm } from "react-hook-form"; +import { yupResolver } from "@hookform/resolvers/yup"; +import FormField from "../../../Components/FormField"; +import GlobalStateContext from "../../../Contexts/GlobalStateContext"; +import { OPACITY_ON_LOAD } from "../../../Layout/animations"; +import AddInvestmentType from "./AddInvestmentType"; -export default EditInvestmentType \ No newline at end of file +const EditInvestmentType = () => { + const params = useParams(); + const { investmentType } = useContext(GlobalStateContext); + const [foundObject, setFoundObject] = useState(null); + + + const { + control, + handleSubmit, + reset, + formState: { errors }, + } = useForm({ + resolver: yupResolver(AddInvestmentType), + defaultValues: { + investmentName: foundObject?.investmentName, + mobileNo: foundObject?.mobileNo, + investmentAddress: foundObject?.investmentAddress, + bankName: foundObject?.bankName, + accountNumber: foundObject?.accountNumber, + swiftCode: foundObject?.swiftCode, + bankEmail: foundObject?.bankEmail, + }, + }); + + useEffect(() => { + // console.log(investmentName); + const id = params?.id; + console.log(id); + + // Ensure id is compared correctly + const found = investmentType.find((item) => item?.id.toString() === id.toString()); + console.log(found); + setFoundObject(found); + + if (found) { + reset({ + investmentName: found.investmentName, + mobileNo: found.mobileNo, + investmentAddress: found.investmentAddress, + bankName: found.bankName, + accountNumber: found.accountNumber, + swiftCode: found.swiftCode, + bankEmail: found.bankEmail, + }); + } + }, [params, investmentType, reset]); + + const onSubmit = (data)=> { + console.log(data); + } + + if (!foundObject) { + return Loading...; // or any loading indicator + } + + + + return ( + +
+ + + + + + + + + + + + + Bank Details + + + + + + + + + + + + + + +
+ ); +}; + +export default EditInvestmentType; diff --git a/src/Pages/Master/InvestmentType/InvestmentType.jsx b/src/Pages/Master/InvestmentType/InvestmentType.jsx index f61ccc5..8b9d961 100644 --- a/src/Pages/Master/InvestmentType/InvestmentType.jsx +++ b/src/Pages/Master/InvestmentType/InvestmentType.jsx @@ -14,25 +14,36 @@ import { 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 } from "react-router-dom"; -import { AddIcon, EmailIcon } from "@chakra-ui/icons"; +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 "../Sponser/AddSponser"; +import { debounce } from "./AddInvestmentType"; const formatDate = (date) => new Date(date).toLocaleDateString(); // Simple date formatter const InvestmentType = () => { - const toast = useToast() - const { investmentType, setInvestmentType,slideFromRight } = useContext(GlobalStateContext); + const navigate = useNavigate() + const toast = useToast(); + const { investmentType, setInvestmentType, slideFromRight } = + useContext(GlobalStateContext); const [searchTerm, setSearchTerm] = useState(""); const [isLoading, setIsLoading] = useState(true); const [deleteAlert, setDeleteAlert] = useState(false); @@ -40,7 +51,6 @@ const InvestmentType = () => { const [mouseEntered, setMouseEntered] = useState(false); const [mouseEnteredId, setMouseEnteredId] = useState(""); - useEffect(() => { // Simulate loading const timer = setTimeout(() => { @@ -53,28 +63,24 @@ const InvestmentType = () => { // ====================================================[Table Setup]================================================================ const tableHeadRow = [ - "investment name", + "Investment name", "Address", "Mobile no", "Status", "Created At", + "Action", ]; const handleUpdateStatus = debounce((id) => { - setInvestmentType((prevInvestmentType) => prevInvestmentType.map((investmentType) => investmentType.id === id ? { ...investmentType, status: !investmentType.status } : investmentType ) ); toast({ - render: () => ( - - ), + render: () => , }); - },300) ; + }, 300); // ====================================================[Table Filter]================================================================ const filteredData = investmentType.filter((item) => { @@ -97,63 +103,65 @@ const InvestmentType = () => { const extractedArray = filteredData?.map((item) => ({ id: item?.id, - "investment name": ( - {item.investmentName} ), Address: ( - - - {item.sponserAddress} + + + {item.investmentAddress} ), "Mobile no": ( - + {item.mobileNo} ), - Status: + Status: ( handleUpdateStatus(item.id)} isChecked={item.status} /> + ), + + // item?.status ? ( + // + // Passed + // + // ) : ( + // + // Not passes + // + // ), - // item?.status ? ( - // - // Passed - // - // ) : ( - // - // Not passes - // - // ), - - , "Created At": ( - + {formatDate(item.createdAt)} - + {/* - + Edit - + View { - + */} ), + Action: ( + + + + + + + + + + + + + + + + + + ), + + // "Created At": + // mouseEntered && mouseEnteredId === item?.id ? ( + // // false ? ( + // + // + // + // + // + // + // + // + // + // + // + // ) : ( + // + // + // {formatDate(item.createdAt)} + // + // + // ), })); const handleDelete = () => { - const updatedInvestmentType = investmentType.filter((investmentType) => investmentType.id !== actionId); + const updatedSponsors = sponser.filter( + (sponsor) => sponsor.id !== actionId + ); setTimeout(() => { - setInvestmentType(updatedInvestmentType); + setSponser(updatedSponsors); setDeleteAlert(false); setIsLoading(false); }, 100); setIsLoading(true); }; - - - return ( @@ -235,18 +337,14 @@ const InvestmentType = () => { setViewActionId={setActionId} // totalPages={10} - - - - setMouseEnteredId={setMouseEnteredId} setMouseEntered={setMouseEntered} /> setDeleteAlert(false)} + onClose={() => setDeleteAlert(false)} isOpen={deleteAlert} - message={"Are you sure you want to delete Investment Type?"} + message={"Are you sure you want to delete sponers?"} alertHandler={handleDelete} isLoading={isLoading} /> diff --git a/src/Pages/Master/InvestmentType/ViewInvestmentType.jsx b/src/Pages/Master/InvestmentType/ViewInvestmentType.jsx index 1c1b8fe..4eaf235 100644 --- a/src/Pages/Master/InvestmentType/ViewInvestmentType.jsx +++ b/src/Pages/Master/InvestmentType/ViewInvestmentType.jsx @@ -1,22 +1,55 @@ -import { Box, Image, Text } from "@chakra-ui/react" +import { Box, FormControl, FormLabel, Image, Text } from "@chakra-ui/react"; // import error from "../assets/Error.svg" -import robot from "../../../assets/robot.png" +import robot from "../../../assets/robot.png"; +import { OPACITY_ON_LOAD } from "../../../Layout/animations"; +import { useParams } from "react-router-dom"; +import GlobalStateContext from "../../../Contexts/GlobalStateContext"; +import { useContext } from "react"; // import robot from "../assets/robot.png" const ViewInvestmentType = () => { - return ( - - - - {/* The requested URL was not found on this server. */} - - ) -} + const params = useParams(); + const { investmentType } = useContext(GlobalStateContext); + const id = params?.id; -export default ViewInvestmentType \ No newline at end of file + const found = investmentType.find( + (item) => item?.id.toString() === id.toString() + ); + + return ( + + + + + + Investment name + + {found?.investmentName} + + + + + Inves name ( Arabic ) + + {found?.investmentName} + + + + + ADDRESS + + {found?.investmentAddress} + + + + + Moobile no + + {found?.mobileNo} + + + + + ); +}; + +export default ViewInvestmentType; diff --git a/src/Pages/Master/Sponser/AddSponser.jsx b/src/Pages/Master/Sponser/AddSponser.jsx index 0ae4f37..05c4d4c 100644 --- a/src/Pages/Master/Sponser/AddSponser.jsx +++ b/src/Pages/Master/Sponser/AddSponser.jsx @@ -42,11 +42,9 @@ const schema = yup.object().shape({ // accountHolderName: yup.string().required("Account Holder's Name is required"), }); - - export function debounce(func, delay) { let debounceTimer; - return function(...args) { + return function (...args) { clearTimeout(debounceTimer); debounceTimer = setTimeout(() => func.apply(this, args), delay); }; @@ -85,21 +83,22 @@ const AddSponser = () => { Personal Details
- + + /> + { isRequired={true} /> - @@ -127,7 +125,13 @@ const AddSponser = () => { {Array(1).fill( - + {/* { - return ( - - - - {/* The requested URL was not found on this server. */} - - ) -} +import { Box, Button, Divider, Heading } from "@chakra-ui/react"; +import { useParams } from "react-router-dom"; +import { useContext, useEffect, useState } from "react"; +import { useForm } from "react-hook-form"; +import { yupResolver } from "@hookform/resolvers/yup"; +import FormField from "../../../Components/FormField"; +import GlobalStateContext from "../../../Contexts/GlobalStateContext"; +import { OPACITY_ON_LOAD } from "../../../Layout/animations"; +import AddSponser from "./AddSponser"; -export default EditSponser \ No newline at end of file +const EditSponser = () => { + const params = useParams(); + const { sponser } = useContext(GlobalStateContext); + const [foundObject, setFoundObject] = useState(null); + + + const { + control, + handleSubmit, + reset, + formState: { errors }, + } = useForm({ + resolver: yupResolver(AddSponser), + defaultValues: { + sponserName: foundObject?.sponserName, + mobileNo: foundObject?.mobileNo, + sponserAddress: foundObject?.sponserAddress, + bankName: foundObject?.bankName, + accountNumber: foundObject?.accountNumber, + swiftCode: foundObject?.swiftCode, + bankEmail: foundObject?.bankEmail, + }, + }); + + useEffect(() => { + console.log(sponser); + const id = params?.id; + console.log(id); + + // Ensure id is compared correctly + const found = sponser.find((item) => item?.id.toString() === id.toString()); + console.log(found); + setFoundObject(found); + + if (found) { + reset({ + sponserName: found.sponserName, + mobileNo: found.mobileNo, + sponserAddress: found.sponserAddress, + bankName: found.bankName, + accountNumber: found.accountNumber, + swiftCode: found.swiftCode, + bankEmail: found.bankEmail, + }); + } + }, [params, sponser, reset]); + + if (!foundObject) { + return Loading...; // or any loading indicator + } + + return ( + +
+ + + + + + + + + + + + + Bank Details + + + + + + + + + + + + + + +
+ ); +}; + +export default EditSponser; diff --git a/src/Pages/Master/Sponser/Sponsers.jsx b/src/Pages/Master/Sponser/Sponsers.jsx index b1eaa13..7c50e6e 100644 --- a/src/Pages/Master/Sponser/Sponsers.jsx +++ b/src/Pages/Master/Sponser/Sponsers.jsx @@ -21,7 +21,7 @@ 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 } from "react-router-dom"; +import { Link, Link as RouterLink, useNavigate } from "react-router-dom"; import { AddIcon, CheckIcon, @@ -40,6 +40,7 @@ import { debounce } from "./AddSponser"; const formatDate = (date) => new Date(date).toLocaleDateString(); // Simple date formatter const Sponser = () => { + const navigate = useNavigate() const toast = useToast(); const { sponser, setSponser, slideFromRight } = useContext(GlobalStateContext); @@ -191,6 +192,7 @@ const Sponser = () => {