Skip to content

Jay Mehta / zango-frontend

Go to a project
Toggle navigation
Toggle navigation pinning
Commit 98208f30 by jaymehta
Options

changes

1 parent b4912241
Inline Side-by-side
Showing 7 changed files with 76 additions and 53 deletions
components/home/BrowseExperiences.js
...@@ -109,7 +109,7 @@ const BrowseExperiences = ({ allActivitiesData }) => { ...@@ -109,7 +109,7 @@ const BrowseExperiences = ({ allActivitiesData }) => {
</div> </div>
</div> </div>
<div className="discription"> <div className="discription">
<span>{data?.attributes?.description}</span> <span>{data?.attributes?.description.slice(0, 80)}...</span>
{/* <a href="/detail">Read More</a> */} {/* <a href="/detail">Read More</a> */}
</div> </div>
<div className="price"> <div className="price">
......
components/layout/Footer.js
...@@ -6,7 +6,7 @@ import { toast } from "react-toastify"; ...@@ -6,7 +6,7 @@ import { toast } from "react-toastify";
import Link from "next/link"; import Link from "next/link";
const Footer = () => { const Footer = () => {
const [email, setEmail] = useState(''); const [email, setEmail] = useState("");
const [isValidEmail, setIsValidEmail] = useState(true); const [isValidEmail, setIsValidEmail] = useState(true);
const validateEmail = () => { const validateEmail = () => {
...@@ -15,14 +15,14 @@ const Footer = () => { ...@@ -15,14 +15,14 @@ const Footer = () => {
return regex.test(email); return regex.test(email);
}; };
const handleSubmit = async (e) => { const handleSubmit = async e => {
e.preventDefault(); e.preventDefault();
if (validateEmail()) { if (validateEmail()) {
// Email is valid, perform your action (e.g., subscribe) // Email is valid, perform your action (e.g., subscribe)
const res = await newsletter(email); const res = await newsletter(email);
console.log("res", res.data); console.log("res", res.data);
// Reset email input field after successful submission // Reset email input field after successful submission
setEmail(''); setEmail("");
setIsValidEmail(true); setIsValidEmail(true);
toast.success("Subscribed successful!"); toast.success("Subscribed successful!");
} else { } else {
...@@ -68,22 +68,14 @@ const Footer = () => { ...@@ -68,22 +68,14 @@ const Footer = () => {
<h3>QUICK LINKS</h3> <h3>QUICK LINKS</h3>
<ul> <ul>
<li> <li>
<Link prefetch href="/about-us">About Us</Link> <Link prefetch href="/about-us">
About Us
</Link>
</li> </li>
<li> <li>
<Link prefetch href="/contact-us">Contact Us</Link> <Link prefetch href="/contact-us">
</li> Contact Us
<li> </Link>
<Link prefetch href="">Corporate Programs</Link>
</li>
<li>
<Link prefetch href="">Private Events</Link>
</li>
<li>
<Link prefetch href="">Promo T & C’s</Link>
</li>
<li>
<Link prefetch href="">Gifting</Link>
</li> </li>
</ul> </ul>
</div> </div>
...@@ -122,17 +114,25 @@ const Footer = () => { ...@@ -122,17 +114,25 @@ const Footer = () => {
<h3>HELP</h3> <h3>HELP</h3>
<ul> <ul>
<li> <li>
<Link prefetch href="/terms-and-conditions">Terms & Policy</Link> <Link prefetch href="/terms-and-conditions">
Terms & Policy
</Link>
</li> </li>
<li> <li>
<Link prefetch href="/privacy-policy">Privacy Policy</Link> <Link prefetch href="/privacy-policy">
Privacy Policy
</Link>
</li> </li>
<li> {/* <li>
<Link prefetch href="">Careers</Link> <Link prefetch href="">
Careers
</Link>
</li> </li>
<li> <li>
<Link prefetch href="">FAQs</Link> <Link prefetch href="">
</li> FAQs
</Link>
</li> */}
</ul> </ul>
</div> </div>
</div> </div>
...@@ -161,7 +161,7 @@ const Footer = () => { ...@@ -161,7 +161,7 @@ const Footer = () => {
<h3>JOIN OUR COMMUNITY</h3> <h3>JOIN OUR COMMUNITY</h3>
<div>Subscribe to gt information, latest news and other interesting offers</div> <div>Subscribe to gt information, latest news and other interesting offers</div>
<div className="subscribe"> <div className="subscribe">
<form onSubmit={handleSubmit}> <form onSubmit={handleSubmit}>
<div className="row"> <div className="row">
<div className="col-12 d-flex align-items-center justify-content-start justify-content-lg-between"> <div className="col-12 d-flex align-items-center justify-content-start justify-content-lg-between">
<input <input
...@@ -174,19 +174,16 @@ const Footer = () => { ...@@ -174,19 +174,16 @@ const Footer = () => {
value={email} value={email}
placeholder="Email Address" placeholder="Email Address"
/> />
<label htmlFor="subscribe"> <label htmlFor="subscribe">
<Button variable="primary" type="submit">Subscribe </Button> <Button variable="primary" type="submit">
Subscribe{" "}
</Button>
</label> </label>
</div> </div>
</div> </div>
<div className="row"> <div className="row">
<div className="col-12"> <div className="col-12">{!isValidEmail && <div style={{ color: "red" }}>Please enter a valid email address.</div>}</div>
{!isValidEmail && (
<div style={{ color: 'red' }}>Please enter a valid email address.</div>
)}
</div>
</div> </div>
</form> </form>
</div> </div>
......
components/layout/Header.js
...@@ -92,7 +92,7 @@ const Header = () => { ...@@ -92,7 +92,7 @@ const Header = () => {
console.log("selected", selected); console.log("selected", selected);
// router.push("/listing"); // router.push("/listing");
if (selected[0]?.label.includes("Experience")) { if (selected[0]?.label.includes("Experience")) {
console.log("jjja"); // console.log("jjja");
router.push(`/activities/${selected[0].id}`); router.push(`/activities/${selected[0].id}`);
} }
if (selected[0]?.label.includes("Category")) { if (selected[0]?.label.includes("Category")) {
......
components/listing/LetDiscover.js
...@@ -20,7 +20,7 @@ const LetDiscover = ({ categories }) => { ...@@ -20,7 +20,7 @@ const LetDiscover = ({ categories }) => {
const { activityFilters } = useSelector(sate => sate.activityFilters); const { activityFilters } = useSelector(sate => sate.activityFilters);
const router = useRouter(); const router = useRouter();
const dispatch = useDispatch(); const dispatch = useDispatch();
const [activeIndex, setActiveIndex] = useState(null); const [activeIndex, setActiveIndex] = useState("All");
// const [loading, setloading] = useState(null); // const [loading, setloading] = useState(null);
console.log("categories", categories); console.log("categories", categories);
console.log("subCategories", subCategories); console.log("subCategories", subCategories);
......
components/listing/Listing.js
...@@ -13,7 +13,7 @@ const Listing = () => { ...@@ -13,7 +13,7 @@ const Listing = () => {
const { categories } = useSelector(sate => sate.categories); const { categories } = useSelector(sate => sate.categories);
const { subCategories } = useSelector(sate => sate.subCategories); const { subCategories } = useSelector(sate => sate.subCategories);
console.log("allActivitiesData >>>> 123", allActivitiesData); console.log("allActivitiesData >>>>", allActivitiesData);
return ( return (
<Fragment> <Fragment>
......
components/listing/ListingItems.js
...@@ -9,11 +9,14 @@ import { cleanImage } from "../../services/imageHandling"; ...@@ -9,11 +9,14 @@ import { cleanImage } from "../../services/imageHandling";
import WishlistComponent from "../detail/WIshlistComponent"; import WishlistComponent from "../detail/WIshlistComponent";
import Pagination from "react-js-pagination"; import Pagination from "react-js-pagination";
import { getActivitiesByFilters } from "../../redux/actions/activityAction"; import { getActivitiesByFilters } from "../../redux/actions/activityAction";
import Link from "next/link";
const ListingItems = ({ allActivitiesData, loading, gridClass, totalCount }) => { const ListingItems = ({ allActivitiesData, loading, gridClass, totalCount }) => {
// const [gridClass, setGridClass] = useState('col-md-3'); // const [gridClass, setGridClass] = useState('col-md-3');
const { endUser } = useSelector(state => state.endUser); const { endUser } = useSelector(state => state.endUser);
const router = useRouter(); const router = useRouter();
const [readMoreText, setreadMoreText] = useState();
const [showModal, setshowModal] = useState(false);
const dispatch = useDispatch(); const dispatch = useDispatch();
// useEffect(() => { // useEffect(() => {
// dispatch(getActivitiesByFilters({ currentPage: router.query.page })); // dispatch(getActivitiesByFilters({ currentPage: router.query.page }));
...@@ -39,18 +42,28 @@ const ListingItems = ({ allActivitiesData, loading, gridClass, totalCount }) => ...@@ -39,18 +42,28 @@ const ListingItems = ({ allActivitiesData, loading, gridClass, totalCount }) =>
} else { } else {
queryParams.append("page", pageNumber); queryParams.append("page", pageNumber);
} }
console.log("queryParams", queryParams); console.log("queryParams", queryParams);
// router.push(`/listing?page=${pageNumber}`) // router.push(`/listing?page=${pageNumber}`)
// router.push({ // router.push({
// query: `/listing?page=${pageNumber}` // query: `/listing?page=${pageNumber}`
// }); // });
dispatch(getActivitiesByFilters({ currentPage: pageNumber })); dispatch(getActivitiesByFilters({ currentPage: pageNumber }));
}; };
console.log("page", page); console.log("page", page);
useEffect(() => { useEffect(() => {
dispatch(getActivitiesByFilters({ currentPage: page })); dispatch(getActivitiesByFilters({ currentPage: page }));
}, []) }, []);
const calculateRating = data => {
let value = 0
data.map(item => {
// console.log("item", item);
value = value + item.attributes.rating;
});
// console.log("value", value);
let length = data.length;
return Math.floor(value / length);
};
return ( return (
<> <>
{allActivitiesData && !allActivitiesData.data.length == 0 ? ( {allActivitiesData && !allActivitiesData.data.length == 0 ? (
...@@ -67,28 +80,40 @@ console.log("queryParams", queryParams); ...@@ -67,28 +80,40 @@ console.log("queryParams", queryParams);
<span className="image-container"> <span className="image-container">
<img layout="fill" alt="" className="image img-fluid" src={cleanImage(data.attributes?.image?.data?.attributes)} /> <img layout="fill" alt="" className="image img-fluid" src={cleanImage(data.attributes?.image?.data?.attributes)} />
</span> </span>
{/* <div className="top-rated">Top Rated</div> */} {data.attributes.rating > 100 && <div className="top-rated">Top Rated</div>}
</div> </div>
<div className="info"> <div className="info">
<div className="top-name"> <div className="top-name">
<div className="title">{data?.attributes?.name}</div> <Link href={`/activities/${data.id}`}>
<div className="title">{data?.attributes?.name}</div>
</Link>
<div className="rating-wishlist"> <div className="rating-wishlist">
<div className="rating"> {data?.attributes?.reviews.data.length > 0 && <div className="rating">
<span className="number">{data?.attributes?.rating}</span> {/* {console.log(">>", calculateRating(data?.attributes?.reviews.data))} */}
{<span className="number">{calculateRating(data?.attributes?.reviews.data)}</span>}
<span className="image-container"> <span className="image-container">
<Image layout="fill" alt="" className="image img-fluid" src="/images/icons/star.svg" /> <Image layout="fill" alt="" className="image img-fluid" src="/images/icons/star.svg" />
</span> </span>
</div> </div>}
{endUser && <WishlistComponent activityId={data.id} userId={endUser.id} />} {endUser && <WishlistComponent activityId={data.id} userId={endUser.id} />}
</div> </div>
</div> </div>
<div className="discription"> <div className="discription">
{data.discription} {data?.attributes.description.slice(0, 70)}
{/* <a href="">Read More</a> */} <a
onClick={() => {
// setreadMoreText(data);
// setshowModal(true);
}}
>
Read More
</a>
</div> </div>
<div className="price"> <div className="price">
${data?.attributes?.pricePerPerson} <span className="off">{data?.attributes?.off} ${data?.attributes?.pricePerPerson}{" "}
{/* % OFF */} <span className="off">
{data?.attributes?.off}
{/* % OFF */}
</span> </span>
</div> </div>
<div className="detail"> <div className="detail">
......
redux/actions/activityAction.js
...@@ -442,7 +442,8 @@ export const getActivitiesByFilters = ...@@ -442,7 +442,8 @@ export const getActivitiesByFilters =
"category", "category",
"reviews", "reviews",
"termsConditions", "termsConditions",
"cancellationPolicy" "cancellationPolicy",
"reviews"
] ]
// sort: ["pricePerPerson:asc"] // sort: ["pricePerPerson:asc"]
}; };
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!