Skip to content
Toggle navigation
Toggle navigation
This project
Loading...
Sign in
Jay Mehta
/
zango-frontend
Go to a project
Toggle navigation
Toggle navigation pinning
Projects
Groups
Snippets
Help
Project
Activity
Repository
Pipelines
Registry
Graphs
Issues
0
Merge Requests
0
Wiki
Network
Create a new issue
Jobs
Commits
Issue Boards
Files
Commits
Network
Compare
Branches
Tags
Commit b0e551bd
authored
2024-07-10 20:33:42 +0530
by
jaymehta
Browse Files
Options
Browse Files
Tag
Download
Plain Diff
Merge branch 'master' of
https://git.logicloop.io/jaymehta/zango-frontend
2 parents
e483780f
564e5ed2
Hide whitespace changes
Inline
Side-by-side
Showing
5 changed files
with
429 additions
and
370 deletions
components/detail/DetailInfo.js
components/gift-card/GiftCard.js
components/layout/Header.js
components/vendor/UpdateActivity.js
styles/globals.css
components/detail/DetailInfo.js
View file @
b0e551b
...
...
@@ -47,6 +47,7 @@ const DetailInfo = ({ activityById }) => {
const
[
showshareWidget
,
setshowshareWidget
]
=
useState
(
false
);
const
{
loadedUser
}
=
useSelector
(
state
=>
state
.
loadedUser
);
const
{
endUser
}
=
useSelector
(
state
=>
state
.
endUser
);
console
.
log
(
"endUser"
,
endUser
)
useEffect
(()
=>
{
const
fetchSession
=
async
()
=>
{
setSession
(
await
getSession
());
...
...
@@ -190,21 +191,29 @@ const DetailInfo = ({ activityById }) => {
<
h2
>
Send
Enquiry
<
/h2
>
<
/Modal.Header
>
<
Modal
.
Body
>
<
div
>
Experience
Name
:
<
/div
>
<
div
className
=
"text01"
>
{
activityById
.
data
.
attributes
.
name
}
<
/div
>
<
div
className
=
"mt-3"
>
Full
Name
:
<
/div
>
<
div
className
=
"text01"
>
{
endUser
?.
attributes
.
name
}
<
/div
>
<
div
className
=
"mt-3"
>
Mobile
:
<
/div
>
<
div
className
=
"text01"
>
{
endUser
?.
attributes
.
phone
}
<
/div
>
<
div
className
=
"mt-3"
>
Email
ID
:
<
/div
>
<
div
className
=
"text01"
>
{
endUser
?.
attributes
.
email
}
<
/div
>
<
div
className
=
"row d-flex justify-content-center"
>
<
div
className
=
"mt-3"
>
Experience
Name
:
<
/div
>
<
div
className
=
"text01"
>
{
activityById
.
data
.
attributes
.
name
}
<
/div
>
<
div
className
=
"row d-flex justify-content-center mt-2"
>
<
div
className
=
"col-6"
>
<
div
className
=
"m
t
-2"
>
Quantity
:
<
/div
>
<
div
className
=
"m
y
-2"
>
Quantity
:
<
/div
>
<
Input
type
=
"number"
onChange
=
{
e
=>
{
...
...
@@ -214,7 +223,7 @@ const DetailInfo = ({ activityById }) => {
><
/Input
>
<
/div
>
<
div
className
=
"col-6"
>
<
div
className
=
"m
t
-2"
>
Date
:
<
/div
>
<
div
className
=
"m
y
-2"
>
Date
:
<
/div
>
<
div
className
=
""
>
<
DatePicker
...
...
@@ -234,7 +243,7 @@ const DetailInfo = ({ activityById }) => {
<
/div
>
<
Button
disabled
=
{
loading
||
!
quantity
}
className
=
"mt-
2
col-12"
className
=
"mt-
4
col-12"
onClick
=
{
async
()
=>
{
setloading
(
true
);
console
.
log
(
"hello"
);
...
...
components/gift-card/GiftCard.js
View file @
b0e551b
...
...
@@ -11,14 +11,17 @@ import { finishVendorOtpVerification } from "../../redux/actions/vendorActions";
import
{
useRouter
}
from
"next/router"
;
import
{
Button
}
from
"react-bootstrap"
;
import
{
postGiftCard
}
from
"../../redux/actions/giftCardAction"
;
import
TermsAndConditionModel
from
"../signup/TermsAndConditionModel"
;
// import { getCurrentEndUser } from "../../redux/actions/userActions";
const
validationSchema
=
Yup
.
object
().
shape
({
customAmt
:
Yup
.
string
().
required
(
"Full name is required"
),
code
:
Yup
.
string
().
required
(
"Please Enter 4-Digit Code"
),
email
:
Yup
.
string
().
email
(
"Invalid email"
).
required
(
"Email is required"
),
receiverEmail
:
Yup
.
string
().
email
(
"Invalid email"
).
required
(
"Email is required"
),
message
:
Yup
.
string
().
required
(
"Message is required"
)
receiverEmail
:
Yup
.
string
().
email
(
"Invalid email"
).
required
(
"Reciver's Email is required"
),
message
:
Yup
.
string
().
required
(
"Message is required"
),
amt
:
Yup
.
string
().
required
(
"Please select an amount"
),
termsConditions
:
Yup
.
bool
().
oneOf
([
true
],
"Please Accept Terms & Conditions"
),
});
let
formik1
;
...
...
@@ -42,6 +45,7 @@ const GiftCard = () => {
// const {loadedUser} = useSelector(state => state.loadedUser)
const
{
endUser
}
=
useSelector
(
state
=>
state
.
endUser
);
console
.
log
(
"endUser"
,
endUser
);
const
[
isOpenEis
,
setIsOpenEis
]
=
useState
(
false
);
const
[
isStep1
,
setIsStep1
]
=
useState
(
true
);
const
[
amount
,
setAmount
]
=
useState
(
0
);
const
[
custom
,
setcustom
]
=
useState
();
...
...
@@ -59,389 +63,418 @@ const GiftCard = () => {
};
return
(
<
section
className
=
"gift-card-session"
>
<
div
className
=
"container"
>
<
div
className
=
"row justify-content-center"
>
<
div
className
=
"col-md-10"
>
<
div
className
=
"see-my-gift-cards-row"
>
<
Button
onClick
=
{()
=>
{
if
(
!
session
)
{
toast
.
warning
(
"Please log in to see your gift cards."
);
return
;
}
router
.
push
(
"/user/giftcard"
);
}}
>
See
my
gift
cards
<
/Button
>
<
/div
>
{
!
isResult
&&
(
<
div
className
=
"row"
>
<
div
className
=
"col-md-5"
>
<
div
className
=
"gift-card-lt"
>
<
div
className
=
"gift-box"
>
<
img
src
=
"/images/gift-card.svg"
alt
=
"Gift Card"
/>
<>
<
section
className
=
"gift-card-session"
>
<
div
className
=
"container"
>
<
div
className
=
"row justify-content-center"
>
<
div
className
=
"col-md-10"
>
<
div
className
=
"see-my-gift-cards-row"
>
<
Button
onClick
=
{()
=>
{
if
(
!
session
)
{
toast
.
warning
(
"Please log in to see your gift cards."
);
return
;
}
router
.
push
(
"/user/giftcard"
);
}}
>
See
my
gift
cards
<
/Button
>
<
/div
>
{
!
isResult
&&
(
<
div
className
=
"row"
>
<
div
className
=
"col-md-5"
>
<
div
className
=
"gift-card-lt"
>
<
div
className
=
"gift-box"
>
<
img
src
=
"/images/gift-card.svg"
alt
=
"Gift Card"
/>
<
/div
>
<
h3
>
Amount
:
$
{
amount
}
<
/h3
>
<
/div
>
<
h3
>
Amount
:
$
{
amount
}
<
/h3
>
<
/div
>
<
/div
>
<
div
className
=
"col-md-7"
>
{
isStep1
&&
(
<
div
className
=
"gift-card-rt"
>
{
/* <div className="back-btn">
<
div
className
=
"col-md-7"
>
{
isStep1
&&
(
<
div
className
=
"gift-card-rt"
>
{
/* <div className="back-btn">
<a href="">
<span className="image-container">
<Image layout="fill" alt="" className="image img-fluid" src="/images/icons/arrow-left-02.svg" />
</span>
</a>
</div> */
}
<
Formik
initialValues
=
{{
customAmt
:
""
,
email
:
""
,
receiverEmail
:
""
,
message
:
""
}}
enableReinitialize
=
{
true
}
// validationSchema={validationSchema}
onSubmit
=
{(
values
,
{
setSubmitting
})
=>
{
// Handle form submission here
}}
>
{({
isSubmitting
,
values
,
handleChange
,
handleBlur
,
touched
,
errors
})
=>
(
<
Form
action
=
""
className
=
"form-01"
>
<
div
className
=
"title"
>
Buy
a
gift
card
<
/div
>
<
div
className
=
"cl-gry"
>
Please
select
an
amount
<
/div
>
<
div
className
=
"gift-card-amt"
>
<
ul
>
<
li
>
<
input
name
=
"amt"
id
=
"amt-20"
type
=
"radio"
value
=
""
data
-
gtm
-
Form
-
interact
-
field
-
id
=
"1"
onChange
=
{
e
=>
{
setAmount
(
20
);
setcustom
(
false
);
}}
/
>
<
label
for
=
"amt-20"
>
$20
<
/label
>
<
/li
>
<
li
>
<
input
name
=
"amt"
id
=
"amt-50"
type
=
"radio"
value
=
""
data
-
gtm
-
form
-
interact
-
field
-
id
=
"1"
onChange
=
{
e
=>
{
setAmount
(
50
);
setcustom
(
false
);
}}
/
>
<
label
for
=
"amt-50"
>
$50
<
/label
>
<
/li
>
<
li
>
<
input
name
=
"amt"
id
=
"amt-100"
type
=
"radio"
value
=
""
data
-
gtm
-
form
-
interact
-
field
-
id
=
"1"
onChange
=
{
e
=>
{
setAmount
(
100
);
setcustom
(
false
);
}}
/
>
<
label
for
=
"amt-100"
>
<
span
>
Most
Popular
<
/span
>
<
br
/>
$100
<
/label
>
<
/li
>
<
li
>
<
input
name
=
"amt"
id
=
"amt-250"
type
=
"radio"
value
=
""
data
-
gtm
-
form
-
interact
-
field
-
id
=
"1"
onChange
=
{
e
=>
{
setAmount
(
250
);
setcustom
(
false
);
}}
/
>
<
label
for
=
"amt-250"
>
$250
<
/label
>
<
/li
>
<
li
>
<
input
name
=
"amt"
id
=
"amt-500"
type
=
"radio"
value
=
""
data
-
gtm
-
form
-
interact
-
field
-
id
=
"1"
onChange
=
{
e
=>
{
setAmount
(
500
);
setcustom
(
false
);
}}
/
>
<
label
for
=
"amt-500"
>
$500
<
/label
>
<
/li
>
<
li
>
<
input
name
=
"amt"
id
=
"amt-custom"
type
=
"radio"
value
=
""
data
-
gtm
-
form
-
interact
-
field
-
id
=
"1"
onChange
=
{
e
=>
{
setcustom
(
true
);
setAmount
(
null
);
}}
/
>
<
label
for
=
"amt-custom"
>
$
Custom
<
/label
>
<
/li
>
<
/ul
>
<
/div
>
<
div
className
=
"row"
>
{
custom
&&
(
<
Formik
initialValues
=
{{
customAmt
:
""
,
email
:
""
,
receiverEmail
:
""
,
message
:
""
,
amt
:
""
,
termsConditions
:
false
}}
enableReinitialize
=
{
true
}
validationSchema
=
{
validationSchema
}
onSubmit
=
{(
values
,
{
setSubmitting
})
=>
{
// Handle form submission here
}}
>
{({
isSubmitting
,
values
,
handleChange
,
handleBlur
,
touched
,
errors
})
=>
(
<
Form
action
=
""
className
=
"form-01"
>
<
div
className
=
"title"
>
Buy
a
gift
card
<
/div
>
<
div
className
=
"cl-gry"
>
Please
select
an
amount
<
/div
>
<
div
className
=
"gift-card-amt"
>
<
ul
>
<
li
>
<
input
name
=
"amt"
id
=
"amt-20"
type
=
"radio"
value
=
""
data
-
gtm
-
Form
-
interact
-
field
-
id
=
"1"
onChange
=
{
e
=>
{
setAmount
(
20
);
setcustom
(
false
);
}}
/
>
<
label
for
=
"amt-20"
>
$20
<
/label
>
<
/li
>
<
li
>
<
input
name
=
"amt"
id
=
"amt-50"
type
=
"radio"
value
=
""
data
-
gtm
-
form
-
interact
-
field
-
id
=
"1"
onChange
=
{
e
=>
{
setAmount
(
50
);
setcustom
(
false
);
}}
/
>
<
label
for
=
"amt-50"
>
$50
<
/label
>
<
/li
>
<
li
>
<
input
name
=
"amt"
id
=
"amt-100"
type
=
"radio"
value
=
""
data
-
gtm
-
form
-
interact
-
field
-
id
=
"1"
onChange
=
{
e
=>
{
setAmount
(
100
);
setcustom
(
false
);
}}
/
>
<
label
for
=
"amt-100"
>
<
span
>
Most
Popular
<
/span
>
<
br
/>
$100
<
/label
>
<
/li
>
<
li
>
<
input
name
=
"amt"
id
=
"amt-250"
type
=
"radio"
value
=
""
data
-
gtm
-
form
-
interact
-
field
-
id
=
"1"
onChange
=
{
e
=>
{
setAmount
(
250
);
setcustom
(
false
);
}}
/
>
<
label
for
=
"amt-250"
>
$250
<
/label
>
<
/li
>
<
li
>
<
input
name
=
"amt"
id
=
"amt-500"
type
=
"radio"
value
=
""
data
-
gtm
-
form
-
interact
-
field
-
id
=
"1"
onChange
=
{
e
=>
{
setAmount
(
500
);
setcustom
(
false
);
}}
/
>
<
label
for
=
"amt-500"
>
$500
<
/label
>
<
/li
>
<
li
>
<
input
name
=
"amt"
id
=
"amt-custom"
type
=
"radio"
value
=
""
data
-
gtm
-
form
-
interact
-
field
-
id
=
"1"
onChange
=
{
e
=>
{
setcustom
(
true
);
setAmount
(
null
);
}}
/
>
<
label
for
=
"amt-custom"
>
$
Custom
<
/label
>
<
/li
>
<
/ul
>
<
/div
>
<
div
className
=
"row"
>
{
custom
&&
(
<
div
className
=
"col-md-12 mb-4"
>
<
label
htmlFor
=
""
>
Custom
Amount
<
/label
>
<
Field
className
=
"form-control"
type
=
"number"
name
=
"customAmt"
placeholder
=
"Enter your amount"
onChange
=
{
e
=>
{
setAmount
(
e
.
target
.
value
);
}}
onBlur
=
{
handleBlur
}
value
=
{
amount
}
/
>
{
touched
.
customAmt
&&
errors
.
customAmt
&&
<
div
className
=
"text-danger"
>
{
errors
.
customAmt
}
<
/div>
}
<
/div
>
)}
<
div
className
=
"col-md-12 mb-4"
>
<
label
htmlFor
=
""
>
Custom
Amount
<
/label
>
<
label
htmlFor
=
""
>
Email
Id
<
/label
>
<
Field
className
=
"form-control"
type
=
"number"
name
=
"customAmt"
placeholder
=
"Enter your amount"
onChange
=
{
e
=>
{
setAmount
(
e
.
target
.
value
);
}}
type
=
"email"
name
=
"email"
placeholder
=
"yourname@example.com"
onChange
=
{
handleChange
}
onBlur
=
{
handleBlur
}
value
=
{
amount
}
value
=
{
values
.
email
}
/
>
{
touched
.
customAmt
&&
errors
.
customAmt
&&
<
div
className
=
"text-danger"
>
{
errors
.
customAmt
}
<
/div>
}
<
/div
>
)}
<
div
className
=
"col-md-12 mb-4"
>
<
label
htmlFor
=
""
>
Email
Id
<
/label
>
<
Field
className
=
"form-control"
type
=
"email"
name
=
"email"
placeholder
=
"yourname@example.com"
onChange
=
{
handleChange
}
onBlur
=
{
handleBlur
}
value
=
{
values
.
email
}
/
>
{
touched
.
email
&&
errors
.
email
&&
<
div
className
=
"text-danger"
>
{
errors
.
email
}
<
/div>
}
<
div
className
=
"tooltip-wrapper"
>
<
a
className
=
"tooltip-btn"
onMouseEnter
=
{()
=>
setShowTooltip1
(
true
)}
onMouseLeave
=
{()
=>
setShowTooltip1
(
false
)}
>
<
span
className
=
"image-container"
>
<
Image
layout
=
"fill"
alt
=
""
className
=
"image img-fluid"
src
=
"/images/icons/info.svg"
/>
<
/span
>
<
/a
>
{
touched
.
email
&&
errors
.
email
&&
<
div
className
=
"text-danger"
>
{
errors
.
email
}
<
/div>
}
<
div
className
=
"tooltip-wrapper"
>
<
a
className
=
"tooltip-btn"
onMouseEnter
=
{()
=>
setShowTooltip1
(
true
)}
onMouseLeave
=
{()
=>
setShowTooltip1
(
false
)}
>
<
span
className
=
"image-container"
>
<
Image
layout
=
"fill"
alt
=
""
className
=
"image img-fluid"
src
=
"/images/icons/info.svg"
/>
<
/span
>
<
/a
>
{
/* Tooltip */
}
{
showTooltip1
&&
<
div
className
=
"tooltips"
>
{
tooltipText1
}
<
/div>
}
{
/* Tooltip */
}
{
showTooltip1
&&
<
div
className
=
"tooltips"
>
{
tooltipText1
}
<
/div>
}
<
/div
>
<
/div
>
<
/div
>
<
div
className
=
"col-md-12 mb-4"
>
<
label
htmlFor
=
""
>
Receiver
’
s
Email
Id
<
/label
>
<
Field
className
=
"form-control"
type
=
"receiverEmail"
name
=
"receiverEmail"
placeholder
=
"yourname@example.com"
onChange
=
{
handleChange
}
onBlur
=
{
handleBlur
}
value
=
{
values
.
receiverEmail
}
/
>
{
touched
.
receiverEmail
&&
errors
.
receiverEmail
&&
<
div
className
=
"text-danger"
>
{
errors
.
receiverEmail
}
<
/div>
}
<
div
className
=
"tooltip-wrapper"
>
<
a
className
=
"tooltip-btn"
onMouseEnter
=
{()
=>
setShowTooltip2
(
true
)}
onMouseLeave
=
{()
=>
setShowTooltip2
(
false
)}
>
<
span
className
=
"image-container"
>
<
Image
layout
=
"fill"
alt
=
""
className
=
"image img-fluid"
src
=
"/images/icons/info.svg"
/>
<
/span
>
<
/a
>
<
div
className
=
"col-md-12 mb-4"
>
<
label
htmlFor
=
""
>
Receiver
’
s
Email
Id
<
/label
>
<
Field
className
=
"form-control"
type
=
"receiverEmail"
name
=
"receiverEmail"
placeholder
=
"yourname@example.com"
onChange
=
{
handleChange
}
onBlur
=
{
handleBlur
}
value
=
{
values
.
receiverEmail
}
/
>
{
touched
.
receiverEmail
&&
errors
.
receiverEmail
&&
<
div
className
=
"text-danger"
>
{
errors
.
receiverEmail
}
<
/div>
}
<
div
className
=
"tooltip-wrapper"
>
<
a
className
=
"tooltip-btn"
onMouseEnter
=
{()
=>
setShowTooltip2
(
true
)}
onMouseLeave
=
{()
=>
setShowTooltip2
(
false
)}
>
<
span
className
=
"image-container"
>
<
Image
layout
=
"fill"
alt
=
""
className
=
"image img-fluid"
src
=
"/images/icons/info.svg"
/>
<
/span
>
<
/a
>
{
showTooltip2
&&
<
div
className
=
"tooltips"
>
{
tooltipText2
}
<
/div>
}
{
showTooltip2
&&
<
div
className
=
"tooltips"
>
{
tooltipText2
}
<
/div>
}
<
/div
>
<
/div
>
<
/div
>
<
div
className
=
"col-md-12 mb-4"
>
<
Field
className
=
"form-control"
as
=
"textarea"
rows
=
{
7
}
name
=
"message"
placeholder
=
"Type your message..."
onChange
=
{
handleChange
}
onBlur
=
{
handleBlur
}
value
=
{
values
.
message
}
/
>
{
touched
.
message
&&
errors
.
message
&&
<
div
className
=
"text-danger"
>
{
errors
.
message
}
<
/div>
}
<
/div
>
<
div
className
=
"col-md-12 mb-3"
>
<
button
className
=
"btn btn-primary w-100"
onClick
=
{
async
()
=>
{
setloading
(
true
);
if
(
!
session
)
{
toast
.
warning
(
"Please log in to buy a gift card."
);
return
;
}
const
config
=
{
headers
:
{
"Content-Type"
:
"application/json"
,
Authorization
:
`Bearer
${
session
.
jwt
}
`
}
};
const
data
=
{
data
:
{
userId
:
session
.
id
<
div
className
=
"col-md-12 mb-4"
>
<
Field
className
=
"form-control"
as
=
"textarea"
rows
=
{
7
}
name
=
"message"
placeholder
=
"Type your message..."
onChange
=
{
handleChange
}
onBlur
=
{
handleBlur
}
value
=
{
values
.
message
}
/
>
{
touched
.
message
&&
errors
.
message
&&
<
div
className
=
"text-danger"
>
{
errors
.
message
}
<
/div>
}
<
/div
>
<
div
>
{
/* {touched.amt && errors.amt && <div className="text-danger">{errors.amt}</div>} */
}
<
div
className
=
"cl-gry"
>
Please
select
an
amount
before
continuing
.
<
/div
>
<
/div
>
<
div
className
=
"col-md-12 mb-3"
>
<
button
className
=
"btn btn-primary w-100"
onClick
=
{
async
()
=>
{
setloading
(
true
);
if
(
!
session
)
{
toast
.
warning
(
"Please log in to buy a gift card."
);
return
;
}
};
const
response
=
await
axios
.
post
(
`
${
process
.
env
.
NEXT_PUBLIC_BACKEND_API_URL
}
/api/end-user/verify-gift-card-otp`
,
data
,
config
);
setvalues
({
...
values
,
amount
});
console
.
log
(
"response"
,
response
.
data
);
setloading
(
false
);
console
.
log
(
values
);
setIsStep2
(
true
);
setIsStep1
(
false
);
}}
disabled
=
{
!
amount
>
0
||
!
values
.
receiverEmail
||
!
values
.
email
}
>
{
loading
?
<
Loader
/>
:
"Continue"
}
<
/button
>
<
/div
>
<
div
className
=
"col-12"
>
<
p
>
const
config
=
{
headers
:
{
"Content-Type"
:
"application/json"
,
Authorization
:
`Bearer
${
session
.
jwt
}
`
}
};
const
data
=
{
data
:
{
userId
:
session
.
id
}
};
const
response
=
await
axios
.
post
(
`
${
process
.
env
.
NEXT_PUBLIC_BACKEND_API_URL
}
/api/end-user/verify-gift-card-otp`
,
data
,
config
);
setvalues
({
...
values
,
amount
});
console
.
log
(
"response"
,
response
.
data
);
setloading
(
false
);
console
.
log
(
values
);
setIsStep2
(
true
);
setIsStep1
(
false
);
}}
disabled
=
{
!
amount
>
0
||
!
values
.
receiverEmail
||
!
values
.
email
||
!
values
.
termsConditions
}
>
{
loading
?
<
Loader
/>
:
"Continue"
}
<
/button
>
<
/div
>
<
div
className
=
"col-12"
>
<
label
className
=
"check-container mb-0 pt-0"
htmlFor
=
"termsConditions"
>
<
input
type
=
"checkbox"
id
=
"termsConditions"
name
=
"termsConditions"
className
=
"check-box me-2"
checked
=
{
values
.
termsConditions
}
onChange
=
{
handleChange
}
onBlur
=
{
handleBlur
}
/
>
<
span
className
=
"checkmark"
><
/span>By continuing you agree to our <a className="cl-blue" onClick={
()
=> { setIsOpenEis
(
true
)
}}>Terms</
a
>
and
<
a
href
=
"/privacy-policy"
>
Privacy
Policy
<
/a
>
<
/label
>
<
div
className
=
"mt-3"
>
{
touched
.
termsConditions
&&
errors
.
termsConditions
&&
<
div
className
=
"text-danger"
>
{
errors
.
termsConditions
}
<
/div>
}
<
/div
>
{
/* <p>
By continuing you agree to our <a href="/terms-and-conditions">Terms</a> and <a href="/privacy-policy">Privacy Policy</a>
</p>
</p> */
}
<
/div
>
<
/div
>
</div>
</Form>
)}
</Formik>
</div>
)}
{isStep2 && (
<div className="
gift
-
card
-
rt
">
<div className="
back
-
btn
">
<a href="">
<span className="
image
-
container
">
<Image layout="
fill
" alt="" className="
image
img
-
fluid
" src="
/
images
/
icons
/
arrow
-
left
-
02
.
svg
" />
</span>
</a>
<
/Form
>
)}
<
/Formik
>
<
/div
>
<Formik
initialValues={{
code: ""
}}
// validationSchema={validationSchema}
onSubmit={(values, { setSubmitting }) => {
// Handle form submission here
console.log(values);
setSubmitting(false);
setIsStep2(false);
setIsStep1(false);
setIsResult(true);
}}
>
{({ isSubmitting, values, handleChange, handleBlur, touched, errors }) => (
<Form action="" className="
form
-
01
">
<div className="
title
">We emailed you a 4-digit code</div>
{/* <div className="
cl
-
gry
">Please enter it below to create or login into your account:</div> */}
{console.log("
values
", form1Values)}
<div className="
row
mt
-
4
">
<div className="
col
-
md
-
12
mb
-
4
">
<label htmlFor="">Enter 4-Digit Code</label>
<Field
className="
form
-
control
"
type="
text
"
name="
code
"
placeholder="
Enter
the
code
we
emailed
you
"
onChange={handleChange}
onBlur={handleBlur}
value={values.code}
/>
{touched.code && errors.code && <div className="
text
-
danger
">{errors.code}</div>}
{/* <div className="
link
-
a
">
)}
{
isStep2
&&
(
<
div
className
=
"gift-card-rt"
>
<
div
className
=
"back-btn"
>
<
a
href
=
""
>
<
span
className
=
"image-container"
>
<
Image
layout
=
"fill"
alt
=
""
className
=
"image img-fluid"
src
=
"/images/icons/arrow-left-02.svg"
/>
<
/span
>
<
/a
>
<
/div
>
<
Formik
initialValues
=
{{
code
:
""
}}
// validationSchema={validationSchema}
onSubmit
=
{(
values
,
{
setSubmitting
})
=>
{
// Handle form submission here
console
.
log
(
values
);
setSubmitting
(
false
);
setIsStep2
(
false
);
setIsStep1
(
false
);
setIsResult
(
true
);
}}
>
{({
isSubmitting
,
values
,
handleChange
,
handleBlur
,
touched
,
errors
})
=>
(
<
Form
action
=
""
className
=
"form-01"
>
<
div
className
=
"title"
>
We
emailed
you
a
4
-
digit
code
<
/div
>
{
/* <div className="cl-gry">Please enter it below to create or login into your account:</div> */
}
{
console
.
log
(
"values"
,
form1Values
)}
<
div
className
=
"row mt-4"
>
<
div
className
=
"col-md-12 mb-4"
>
<
label
htmlFor
=
""
>
Enter
4
-
Digit
Code
<
/label
>
<
Field
className
=
"form-control"
type
=
"text"
name
=
"code"
placeholder
=
"Enter the code we emailed you"
onChange
=
{
handleChange
}
onBlur
=
{
handleBlur
}
value
=
{
values
.
code
}
/
>
{
touched
.
code
&&
errors
.
code
&&
<
div
className
=
"text-danger"
>
{
errors
.
code
}
<
/div>
}
{
/* <div className="link-a">
<a href="">Resend Code</a>
</div> */
}
<
/div
>
<
/div
>
</div
>
<div className="
row
">
<div className="
col
-
md
-
12
mb
-
3
">
<button
className="
btn
btn
-
primary
w
-
100
"
onClick={async () => {
const res = await await finishVendorOtpVerification({ email: session.user.email, oneTimePassword: values.code }
);
console.log("
res
", res.data);
if (!res.data.ok) {
toast.error(res.data.message);
}
if (res.data.ok)
{
const response = await postGiftCard(
{
data: {
senderEmail
: form1Values.email,
senderName: form1Values.e
mail,
receiverEmail
: form1Values.receiverEmail,
receiverName: form1Values.receiverEmail
,
amount: form1Values.amount
,
note: form1Values.message
,
endUser: endUser.id,
status: "
new
"
}
}
);
console.log("
response
", response
);
toast.success("
OTP
verified
!
");
}
}
}
disabled={isSubmitting}
>
Confirm
</
button
>
<
div
className
=
"row"
>
<
div
className
=
"col-md-12 mb-3
"
>
<
button
className
=
"btn btn-primary w-100"
onClick
=
{
async
()
=>
{
const
res
=
await
await
finishVendorOtpVerification
({
email
:
session
.
user
.
email
,
oneTimePassword
:
values
.
code
});
console
.
log
(
"res"
,
res
.
data
);
if
(
!
res
.
data
.
ok
)
{
toast
.
error
(
res
.
data
.
message
);
}
if
(
res
.
data
.
ok
)
{
const
response
=
await
postGiftCard
(
{
data
:
{
senderEmail
:
form1Values
.
email
,
senderName
:
form1Values
.
email
,
receiverEmail
:
form1Values
.
receiverE
mail
,
receiverName
:
form1Values
.
receiverEmail
,
amount
:
form1Values
.
amount
,
note
:
form1Values
.
message
,
endUser
:
endUser
.
id
,
status
:
"new"
}
}
);
console
.
log
(
"response"
,
response
);
toast
.
success
(
"OTP verified!"
);
}
}
}
disabled
=
{
isSubmitting
}
>
Confirm
<
/button
>
<
/
div
>
<
/div
>
</
div
>
</Form>
)}
</
Formik
>
</div>
)}
<
/
Form
>
)}
<
/Formik
>
<
/
div
>
)}
<
/div
>
<
/div
>
</div>
)}
)}
{isResult && (
<div className="
row
">
<div className="
col
-
12
">
<div className="
result
-
box
">
<p>
Gift card sent for approval, please wait till the vendor contacts you
<br /> Thank you.
</p>
<div>
<button
className="
btn
btn
-
primary
"
type="
button
"
onClick={() => {
router.push("
/
listing
"
);
}}
>
Browse
Experiences
<
/button
>
{
isResult
&&
(
<
div
className
=
"row"
>
<
div
className
=
"col-12"
>
<
div
className
=
"result-box"
>
<
p
>
“
Sorry
,
unable
to
process
the
Gift
Card
now
.
This
feature
will
be
available
shortly
.
”
{
/* Gift card sent for approval, please wait till the vendor contacts you
<br /> Thank you. */
}
<
/p
>
<
div
>
<
button
className
=
"btn btn-primary"
type
=
"button"
onClick
=
{()
=>
{
router
.
push
(
"/listing"
);
}}
>
Browse
Experiences
<
/button
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
)}
)}
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/section
>
<
/section
>
<
TermsAndConditionModel
isOpenEis
=
{
isOpenEis
}
setIsOpenEis
=
{
setIsOpenEis
}
/
>
<
/
>
);
};
...
...
components/layout/Header.js
View file @
b0e551b
...
...
@@ -90,7 +90,7 @@ const Header = () => {
<
/Navbar.Brand
>
{
loadedUser
&&
loadedUser
.
id
?
(
<
div
className
=
"top-btn hide-on-desktop"
>
<
div
className
=
"logout-bk"
>
<
div
className
=
"logout-bk"
ref
=
{
logoutBkRef
}
>
<
a
onClick
=
{
toggleGridViewDropdown
}
className
=
"user-icon"
>
<
span
className
=
"image-container user-pic"
>
<
Image
layout
=
"fill"
priority
alt
=
""
className
=
"image img-fluid"
src
=
"/images/icons/user.svg"
/>
...
...
@@ -100,7 +100,7 @@ const Header = () => {
<
/span
>
<
/a
>
{
/* <p>{loadedUser.phone}</p> */
}
<
div
ref
=
{
logoutBk
Ref
}
className
=
{
`inner-box
${
isGridViewOpen
?
"open"
:
""
}
`
}
>
<
div
ref
=
{
innerBox
Ref
}
className
=
{
`inner-box
${
isGridViewOpen
?
"open"
:
""
}
`
}
>
{
endUser
&&
(
<
div
className
=
"user-info"
>
<
div
className
=
"pic"
>
...
...
@@ -288,7 +288,7 @@ const Header = () => {
<>
{
endUser
&&
endUser
.
id
?
(
<
div
className
=
"top-btn hide-on-mobile"
>
<
div
className
=
"logout-bk"
>
<
div
className
=
"logout-bk"
ref
=
{
logoutBkRef
}
>
<
a
onClick
=
{
toggleGridViewDropdown
}
className
=
"user-icon"
>
<
span
className
=
"image-container user-pic"
>
<
Image
layout
=
"fill"
priority
alt
=
""
className
=
"image img-fluid"
src
=
"/images/icons/user.svg"
/>
...
...
components/vendor/UpdateActivity.js
View file @
b0e551b
...
...
@@ -1053,7 +1053,7 @@ const UpdateActivity = () => {
<
/li
>
<
li
>
<
img
src
=
"/images/vendor/call.svg"
className
=
"img-fluid"
/>
<
p
className
=
"number"
>+
1
(
407
)
8798
789
asdasd
<
/p
>
<
p
className
=
"number"
>+
1
(
407
)
8798
789
<
/p
>
<
/li
>
<
/ul
>
<
/div
>
...
...
styles/globals.css
View file @
b0e551b
...
...
@@ -374,6 +374,7 @@ header {
.header-search
.rbt
.rbt-input-main
{
padding-right
:
2.5rem
;
font-size
:
0.833vw
;
width
:
18vw
;
}
.header-search
>
.form-control
{
...
...
@@ -2051,14 +2052,18 @@ span.form-error,
height
:
calc
(
25px
+
(
25
-
25
)
*
(
100vw
-
320px
)
/
(
1920
-
320
))
!important
;
padding-top
:
7px
;
}
.modal-01-session
h2
{
font-size
:
calc
(
32px
+
(
32
-
32
)
*
(
100vw
-
320px
)
/
(
1920
-
320
));
line-height
:
calc
(
4
4px
+
(
44
-
44
)
*
(
100vw
-
320px
)
/
(
1920
-
320
));
font-size
:
calc
(
28px
+
(
28
-
28
)
*
(
100vw
-
320px
)
/
(
1920
-
320
));
line-height
:
calc
(
4
0px
+
(
40
-
40
)
*
(
100vw
-
320px
)
/
(
1920
-
320
));
}
.modal-01-session
.text01
{
font-size
:
calc
(
20px
+
(
20
-
20
)
*
(
100vw
-
320px
)
/
(
1920
-
320
));
padding-top
:
0.2rem
;
padding-bottom
:
1rem
;
padding-bottom
:
0.5rem
;
}
.modal-header
{
padding-bottom
:
0
;
}
.info
.top-name
.title
{
font-size
:
0.885vw
;
...
...
@@ -2074,6 +2079,9 @@ span.form-error,
.cl-blue
{
color
:
#0a58ca
!important
;
}
.text-danger
{
font-size
:
0.8rem
;
}
.info
.rating-wishlist
.rating
{
background
:
#002c5f
;
border-radius
:
4px
;
...
...
@@ -4214,6 +4222,12 @@ footer .footer-link ul {
.vendor-signup
.btn-light
{
background
:
#fff
;
}
.modal-01-session
.modal-header
{
border
:
0
!important
;
}
.modal-01-session
.modal-content
{
padding
:
1rem
;
}
@media
(
min-width
:
992px
)
{
.navbar-expand-lg
.navbar-nav
.nav-link
{
margin
:
0
2rem
;
...
...
@@ -4232,7 +4246,7 @@ footer .footer-link ul {
position
:
relative
;
}
.navbar-expand-lg
.navbar-nav
.nav-link.gift-card
::after
{
/*
.navbar-expand-lg .navbar-nav .nav-link.gift-card::after {
content: "";
background: #000;
height: 2px;
...
...
@@ -4240,7 +4254,7 @@ footer .footer-link ul {
bottom: 0;
left: 0;
position: absolute;
}
}
*/
.navbar-expand-lg
.navbar-nav
.nav-link.gift-card
.image-container
{
width
:
21px
;
...
...
@@ -4272,7 +4286,7 @@ footer .footer-link ul {
position
:
relative
;
}
.navbar-expand-lg
.navbar-nav
.nav-link.gift-card
::after
{
/*
.navbar-expand-lg .navbar-nav .nav-link.gift-card::after {
content: "";
background: #000;
height: 2px;
...
...
@@ -4280,7 +4294,7 @@ footer .footer-link ul {
bottom: 0;
left: 0;
position: absolute;
}
}
*/
.navbar-expand-lg
.navbar-nav
.nav-link.gift-card
.image-container
{
width
:
1.094vw
;
...
...
@@ -4394,6 +4408,9 @@ footer .footer-link ul {
.vendor-signup
a
{
min-width
:
140px
;
}
.top-btn
.inner-box
{
right
:
-15vw
;
}
}
@media
(
max-width
:
767px
)
{
...
...
Write
Preview
Styling with
Markdown
is supported
Attach a file
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to post a comment