Compare commits
19 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 5a37352c53 | |||
| 0c21f953ee | |||
| 448c1c69ba | |||
| b535326c51 | |||
| dad2b6781e | |||
| 3cb0604e81 | |||
| 73a21a2367 | |||
| 8716b16a70 | |||
| 3290fce6da | |||
| 21e4221301 | |||
| d9f1771045 | |||
| 119dfcde06 | |||
| f6e37d0f14 | |||
| 3b1dc859e0 | |||
| a45d21cd2d | |||
| 1774d07980 | |||
| 69ec1e3766 | |||
| 7e0f19212f | |||
| 4f1a4dd045 |
@@ -36,6 +36,7 @@ import FamilyAccPage from "./views/FamilyAccPage";
|
||||
import StartJob from "./components/MyJobs/StartJob";
|
||||
import AddJobPage from "./views/AddJobPage";
|
||||
import MyPendingJobsPage from "./views/MyPendingJobsPage";
|
||||
import ManageActiveJobs from "./views/ManageActiveJobs";
|
||||
|
||||
export default function Routers() {
|
||||
return (
|
||||
@@ -83,6 +84,7 @@ export default function Routers() {
|
||||
<Route exact path="/my-pending-jobs" element={<MyPendingJobsPage />} />
|
||||
<Route exact path="/acc-family" element={<FamilyAccPage />} />
|
||||
<Route exact path="/start-job" element={<StartJob />} />
|
||||
<Route exact path="/manage-active-job" element={<ManageActiveJobs />} />
|
||||
<Route
|
||||
exact
|
||||
path="/my-collection/collection-item"
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,155 @@
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { useSelector } from "react-redux";
|
||||
import ModalCom from "../Helpers/ModalCom";
|
||||
import Layout from "../Partials/Layout";
|
||||
import { useLocation, useNavigate } from "react-router-dom";
|
||||
import ActiveJobMessage from "./ActiveJobMessage";
|
||||
|
||||
function ActiveJobs() {
|
||||
let { userDetails } = useSelector((state) => state.userDetails);
|
||||
let navigate = useNavigate()
|
||||
let {state} = useLocation()
|
||||
|
||||
let [details, setDetails] = useState({})
|
||||
|
||||
// console.log(state, userDetails);
|
||||
|
||||
useEffect(()=>{
|
||||
if(!state){
|
||||
navigate('/my-active-jobs', {replace: true})
|
||||
}
|
||||
setDetails(state)
|
||||
},[])
|
||||
return (
|
||||
<Layout>
|
||||
{/* <div className="logout-modal-wrapper min-w-[850px] h-full lg:h-auto lg:rounded-2xl overflow-y-auto"> */}
|
||||
|
||||
<div className="p-4 lg:flex justify-between items-start space-y-4 lg:space-x-4 lg:space-y-0 rounded-lg shadow-lg bg-slate-100">
|
||||
<div className="w-full lg:w-3/4">
|
||||
<div className="py-[20px] bg-white px-4 rounded-md shadow-md">
|
||||
{/* back btn and title */}
|
||||
<div className="w-full flex justify-start space-x-3 items-center">
|
||||
<button
|
||||
type="button"
|
||||
className="text-[#374557] border border-sky-blue p-1 rounded-full"
|
||||
onClick={() => navigate('/my-active-jobs', {replace: true})}
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="35"
|
||||
height="35"
|
||||
viewBox="0 0 24 24"
|
||||
fill="skyblue"
|
||||
>
|
||||
<path d="M19 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H19v-2z" />
|
||||
</svg>
|
||||
</button>
|
||||
<h1 className="text-lg font-bold text-dark-gray dark:text-white tracking-wide">
|
||||
{details.title && details.title}
|
||||
</h1>
|
||||
</div>
|
||||
{/* END of back btn and title */}
|
||||
|
||||
<div className="mt-2 w-full lg:flex lg:justify-between lg:items-center lg:space-x-2">
|
||||
<div className="my-2 lg:my-0">
|
||||
<p className="text-base text-slate-700 dark:text-black">
|
||||
{details.contract && details.contract}
|
||||
</p>
|
||||
<p className="text-base text-slate-700 dark:text-black">
|
||||
<span className="font-semibold">Description: </span>
|
||||
{details.description && details.description}
|
||||
</p>
|
||||
<p className="text-base text-sky-blue">Delivery Detail</p>
|
||||
</div>
|
||||
<div className="">
|
||||
<p className="text-base text-sky-blue">
|
||||
{userDetails.firstname && userDetails.firstname}
|
||||
</p>
|
||||
<p className="text-base text-slate-700 dark:text-black">
|
||||
<span className="font-semibold">Due: </span>
|
||||
{details.delivery_date &&
|
||||
details.delivery_date.split(" ")[0]}
|
||||
</p>
|
||||
<p className="text-base text-slate-700 dark:text-black">
|
||||
{details.delivery_date &&
|
||||
details.delivery_date.split(" ")[1]}
|
||||
</p>
|
||||
<p className="text-base text-slate-700 dark:text-black">
|
||||
{details.timeline_days && details.timeline_days} day(s)
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="mt-5 bg-white p-4 rounded-md shadow-md">
|
||||
<div className="">
|
||||
<p className="text-lg font-bold text-slate-600 dark:text-blask tracking-wide">Message(s)</p>
|
||||
<textarea
|
||||
className="p-4 w-full text-base text-slate-600 border border-slate-300 outline-none rounded-md"
|
||||
rows="10"
|
||||
style={{ resize: "none" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Buttons Sections */}
|
||||
<div className="py-2 mb-8 sm:flex sm:justify-center sm:items-center">
|
||||
<div className="w-full sm:w-3/4 mb-5 sm:mb-0">
|
||||
<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-1/4 flex justify-between items-center space-x-2">
|
||||
<button
|
||||
type="button"
|
||||
className="bg-red-600 text-base text-white tracking-wide px-4 py-2 rounded-md hover:opacity-90"
|
||||
>
|
||||
<span className="text-white">Clear</span>
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
className="btn-gradient text-base text-white tracking-wide px-4 py-2 rounded-md"
|
||||
>
|
||||
<span className="text-white">Send</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
{/* end of Buttons Sections */}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* ACTION SECTION */}
|
||||
<div className="w-full lg:w-1/4 h-full">
|
||||
<div className="py-[20px] bg-white px-4 rounded-md shadow-md">
|
||||
<h1 className="text-lg font-bold text-dark-gray dark:text-white tracking-wide">Actions</h1>
|
||||
|
||||
<p className="my-3 py-1 text-base">
|
||||
Waiting for the completion message from the client before you can approve.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="mt-5 bg-white p-4 rounded-md shadow-md">
|
||||
<div className="">
|
||||
<p className="text-lg font-bold text-dark-gray dark:text-black tracking-wide">Message</p>
|
||||
<ActiveJobMessage />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* </div> */}
|
||||
</Layout>
|
||||
);
|
||||
}
|
||||
|
||||
export default ActiveJobs;
|
||||
@@ -1,112 +1,136 @@
|
||||
import React, { useState } from "react";
|
||||
import dataImage1 from "../../assets/images/data-table-user-1.png";
|
||||
import dataImage2 from "../../assets/images/data-table-user-2.png";
|
||||
import dataImage3 from "../../assets/images/data-table-user-3.png";
|
||||
import dataImage4 from "../../assets/images/data-table-user-4.png";
|
||||
import SelectBox from "../Helpers/SelectBox";
|
||||
import ActiveJobsPopout from "../jobPopout/ActiveJobsPopout";
|
||||
|
||||
import PaginatedList from "../Pagination/PaginatedList";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
|
||||
import { handlePagingFunc } from "../Pagination/HandlePagination";
|
||||
import PaginatedList from "../Pagination/PaginatedList";
|
||||
|
||||
export default function MyActiveJobTable({MyJobList, className }) {
|
||||
const filterCategories = ["All Categories", "Explore", "Featured"];
|
||||
const [selectedCategory, setCategory] = useState(filterCategories[0]);
|
||||
export default function MyActiveJobTable({ MyJobList, className }) {
|
||||
const navigate = useNavigate()
|
||||
|
||||
let [jobPopout,setJobPopout] = useState({show:false, data:{}}) // STATE TO HOLD THE VALUE OF THE ALERT DETAILS AND DETERMINE WHEN TO SHOW
|
||||
const filterCategories = ["All Categories", "Explore", "Featured"];
|
||||
const [selectedCategory, setCategory] = useState(filterCategories[0]);
|
||||
|
||||
const [currentPage, setCurrentPage] = useState(0);
|
||||
const indexOfFirstItem = Number(currentPage);
|
||||
const indexOfLastItem = Number(indexOfFirstItem)+Number(process.env.REACT_APP_ITEM_PER_PAGE);
|
||||
const currentActiveJobList = MyJobList?.result_list?.slice(indexOfFirstItem, indexOfLastItem);
|
||||
|
||||
const handlePagination = (e) => {
|
||||
handlePagingFunc(e,setCurrentPage)
|
||||
}
|
||||
const [currentPage, setCurrentPage] = useState(0);
|
||||
const indexOfFirstItem = Number(currentPage);
|
||||
const indexOfLastItem =
|
||||
Number(indexOfFirstItem) + Number(process.env.REACT_APP_ITEM_PER_PAGE);
|
||||
const currentActiveJobList = MyJobList?.result_list?.slice(
|
||||
indexOfFirstItem,
|
||||
indexOfLastItem
|
||||
);
|
||||
|
||||
return (
|
||||
<div
|
||||
className={`update-table w-full p-8 bg-white dark:bg-dark-white overflow-hidden rounded-2xl section-shadow ${
|
||||
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>*/}
|
||||
const handlePagination = (e) => {
|
||||
handlePagingFunc(e, setCurrentPage);
|
||||
};
|
||||
|
||||
{
|
||||
<>
|
||||
{MyJobList && MyJobList?.result_list &&
|
||||
MyJobList.result_list.length > 0 &&
|
||||
currentActiveJobList.map((value, index) => (
|
||||
<tr key={index} className="bg-white dark:bg-dark-white border-b dark:border-[#5356fb29] hover:bg-gray-50">
|
||||
<td className=" py-4">
|
||||
<div className="flex space-x-2 items-center">
|
||||
<div className="w-[60px] h-[60px] rounded-full overflow-hidden flex justify-center items-center">
|
||||
<img
|
||||
src={dataImage2}
|
||||
alt="data"
|
||||
className="w-full h-full"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<h1 className="font-bold text-xl text-dark-gray dark:text-white">
|
||||
{value.title}
|
||||
</h1>
|
||||
<div>
|
||||
{value.description}
|
||||
</div>
|
||||
<span className="text-sm text-thin-light-gray">
|
||||
Price: <span className="text-purple">{value.price*0.01}</span>
|
||||
</span>
|
||||
<span className="text-sm text-thin-light-gray">
|
||||
Duration: <span className="text-purple"> {value.timeline_days} day(s)</span>
|
||||
</span>
|
||||
<span className="text-sm text-thin-light-gray">
|
||||
Expire: <span className="text-purple"> {value.expire}</span>
|
||||
</span>
|
||||
<span className="text-sm text-thin-light-gray">
|
||||
Send to: <span className="text-purple"> {value.job_to}</span>
|
||||
</span>
|
||||
return (
|
||||
<div
|
||||
className={`update-table w-full p-8 bg-white dark:bg-dark-white overflow-hidden rounded-2xl section-shadow ${
|
||||
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>
|
||||
</div>
|
||||
</td>
|
||||
{
|
||||
<>
|
||||
{MyJobList &&
|
||||
MyJobList?.result_list &&
|
||||
MyJobList.result_list.length > 0 &&
|
||||
currentActiveJobList.map((value, index) => (
|
||||
<tr
|
||||
key={index}
|
||||
className="bg-white dark:bg-dark-white border-b dark:border-[#5356fb29] hover:bg-gray-50"
|
||||
>
|
||||
<td className=" py-4">
|
||||
<div className="flex space-x-2 items-center">
|
||||
<div className="w-[60px] h-[60px] rounded-full overflow-hidden flex justify-center items-center">
|
||||
<img
|
||||
src={dataImage2}
|
||||
alt="data"
|
||||
className="w-full h-full"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<h1 className="font-bold text-xl text-dark-gray dark:text-white">
|
||||
{value.title}
|
||||
</h1>
|
||||
<div>{value.description}</div>
|
||||
<span className="text-sm text-thin-light-gray">
|
||||
Price:{" "}
|
||||
<span className="text-purple">
|
||||
{value.price * 0.01}
|
||||
</span>
|
||||
</span>
|
||||
<span className="text-sm text-thin-light-gray">
|
||||
Duration:{" "}
|
||||
<span className="text-purple">
|
||||
{" "}
|
||||
{value.timeline_days} day(s)
|
||||
</span>
|
||||
</span>
|
||||
<span className="text-sm text-thin-light-gray">
|
||||
Expire:{" "}
|
||||
<span className="text-purple">
|
||||
{" "}
|
||||
{value.expire}
|
||||
</span>
|
||||
</span>
|
||||
<span className="text-sm text-thin-light-gray">
|
||||
Send to:{" "}
|
||||
<span className="text-purple">
|
||||
{" "}
|
||||
{value.job_to}
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
|
||||
|
||||
<td className="text-right py-4 px-2">
|
||||
<button
|
||||
type="button"
|
||||
onClick={()=>{setJobPopout({show:true, data:value})}}
|
||||
className="w-20 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
|
||||
>
|
||||
View
|
||||
</button>
|
||||
</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>
|
||||
<td className="text-right py-4 px-2">
|
||||
<div className="flex justify-center items-center">
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => {
|
||||
navigate('/manage-active-job', {state:value});
|
||||
}}
|
||||
className="w-20 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
|
||||
>
|
||||
View
|
||||
</button>
|
||||
</div>
|
||||
</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
|
||||
}
|
||||
|
||||
{/* Active Job Popout */}
|
||||
{jobPopout.show &&
|
||||
<ActiveJobsPopout details={jobPopout.data} onClose={()=>{setJobPopout({show:false, data:{}})}} situation={jobPopout.show} />
|
||||
}
|
||||
{/* End of Active Job Popout */}
|
||||
data={MyJobList?.result_list}
|
||||
start={indexOfFirstItem}
|
||||
stop={indexOfLastItem}
|
||||
/>
|
||||
{/* END OF PAGINATION BUTTON */}
|
||||
</div>
|
||||
);
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -5,37 +5,37 @@ import CommonHead from "../UserHeader/CommonHead";
|
||||
import MyActiveJobTable from "./MyActiveJobTable";
|
||||
|
||||
export default function MyActiveJobs(props) {
|
||||
const [selectTab, setValue] = useState("today");
|
||||
const filterHandler = (value) => {
|
||||
setValue(value);
|
||||
};
|
||||
console.log("AMEYE LOC1", props.MyJobList);
|
||||
return (
|
||||
<Layout>
|
||||
<CommonHead />
|
||||
<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">
|
||||
const [selectTab, setValue] = useState("today");
|
||||
const filterHandler = (value) => {
|
||||
setValue(value);
|
||||
};
|
||||
console.log("AMEYE LOC1", props.MyJobList);
|
||||
return (
|
||||
<Layout>
|
||||
<CommonHead />
|
||||
<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"}`}
|
||||
className={`${selectTab === "today" ? "block" : "hidden"}`}
|
||||
>
|
||||
Active 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>
|
||||
</h1>
|
||||
</div>
|
||||
</Layout>
|
||||
);
|
||||
<div className="slider-btns flex space-x-4">
|
||||
<div
|
||||
onClick={() => filterHandler("today")}
|
||||
className="relative"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
<MyActiveJobTable MyJobList={props.MyJobList} />
|
||||
</div>
|
||||
</div>
|
||||
</Layout>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -62,33 +62,35 @@ export default function MyJobTable({MyJobList, className }) {
|
||||
currentJobList.map((value, index) => (
|
||||
<tr key={index} className="bg-white dark:bg-dark-white border-b dark:border-[#5356fb29] hover:bg-gray-50">
|
||||
<td className="py-9">
|
||||
<div className="flex space-x-2 items-center job-items">
|
||||
<div className="w-[60px] h-[60px] rounded-full overflow-hidden flex justify-center items-center">
|
||||
<img
|
||||
src={dataImage2}
|
||||
alt="data"
|
||||
className="w-full h-full"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<h1 className="font-bold text-xl text-dark-gray dark:text-white">
|
||||
{value.title}
|
||||
</h1>
|
||||
<div>
|
||||
{value.description}
|
||||
<div className="sm:flex sm:space-x-2 sm:justify-between sm:items-center job-items">
|
||||
<div className="flex space-x-2 items-center job-items">
|
||||
<div className="w-[60px] h-[60px] rounded-full overflow-hidden flex justify-center items-center">
|
||||
<img
|
||||
src={dataImage2}
|
||||
alt="data"
|
||||
className="w-full h-full"
|
||||
/>
|
||||
</div>
|
||||
<span className="text-sm text-thin-light-gray">
|
||||
Price: <span className="text-purple">{value.price*0.01}</span>
|
||||
</span>
|
||||
<span className="text-sm text-thin-light-gray">
|
||||
Duration: <span className="text-purple"> {value.timeline_days} day(s)</span>
|
||||
</span>
|
||||
<div className="flex flex-col">
|
||||
<h1 className="font-bold text-xl text-dark-gray dark:text-white">
|
||||
{value.title}
|
||||
</h1>
|
||||
<div>
|
||||
{value.description}
|
||||
</div>
|
||||
<span className="text-sm text-thin-light-gray">
|
||||
Price: <span className="text-purple">{value.price*0.01}</span>
|
||||
</span>
|
||||
<span className="text-sm text-thin-light-gray">
|
||||
Duration: <span className="text-purple"> {value.timeline_days} day(s)</span>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="job-sub-menu mt-2 flex flex-nowrap justify-start sm:justify-end items-center">
|
||||
<div className="bg-yellow-300 mx-2 rounded-md">
|
||||
<button type="button" className="p-2 w-[60px] h-11" onClick={()=>{setDeleteJobPopout({show:true, data:value})}}>[Delete]</button> |
|
||||
|
||||
<div className="min-w-[110px] max-w-[110px] bg-yellow-300 mx-2 rounded-md flex flex-nowrap space-x-2 justify-center items-center self-end">
|
||||
<button type="button" className="p-2 w-[60px] h-11" onClick={()=>{setDeleteJobPopout({show:true, data:value})}}>[Delete]</button>
|
||||
<span>|</span>
|
||||
<button type="button" className="p-2 w-[40px] h-11">Edit</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -5,40 +5,44 @@ import MyJobTable from "./MyJobTable";
|
||||
import CommonHead from "../UserHeader/CommonHead";
|
||||
|
||||
export default function MyJobs(props) {
|
||||
const [selectTab, setValue] = useState("today");
|
||||
const filterHandler = (value) => {
|
||||
setValue(value);
|
||||
};
|
||||
console.log("AMEYE LOC1", props.MyJobList);
|
||||
return (
|
||||
<Layout>
|
||||
<CommonHead />
|
||||
<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 flex items-center space-x-1 text-dark-gray dark:text-white">
|
||||
<span
|
||||
className={`${selectTab === "today" ? "block" : "hidden"}`}
|
||||
>
|
||||
My Jobs
|
||||
</span>
|
||||
const [selectTab, setValue] = useState("today");
|
||||
const filterHandler = (value) => {
|
||||
setValue(value);
|
||||
};
|
||||
console.log("AMEYE LOC1", props.MyJobList);
|
||||
return (
|
||||
<Layout>
|
||||
<CommonHead />
|
||||
<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 flex items-center space-x-1 text-dark-gray dark:text-white">
|
||||
<span
|
||||
className={`${selectTab === "today" ? "block" : "hidden"}`}
|
||||
>
|
||||
My Jobs
|
||||
</span>
|
||||
|
||||
<Link to='/add-job' className='w-20 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white'>
|
||||
Add Job
|
||||
</Link>
|
||||
</h1>
|
||||
</div>
|
||||
<div className="slider-btns flex space-x-4">
|
||||
<div onClick={() => filterHandler("today")} className="relative">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<MyJobTable MyJobList={props.MyJobList} />
|
||||
</div>
|
||||
<Link
|
||||
to="/add-job"
|
||||
className="w-20 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
|
||||
>
|
||||
Add Job
|
||||
</Link>
|
||||
</h1>
|
||||
</div>
|
||||
</Layout>
|
||||
);
|
||||
<div className="slider-btns flex space-x-4">
|
||||
<div
|
||||
onClick={() => filterHandler("today")}
|
||||
className="relative"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
<MyJobTable MyJobList={props.MyJobList} />
|
||||
</div>
|
||||
</div>
|
||||
</Layout>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -4,7 +4,7 @@ import dataImage2 from "../../assets/images/data-table-user-2.png";
|
||||
import dataImage3 from "../../assets/images/data-table-user-3.png";
|
||||
import dataImage4 from "../../assets/images/data-table-user-4.png";
|
||||
import SelectBox from "../Helpers/SelectBox";
|
||||
import ActiveJobsPopout from "../jobPopout/ActiveJobsPopout";
|
||||
import PendingJobsPopout from "../jobPopout/PendingJobsPopout";
|
||||
|
||||
import PaginatedList from "../Pagination/PaginatedList";
|
||||
import { handlePagingFunc } from "../Pagination/HandlePagination";
|
||||
@@ -104,7 +104,7 @@ export default function MyPendingJobTable({MyJobList, className }) {
|
||||
|
||||
{/* Active Job Popout */}
|
||||
{jobPopout.show &&
|
||||
<ActiveJobsPopout details={jobPopout.data} onClose={()=>{setJobPopout({show:false, data:{}})}} situation={jobPopout.show} />
|
||||
<PendingJobsPopout details={jobPopout.data} onClose={()=>{setJobPopout({show:false, data:{}})}} situation={jobPopout.show} />
|
||||
}
|
||||
{/* End of Active Job Popout */}
|
||||
</div>
|
||||
|
||||
+532
-1453
File diff suppressed because it is too large
Load Diff
@@ -5,36 +5,36 @@ import MyJobTable from "./MyJobTable";
|
||||
import CommonHead from "../UserHeader/CommonHead";
|
||||
|
||||
export default function MyTasks() {
|
||||
const [selectTab, setValue] = useState("today");
|
||||
const filterHandler = (value) => {
|
||||
setValue(value);
|
||||
};
|
||||
return (
|
||||
<Layout>
|
||||
<CommonHead />
|
||||
<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">
|
||||
const [selectTab, setValue] = useState("today");
|
||||
const filterHandler = (value) => {
|
||||
setValue(value);
|
||||
};
|
||||
return (
|
||||
<Layout>
|
||||
<CommonHead />
|
||||
<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"}`}
|
||||
className={`${selectTab === "today" ? "block" : "hidden"}`}
|
||||
>
|
||||
My Tasks
|
||||
</span>
|
||||
|
||||
</h1>
|
||||
</div>
|
||||
<div className="slider-btns flex space-x-4">
|
||||
<div onClick={() => filterHandler("today")} className="relative">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<MyJobTable />
|
||||
</div>
|
||||
</h1>
|
||||
</div>
|
||||
</Layout>
|
||||
);
|
||||
<div className="slider-btns flex space-x-4">
|
||||
<div
|
||||
onClick={() => filterHandler("today")}
|
||||
className="relative"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
<MyJobTable />
|
||||
</div>
|
||||
</div>
|
||||
</Layout>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import {Link} from 'react-router-dom'
|
||||
import { Link, useLocation, useNavigate } from "react-router-dom";
|
||||
import Icons from "../Helpers/Icons";
|
||||
import bank1 from "../../assets/images/bank-1.png";
|
||||
import bank2 from "../../assets/images/bank-2.png";
|
||||
@@ -8,180 +8,194 @@ import Accordion from "../Helpers/Accordion";
|
||||
|
||||
export default function WalletHeader(props) {
|
||||
// debugger;
|
||||
//props.myWalletList.result_list
|
||||
return (
|
||||
<>
|
||||
<div
|
||||
className="lg:flex hidden user-balance cursor-pointer lg:w-[152px] w-[150px] h-[48px] items-center rounded-full relative bg-purple pr-1.5 pl-4">
|
||||
<div
|
||||
onClick={() => props.handlerBalance()}
|
||||
className="flex items-center lg:justify-between justify-center w-full h-full"
|
||||
>
|
||||
<span className="lg:block hidden">
|
||||
<Icons name="wallet"/>
|
||||
</span>
|
||||
<p className="lg:text-xl text-lg font-bold text-white">
|
||||
Wallet
|
||||
</p>
|
||||
<span className="lg:block hidden">
|
||||
<Icons name="deep-plus"/>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
className={`balance-dropdown w-96 z-30 bg-white dark:bg-dark-white absolute -left-24 rounded-lg cursor-pointer ${
|
||||
props.balanceDropdown ? "active" : ""
|
||||
}`}
|
||||
>
|
||||
<div className="heading border-b dark:border-[#5356fb29] border-light-purple px-7 py-6">
|
||||
<h3 className="text-xl font-bold text-dark-gray dark:text-white">
|
||||
Wallet
|
||||
</h3>
|
||||
//props.myWalletList.result_list
|
||||
let { pathname } = useLocation();
|
||||
let navigate = useNavigate();
|
||||
return (
|
||||
<>
|
||||
<div className="lg:flex hidden user-balance cursor-pointer lg:w-[152px] w-[150px] h-[48px] items-center rounded-full relative bg-purple pr-1.5 pl-4">
|
||||
<div
|
||||
onClick={() => props.handlerBalance()}
|
||||
className="flex items-center lg:justify-between justify-center w-full h-full"
|
||||
>
|
||||
<span className="lg:block hidden">
|
||||
<Icons name="wallet" />
|
||||
</span>
|
||||
<p className="lg:text-xl text-lg font-bold text-white">Wallet</p>
|
||||
<span className="lg:block hidden">
|
||||
<Icons name="deep-plus" />
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
className={`balance-dropdown w-96 z-30 bg-white dark:bg-dark-white absolute -left-24 rounded-lg cursor-pointer ${
|
||||
props.balanceDropdown ? "active" : ""
|
||||
}`}
|
||||
>
|
||||
<div className="heading border-b dark:border-[#5356fb29] border-light-purple px-7 py-6">
|
||||
<h3 className="text-xl font-bold text-dark-gray dark:text-white">
|
||||
Wallet
|
||||
</h3>
|
||||
</div>
|
||||
<div className="content px-7 pb-7">
|
||||
<ul>
|
||||
{props.myWalletList &&
|
||||
props.myWalletList?.result_list?.length > 0 &&
|
||||
props.myWalletList.result_list.map((value, index) => (
|
||||
<li
|
||||
key={index}
|
||||
className="content-item py-4 border-b dark:border-[#5356fb29] border-light-purple hover:border-purple dark:hover:border-purple"
|
||||
>
|
||||
<div className="sm:flex justify-between items-center">
|
||||
<div className="account-name flex space-x-4 items-center mb-2 sm:mb-0">
|
||||
<div className="icon w-14 h-14 transition duration-300 ease-in-out rounded-full flex justify-center items-center bg-light-purple dark:bg-dark-light-purple ">
|
||||
<img src={bank1} alt="" />
|
||||
</div>
|
||||
<div className="name">
|
||||
<p className="text-base text-dark-gray dark:text-white font-medium">
|
||||
{value.description}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<p className="eth text-xl font-bold text-purple">
|
||||
{(value.amount * 0.01).toFixed(2)} {value.code}
|
||||
</p>
|
||||
<p className="usd text-base text-thin-light-gray text-right">
|
||||
{/*(773.69 USD)*/}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="content px-7 pb-7">
|
||||
<ul>
|
||||
</li>
|
||||
))}
|
||||
|
||||
{props.myWalletList &&
|
||||
props.myWalletList?.result_list?.length > 0 &&
|
||||
props.myWalletList.result_list.map((value, index) => (
|
||||
<li key={index} className="content-item py-4 border-b dark:border-[#5356fb29] border-light-purple hover:border-purple dark:hover:border-purple">
|
||||
<div className="sm:flex justify-between items-center">
|
||||
<div className="account-name flex space-x-4 items-center mb-2 sm:mb-0">
|
||||
<div
|
||||
className="icon w-14 h-14 transition duration-300 ease-in-out rounded-full flex justify-center items-center bg-light-purple dark:bg-dark-light-purple ">
|
||||
<img src={bank1} alt=""/>
|
||||
</div>
|
||||
<div className="name">
|
||||
<p className="text-base text-dark-gray dark:text-white font-medium">
|
||||
{value.description}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<p className="eth text-xl font-bold text-purple">
|
||||
{(value.amount*0.01).toFixed(2)} {value.code}
|
||||
</p>
|
||||
<p className="usd text-base text-thin-light-gray text-right">
|
||||
{/*(773.69 USD)*/}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
))}
|
||||
|
||||
{/*<li className="content-item py-4 border-b dark:border-[#5356fb29] border-light-purple hover:border-purple dark:hover:border-purple">*/}
|
||||
{/* <div className="sm:flex justify-between items-center">*/}
|
||||
{/* <div className="account-name flex space-x-4 items-center mb-2 sm:mb-0">*/}
|
||||
{/* <div*/}
|
||||
{/* className="icon w-14 h-14 transition duration-300 ease-in-out rounded-full flex justify-center items-center bg-light-purple dark:bg-dark-light-purple ">*/}
|
||||
{/* <img src={bank1} alt=""/>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className="name">*/}
|
||||
{/* <p className="text-base text-dark-gray dark:text-white font-medium">*/}
|
||||
{/* MetaMask*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div>*/}
|
||||
{/* <p className="eth text-xl font-bold text-purple">*/}
|
||||
{/* 75,320 ETH*/}
|
||||
{/* </p>*/}
|
||||
{/* <p className="usd text-base text-thin-light-gray text-right">*/}
|
||||
{/* (773.69 USD)*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/*</li>*/}
|
||||
{/*<li className="content-item py-4 border-b dark:border-[#5356fb29] border-light-purple hover:border-purple dark:hover:border-purple">*/}
|
||||
{/* <div className="sm:flex justify-between items-center">*/}
|
||||
{/* <div className="account-name flex space-x-4 items-center mb-2 sm:mb-0">*/}
|
||||
{/* <div*/}
|
||||
{/* className="icon w-14 h-14 transition duration-300 ease-in-out rounded-full flex justify-center items-center bg-light-purple dark:bg-dark-light-purple ">*/}
|
||||
{/* <img src={bank2} alt=""/>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className="name">*/}
|
||||
{/* <p className="text-base text-dark-gray dark:text-white font-medium">*/}
|
||||
{/* Coinbase Wallet*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div>*/}
|
||||
{/* <p className="eth text-xl font-bold text-purple">*/}
|
||||
{/* 56,124 ETH*/}
|
||||
{/* </p>*/}
|
||||
{/* <p className="usd text-base text-thin-light-gray text-right">*/}
|
||||
{/* (773.69 USD)*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/*</li>*/}
|
||||
{/*<li className="content-item py-4 border-b dark:border-[#5356fb29] border-light-purple hover:border-purple dark:hover:border-purple">*/}
|
||||
{/* <div className="sm:flex justify-between items-center">*/}
|
||||
{/* <div className="account-name flex space-x-4 items-center mb-2 sm:mb-0">*/}
|
||||
{/* <div*/}
|
||||
{/* className="icon w-14 h-14 transition duration-300 ease-in-out rounded-full flex justify-center items-center bg-light-purple dark:bg-dark-light-purple ">*/}
|
||||
{/* <img src={bank3} alt=""/>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className="name">*/}
|
||||
{/* <p className="text-base text-dark-gray dark:text-white font-medium">*/}
|
||||
{/* Bitski*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div>*/}
|
||||
{/* <p className="eth text-xl font-bold text-purple">*/}
|
||||
{/* 99,123 ETH*/}
|
||||
{/* </p>*/}
|
||||
{/* <p className="usd text-base text-thin-light-gray text-right">*/}
|
||||
{/* (773.69 USD)*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/*</li>*/}
|
||||
{/*<li className="content-item py-5">*/}
|
||||
{/* <div className="sm:flex justify-between items-center">*/}
|
||||
{/* <div className="account-name flex space-x-4 items-center mb-2 sm:mb-0">*/}
|
||||
{/* <div*/}
|
||||
{/* className="icon w-14 h-14 transition duration-300 ease-in-out rounded-full flex justify-center items-center bg-light-purple dark:bg-dark-light-purple ">*/}
|
||||
{/* <img src={bank4} alt=""/>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className="name">*/}
|
||||
{/* <p className="text-base text-dark-gray dark:text-white font-medium">*/}
|
||||
{/* WalletConnect*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div>*/}
|
||||
{/* <p className="eth text-xl font-bold text-purple">*/}
|
||||
{/* 43,728 ETH*/}
|
||||
{/* </p>*/}
|
||||
{/* <p className="usd text-base text-thin-light-gray text-right">*/}
|
||||
{/* (773.69 USD)*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/*</li>*/}
|
||||
</ul>
|
||||
<div className="add-money-btn flex justify-center items-center mt-3">
|
||||
{/* <button
|
||||
onClick={() => props.addMoneyHandler()}
|
||||
{/*<li className="content-item py-4 border-b dark:border-[#5356fb29] border-light-purple hover:border-purple dark:hover:border-purple">*/}
|
||||
{/* <div className="sm:flex justify-between items-center">*/}
|
||||
{/* <div className="account-name flex space-x-4 items-center mb-2 sm:mb-0">*/}
|
||||
{/* <div*/}
|
||||
{/* className="icon w-14 h-14 transition duration-300 ease-in-out rounded-full flex justify-center items-center bg-light-purple dark:bg-dark-light-purple ">*/}
|
||||
{/* <img src={bank1} alt=""/>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className="name">*/}
|
||||
{/* <p className="text-base text-dark-gray dark:text-white font-medium">*/}
|
||||
{/* MetaMask*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div>*/}
|
||||
{/* <p className="eth text-xl font-bold text-purple">*/}
|
||||
{/* 75,320 ETH*/}
|
||||
{/* </p>*/}
|
||||
{/* <p className="usd text-base text-thin-light-gray text-right">*/}
|
||||
{/* (773.69 USD)*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/*</li>*/}
|
||||
{/*<li className="content-item py-4 border-b dark:border-[#5356fb29] border-light-purple hover:border-purple dark:hover:border-purple">*/}
|
||||
{/* <div className="sm:flex justify-between items-center">*/}
|
||||
{/* <div className="account-name flex space-x-4 items-center mb-2 sm:mb-0">*/}
|
||||
{/* <div*/}
|
||||
{/* className="icon w-14 h-14 transition duration-300 ease-in-out rounded-full flex justify-center items-center bg-light-purple dark:bg-dark-light-purple ">*/}
|
||||
{/* <img src={bank2} alt=""/>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className="name">*/}
|
||||
{/* <p className="text-base text-dark-gray dark:text-white font-medium">*/}
|
||||
{/* Coinbase Wallet*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div>*/}
|
||||
{/* <p className="eth text-xl font-bold text-purple">*/}
|
||||
{/* 56,124 ETH*/}
|
||||
{/* </p>*/}
|
||||
{/* <p className="usd text-base text-thin-light-gray text-right">*/}
|
||||
{/* (773.69 USD)*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/*</li>*/}
|
||||
{/*<li className="content-item py-4 border-b dark:border-[#5356fb29] border-light-purple hover:border-purple dark:hover:border-purple">*/}
|
||||
{/* <div className="sm:flex justify-between items-center">*/}
|
||||
{/* <div className="account-name flex space-x-4 items-center mb-2 sm:mb-0">*/}
|
||||
{/* <div*/}
|
||||
{/* className="icon w-14 h-14 transition duration-300 ease-in-out rounded-full flex justify-center items-center bg-light-purple dark:bg-dark-light-purple ">*/}
|
||||
{/* <img src={bank3} alt=""/>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className="name">*/}
|
||||
{/* <p className="text-base text-dark-gray dark:text-white font-medium">*/}
|
||||
{/* Bitski*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div>*/}
|
||||
{/* <p className="eth text-xl font-bold text-purple">*/}
|
||||
{/* 99,123 ETH*/}
|
||||
{/* </p>*/}
|
||||
{/* <p className="usd text-base text-thin-light-gray text-right">*/}
|
||||
{/* (773.69 USD)*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/*</li>*/}
|
||||
{/*<li className="content-item py-5">*/}
|
||||
{/* <div className="sm:flex justify-between items-center">*/}
|
||||
{/* <div className="account-name flex space-x-4 items-center mb-2 sm:mb-0">*/}
|
||||
{/* <div*/}
|
||||
{/* className="icon w-14 h-14 transition duration-300 ease-in-out rounded-full flex justify-center items-center bg-light-purple dark:bg-dark-light-purple ">*/}
|
||||
{/* <img src={bank4} alt=""/>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className="name">*/}
|
||||
{/* <p className="text-base text-dark-gray dark:text-white font-medium">*/}
|
||||
{/* WalletConnect*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div>*/}
|
||||
{/* <p className="eth text-xl font-bold text-purple">*/}
|
||||
{/* 43,728 ETH*/}
|
||||
{/* </p>*/}
|
||||
{/* <p className="usd text-base text-thin-light-gray text-right">*/}
|
||||
{/* (773.69 USD)*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/*</li>*/}
|
||||
</ul>
|
||||
<div className="add-money-btn flex justify-center items-center mt-3">
|
||||
{/* <button
|
||||
onClick={() => {
|
||||
if(pathname == '/my-wallet') props.setBalanceDropdown.toggle()
|
||||
else navigate('/my-wallet', {replace: true})
|
||||
}}
|
||||
type="button"
|
||||
className="w-[122px] h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
|
||||
>
|
||||
Manage
|
||||
</button> */}
|
||||
<Link to='/my-wallet' className="w-[122px] h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white">Manage</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Link
|
||||
to="/my-wallet"
|
||||
onClick={() => {
|
||||
if (pathname == "/my-wallet")
|
||||
props.setBalanceDropdown.toggle();
|
||||
else navigate("/my-wallet", { replace: true });
|
||||
}}
|
||||
className="w-[122px] h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
|
||||
>
|
||||
Manage
|
||||
</Link>
|
||||
</div>
|
||||
{/*<div*/}
|
||||
{/* className="lg:hidden flex user-balance cursor-pointer lg:w-[252px] w-[150px] h-[48px] items-center rounded-full relative bg-purple">*/}
|
||||
{/* <div className="flex items-center lg:justify-between justify-center w-full h-full">*/}
|
||||
{/* <p className="lg:text-xl text-lg font-bold text-white">*/}
|
||||
{/* $ 234,435.34*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/*</div>*/}
|
||||
<div className="lg:hidden block"></div>
|
||||
</>);
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/*<div*/}
|
||||
{/* className="lg:hidden flex user-balance cursor-pointer lg:w-[252px] w-[150px] h-[48px] items-center rounded-full relative bg-purple">*/}
|
||||
{/* <div className="flex items-center lg:justify-between justify-center w-full h-full">*/}
|
||||
{/* <p className="lg:text-xl text-lg font-bold text-white">*/}
|
||||
{/* $ 234,435.34*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/*</div>*/}
|
||||
<div className="lg:hidden block"></div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import React, { useContext,useState, useEffect } from "react";
|
||||
import { Link } from "react-router-dom";
|
||||
import { Link, useLocation } from "react-router-dom";
|
||||
import bank1 from "../../assets/images/bank-1.png";
|
||||
import bank2 from "../../assets/images/bank-2.png";
|
||||
import bank3 from "../../assets/images/bank-3.png";
|
||||
@@ -91,6 +91,15 @@ export default function Header({ logoutModalHandler, sidebarHandler }) {
|
||||
setToggleNotification.toggle()
|
||||
}
|
||||
|
||||
// getting the location of head
|
||||
let {pathname} = useLocation()
|
||||
|
||||
const handleWalletBtn = () => {
|
||||
if (pathname === "/my-wallet"){
|
||||
setbalanceValue.set(false)
|
||||
} else return balanceDropdown
|
||||
}
|
||||
|
||||
// User Profile
|
||||
let {firstname, lastname, email, profile_pic} = userDetails
|
||||
let userEmail = email.split('@')[0]
|
||||
@@ -234,7 +243,8 @@ export default function Header({ logoutModalHandler, sidebarHandler }) {
|
||||
myWalletList={myWalletList}
|
||||
handlerBalance={handlerBalance}
|
||||
balanceDropdown={balanceDropdown}
|
||||
addMoneyHandler={addMoneyHandler} />
|
||||
addMoneyHandler={addMoneyHandler}
|
||||
setBalanceDropdown = {setbalanceValue} />
|
||||
{/* notification */}
|
||||
<div className="user-notification lg:block hidden relative">
|
||||
<div
|
||||
|
||||
@@ -12,7 +12,7 @@ export default function MobileSidebar({ sidebar, action, logoutModalHandler }) {
|
||||
|
||||
let { jobLists } = useSelector((state) => state.jobLists);
|
||||
const marketData = jobLists?.result_list;
|
||||
let noOfJobs = marketData?.length;
|
||||
let noOfJobs = marketData?.length <= 0 ? "0" : marketData?.length;
|
||||
|
||||
return (
|
||||
<div className="w-full h-full">
|
||||
@@ -163,19 +163,20 @@ export default function MobileSidebar({ sidebar, action, logoutModalHandler }) {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{!userDetails.post_jobs ?
|
||||
{!userDetails.post_jobs ? (
|
||||
<div className="setting-item">
|
||||
<div className="top-platform bg-pink dark:bg-dark-white rounded-2xl p-16 2xl:w-[180px] w-full 2xl:mb-10 2xl:border-none border ">
|
||||
<NavLink to="/start-job" className="nav-item flex items-center justify-start space-x-3.5">
|
||||
<span className="item-content relative group-hover:text-purple text-xl transition-all duration-300 ease-in-out text-lighter-gray font-medium active flex-1">
|
||||
Enable Job Post
|
||||
</span>
|
||||
</NavLink>
|
||||
<div className="top-platform bg-pink dark:bg-dark-white rounded-2xl p-16 2xl:w-[180px] w-full 2xl:mb-10 2xl:border-none border ">
|
||||
<NavLink
|
||||
to="/start-job"
|
||||
className="nav-item flex items-center justify-start space-x-3.5"
|
||||
>
|
||||
<span className="item-content relative group-hover:text-purple text-xl transition-all duration-300 ease-in-out text-lighter-gray font-medium active flex-1">
|
||||
Enable Job Post
|
||||
</span>
|
||||
</NavLink>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
:
|
||||
jobLists?.result_list?.length ?
|
||||
(
|
||||
) : jobLists?.result_list?.length ? (
|
||||
<div className="setting-item">
|
||||
<div className="heading mb-5">
|
||||
<h1 className="title text-xl font-bold text-purple">My Jobs</h1>
|
||||
@@ -224,33 +225,30 @@ export default function MobileSidebar({ sidebar, action, logoutModalHandler }) {
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
:
|
||||
(
|
||||
<div className="setting-item">
|
||||
<div className="heading mb-5">
|
||||
<h1 className="title text-xl font-bold text-purple">My Jobs</h1>
|
||||
</div>
|
||||
<div className="items">
|
||||
<ul className="flex flex-col space-y-6">
|
||||
<li className="item group">
|
||||
<NavLink
|
||||
to="/add-job"
|
||||
className="nav-item flex items-center justify-start space-x-3.5"
|
||||
>
|
||||
<span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white">
|
||||
<Icons name="people-two" />
|
||||
</span>
|
||||
<span className="item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium active flex-1">
|
||||
My Jobs
|
||||
</span>
|
||||
</NavLink>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
) : (
|
||||
<div className="setting-item">
|
||||
<div className="heading mb-5">
|
||||
<h1 className="title text-xl font-bold text-purple">My Jobs</h1>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
<div className="items">
|
||||
<ul className="flex flex-col space-y-6">
|
||||
<li className="item group">
|
||||
<NavLink
|
||||
to="/add-job"
|
||||
className="nav-item flex items-center justify-start space-x-3.5"
|
||||
>
|
||||
<span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white">
|
||||
<Icons name="people-two" />
|
||||
</span>
|
||||
<span className="item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium active flex-1">
|
||||
My Jobs
|
||||
</span>
|
||||
</NavLink>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
{/* signout area */}
|
||||
{sidebar ? (
|
||||
@@ -345,4 +343,4 @@ const ListItem = ({ sidebar, route, title, bubble }) => {
|
||||
</NavLink>
|
||||
</li>
|
||||
);
|
||||
};
|
||||
};
|
||||
|
||||
+150
-154
@@ -13,7 +13,7 @@ export default function Sidebar({ sidebar, action, logoutModalHandler }) {
|
||||
|
||||
let { jobLists } = useSelector((state) => state.jobLists);
|
||||
const marketData = jobLists?.result_list;
|
||||
let noOfJobs = marketData?.length;
|
||||
let noOfJobs = marketData?.length <= 0 ? "0" : marketData?.length;
|
||||
|
||||
useEffect(() => {
|
||||
const title = document.querySelectorAll(".menu-setting-items .heading");
|
||||
@@ -233,168 +233,164 @@ export default function Sidebar({ sidebar, action, logoutModalHandler }) {
|
||||
<div className="setting-item">
|
||||
<div className="heading mb-5 bg-dark-blue rounded-2xl p-2 2xl:w-[180px] w-full 2xl:mb-10 2xl:border-none border">
|
||||
<NavLink to="/acc-family">
|
||||
<h1 className="title text-xl font-bold text-purple">Family Corner</h1>
|
||||
<h1 className="title text-xl font-bold text-purple">
|
||||
Family Corner
|
||||
</h1>
|
||||
</NavLink>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{!userDetails.post_jobs ?
|
||||
<div className="setting-item">
|
||||
<div className="top-platform bg-pink dark:bg-dark-white rounded-2xl p-16 2xl:w-[180px] w-full 2xl:mb-10 2xl:border-none border ">
|
||||
<NavLink to="/start-job">
|
||||
<span className="item-content relative group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray font-medium active flex-1">
|
||||
Enable Job Post
|
||||
</span>
|
||||
</NavLink>
|
||||
{!userDetails.post_jobs ? (
|
||||
<div className="setting-item">
|
||||
<div className="top-platform bg-pink dark:bg-dark-white rounded-2xl p-16 2xl:w-[180px] w-full 2xl:mb-10 2xl:border-none border ">
|
||||
<NavLink to="/start-job">
|
||||
<span className="item-content relative group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray font-medium active flex-1">
|
||||
Enable Job Post
|
||||
</span>
|
||||
</NavLink>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
:
|
||||
jobLists?.result_list?.length ?
|
||||
(
|
||||
<div className="setting-item">
|
||||
<div className="heading mb-5">
|
||||
<h1 className="title text-xl font-bold text-purple">My Jobs</h1>
|
||||
</div>
|
||||
<div className="items">
|
||||
<ul className="flex flex-col space-y-6">
|
||||
<li className="item group">
|
||||
<NavLink
|
||||
to="/myjobs"
|
||||
className={`nav-item flex items-center ${
|
||||
((navData) => (navData.isActive ? "active" : ""),
|
||||
sidebar ? "justify-start space-x-3.5" : "justify-center")
|
||||
}`}
|
||||
>
|
||||
<span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white dark:text-lighter-gray">
|
||||
<Icons name="people-two" />
|
||||
</span>
|
||||
<span
|
||||
className={`item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium ${
|
||||
sidebar ? "active flex-1" : "w-0"
|
||||
}`}
|
||||
>
|
||||
List
|
||||
</span>
|
||||
</NavLink>
|
||||
</li>
|
||||
<li className="item group">
|
||||
<NavLink
|
||||
to="/my-pending-jobs"
|
||||
className={`nav-item flex items-center ${
|
||||
((navData) => (navData.isActive ? "active" : ""),
|
||||
sidebar ? "justify-start space-x-3.5" : "justify-center")
|
||||
}`}
|
||||
>
|
||||
<span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white dark:text-lighter-gray">
|
||||
<Icons name="people-two" />
|
||||
</span>
|
||||
<span
|
||||
className={`item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium ${
|
||||
sidebar ? "active flex-1" : "w-0"
|
||||
}`}
|
||||
>
|
||||
Pending
|
||||
</span>
|
||||
</NavLink>
|
||||
</li>
|
||||
<li className="item group">
|
||||
<NavLink
|
||||
to="/my-active-jobs"
|
||||
className={`nav-item flex items-center ${
|
||||
((navData) => (navData.isActive ? "active" : ""),
|
||||
sidebar ? "justify-start space-x-3.5" : "justify-center")
|
||||
}`}
|
||||
>
|
||||
<span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white dark:text-lighter-gray">
|
||||
<Icons name="people-two" />
|
||||
</span>
|
||||
<span
|
||||
className={`item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium ${
|
||||
sidebar ? "active flex-1" : "w-0"
|
||||
}`}
|
||||
>
|
||||
Active
|
||||
</span>
|
||||
</NavLink>
|
||||
</li>
|
||||
{/*<li className="item group">*/}
|
||||
{/* <NavLink*/}
|
||||
{/* to="/profile"*/}
|
||||
{/* className={`nav-item flex items-center ${*/}
|
||||
{/* ((navData) => (navData.isActive ? "active" : ""),*/}
|
||||
{/* sidebar ? "justify-start space-x-3.5" : "justify-center")*/}
|
||||
{/* }`}*/}
|
||||
{/* >*/}
|
||||
{/* <span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white dark:text-lighter-gray">*/}
|
||||
{/* <Icons name="people-two" />*/}
|
||||
{/* </span>*/}
|
||||
{/* <span*/}
|
||||
{/* className={`item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium ${*/}
|
||||
{/* sidebar ? "active flex-1" : "w-0"*/}
|
||||
{/* }`}*/}
|
||||
{/* >*/}
|
||||
{/* My Profile*/}
|
||||
{/* </span>*/}
|
||||
{/* </NavLink>*/}
|
||||
{/*</li>*/}
|
||||
{/*<li className="item group">*/}
|
||||
{/* <NavLink*/}
|
||||
{/* to="/settings"*/}
|
||||
{/* className={`nav-item flex items-center ${*/}
|
||||
{/* ((navData) => (navData.isActive ? "active" : ""),*/}
|
||||
{/* sidebar ? "justify-start space-x-3.5" : "justify-center")*/}
|
||||
{/* }`}*/}
|
||||
{/* >*/}
|
||||
{/* <span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white dark:text-lighter-gray">*/}
|
||||
{/* <Icons name="setting" />*/}
|
||||
{/* </span>*/}
|
||||
{/* <span*/}
|
||||
{/* className={`item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium ${*/}
|
||||
{/* sidebar ? "active flex-1" : "w-0"*/}
|
||||
{/* }`}*/}
|
||||
{/* >*/}
|
||||
{/* Settings*/}
|
||||
{/* </span>*/}
|
||||
{/* </NavLink>*/}
|
||||
{/*</li>*/}
|
||||
</ul>
|
||||
</div>
|
||||
) : jobLists?.result_list?.length ? (
|
||||
<div className="setting-item">
|
||||
<div className="heading mb-5">
|
||||
<h1 className="title text-xl font-bold text-purple">My Jobs</h1>
|
||||
</div>
|
||||
)
|
||||
:
|
||||
(
|
||||
<div className="setting-item">
|
||||
<div className="heading mb-5">
|
||||
<h1 className="title text-xl font-bold text-purple">My Jobs</h1>
|
||||
</div>
|
||||
<div className="items">
|
||||
<ul className="flex flex-col space-y-6">
|
||||
<li className="item group">
|
||||
<NavLink
|
||||
to="/add-job"
|
||||
className={`nav-item flex items-center ${
|
||||
((navData) => (navData.isActive ? "active" : ""),
|
||||
sidebar ? "justify-start space-x-3.5" : "justify-center")
|
||||
<div className="items">
|
||||
<ul className="flex flex-col space-y-6">
|
||||
<li className="item group">
|
||||
<NavLink
|
||||
to="/myjobs"
|
||||
className={`nav-item flex items-center ${
|
||||
((navData) => (navData.isActive ? "active" : ""),
|
||||
sidebar ? "justify-start space-x-3.5" : "justify-center")
|
||||
}`}
|
||||
>
|
||||
<span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white dark:text-lighter-gray">
|
||||
<Icons name="people-two" />
|
||||
</span>
|
||||
<span
|
||||
className={`item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium ${
|
||||
sidebar ? "active flex-1" : "w-0"
|
||||
}`}
|
||||
>
|
||||
<span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white dark:text-lighter-gray">
|
||||
<Icons name="people-two" />
|
||||
</span>
|
||||
<span
|
||||
className={`item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium ${
|
||||
sidebar ? "active flex-1" : "w-0"
|
||||
}`}
|
||||
>
|
||||
Add Job
|
||||
</span>
|
||||
</NavLink>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
List
|
||||
</span>
|
||||
</NavLink>
|
||||
</li>
|
||||
<li className="item group">
|
||||
<NavLink
|
||||
to="/my-pending-jobs"
|
||||
className={`nav-item flex items-center ${
|
||||
((navData) => (navData.isActive ? "active" : ""),
|
||||
sidebar ? "justify-start space-x-3.5" : "justify-center")
|
||||
}`}
|
||||
>
|
||||
<span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white dark:text-lighter-gray">
|
||||
<Icons name="people-two" />
|
||||
</span>
|
||||
<span
|
||||
className={`item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium ${
|
||||
sidebar ? "active flex-1" : "w-0"
|
||||
}`}
|
||||
>
|
||||
Pending
|
||||
</span>
|
||||
</NavLink>
|
||||
</li>
|
||||
<li className="item group">
|
||||
<NavLink
|
||||
to="/my-active-jobs"
|
||||
className={`nav-item flex items-center ${
|
||||
((navData) => (navData.isActive ? "active" : ""),
|
||||
sidebar ? "justify-start space-x-3.5" : "justify-center")
|
||||
}`}
|
||||
>
|
||||
<span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white dark:text-lighter-gray">
|
||||
<Icons name="people-two" />
|
||||
</span>
|
||||
<span
|
||||
className={`item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium ${
|
||||
sidebar ? "active flex-1" : "w-0"
|
||||
}`}
|
||||
>
|
||||
Active
|
||||
</span>
|
||||
</NavLink>
|
||||
</li>
|
||||
{/*<li className="item group">*/}
|
||||
{/* <NavLink*/}
|
||||
{/* to="/profile"*/}
|
||||
{/* className={`nav-item flex items-center ${*/}
|
||||
{/* ((navData) => (navData.isActive ? "active" : ""),*/}
|
||||
{/* sidebar ? "justify-start space-x-3.5" : "justify-center")*/}
|
||||
{/* }`}*/}
|
||||
{/* >*/}
|
||||
{/* <span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white dark:text-lighter-gray">*/}
|
||||
{/* <Icons name="people-two" />*/}
|
||||
{/* </span>*/}
|
||||
{/* <span*/}
|
||||
{/* className={`item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium ${*/}
|
||||
{/* sidebar ? "active flex-1" : "w-0"*/}
|
||||
{/* }`}*/}
|
||||
{/* >*/}
|
||||
{/* My Profile*/}
|
||||
{/* </span>*/}
|
||||
{/* </NavLink>*/}
|
||||
{/*</li>*/}
|
||||
{/*<li className="item group">*/}
|
||||
{/* <NavLink*/}
|
||||
{/* to="/settings"*/}
|
||||
{/* className={`nav-item flex items-center ${*/}
|
||||
{/* ((navData) => (navData.isActive ? "active" : ""),*/}
|
||||
{/* sidebar ? "justify-start space-x-3.5" : "justify-center")*/}
|
||||
{/* }`}*/}
|
||||
{/* >*/}
|
||||
{/* <span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white dark:text-lighter-gray">*/}
|
||||
{/* <Icons name="setting" />*/}
|
||||
{/* </span>*/}
|
||||
{/* <span*/}
|
||||
{/* className={`item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium ${*/}
|
||||
{/* sidebar ? "active flex-1" : "w-0"*/}
|
||||
{/* }`}*/}
|
||||
{/* >*/}
|
||||
{/* Settings*/}
|
||||
{/* </span>*/}
|
||||
{/* </NavLink>*/}
|
||||
{/*</li>*/}
|
||||
</ul>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
</div>
|
||||
) : (
|
||||
<div className="setting-item">
|
||||
<div className="heading mb-5">
|
||||
<h1 className="title text-xl font-bold text-purple">My Jobs</h1>
|
||||
</div>
|
||||
<div className="items">
|
||||
<ul className="flex flex-col space-y-6">
|
||||
<li className="item group">
|
||||
<NavLink
|
||||
to="/add-job"
|
||||
className={`nav-item flex items-center ${
|
||||
((navData) => (navData.isActive ? "active" : ""),
|
||||
sidebar ? "justify-start space-x-3.5" : "justify-center")
|
||||
}`}
|
||||
>
|
||||
<span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white dark:text-lighter-gray">
|
||||
<Icons name="people-two" />
|
||||
</span>
|
||||
<span
|
||||
className={`item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium ${
|
||||
sidebar ? "active flex-1" : "w-0"
|
||||
}`}
|
||||
>
|
||||
Add Job
|
||||
</span>
|
||||
</NavLink>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
{/* signout area */}
|
||||
{sidebar ? (
|
||||
|
||||
+2
-2
@@ -3,7 +3,7 @@ import Detail from './popoutcomponent/Detail'
|
||||
import ModalCom from '../Helpers/ModalCom'
|
||||
|
||||
|
||||
function ActiveJobsPopout({details, onClose, situation}) {
|
||||
function PendingJobsPopout({details, onClose, situation}) {
|
||||
return (
|
||||
<ModalCom action={onClose} situation={situation}>
|
||||
<div className="logout-modal-wrapper lw-[90%] md:w-[768px] h-full lg:h-auto bg-white dark:bg-dark-white lg:rounded-2xl overflow-y-auto">
|
||||
@@ -139,4 +139,4 @@ function ActiveJobsPopout({details, onClose, situation}) {
|
||||
)
|
||||
}
|
||||
|
||||
export default ActiveJobsPopout
|
||||
export default PendingJobsPopout
|
||||
@@ -198,6 +198,18 @@ class usersService {
|
||||
return this.postAuxEnd("/sendmoneyfee", postData);
|
||||
}
|
||||
|
||||
// Task for the person doing the job
|
||||
getMyActiveTaskList(){
|
||||
var postData = {
|
||||
uuid: localStorage.getItem("uid"),
|
||||
member_id: localStorage.getItem("member_id"),
|
||||
sessionid: localStorage.getItem("session_token"),
|
||||
page:0,
|
||||
offset:0,
|
||||
limit :100
|
||||
};
|
||||
return this.postAuxEnd("/activetaskslist", postData);
|
||||
}
|
||||
getMyActiveJobList(){
|
||||
var postData = {
|
||||
uuid: localStorage.getItem("uid"),
|
||||
|
||||
@@ -0,0 +1,10 @@
|
||||
import React from 'react'
|
||||
import ActiveJobs from '../components/MyActiveJobs/ActiveJobs'
|
||||
|
||||
function ManageActiveJobs() {
|
||||
return (
|
||||
<ActiveJobs />
|
||||
)
|
||||
}
|
||||
|
||||
export default ManageActiveJobs
|
||||
@@ -10,7 +10,7 @@ export default function MyTaskPage() {
|
||||
|
||||
const getMyActiveJobList = async () => {
|
||||
try {
|
||||
const res = await api.getMyActiveJobList();
|
||||
const res = await api.getMyActiveTaskList();
|
||||
setMyActiveJobList(res.data);
|
||||
} catch (error) {
|
||||
console.log("Error getting mode");
|
||||
|
||||
Reference in New Issue
Block a user