Siddhesh.More/tanami-admin-panel
1
0
Fork 0
Code Issues 4 Pull Requests Packages Projects Releases 2 Wiki Activity

mobile changes

Browse Source
This commit is contained in:
YasinShaikh123
2024-08-28 19:35:39 +05:30
parent 86ce31e86c
commit 91e362d6c2
11 changed files with 443 additions and 300 deletions
Download Patch File Download Diff File Expand all files Collapse all files

92
src/Components/MobileView.jsx
View File

@@ -27,7 +27,7 @@ import { BiWifi } from "react-icons/bi";
import { useGetIOByIdQuery } from "../Services/io.service";
import { useNavigate, useParams } from "react-router-dom";
import FullscreenLoaders from "./Loaders/FullscreenLoaders";
import { formatDate } from "../Constants/Constants";
import { calculatePercentage, formatDate } from "../Constants/Constants";
import { BsFileText } from "react-icons/bs";
const MobileView = ({ isOpen, onClose, finalRef, actionId }) => {
@@ -63,6 +63,13 @@ const MobileView = ({ isOpen, onClose, finalRef, actionId }) => {
});
};
console.log(
calculatePercentage(
IObyID?.data?.totalAmtInvestmentInUSD,
IObyID?.data?.goalAmount
)
);
return (
<Modal
display={"flex"}
@@ -89,12 +96,12 @@ const MobileView = ({ isOpen, onClose, finalRef, actionId }) => {
w={"320px"}
sx={{
"@media (max-width: 2024px)": {
height:"695px",
width:"360px",
height: "695px",
width: "360px",
},
"@media (max-width: 1440px)": {
height:"600px",
width:"320px",
height: "600px",
width: "320px",
},
}}
>
@@ -117,16 +124,12 @@ const MobileView = ({ isOpen, onClose, finalRef, actionId }) => {
>
{IObyIDisLoading ? (
<Box
display={"flex"}
justifyContent={"center"}
alignItems={"center"}
h={"100%"}
display={"flex"}
justifyContent={"center"}
alignItems={"center"}
h={"100%"}
>
<Spinner
thickness='3px'
color='purple.900'
size='lg'
/>
<Spinner thickness="3px" color="purple.900" size="lg" />
</Box>
) : (
<>
@@ -174,10 +177,10 @@ const MobileView = ({ isOpen, onClose, finalRef, actionId }) => {
borderBottomRightRadius={"23px"}
sx={{
"@media (max-width: 2024px)": {
height:"575px",
height: "575px",
},
"@media (max-width: 1440px)": {
height:"483px",
height: "483px",
},
}}
>
@@ -246,7 +249,10 @@ const MobileView = ({ isOpen, onClose, finalRef, actionId }) => {
<Progress
colorScheme="green"
size="sm"
value={20}
value={calculatePercentage(
IObyID?.data?.totalAmtInvestmentInUSD,
IObyID?.data?.goalAmount
)}
borderRadius={"3px"}
/>
<Text
@@ -255,7 +261,16 @@ const MobileView = ({ isOpen, onClose, finalRef, actionId }) => {
fontWeight={600}
mb={0}
>
0.0% funded
{parseFloat(
calculatePercentage(
IObyID?.data?.totalAmtInvestmentInUSD,
IObyID?.data?.goalAmount
) || 0
).toLocaleString(undefined, {
minimumFractionDigits: 2,
maximumFractionDigits: 2,
})}
% funded
</Text>
<Text
fontSize={"xs"}
@@ -334,25 +349,28 @@ const MobileView = ({ isOpen, onClose, finalRef, actionId }) => {
<Heading fontSize="14px" fontWeight={600}>
Key Merits
</Heading>
<Box display={"flex"} alignItems={"center"}>
{keyMerits?.[0]?.icon?.iconFilePath && (
<Image
rounded={"md"}
display={"flex"}
p={1}
justifyContent={"center"}
alignItems={"center"}
src={
"https://tanami.betadelivery.com/" +
keyMerits[0].icon.iconFilePath
}
w={8}
h={8}
/>
)}
<Text fontSize={"xs"} mb={0}>
{IObyID?.data?.keyMerits[0]?.meritsDescription}
</Text>
<Box>
{keyMerits &&
keyMerits.map((item, index) => (
<Box display={"flex"} alignItems={"center"}>
<Image
rounded={"md"}
display={"flex"}
p={1}
justifyContent={"center"}
alignItems={"center"}
src={
"https://tanami.betadelivery.com/" +
item?.icon.iconFilePath
}
w={8}
h={8}
/>
<Text fontSize={"xs"} mb={0}>
{item?.meritsDescription}
</Text>
</Box>
))}
</Box>
</Box>
<Box