From 5265aed4f8d8d54b0311a2d69355411a506199dd Mon Sep 17 00:00:00 2001 From: siddheshmorewdi Date: Fri, 28 Jun 2024 15:11:57 +0530 Subject: [PATCH] updated siddhesh --- src/Components/DataTable/DataTable.jsx | 99 +- src/Components/FormField.jsx | 2 +- src/Pages/IO_Management/AddIOCharges.jsx | 149 ++++ src/Pages/IO_Management/CreateIO.jsx | 843 ++++++++++-------- src/Pages/IO_Management/ViewIO.jsx | 14 +- .../Investor_Management/InvestorDetails.jsx | 3 +- src/Pages/Login.jsx | 6 +- .../Master/ExchangeRate/EditExchangeRate.jsx | 24 +- .../Master/ExchangeRate/ExchangeRate.jsx | 2 +- src/Pages/Master/Sponser/AddSponser.jsx | 45 +- src/Pages/Master/Sponser/Sponsers.jsx | 175 +++- src/Pages/WithDrawal/PendingRequest.jsx | 23 +- src/Pages/WithDrawal/ViewHistory.jsx | 4 +- 13 files changed, 868 insertions(+), 521 deletions(-) create mode 100644 src/Pages/IO_Management/AddIOCharges.jsx diff --git a/src/Components/DataTable/DataTable.jsx b/src/Components/DataTable/DataTable.jsx index 14b94ed..f8864ed 100644 --- a/src/Components/DataTable/DataTable.jsx +++ b/src/Components/DataTable/DataTable.jsx @@ -9,10 +9,8 @@ import { Tr, Skeleton, TableCaption, - Tfoot, } from "@chakra-ui/react"; import EmptySearchList from "../EmptySearchList"; -import Pagination from "../Pagination"; import { useNavigate } from "react-router-dom"; import GlobalStateContext from "../../Contexts/GlobalStateContext"; @@ -22,86 +20,83 @@ const DataTable = ({ isLoading, tableHeadRow, emptyMessage, - totalPages, setMouseEntered, setMouseEnteredId, }) => { const navigate = useNavigate(); const { slideFromRight } = useContext(GlobalStateContext); - const columnWidth = - data && data[0] - ? `${(100 / Object.keys(data[0]).length).toFixed(2)}%` - : "auto"; return ( {data?.length === 0 ? ( ) : ( - {/* */} Tanami v1.0 {tableHeadRow.map((heading, index) => ( ))} - { data?.map((item, index) => ( - { - e.currentTarget.style.backgroundColor = "transparent"; // Change the background color on hover - e.currentTarget.style.transition = "0.1s"; - e.currentTarget.style.boxShadow = - "rgba(0, 0, 0, 0.24) 0px 1px 8px"; - setMouseEntered(true); - setMouseEnteredId(item.id); + {data?.map((item, index) => ( + { + // e.currentTarget.style.backgroundColor = "transparent"; // Change the background color on hover + // e.currentTarget.style.transition = "0.1s"; + // e.currentTarget.style.boxShadow = + // "rgba(0, 0, 0, 0.24) 0px 1px 8px"; + // setMouseEntered(true); + // setMouseEnteredId(item.id); + // }} + // onMouseLeave={(e) => { + // e.currentTarget.style.backgroundColor = "transparent"; // Revert to default background color on hover out + // e.currentTarget.style.transition = "0.3s"; + // e.currentTarget.style.boxShadow = "none"; + // setMouseEntered(false); + // }} + transition={"0.5s all"} + _hover={{ + bg: "green.50", + cursor: "pointer", + }} + key={index} + > + {tableHeadRow.map((heading, i) => ( + - ))} - + + {item[heading]} + + ))} + + ))}
- {heading} + + {heading} +
{ - e.currentTarget.style.backgroundColor = "transparent"; // Revert to default background color on hover out - e.currentTarget.style.transition = "0.3s"; - e.currentTarget.style.boxShadow = "none"; - setMouseEntered(false); - }} - transition={"0.5s all"} - _hover={{ - bg: "green.50", - cursor: "pointer", - }} - key={index} + className="web-text-small" + // onClick={ + // i === tableHeadRow.length - 1 || i === 0 + // ? null + // : () => navigate(`edit-sponser/${item.id}`) // Define the onClick handler for other cells + // } > - {tableHeadRow.map((heading, i) => ( - navigate(`edit-sponser/${item.id}`) // Define the onClick handler for other cells - // } - > - {item[heading]} -
)} diff --git a/src/Components/FormField.jsx b/src/Components/FormField.jsx index e11e1f3..af1ee46 100644 --- a/src/Components/FormField.jsx +++ b/src/Components/FormField.jsx @@ -19,7 +19,7 @@ const FormField = ({ handleImageChange, ...props }) => ( - + {label} { + if (!date) return ""; + const d = new Date(date); + let month = "" + (d.getMonth() + 1); + let day = "" + d.getDate(); + const year = d.getFullYear(); + + if (month.length < 2) month = "0" + month; + if (day.length < 2) day = "0" + day; + + return [year, month, day].join("-"); +}; + +const AddIOCharges = ({ setCharges, charges }) => { + const btnRef = useRef(); + const { isOpen, onOpen, onClose } = useDisclosure(); + + const [chargeTitle, setChargeTitle] = useState(""); + const [chargeValue, setChargeValue] = useState(0.0); + + const handleSave = () => { + setCharges([ + ...charges, + { + title: chargeTitle, + value: chargeValue, + }, + ]); + + setChargeTitle(""); + setChargeValue(""); + + setTimeout(() => { + onClose(); + }, 100); + }; + + return ( + <> + + + + + + Add charges + + + + Charge title + setChargeTitle(e.target.value)} + fontSize={"sm"} + type="text" + size={"sm"} + placeholder="Charge title" + /> + + + + Charge value + setChargeValue(e.target.value)} + fontSize={"sm"} + type="number" + size={"sm"} + placeholder="00.00$" + /> + + Please enter value in Dollars + + + + + + + + + + + + + ); +}; + +export default AddIOCharges; diff --git a/src/Pages/IO_Management/CreateIO.jsx b/src/Pages/IO_Management/CreateIO.jsx index 269c47f..da924ac 100644 --- a/src/Pages/IO_Management/CreateIO.jsx +++ b/src/Pages/IO_Management/CreateIO.jsx @@ -1,4 +1,4 @@ -import React, { useContext, useState } from "react"; +import React, { useContext, useEffect, useState } from "react"; import { OPACITY_ON_LOAD } from "../../Layout/animations"; import { Box, @@ -22,6 +22,7 @@ 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"; const schema = yup.object().shape({ ioNameArabic: yup.string().required("Arabic name is required"), @@ -51,71 +52,63 @@ const schema = yup.object().shape({ .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) - // ), }); 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 }) -); +const years = Array.from( + { length: endYear - startYear + 1 }, + (_, i) => startYear + i +).map((year) => ({ value: year, label: year })); -export function debounce(func, delay) { - let debounceTimer; - return function (...args) { - clearTimeout(debounceTimer); - debounceTimer = setTimeout(() => func.apply(this, args), delay); - }; -} const CreateIO = () => { const navigate = useNavigate(); - const { sponser, setSponser } = useContext(GlobalStateContext); + const { sponser } = 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 { control, handleSubmit, reset, + watch, formState: { errors }, } = useForm({ resolver: yupResolver(schema), - // defaultValues: { - // destributedAmount: 0, - // tenure: 0, - // annualReturn: 0, - // miniInvest: 0, - // annualyield: 0, - // }, }); console.log(errors); + 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) => { console.log(data); navigate("/view-io"); @@ -140,350 +133,484 @@ const CreateIO = () => { } }; -// Handler for file input -const handleOtherImageChange = (e) => { - const files = Array.from(e.target.files); - const newImageData = [...(otherImageData || []), ...files]; // Ensure otherImageData is an array + // 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); + 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); + 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); + 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); + }; - setOtherImageData(newImageData); - setSelectedOtherImageData(newSelectedImageData); -}; return (
Investment Object Details - - - + + - + - + - + - + - + - + - {selectedBannerImageData && ( - - profile - - setSelectedBannerImageData(null)} - className="link pointer" - p={1} - fontSize={"lg"} - color={"red"} - fontWeight={"500"} - rounded={"md"} - position={"absolute"} - top={1} - right={0} - /> - - {bannerImageData?.name} - - - {(bannerImageData?.size / (1024 * 1024)).toFixed(2)} mb - - - - )} - + - - + - + - - - - - - - - - - {selectedOtherImageData?.length > 0 && ( - - {selectedOtherImageData.map((imageData, index) => ( - - {`profile-${index}`} - - removeOtherImage(index)} - bg={"#fff"} - className="link pointer" - p={1} - fontSize={"lg"} - color={"red"} - fontWeight={"500"} - rounded={"md"} - position={"absolute"} - bottom={0} - right={0} - /> - - {otherImageData[index]?.name} - - - {(otherImageData[index]?.size / (1024 * 1024)).toFixed( - 2 - )}{" "} - mb - - - - ))} - {/* */} - document.getElementById('otherImageInput').click()} - rounded={"md"} - width={50} - height={50} - mt={26} - p={4} - cursor={"pointer"} - // rounded={'md'} - className="link" - /> - {/* */} - - )} - - - + + + + + Uplaod Banner Images + + + + + + + {selectedBannerImageData && ( + + profile + + setSelectedBannerImageData(null)} + className="link pointer" + p={1} + fontSize={"lg"} + color={"red"} + fontWeight={"500"} + rounded={"md"} + position={"absolute"} + top={1} + right={0} + /> + + {bannerImageData?.name} + + + {(bannerImageData?.size / (1024 * 1024)).toFixed(2)} mb + + + + )} + + {selectedOtherImageData?.length > 0 && ( + + {selectedOtherImageData.map((imageData, index) => ( + + {`profile-${index}`} + + removeOtherImage(index)} + bg={"#fff"} + className="link pointer" + p={1} + fontSize={"lg"} + color={"red"} + fontWeight={"500"} + rounded={"md"} + position={"absolute"} + bottom={0} + right={0} + /> + + {otherImageData[index]?.name} + + + {(otherImageData[index]?.size / (1024 * 1024)).toFixed(2)}{" "} + mb + + + + ))} + {/* */} + + document.getElementById("otherImageInput").click() + } + rounded={"md"} + width={50} + height={50} + mt={26} + p={4} + cursor={"pointer"} + // rounded={'md'} + className="link" + /> + {/* */} + + )} + + + + + + + + Final calculation + + + + + {charges.map(({ title, value }, index) => ( + + + {title} + + + $ {value} + + + ))} + + + {totalCharge !== 0 ? ( + + + Total charges + + + $ {totalCharge.toFixed(4)} + + + ) : ( + "" + )} + + + + + Total distributed amount + + + $ {destributedAmount.toFixed(4)} + + + + + + Total Net Charges + + + $ {totalAmount.toFixed(4)} + + + + + + + + size={"sm"} + width={"50%"} + rounded={"sm"} + type="submit" + colorScheme="green" + mt={4} + > + Submit + - - {/* */} +
); }; diff --git a/src/Pages/IO_Management/ViewIO.jsx b/src/Pages/IO_Management/ViewIO.jsx index e12841c..c4730bd 100644 --- a/src/Pages/IO_Management/ViewIO.jsx +++ b/src/Pages/IO_Management/ViewIO.jsx @@ -70,17 +70,17 @@ const ExchangeRate = () => { - All - Available + {/* All */} + {/* Available Upcomming - Closed + Closed */} - + /> */} @@ -122,7 +122,7 @@ const ExchangeRate = () => { )} - + {/* { )) )} - + */} diff --git a/src/Pages/Investor_Management/InvestorDetails.jsx b/src/Pages/Investor_Management/InvestorDetails.jsx index 6a4f973..9c58af4 100644 --- a/src/Pages/Investor_Management/InvestorDetails.jsx +++ b/src/Pages/Investor_Management/InvestorDetails.jsx @@ -141,7 +141,8 @@ const InvestorDetails = () => { // ), Action: ( - ), diff --git a/src/Pages/Login.jsx b/src/Pages/Login.jsx index a1242bc..ee3f309 100644 --- a/src/Pages/Login.jsx +++ b/src/Pages/Login.jsx @@ -44,7 +44,7 @@ const Login = () => { const onSubmit = (value) => { setIsLoading(true); - if (value.name === "Admin" && value.password === "Admin") { + if (value.name === "admin@tanami.com" && value.password === "Admin@123") { return setTimeout(() => { // dispatch(loginUser(true)); setIsAuthenticate(true); @@ -125,7 +125,7 @@ const Login = () => { className="mb-4" /> - Welcome back. + Welcome. Login to manage tanami. @@ -134,7 +134,7 @@ const Login = () => { - Owner name * + E-mail * { return ( <> - + { // - + ), })); diff --git a/src/Pages/Master/Sponser/AddSponser.jsx b/src/Pages/Master/Sponser/AddSponser.jsx index 06500dc..b4c7b41 100644 --- a/src/Pages/Master/Sponser/AddSponser.jsx +++ b/src/Pages/Master/Sponser/AddSponser.jsx @@ -84,20 +84,21 @@ const AddSponser = () => { Personal Details - + + /> { /> - - - @@ -141,13 +126,7 @@ const AddSponser = () => { {Array(1).fill( - + {/* { )} - + + + + + + + + + + + + + + + ), + + // "Created At": + // mouseEntered && mouseEnteredId === item?.id ? ( + // // false ? ( + // + // + // + // + // + // + // + // + // + // + // + // ) : ( + // + // + // {formatDate(item.createdAt)} + // + // + // ), })); const handleDelete = () => { - const updatedSponsors = sponser.filter((sponsor) => sponsor.id !== actionId); + const updatedSponsors = sponser.filter( + (sponsor) => sponsor.id !== actionId + ); setTimeout(() => { setSponser(updatedSponsors); @@ -185,9 +285,6 @@ const Sponser = () => { setIsLoading(true); }; - - - return ( @@ -237,16 +334,12 @@ const Sponser = () => { setViewActionId={setActionId} // totalPages={10} - - - - setMouseEnteredId={setMouseEnteredId} setMouseEntered={setMouseEntered} /> setDeleteAlert(false)} + onClose={() => setDeleteAlert(false)} isOpen={deleteAlert} message={"Are you sure you want to delete sponers?"} alertHandler={handleDelete} diff --git a/src/Pages/WithDrawal/PendingRequest.jsx b/src/Pages/WithDrawal/PendingRequest.jsx index a8a7db6..c4604f6 100644 --- a/src/Pages/WithDrawal/PendingRequest.jsx +++ b/src/Pages/WithDrawal/PendingRequest.jsx @@ -6,6 +6,7 @@ import { HStack, Input, Text, + Tooltip, useToast, } from "@chakra-ui/react"; import React, { useContext, useEffect, useState } from "react"; @@ -15,6 +16,7 @@ import Pagination from "../../Components/Pagination"; import GlobalStateContext from "../../Contexts/GlobalStateContext"; import CustomAlertDialog from "../../Components/CustomAlertDialog"; import { formatDate } from "../../Components/Functions/UTCConvertor"; +import { CheckIcon, CloseIcon } from "@chakra-ui/icons"; // import { formatDate } from "../../Components/Functions/UTCConvertor"; const PendingRequest = () => { @@ -65,7 +67,7 @@ const PendingRequest = () => { "Charges (USD)", "Year", "Quater", - "Amount", + "Action", ]; const extractedArray = filteredData?.map((item, index) => ({ @@ -138,16 +140,15 @@ const PendingRequest = () => { ), - Amount: ( - - {item.amount} - + Action: ( + + + + + + ), })); diff --git a/src/Pages/WithDrawal/ViewHistory.jsx b/src/Pages/WithDrawal/ViewHistory.jsx index 82d37cb..6dc35e3 100644 --- a/src/Pages/WithDrawal/ViewHistory.jsx +++ b/src/Pages/WithDrawal/ViewHistory.jsx @@ -65,7 +65,7 @@ const ViewHistory = () => { "Charges (USD)", "Year", "Quater", - "Amount", + "Action", ]; const extractedArray = filteredData?.map((item, index) => ({ @@ -138,7 +138,7 @@ const ViewHistory = () => { ), - Amount: ( + Action: (