Skip to content

2
2022-257
Commit fcfefc9f authored by Madhura Mihiranga H.N. IT19177410's avatar Madhura Mihiranga H.N. IT19177410
Browse files
Options

results page ui changes

parent fa323d4c
Hide whitespace changes
Inline Side-by-side
Showing with 25 additions and 13 deletions
bussifinder/src/components/Results.js
View file @ fcfefc9f
......@@ -42,6 +42,13 @@ import { useSelector, useDispatch } from 'react-redux';
import { compareBusiness } from '../features/business';
import { useNavigate } from "react-router-dom";
import BGImage from '../images/vadim-bogulov-Vq-Sqr7D_7k-unsplash.jpg';
import {GiPathDistance} from 'react-icons/gi';
import {MdWork} from 'react-icons/md';
import {IoMdSchool} from 'react-icons/io';
import {HiShoppingBag} from 'react-icons/hi';
import {RiRestaurantFill} from 'react-icons/ri';
import {MdOutlineDeliveryDining} from 'react-icons/md';
import {AiOutlineClockCircle} from 'react-icons/ai';
import { jsPDF } from "jspdf";
......@@ -338,7 +345,7 @@ const doc = new jsPDF();
<Box sx={{
width: "100%",
boxSizing: "border-box",
backgroundColor: themeColor.status == 'light' ? '#f5f5f5' : '#3e3d3d',
backgroundColor: themeColor.status == 'light' ? '#1e2936' : '#3e3d3d',
height: "150vh",
display: "grid",
gridTemplateColumns: "6fr 3fr",
......@@ -348,6 +355,8 @@ const doc = new jsPDF();
backgroundRepeat: 'no-repeat',
backgroundSize: 'cover',
backgroundAttachment:'fixed',
backgroundBlendMode:'overlay',
}}>
<Box
......@@ -418,16 +427,16 @@ const doc = new jsPDF();
<div className={classes.featureTitleTxt}>Location Based Features</div>
<Box className={classes.featuresBox}>
<Grow in={checked} style={{ transformOrigin: '0 0 0' }} {...(checked ? { timeout: 500 } : {})} >
<div className={classes.features}><LocationOnRoundedIcon style={{ color: '#4534b1' }} />Location Attractiveness Places - {businessDetails && businessDetails.value[0].locationFeatures.attractionPlacesCount}</div>
<div className={classes.features}><LocationOnRoundedIcon style={{ color: '#df5e52' }} />Location Attractiveness Places - {businessDetails && businessDetails.value[0].locationFeatures.attractionPlacesCount}</div>
</Grow>
<Grow in={checked} style={{ transformOrigin: '0 0 0' }} {...(checked ? { timeout: 800 } : {})} >
<div className={classes.features}><DirectionsTransitFilledSharpIcon style={{ color: '#4534b1' }} />Transportation Modes Count - {businessDetails && businessDetails.value[0].locationFeatures.transportationModesCount}</div>
<div className={classes.features}><DirectionsTransitFilledSharpIcon style={{ color: '#2f9f48' }} />Transportation Modes Count - {businessDetails && businessDetails.value[0].locationFeatures.transportationModesCount}</div>
</Grow>
<Grow in={checked} style={{ transformOrigin: '0 0 0' }} {...(checked ? { timeout: 1100 } : {})} >
<div className={classes.features}><ApartmentRoundedIcon style={{ color: '#4534b1' }} />Nearby Hotel Count - {businessDetails && businessDetails.value[0].locationFeatures.competitors}</div>
<div className={classes.features}><ApartmentRoundedIcon style={{ color: '#ce7c39' }} />Nearby Hotel Count - {businessDetails && businessDetails.value[0].locationFeatures.competitors}</div>
</Grow>
<Grow in={checked} style={{ transformOrigin: '0 0 0' }} {...(checked ? { timeout: 1400 } : {})} >
<div className={classes.features}><StarRoundedIcon style={{ color: '#4534b1' }} />Nearby Hotel Reviews Count - {businessDetails && businessDetails.value[0].locationFeatures.nearByHotelReviewCount}</div>
<div className={classes.features}><StarRoundedIcon style={{ color: '#e2da5f' }} />Nearby Hotel Reviews Count - {businessDetails && businessDetails.value[0].locationFeatures.nearByHotelReviewCount}</div>
</Grow>
</Box>
</Box>
......@@ -468,20 +477,20 @@ const doc = new jsPDF();
<Box className={classes.featuresBoxFlex}>
<div className={classes.featureTitleTxt}>Location Based Features</div>
<Box className={classes.featuresBox}>
<div className={classes.features}><LocationOnRoundedIcon />Distance to city - {businessDetails && businessDetails.value[0].locationFeatures.distanceToCity}</div>
<div className={classes.features}><DirectionsTransitFilledSharpIcon />Education Related Places Count - {businessDetails && businessDetails.value[0].locationFeatures.educationRelatedPlacesCount}</div>
<div className={classes.features}><ApartmentRoundedIcon />Shopping Malls Count - {businessDetails && businessDetails.value[0].locationFeatures.shoppingMallsCount}</div>
<div className={classes.features}><StarRoundedIcon />Shopping Malls Count - {businessDetails && businessDetails.value[0].locationFeatures.workPlacesCount}</div>
<div className={classes.features}><ApartmentRoundedIcon />Competitors Count - {businessDetails && businessDetails.value[0].locationFeatures.competitors}</div>
<div className={classes.features}><GiPathDistance style={{ color: '#df5e52',fontSize: '20px' }} />Distance to city - {businessDetails && businessDetails.value[0].locationFeatures.distanceToCity}</div>
<div className={classes.features}><HiShoppingBag style={{ color: '#2f9f48',fontSize: '20px' }} />Education Related Places Count - {businessDetails && businessDetails.value[0].locationFeatures.educationRelatedPlacesCount}</div>
<div className={classes.features}><IoMdSchool style={{ color: '#ce7c39',fontSize: '20px' }} />Shopping Malls Count - {businessDetails && businessDetails.value[0].locationFeatures.shoppingMallsCount}</div>
<div className={classes.features}><MdWork style={{ color: '#4e4c2e',fontSize: '20px' }} />Shopping Malls Count - {businessDetails && businessDetails.value[0].locationFeatures.workPlacesCount}</div>
<div className={classes.features}><RiRestaurantFill style={{ color: '#e2da5f',fontSize: '20px' }} />Competitors Count - {businessDetails && businessDetails.value[0].locationFeatures.competitors}</div>
</Box>
</Box>
<Box className={classes.featuresBoxFlex}>
<div className={classes.featureTitleTxt}>Service Based Features</div>
<Box className={classes.featuresBox}>
<div className={classes.features}><WifiIcon />Opening Hours : {businessDetails && businessDetails.value[0].serviceDetails.opening}</div>
<div className={classes.features}><LocalParkingIcon />Closing Hours : {businessDetails && businessDetails.value[0].serviceDetails.closing}</div>
<div className={classes.features}><BeachAccessIcon />Delivery : {businessDetails && businessDetails.value[0].serviceDetails.delivery}</div>
<div className={classes.features}><AiOutlineClockCircle style={{ color: '#1d7e20', fontSize: '20px', marginInline: '8px' }} />Opening Hours : {businessDetails && businessDetails.value[0].serviceDetails.opening}</div>
<div className={classes.features}><AiOutlineClockCircle style={{ color: '#b13434', fontSize: '20px', marginInline: '8px' }} />Closing Hours : {businessDetails && businessDetails.value[0].serviceDetails.closing}</div>
<div className={classes.features}><MdOutlineDeliveryDining style={{ color: '#2f8eff', fontSize: '22px', marginInline: '8px' }} />Delivery : {businessDetails && businessDetails.value[0].serviceDetails.delivery}</div>
</Box>
</Box>
</Box>
......@@ -519,6 +528,9 @@ const doc = new jsPDF();
colors={['#EA4228', '#F5CD19', '#5BE12C']}
percent={businessDetails && parseInt(businessDetails.value[0].ml_result) / 100}
arcPadding={0.02}
textColor={themeColor.status == 'light' ? '#3e3d3d' : '#f5f5f5'}
needleColor={"#1c2126cc"}
needleBaseColor={"#2d2d2d"}
/>
</Box>
<Box
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment