Market item Popup-upgrades #145

Merged
ameye merged 10 commits from market-item-view-popup into master 2023-06-07 01:09:26 +00:00
9 changed files with 159 additions and 36 deletions
+2
View File
@@ -40,6 +40,7 @@ import ManageActiveJobs from "./views/ManageActiveJobs";
import FamilyManagePage from "./views/FamilyManagePage";
import MyCouponPage from "./views/MyCouponPage";
import AuthRedirect from "./views/AuthRedirect";
import MyPastDueJobsPage from "./views/MyPastDueJobsPage";
export default function Routers() {
return (
@@ -86,6 +87,7 @@ export default function Routers() {
<Route exact path="/myjobs" element={<MyJobsPage />} />
<Route exact path="/add-job" element={<AddJobPage />} />
<Route exact path="/my-active-jobs" element={<MyActiveJobsPage />} />
<Route exact path="/my-pastdue-jobs" element={<MyPastDueJobsPage />} />
<Route exact path="/my-pending-jobs" element={<MyPendingJobsPage />} />
<Route exact path="/acc-family" element={<FamilyAccPage />} />
<Route exact path="/manage-family" element={<FamilyManagePage />} />
Binary file not shown.

After

Width:  |  Height:  |  Size: 77 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 72 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 72 KiB

@@ -32,7 +32,7 @@ export default function HomeBannerOffersCard(props) {
{props.itemData.description}
</div>
<div className="siderCardButton">
[BUTTON HERE]
[ {props.itemData.button_text} ]
</div>
</div>
+63 -35
View File
@@ -4,14 +4,17 @@ import Layout from "../Partials/Layout";
import { useNavigate } from "react-router-dom";
import ActiveJobMessage from "./ActiveJobMessage";
import LoadingSpinner from "../Spinners/LoadingSpinner";
import CountDown from "../Helpers/CountDown";
import usersService from "../../services/UsersService";
function ActiveJobs(props) {
const ApiCall = new usersService()
let navigate = useNavigate()
let { userDetails } = useSelector((state) => state.userDetails);
let navigate = useNavigate()
let [passDue, setPassDue] = useState(new Date() > new Date(props.details?.delivery_date)) // STATE TO KNOW IF TASK IS PASSED DUE TIME
let [messageToSend, setMessageToSend] = useState('') // State to hold the value of message to be sent
@@ -145,10 +148,33 @@ function ActiveJobs(props) {
}
}
// FUNCTION TO CHECK IF TASK PASS DUE IS REACHED
let isPassedDue = () => {
// console.log('TESTING',new Date() > new Date(props.details?.delivery_date) )
if(new Date() > new Date(props.details?.delivery_date)){
setPassDue(true)
}else{
setPassDue(false)
}
}
useEffect(()=>{
if(!passDue){
let passDueInterval = setInterval(()=>{
isPassedDue()
},1000)
return ()=>{
clearInterval(passDueInterval)
}
}
},[passDue])
return (
<Layout>
<div className="py-[20px] bg-white px-4 rounded-2xl shadow-md md:flex justify-between items-start space-y-4 md:space-x-4 md:space-y-0">
<div className="py-[20px] bg-white px-4 rounded-2xl shadow-md md:flex justify-between items-start gap-16">
{/* job title */}
<div className="w-full md:w-8/12">
<div className="w-full flex justify-start space-x-3 items-start">
@@ -172,20 +198,14 @@ function ActiveJobs(props) {
</h1>
</div>
<div className="w-full my-4">
<div className="pb-2 w-full flex items-center">
<p className="w-full lg:w-2/3 text-base text-slate-700 dark:text-black">
{props.details?.contract && props.details.contract}
</p>
<p className="w-full lg:w-1/3 text-base text-sky-blue">
<div className="w-full my-2">
<p className="w-full text-base text-right text-sky-blue">
{userDetails.firstname && userDetails.firstname}
</p>
<div className="text-base text-slate-700 dark:text-black tracking-wide">
<p className="font-semibold text-black">Description: </p>
<p className="p-2 border border-sky-blue">{props.details?.description && props.details.description}</p>
</div>
<p className="text-base text-slate-700 dark:text-black">
<span className="font-semibold">Description: </span>
{props.details?.description && props.details.description}
</p>
</div>
</div>
{/* end of job title */}
@@ -193,7 +213,9 @@ function ActiveJobs(props) {
{/* job details */}
<div className="w-full md:w-4/12">
<p className="text-base text-sky-blue">Delivery Detail</p>
<div className="mt-2">
{passDue ?
(
<div className="my-1">
<p className="text-base text-slate-700 dark:text-black">
<span className="font-semibold">Due: </span>
{props.details?.delivery_date &&
@@ -203,9 +225,33 @@ function ActiveJobs(props) {
{props.details?.delivery_date &&
props.details.delivery_date.split(" ")[1]}
</p>
<p className="text-base text-slate-700 dark:text-black">
{props.details?.timeline_days && props.details.timeline_days} day(s)
</p>
</div>
)
:
(
<div className="my-1 flex items-start gap-3">
<p className="font-semibold">Due: </p>
<div className="flex flex-col justify-between">
<p className="text-base text-slate-700 dark:text-black tracking-wide">
<CountDown lastDate={props.details.delivery_date} />
</p>
<div className="text-base text-slate-700 dark:text-black tracking-wide flex gap-[5px]">
<span>Hrs</span>
<span>Min</span>
<span>Sec</span>
</div>
</div>
</div>
)
}
<div className="my-1 text-base text-slate-700 dark:text-black tracking-wide flex items-center gap-3">
<span className="font-semibold text-black">Duration: </span>
<span className="">{props.details?.timeline_days && props.details.timeline_days} day(s)</span>
</div>
<div className="my-1 text-base text-slate-700 dark:text-black tracking-wide flex items-center gap-3">
<span className="font-semibold text-black">No: </span>
<span className="">{props.details?.contract && props.details.contract}</span>
</div>
</div>
{/* end of job details */}
@@ -293,24 +339,6 @@ function ActiveJobs(props) {
{/* Buttons Sections */}
<div className="py-2 sm:flex sm:justify-end sm:items-center">
{/* <div className="w-full mb-3 sm:mb-0 sm:w-2/4">
{tab == 'files' &&
(
<button
onClick={()=>{console.log('working')}}
type="button"
className="btn-gradient text-base tracking-wide px-4 py-2 rounded-md flex justify-center items-center"
>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" fill='white'>
<path d="M12 2L2 12h3v8h14v-8h3L12 2zm0 16v-6h-2v6H7l5-5 5 5h-3z"/>
</svg>
<span className="text-white">Upload Files</span>
</button>
)
}
</div> */}
<div className="w-full sm:w-2/4 flex justify-between items-center space-x-2">
<button
type="button"
@@ -0,0 +1,43 @@
import React, { useState } from "react";
import { Link } from "react-router-dom";
import Layout from "../Partials/Layout";
import CommonHead from "../UserHeader/CommonHead";
import MyActiveJobTable from "./MyActiveJobTable";
export default function MyPastDueJobs(props) {
const [selectTab, setValue] = useState("today");
const filterHandler = (value) => {
setValue(value);
};
console.log("AMEYE LOC1", props.MyJobList);
return (
<Layout>
<CommonHead
commonHeadData={props.commonHeadData}
/>
<div className="notification-page w-full mb-10">
<div className="notification-wrapper w-full">
{/* heading */}
<div className="sm:flex justify-between items-center mb-6">
<div className="mb-5 sm:mb-0">
<h1 className="text-26 font-bold text-dark-gray dark:text-white">
<span
className={`${selectTab === "today" ? "block" : "hidden"}`}
>
Pass Due Job(s)
</span>
</h1>
</div>
<div className="slider-btns flex space-x-4">
<div
onClick={() => filterHandler("today")}
className="relative"
></div>
</div>
</div>
<MyActiveJobTable MyJobList={props.MyJobList} />
</div>
</div>
</Layout>
);
}
+14
View File
@@ -219,6 +219,7 @@ class usersService {
uid: localStorage.getItem("uid"),
member_id: localStorage.getItem("member_id"),
sessionid: localStorage.getItem("session_token"),
job_mode: "ACTIVE",
limit: 30,
offset: 0,
action: 13008,
@@ -244,6 +245,7 @@ class usersService {
uuid: localStorage.getItem("uid"),
member_id: localStorage.getItem("member_id"),
sessionid: localStorage.getItem("session_token"),
job_mode: "ACTIVE",
page: 0,
offset: 0,
limit: 100,
@@ -251,6 +253,18 @@ class usersService {
return this.postAuxEnd("/jobmanageractive", postData);
}
getMyPastDueJobList() {
var postData = {
uuid: localStorage.getItem("uid"),
member_id: localStorage.getItem("member_id"),
sessionid: localStorage.getItem("session_token"),
job_mode: "PASTDUE",
page: 0,
offset: 0,
limit: 100,
};
return this.postAuxEnd("/jobmanageractive", postData);
}
getMyPendingJobList() {
var postData = {
uuid: localStorage.getItem("uid"),
+36
View File
@@ -0,0 +1,36 @@
import React, { useContext,useState, useEffect } from "react";
import usersService from "../services/UsersService";
//import MyJobs from "../components/MyJobs";
//import MyActiveJobs from "../components/MyActiveJobs";
import MyPastDueJobs from "../components/MyActiveJobs/MyPastDueJobs";
export default function MyPastDueJobsPage() {
const commonHeadData =()=>{
console.log("COMMON HEAD DATA ----------------=====---------------------");
return 0;
}
const [MyJobList, setMyJobList] = useState([]);
const api = new usersService();
//TARGET ENDPOINT[POST]http://10.204.5.100:9083/en/wrench/api/v1/jobmanageractive
const getMyJobList = async () => {
try {
const res = await api.getMyPastDueJobList();
setMyJobList(res.data);
} catch (error) {
console.log("Error getting mode");
}
};
useEffect(() => {
getMyJobList();
}, []);
// debugger;
return (
<>
<MyPastDueJobs
MyJobList={MyJobList}
commonHeadData={commonHeadData}
/>
</>
);
}