Skip to content

Jay Mehta / zango-frontend

Go to a project
Toggle navigation
Toggle navigation pinning
Commit 4e0139fe by jaymehta
Options

gift card

1 parent 9db09d5b
Inline Side-by-side
Showing 5 changed files with 71 additions and 16 deletions
components/gift-card/GiftCard.js
...@@ -10,6 +10,7 @@ import { Loader } from "react-bootstrap-typeahead"; ...@@ -10,6 +10,7 @@ import { Loader } from "react-bootstrap-typeahead";
import { finishVendorOtpVerification } from "../../redux/actions/vendorActions"; import { finishVendorOtpVerification } from "../../redux/actions/vendorActions";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
import { Button } from "react-bootstrap"; import { Button } from "react-bootstrap";
import { postGiftCard } from "../../redux/actions/giftCardAction";
// import { getCurrentEndUser } from "../../redux/actions/userActions"; // import { getCurrentEndUser } from "../../redux/actions/userActions";
const validationSchema = Yup.object().shape({ const validationSchema = Yup.object().shape({
...@@ -39,11 +40,12 @@ const GiftCard = () => { ...@@ -39,11 +40,12 @@ const GiftCard = () => {
// dispatch(getLoggedInVendor()); // dispatch(getLoggedInVendor());
}, []); }, []);
// const {loadedUser} = useSelector(state => state.loadedUser) // const {loadedUser} = useSelector(state => state.loadedUser)
// const { endUser } = useSelector(state => state.endUser); const { endUser } = useSelector(state => state.endUser);
console.log("endUser", session); console.log("endUser", endUser);
const [isStep1, setIsStep1] = useState(true); const [isStep1, setIsStep1] = useState(true);
const [amount, setAmount] = useState(0); const [amount, setAmount] = useState(0);
const [custom, setcustom] = useState(); const [custom, setcustom] = useState();
const [form1Values, setvalues] = useState();
const [isStep2, setIsStep2] = useState(false); const [isStep2, setIsStep2] = useState(false);
const [isResult, setIsResult] = useState(false); const [isResult, setIsResult] = useState(false);
...@@ -301,6 +303,7 @@ const GiftCard = () => { ...@@ -301,6 +303,7 @@ const GiftCard = () => {
} }
}; };
const response = await axios.post(`${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/end-user/verify-gift-card-otp`, data, config); 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); console.log("response", response.data);
setloading(false); setloading(false);
console.log(values); console.log(values);
...@@ -350,8 +353,8 @@ const GiftCard = () => { ...@@ -350,8 +353,8 @@ const GiftCard = () => {
{({ isSubmitting, values, handleChange, handleBlur, touched, errors }) => ( {({ isSubmitting, values, handleChange, handleBlur, touched, errors }) => (
<Form action="" className="form-01"> <Form action="" className="form-01">
<div className="title">We emailed you a 4-digit code</div> <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> {/* <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="row mt-4">
<div className="col-md-12 mb-4"> <div className="col-md-12 mb-4">
<label htmlFor="">Enter 4-Digit Code</label> <label htmlFor="">Enter 4-Digit Code</label>
...@@ -381,6 +384,19 @@ const GiftCard = () => { ...@@ -381,6 +384,19 @@ const GiftCard = () => {
toast.error(res.data.message); toast.error(res.data.message);
} }
if (res.data.ok) { if (res.data.ok) {
const response = await postGiftCard({
data: {
senderEmail: form1Values.email,
senderName: form1Values.email,
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!"); toast.success("OTP verified!");
} }
}} }}
......
components/user/MyGiftCard.js
import Image from "next/image"; import Image from "next/image";
import React, { Fragment } from "react"; import React, { Fragment, useEffect } from "react";
import { Button } from "react-bootstrap"; import { Button } from "react-bootstrap";
import { cleanImage, renderImage } from "../../services/imageHandling"; import { cleanImage, renderImage } from "../../services/imageHandling";
import { useSelector } from "react-redux"; import { useDispatch, useSelector } from "react-redux";
import { getGiftCard } from "../../redux/actions/giftCardAction";
const MyGiftCard = () => { const MyGiftCard = () => {
const dispatch = useDispatch();
const { giftCard } = useSelector(state => state.giftCard); const { giftCard } = useSelector(state => state.giftCard);
console.log("giftCard >>>>>", giftCard) const { endUser } = useSelector(state => state.endUser);
useEffect(() => {
if (endUser) {
dispatch(getGiftCard(endUser.id));
}
}, [endUser]);
console.log("endUser", endUser);
console.log("giftCard", giftCard);
return ( return (
<Fragment> <Fragment>
...@@ -15,7 +25,8 @@ const MyGiftCard = () => { ...@@ -15,7 +25,8 @@ const MyGiftCard = () => {
<div className="col-12 col-lg-12 form-container content-wraaper"> <div className="col-12 col-lg-12 form-container content-wraaper">
<h2 className="px-2 px-lg-0">My Gift Card</h2> <h2 className="px-2 px-lg-0">My Gift Card</h2>
<div className="row"> <div className="row">
{giftCard?.length && giftCard.map((data, index) => ( {giftCard?.length > 0 &&
giftCard.map((data, index) => (
<div className="col-12 col-lg-4 px-4 px-lg-3" key={`1${index}`}> <div className="col-12 col-lg-4 px-4 px-lg-3" key={`1${index}`}>
<div className="card-booking"> <div className="card-booking">
<div className="card-booking-img bgGrey"> <div className="card-booking-img bgGrey">
...@@ -48,7 +59,7 @@ const MyGiftCard = () => { ...@@ -48,7 +59,7 @@ const MyGiftCard = () => {
</div> </div>
</div> </div>
</Fragment> </Fragment>
) );
} };
export default MyGiftCard; export default MyGiftCard;
pages/user/giftcard/index.js
...@@ -16,7 +16,7 @@ export default function UserGiftCardPage () { ...@@ -16,7 +16,7 @@ export default function UserGiftCardPage () {
/** For server side rendering */ /** For server side rendering */
export const getServerSideProps = wrapper.getServerSideProps(store => async ({ req, query }) => { export const getServerSideProps = wrapper.getServerSideProps(store => async ({ req, query }) => {
try { try {
await store.dispatch(getGiftCard()) // await store.dispatch(getGiftCard())
return { return {
props: {}, props: {},
......
redux/actions/giftCardAction.js
import axios from "axios"; import axios from "axios";
import { getSession } from "next-auth/react";
import qs from "qs"; import qs from "qs";
import { GET_GIFTCARD_FAIL, GET_GIFTCARD_REQUEST, GET_GIFTCARD_SUCCESS } from "../constants/giftCardConstants"; import { GET_GIFTCARD_FAIL, GET_GIFTCARD_REQUEST, GET_GIFTCARD_SUCCESS } from "../constants/giftCardConstants";
export const getGiftCard = () => async dispatch => { export const getGiftCard = id => async dispatch => {
try { try {
dispatch({ dispatch({
type: GET_GIFTCARD_REQUEST type: GET_GIFTCARD_REQUEST
}); });
...@@ -15,7 +15,12 @@ export const getGiftCard = () => async dispatch => { ...@@ -15,7 +15,12 @@ export const getGiftCard = () => async dispatch => {
} }
}; };
const query = { const query = {
populate: ["image"] populate: ["image", "endUser"],
filters: {
endUser: {
id: { $eq: id }
}
}
}; };
const queryString = qs.stringify(query, { const queryString = qs.stringify(query, {
...@@ -38,3 +43,26 @@ export const getGiftCard = () => async dispatch => { ...@@ -38,3 +43,26 @@ export const getGiftCard = () => async dispatch => {
}); });
} }
}; };
export const postGiftCard = async ({ data }) => {
try {
const session = await getSession();
if (!session) {
return;
}
const config = {
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${session.jwt}`
}
};
// const data = {
// data
// };
const response = await axios.post(`${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/gift-cards`, { data }, config);
return response.data;
} catch (error) {
console.log("error while posting gift card");
}
};
redux/actions/userActions.js
...@@ -402,12 +402,12 @@ export const updateActivityStatusAdmin = async ({ status, activityId, rejectionR ...@@ -402,12 +402,12 @@ export const updateActivityStatusAdmin = async ({ status, activityId, rejectionR
export const getCurrentEndUser = () => async dispatch => { export const getCurrentEndUser = () => async dispatch => {
try { try {
console.log("here action"); // console.log("here action");
const session = await getSession(); const session = await getSession();
if (!session) { if (!session) {
return; return;
} }
console.log("session action", session); // console.log("session action", session);
dispatch({ dispatch({
type: GET_END_USER_REQUEST type: GET_END_USER_REQUEST
}); });
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!