Skip to content

Jay Mehta / zango-frontend

Go to a project
Toggle navigation
Toggle navigation pinning
Commit 63a32666 by Ravindra Kanojiya
Options

updated ui

1 parent db7ced53
Inline Side-by-side
Showing 13 changed files with 206 additions and 18 deletions
components/admin/Enquiries.js
......@@ -139,8 +139,10 @@ const Enquiries = () => {
return (
<div>
<Table dataSource={data} columns={columns} />
<Modal show={detailsModal} onHide={() => setdetailsModal(false)}>
<Modal.Header>Enquiry details</Modal.Header>
<Modal show={detailsModal} onHide={() => setdetailsModal(false)} size="xl" className="vendorDetails" centered>
<Modal.Header style={{ border: "0" }}>
<h4>Enquiry details</h4>
</Modal.Header>
<Modal.Body>
<EnquiryDetailModal data={details} setdetailsModal={setdetailsModal} />
</Modal.Body>
......
components/admin/EnquiryDetailModal.js
......@@ -21,10 +21,10 @@ const EnquiryDetailModal = ({ data, setdetailsModal }) => {
</div>
</div>
</div>
<div className="col-8 col-lg-8 mt-4">
<div className="col-12 col-lg-12 mt-4">
{/* <h4>End user</h4> */}
<div className="row">
<div className="col-12 col-lg-5">
<div className="col-12 col-lg-4">
<p className="phead">User details</p>
{/* <div className="row">
<p className="col-12 col-lg-6">Business PAN No.</p>
......@@ -55,7 +55,7 @@ const EnquiryDetailModal = ({ data, setdetailsModal }) => {
<p className="col-12 col-lg-6">{detail[0].attributes.businessName}</p>
</div> */}
</div>
<div className="col-12 col-lg-7 borderLeft">
<div className="col-12 col-lg-4 borderLeft">
<p className="phead">Activity</p>
<div className="row">
<p className="col-12 col-lg-4">Activity Name</p>
......@@ -78,7 +78,7 @@ const EnquiryDetailModal = ({ data, setdetailsModal }) => {
<p className="col-12 col-lg-8">United States</p>
</div>
</div>
<div className="col-12 col-lg-7 borderLeft">
<div className="col-12 col-lg-4 borderLeft">
<p className="phead">Vendor Details</p>
<div className="row">
<p className="col-12 col-lg-4">Vendor Name</p>
......
components/detail/DetailInfo.js
......@@ -182,7 +182,7 @@ const DetailInfo = ({ activityById }) => {
setenquiryModal;
}}
>
<Modal.Header>Send Enquiry</Modal.Header>
<Modal.Header><h4>Send Enquiry</h4></Modal.Header>
<Modal.Body>
<div>Experience Name:</div>
<div className="" style={{ fontSize: "22px", fontWeight: "bold" }}>
......
components/detail/ShareWidget.js
......@@ -52,7 +52,7 @@ const ShareWidget = () => {
<CopyToClipboard text={shareUrl} onCopy={() => setcopy({ copied: true })}>
<span>
{!copy.copied && (
<div>
<div style={{ cursor: "pointer" }}>
<CopyTwoTone /> Copy to clipboard
</div>
)}
......
components/home/BrowseExperiences.js
......@@ -116,8 +116,8 @@ const BrowseExperiences = ({ allActivitiesData }) => {
</div>
</div>
<div className="discription">
<span>{data?.attributes?.description.slice(0, 80)}...</span>
{/* <a href="/detail">Read More</a> */}
<span>{data?.attributes?.description.slice(0, 52)}... <a href="/detail">Read More</a></span>
</div>
<div className="price">
${data?.attributes?.pricePerPerson}
......
components/layout/Header.js
......@@ -113,7 +113,7 @@ const Header = () => {
<div className="">
<div className="name">John Doe</div>
<div className="view-profile">
<a href="">View Profile</a>
<a href="/user/profile">View Profile</a>
</div>
</div>
</div>
......@@ -309,14 +309,14 @@ const Header = () => {
<div className="">
<div className="name">John Doe</div>
<div className="view-profile">
<a href="">View Profile</a>
<a href="/user/profile">View Profile</a>
</div>
</div>
</div>
<div className="user-item">
<ul>
<li>
<a href="">
<a href="/user/my-enquires">
<span className="image-container">
<Image layout="fill" priority alt="" className="image img-fluid" src="/images/icons/my-booking.svg" />
</span>
......
components/listing/ListingFilter.js
......@@ -399,6 +399,8 @@ const ListingFilter = () => {
<div className="p-all">
<div className="head">Suitable Age Group</div>
</div>
<div className="inner">
<div className="suitable-age-group form-select">
<Dropdown
menu={{
items,
......@@ -412,6 +414,8 @@ const ListingFilter = () => {
</Space>
</a>
</Dropdown>
</div>
</div>
{/* <div className="inner">
<Form.Select
onChange={e => {
......
components/listing/ListingItems.js
......@@ -169,7 +169,7 @@ const ListingItems = ({ allActivitiesData, loading, gridClass, totalCount }) =>
</div>
</div>
<div className="discription">
{data?.attributes.description.slice(0, 70)}
{data?.attributes.description.slice(0, 52)}...
<a
onClick={() => {
// setreadMoreText(data);
......
components/user/MyEnquires.js 0 → 100644
import Image from "next/image";
import React, { Fragment } from "react";
import { renderImage } from "../../services/imageHandling";
const MyEnquires = () => {
const bookingsData = [
{
id: "0",
name: "City Climb",
start_date: "Jan 8, 2021",
end_date: "Jan 9, 2021",
price: "$200",
status: "Confirmed",
image: "/images/user/image1.png"
},
{
id: "1",
name: "City Climb",
start_date: "Jan 8, 2021",
end_date: "Jan 9, 2021",
price: "$200",
status: "Confirmed",
image: "/images/user/image1.png"
},
{
id: "2",
name: "City Climb",
start_date: "Jan 8, 2021",
end_date: "Jan 9, 2021",
price: "$200",
status: "Confirmed",
image: "/images/user/image1.png"
},
{
id: "3",
name: "City Climb",
start_date: "Jan 8, 2021",
end_date: "Jan 9, 2021",
price: "$200",
status: "Confirmed",
image: "/images/user/image1.png"
}
]
return (
<Fragment>
<div className="container">
<div className="row">
<div className="col-12 col-lg-12 form-container content-wraaper">
<h2 className="px-2 px-lg-0">My Enquires</h2>
<div className="row">
{bookingsData?.length && bookingsData.map((data, index) => (
<div className="col-12 col-sm-12 col-lg-3 col-md-6 px-4 px-lg-3" key={`1${index}`}>
<div className="card-booking">
<div className="card-booking-img">
<span className="image-container">
<Image src={renderImage(data.image)} layout="fill" className="image" />
</span>
</div>
<div className="card-booking-content">
<p className="activity-name">{data.name}</p>
<p>{data.start_date} - {data.end_date}</p>
<p>{data.price}</p>
<p className="status">{data.status}</p>
</div>
<div className="hr-div" />
<div className="card-booking-footer">
<div className="d-flex align-items-center justify-content-between">
<div className="d-flex align-items-center">
<span className="image-container me-2">
<Image src={renderImage("/images/user/icon-rebook.svg")} layout="fill" className="image" />
</span>
<p className="duration mb-0">Rebook this booking</p>
</div>
<div className="image-container">
<Image src={renderImage("/images/user/arrow-right.svg")} layout="fill" className="image" />
</div>
</div>
</div>
</div>
</div>
))}
</div>
<div className="row">
{bookingsData?.length && bookingsData.map((data, index) => (
<div className="col-12 col-sm-12 col-lg-3 col-md-6 px-4 px-lg-3" key={`2${index}`}>
<div className="card-booking">
<div className="card-booking-img">
<span className="image-container">
<Image src={renderImage(data.image)} layout="fill" className="image" />
</span>
</div>
<div className="card-booking-content">
<p className="activity-name">{data.name}</p>
<p>{data.start_date} - {data.end_date}</p>
<p>{data.price}</p>
<p className="status">{data.status}</p>
</div>
<div className="hr-div" />
<div className="card-booking-footer">
<div className="d-flex align-items-center justify-content-between">
<div className="d-flex align-items-center">
<span className="image-container me-2">
<Image src={renderImage("/images/user/icon-rebook.svg")} layout="fill" className="image" />
</span>
<p className="duration mb-0">Rebook this booking</p>
</div>
<div className="image-container">
<Image src={renderImage("/images/user/arrow-right.svg")} layout="fill" className="image" />
</div>
</div>
</div>
</div>
</div>
))}
</div>
<div className="row">
{bookingsData?.length && bookingsData.map((data, index) => (
<div className="col-12 col-sm-12 col-lg-3 col-md-6 px-4 px-lg-3" key={`3${index}`}>
<div className="card-booking">
<div className="card-booking-img">
<span className="image-container">
<Image src={renderImage(data.image)} layout="fill" className="image" />
</span>
</div>
<div className="card-booking-content">
<p className="activity-name">{data.name}</p>
<p>{data.start_date} - {data.end_date}</p>
<p>{data.price}</p>
<p className="status">{data.status}</p>
</div>
<div className="hr-div" />
<div className="card-booking-footer">
<div className="d-flex align-items-center justify-content-between">
<div className="d-flex align-items-center">
<span className="image-container me-2">
<Image src={renderImage("/images/user/icon-rebook.svg")} layout="fill" className="image" />
</span>
<p className="duration mb-0">Rebook this booking</p>
</div>
<div className="image-container">
<Image src={renderImage("/images/user/arrow-right.svg")} layout="fill" className="image" />
</div>
</div>
</div>
</div>
</div>
))}
</div>
</div>
</div>
</div>
</Fragment>
)
}
export default MyEnquires;
\ No newline at end of file
components/vendor/ActivityDetails.js
......@@ -834,7 +834,7 @@ const ActivityDetails = ({ isUpdate }) => {
<label>Minimum duration</label>
<input value={values.minDuration} id="minDuration" name="minDuration" onChange={handleChange} onBlur={handleBlur}></input>
{touched.minDuration && errors.minDuration && (
<span className="form-error" style={{ color: "red", fontSize: "10px" }}>
<span className="form-error">
{errors.minDuration}
</span>
)}
......@@ -857,7 +857,7 @@ const ActivityDetails = ({ isUpdate }) => {
</div>
<div className="col-12 col-lg-6">
<div className="input-group">
<label>Age Group</label>
<label className="mb-4">Age Group</label>
<select value={values.ageGroup} id={"ageGroup"} name={"ageGroup"} onChange={handleChange} onBlur={handleBlur}>
<option value="">Select</option>
<option value="5">5+</option>
......
components/vendor/ActivityListingRBAC.js
......@@ -311,7 +311,7 @@ export const ActivityListingRBAC = ({ setactivityDetailInfo, setShowActivityDeta
placement="bottomLeft"
>
<Button style={{ border: "none" }}>
<DownCircleOutlined style={{ fontSize: "20px", color: "#08c" }} onClick={() => {}} />
<DownCircleOutlined style={{ fontSize: "20px", color: "#08c" }} onClick={() => { }} />
</Button>
</Dropdown>
</Space>
......@@ -485,6 +485,7 @@ export const ActivityListingRBAC = ({ setactivityDetailInfo, setShowActivityDeta
setrejectionId(null);
setrejectPopUp(false);
}}
centered
>
<Modal.Header closeButton>Please mention reason for rejecting the activity.</Modal.Header>
<Modal.Body>
......
pages/user/my-enquires/index.js 0 → 100644
import React from "react";
import Layout from "../../../components/layout/Layout";
import MyBookings from "../../../components/user/MyBookings";
import MyEnquires from "../../../components/user/MyEnquires";
export default function UserMyEnquiresPage() {
return (
<Layout>
<MyEnquires />
</Layout>
);
};
\ No newline at end of file
styles/globals.css
......@@ -644,6 +644,7 @@ span.form-error,
color: red;
font-size: 0.8rem;
font-family: "Sofia Pro Light";
display: inline-block;
}
.login-banner-image {
......@@ -1909,6 +1910,7 @@ span.form-error,
line-height: 17px;
color: #000000;
margin-bottom: 1rem;
word-wrap: break-word;
}
.vendorDetails p.phead {
......@@ -2120,7 +2122,7 @@ span.form-error,
color: #808080;
text-decoration: underline !important;
text-align: right;
display: block;
/* display: block; */
padding-top: 4px;
}
......@@ -4121,6 +4123,15 @@ footer .footer-link ul {
/* .image-gallery-content .image-gallery-slide .image-gallery-image {
margin-top: 2rem;
} */
.suitable-age-group .ant-dropdown-trigger {
width: 112%;
display: block;
color: #000;
}
.suitable-age-group .anticon.anticon-down {
display: none;
}
@media (min-width: 992px) {
.navbar-expand-lg .navbar-nav .nav-link {
margin: 0 2rem;
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!