WrenchBoard/Users-Wrench
3
0
Fork 0
Code Issues Pull Requests Releases Activity

added the redeem coupon api

Browse Source
This commit was merged in pull request #167.
This commit is contained in:
Chukwumdiebube Ojinta
2023-06-13 20:49:29 +01:00
parent d7dbacc69e
commit 9a2fd54bd5
5 changed files with 120 additions and 118 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/MyActiveJobs/ActiveJobs.jsx
+1 -1
View File
@@ -1,4 +1,4 @@
import React, { useEffect, useState, useRef, forwardRef } from "react";
import React, { useEffect, useState, useRef } from "react";
import { useSelector } from "react-redux";
import Layout from "../Partials/Layout";
import { useNavigate } from "react-router-dom";
src/components/MyCoupons/CouponPopup.jsx
+15 -12
View File
@@ -8,30 +8,33 @@ const CouponPopup = ({ popUpHandler, data }) => {
const redeemCouponHandler = async () => {
setLoader(true);
try {
const { code, coupon_id } = data;
const reqData = { code_id: Number(coupon_id), code };
const res = await apiCall.getCouponRedeem(reqData);
if(res.statusText === "OK") {
if (res.statusText === "OK") {
toast.success("Great news! Your coupon has been redeemed.", {
autoClose: 3000,
hideProgressBar: true,
});
}
popUpHandler();
setLoader(false);
setTimeout(() => {
popUpHandler();
setLoader(false);
}, 3000);
throw new Response(res);
} catch (error) {
error &&
toast.warn("An error occurred while processing your coupon.", {
autoClose: 3000,
hideProgressBar: true,
});
// error &&
// toast.warn("An error occurred while processing your coupon.", {
// autoClose: 3000,
// hideProgressBar: true,
// });
setLoader(false);
console.log(error)
console.log(error);
return;
// throw new Error(error);
}
};
@@ -82,7 +85,7 @@ const CouponPopup = ({ popUpHandler, data }) => {
<button
type="button"
onClick={redeemCouponHandler}
className="text-white btn-gradient text-lg tracking-wide px-6 py-2 rounded-full"
className="text-white lg:w-[167px] btn-gradient flex justify-center items-center text-lg tracking-wide px-6 py-2 rounded-full"
>
{loader ? (
<div className="signup btn-loader"></div>
src/components/MyPendingJobs/MyPendingJobTable.jsx
+79 -79
View File
@@ -1,13 +1,10 @@
import React, { useState } from "react";
import dataImage2 from "../../assets/images/data-table-user-2.png";
import PendingJobsPopout from "../jobPopout/PendingJobsPopout";
import { handlePagingFunc } from "../Pagination/HandlePagination";
import PaginatedList from "../Pagination/PaginatedList";
export default function MyPendingJobTable({ MyJobList, className }) {
const filterCategories = ["All Categories", "Explore", "Featured"];
const [selectedCategory, setCategory] = useState(filterCategories[0]);
let [jobPopout, setJobPopout] = useState({ show: false, data: {} }); // STATE TO HOLD THE VALUE OF THE ALERT DETAILS AND DETERMINE WHEN TO SHOW
const [currentPage, setCurrentPage] = useState(0);
@@ -24,26 +21,28 @@ export default function MyPendingJobTable({ MyJobList, className }) {
};
return (
<div
className={`update-table w-full p-8 bg-white dark:bg-dark-white overflow-hidden rounded-2xl section-shadow min-h-[520px] ${
className || ""
}`}
>
{MyJobList && MyJobList?.result_list && (
<div className="relative w-full overflow-x-auto sm:rounded-lg flex flex-col justify-between h-full">
<table className="w-full text-sm text-left text-gray-500 dark:text-gray-400">
<tbody>
{/*<tr className="text-base text-thin-light-gray border-b dark:border-[#5356fb29] default-border-b dark:border-[#5356fb29] ottom ">*/}
{/* <td className="py-4">All Product</td>*/}
{/* <td className="py-4 text-right">.</td>*/}
{/*</tr>*/}
<div
className={`update-table w-full p-8 bg-white dark:bg-dark-white overflow-hidden rounded-2xl section-shadow min-h-[520px] ${
className || ""
}`}
>
{MyJobList && MyJobList?.result_list && (
<div className="relative w-full overflow-x-auto sm:rounded-lg flex flex-col justify-between h-full">
<table className="w-full text-sm text-left text-gray-500 dark:text-gray-400">
<tbody>
{/*<tr className="text-base text-thin-light-gray border-b dark:border-[#5356fb29] default-border-b dark:border-[#5356fb29] ottom ">*/}
{/* <td className="py-4">All Product</td>*/}
{/* <td className="py-4 text-right">.</td>*/}
{/*</tr>*/}
{
<>
{MyJobList &&
MyJobList?.result_list &&
MyJobList.result_list.length > 0 ?
currentActiveJobList.map((value, index) => (
{
<>
{MyJobList &&
MyJobList?.result_list &&
MyJobList.result_list.length > 0 ? (
currentActiveJobList.map((value, index) => {
let deliveryDate = value?.expire?.split(" ")[0];
return (
<tr
key={index}
className="bg-white dark:bg-dark-white border-b dark:border-[#5356fb29] hover:bg-gray-50"
@@ -68,31 +67,33 @@ export default function MyPendingJobTable({ MyJobList, className }) {
{value.price * 0.01}
</span>
</span>
<span className="text-sm text-thin-light-gray">
Duration:{" "}
<span className="text-purple">
{" "}
{value.timeline_days} day(s)
<div className="flex items-center gap-4">
<span className="text-sm text-thin-light-gray">
Duration:{" "}
<span className="text-purple">
{" "}
{value.timeline_days} day(s)
</span>
</span>
</span>
<span className="text-sm text-thin-light-gray">
Expire:{" "}
<span className="text-purple">
{" "}
{value.expire}
<span className="text-sm text-thin-light-gray">
Expire:{" "}
<span className="text-purple">
{" "}
{deliveryDate}
</span>
</span>
</span>
<span className="text-sm text-thin-light-gray">
Send to:{" "}
<span className="text-purple">
{" "}
{value.job_to}
<span className="text-sm text-thin-light-gray">
Send to:{" "}
<span className="text-purple">
{" "}
{value.job_to}
</span>
</span>
</span>
</div>
</div>
</div>
</td>
<td className="text-right py-4 px-2">
<button
type="button"
@@ -105,47 +106,46 @@ export default function MyPendingJobTable({ MyJobList, className }) {
</button>
</td>
</tr>
))
:
)
})
) : (
<tr className="font-bold text-xl text-dark-gray dark:text-white whitespace-nowrap">
<td className="p-2">
No Pending Task!
</td>
<td className="p-2">No Pending Task!</td>
</tr>
}
</>
}
</tbody>
</table>
{/* PAGINATION BUTTON */}
<PaginatedList
onClick={handlePagination}
prev={currentPage == 0 ? true : false}
next={
currentPage + Number(process.env.REACT_APP_ITEM_PER_PAGE) >=
MyJobList?.result_list.length
? true
: false
)}
</>
}
data={MyJobList?.result_list}
start={indexOfFirstItem}
stop={indexOfLastItem}
/>
{/* END OF PAGINATION BUTTON */}
</div>
)}
{/* Active Job Popout */}
{jobPopout.show && (
<PendingJobsPopout
details={jobPopout.data}
onClose={() => {
setJobPopout({ show: false, data: {} });
}}
situation={jobPopout.show}
</tbody>
</table>
{/* PAGINATION BUTTON */}
<PaginatedList
onClick={handlePagination}
prev={currentPage == 0 ? true : false}
next={
currentPage + Number(process.env.REACT_APP_ITEM_PER_PAGE) >=
MyJobList?.result_list.length
? true
: false
}
data={MyJobList?.result_list}
start={indexOfFirstItem}
stop={indexOfLastItem}
/>
)}
{/* End of Active Job Popout */}
</div>
{/* END OF PAGINATION BUTTON */}
</div>
)}
{/* Active Job Popout */}
{jobPopout.show && (
<PendingJobsPopout
details={jobPopout.data}
onClose={() => {
setJobPopout({ show: false, data: {} });
}}
situation={jobPopout.show}
/>
)}
{/* End of Active Job Popout */}
</div>
);
}
src/components/MyTasks/MyJobTable.jsx
+1
View File
@@ -85,6 +85,7 @@ export default function MyJobTable({ className, ActiveJobList }) {
{Number(task?.price) * 0.01}
</span>
</span>
<span className="text-sm text-thin-light-gray">
Duration:
<span className="text-purple ml-1">
src/views/MyPendingJobsPage.jsx
+24 -26
View File
@@ -1,34 +1,32 @@
import React, { useContext,useState, useEffect } from "react";
import React, { useContext, useState, useEffect } from "react";
import usersService from "../services/UsersService";
//import MyJobs from "../components/MyJobs";
import MyActiveJobs from "../components/MyActiveJobs";
import MyPendingJobs from "../components/MyPendingJobs";
import { useSelector } from "react-redux";
export default function MyPendingJobsPage() {
let {commonHeadBanner} = useSelector(state => state.commonHeadBanner)
const [MyJobList, setMyJobList] = useState([]);
const api = new usersService();
let { commonHeadBanner } = useSelector((state) => state.commonHeadBanner);
const [MyJobList, setMyJobList] = useState([]);
const api = new usersService();
const getMyJobList = async () => {
try {
const res = await api.getMyPendingJobList();
setMyJobList(res.data);
} catch (error) {
console.log("Error getting mode");
}
};
useEffect(() => {
getMyJobList();
}, []);
const getMyJobList = async () => {
try {
const res = await api.getMyPendingJobList();
setMyJobList(res.data);
} catch (error) {
console.log("Error getting mode");
}
};
useEffect(() => {
getMyJobList();
}, []);
// debugger;
return (
<>
<MyPendingJobs
MyJobList={MyJobList}
commonHeadData={commonHeadBanner.result_list}
/>
</>
);
// debugger;
return (
<>
<MyPendingJobs
MyJobList={MyJobList}
commonHeadData={commonHeadBanner.result_list}
/>
</>
);
}