Compare commits
18 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 Ebube
|
5a37352c53 | ||
|
Ebube
|
0c21f953ee | ||
|
CHIEFSOFT\ameye
|
448c1c69ba | ||
 ameye
|
b535326c51 | ||
|
ameye
|
dad2b6781e | ||
|
victorAnumudu
|
3cb0604e81 | ||
|
Ebube
|
73a21a2367 | ||
|
Ebube
|
8716b16a70 | ||
 tokslaw
|
3290fce6da | ||
|
victorAnumudu
|
21e4221301 | ||
|
victorAnumudu
|
d9f1771045 | ||
|
victorAnumudu
|
119dfcde06 | ||
|
CHIEFSOFT\ameye
|
f6e37d0f14 | ||
|
ameye
|
3b1dc859e0 | ||
|
ameye
|
a45d21cd2d | ||
|
ameye
|
1774d07980 | ||
|
victorAnumudu
|
5fd3940911 | ||
|
victorAnumudu
|
4f1a4dd045 |
@@ -36,6 +36,7 @@ import FamilyAccPage from "./views/FamilyAccPage";
|
|||||||
import StartJob from "./components/MyJobs/StartJob";
|
import StartJob from "./components/MyJobs/StartJob";
|
||||||
import AddJobPage from "./views/AddJobPage";
|
import AddJobPage from "./views/AddJobPage";
|
||||||
import MyPendingJobsPage from "./views/MyPendingJobsPage";
|
import MyPendingJobsPage from "./views/MyPendingJobsPage";
|
||||||
|
import ManageActiveJobs from "./views/ManageActiveJobs";
|
||||||
|
|
||||||
export default function Routers() {
|
export default function Routers() {
|
||||||
return (
|
return (
|
||||||
@@ -83,6 +84,7 @@ export default function Routers() {
|
|||||||
<Route exact path="/my-pending-jobs" element={<MyPendingJobsPage />} />
|
<Route exact path="/my-pending-jobs" element={<MyPendingJobsPage />} />
|
||||||
<Route exact path="/acc-family" element={<FamilyAccPage />} />
|
<Route exact path="/acc-family" element={<FamilyAccPage />} />
|
||||||
<Route exact path="/start-job" element={<StartJob />} />
|
<Route exact path="/start-job" element={<StartJob />} />
|
||||||
|
<Route exact path="/manage-active-job" element={<ManageActiveJobs />} />
|
||||||
<Route
|
<Route
|
||||||
exact
|
exact
|
||||||
path="/my-collection/collection-item"
|
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 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 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 { handlePagingFunc } from "../Pagination/HandlePagination";
|
||||||
|
import PaginatedList from "../Pagination/PaginatedList";
|
||||||
|
|
||||||
export default function MyActiveJobTable({MyJobList, className }) {
|
export default function MyActiveJobTable({ MyJobList, className }) {
|
||||||
const filterCategories = ["All Categories", "Explore", "Featured"];
|
const navigate = useNavigate()
|
||||||
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 filterCategories = ["All Categories", "Explore", "Featured"];
|
||||||
|
const [selectedCategory, setCategory] = useState(filterCategories[0]);
|
||||||
|
|
||||||
const [currentPage, setCurrentPage] = useState(0);
|
const [currentPage, setCurrentPage] = useState(0);
|
||||||
const indexOfFirstItem = Number(currentPage);
|
const indexOfFirstItem = Number(currentPage);
|
||||||
const indexOfLastItem = Number(indexOfFirstItem)+Number(process.env.REACT_APP_ITEM_PER_PAGE);
|
const indexOfLastItem =
|
||||||
const currentActiveJobList = MyJobList?.result_list?.slice(indexOfFirstItem, indexOfLastItem);
|
Number(indexOfFirstItem) + Number(process.env.REACT_APP_ITEM_PER_PAGE);
|
||||||
|
const currentActiveJobList = MyJobList?.result_list?.slice(
|
||||||
const handlePagination = (e) => {
|
indexOfFirstItem,
|
||||||
handlePagingFunc(e,setCurrentPage)
|
indexOfLastItem
|
||||||
}
|
);
|
||||||
|
|
||||||
return (
|
const handlePagination = (e) => {
|
||||||
<div
|
handlePagingFunc(e, setCurrentPage);
|
||||||
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>*/}
|
|
||||||
|
|
||||||
{
|
return (
|
||||||
<>
|
<div
|
||||||
{MyJobList && MyJobList?.result_list &&
|
className={`update-table w-full p-8 bg-white dark:bg-dark-white overflow-hidden rounded-2xl section-shadow ${
|
||||||
MyJobList.result_list.length > 0 &&
|
className || ""
|
||||||
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">
|
{MyJobList && MyJobList?.result_list && (
|
||||||
<div className="flex space-x-2 items-center">
|
<div className="relative w-full overflow-x-auto sm:rounded-lg flex flex-col justify-between h-full">
|
||||||
<div className="w-[60px] h-[60px] rounded-full overflow-hidden flex justify-center items-center">
|
<table className="w-full text-sm text-left text-gray-500 dark:text-gray-400">
|
||||||
<img
|
<tbody>
|
||||||
src={dataImage2}
|
{/*<tr className="text-base text-thin-light-gray border-b dark:border-[#5356fb29] default-border-b dark:border-[#5356fb29] ottom ">*/}
|
||||||
alt="data"
|
{/* <td className="py-4">All Product</td>*/}
|
||||||
className="w-full h-full"
|
{/* <td className="py-4 text-right">.</td>*/}
|
||||||
/>
|
{/*</tr>*/}
|
||||||
</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>
|
{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">
|
||||||
<td className="text-right py-4 px-2">
|
<div className="flex justify-center items-center">
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
onClick={()=>{setJobPopout({show:true, data:value})}}
|
onClick={() => {
|
||||||
className="w-20 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
|
navigate('/manage-active-job', {state:value});
|
||||||
>
|
}}
|
||||||
View
|
className="w-20 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
|
||||||
</button>
|
>
|
||||||
</td>
|
View
|
||||||
</tr>
|
</button>
|
||||||
))}
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
</>
|
))}
|
||||||
}
|
</>
|
||||||
</tbody>
|
}
|
||||||
</table>
|
</tbody>
|
||||||
{/* PAGINATION BUTTON */}
|
</table>
|
||||||
<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} />
|
{/* PAGINATION BUTTON */}
|
||||||
{/* END OF PAGINATION BUTTON */}
|
<PaginatedList
|
||||||
</div>
|
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}
|
||||||
{/* Active Job Popout */}
|
start={indexOfFirstItem}
|
||||||
{jobPopout.show &&
|
stop={indexOfLastItem}
|
||||||
<ActiveJobsPopout details={jobPopout.data} onClose={()=>{setJobPopout({show:false, data:{}})}} situation={jobPopout.show} />
|
/>
|
||||||
}
|
{/* END OF PAGINATION BUTTON */}
|
||||||
{/* End of Active Job Popout */}
|
|
||||||
</div>
|
</div>
|
||||||
);
|
)}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -5,37 +5,37 @@ import CommonHead from "../UserHeader/CommonHead";
|
|||||||
import MyActiveJobTable from "./MyActiveJobTable";
|
import MyActiveJobTable from "./MyActiveJobTable";
|
||||||
|
|
||||||
export default function MyActiveJobs(props) {
|
export default function MyActiveJobs(props) {
|
||||||
const [selectTab, setValue] = useState("today");
|
const [selectTab, setValue] = useState("today");
|
||||||
const filterHandler = (value) => {
|
const filterHandler = (value) => {
|
||||||
setValue(value);
|
setValue(value);
|
||||||
};
|
};
|
||||||
console.log("AMEYE LOC1", props.MyJobList);
|
console.log("AMEYE LOC1", props.MyJobList);
|
||||||
return (
|
return (
|
||||||
<Layout>
|
<Layout>
|
||||||
<CommonHead />
|
<CommonHead />
|
||||||
<div className="notification-page w-full mb-10">
|
<div className="notification-page w-full mb-10">
|
||||||
<div className="notification-wrapper w-full">
|
<div className="notification-wrapper w-full">
|
||||||
{/* heading */}
|
{/* heading */}
|
||||||
<div className="sm:flex justify-between items-center mb-6">
|
<div className="sm:flex justify-between items-center mb-6">
|
||||||
<div className="mb-5 sm:mb-0">
|
<div className="mb-5 sm:mb-0">
|
||||||
<h1 className="text-26 font-bold text-dark-gray dark:text-white">
|
<h1 className="text-26 font-bold text-dark-gray dark:text-white">
|
||||||
<span
|
<span
|
||||||
className={`${selectTab === "today" ? "block" : "hidden"}`}
|
className={`${selectTab === "today" ? "block" : "hidden"}`}
|
||||||
>
|
>
|
||||||
Active Job(s)
|
Active Job(s)
|
||||||
</span>
|
</span>
|
||||||
|
</h1>
|
||||||
</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>
|
</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) => (
|
currentJobList.map((value, index) => (
|
||||||
<tr key={index} className="bg-white dark:bg-dark-white border-b dark:border-[#5356fb29] hover:bg-gray-50">
|
<tr key={index} className="bg-white dark:bg-dark-white border-b dark:border-[#5356fb29] hover:bg-gray-50">
|
||||||
<td className="py-9">
|
<td className="py-9">
|
||||||
<div className="flex space-x-2 items-center job-items">
|
<div className="sm:flex sm:space-x-2 sm:justify-between sm:items-center job-items">
|
||||||
<div className="w-[60px] h-[60px] rounded-full overflow-hidden flex justify-center items-center">
|
<div className="flex space-x-2 items-center job-items">
|
||||||
<img
|
<div className="w-[60px] h-[60px] rounded-full overflow-hidden flex justify-center items-center">
|
||||||
src={dataImage2}
|
<img
|
||||||
alt="data"
|
src={dataImage2}
|
||||||
className="w-full h-full"
|
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>
|
</div>
|
||||||
<span className="text-sm text-thin-light-gray">
|
<div className="flex flex-col">
|
||||||
Price: <span className="text-purple">{value.price*0.01}</span>
|
<h1 className="font-bold text-xl text-dark-gray dark:text-white">
|
||||||
</span>
|
{value.title}
|
||||||
<span className="text-sm text-thin-light-gray">
|
</h1>
|
||||||
Duration: <span className="text-purple"> {value.timeline_days} day(s)</span>
|
<div>
|
||||||
</span>
|
{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>
|
|
||||||
<div className="job-sub-menu mt-2 flex flex-nowrap justify-start sm:justify-end items-center">
|
<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">
|
||||||
<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>
|
||||||
<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>
|
<button type="button" className="p-2 w-[40px] h-11">Edit</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -5,40 +5,44 @@ import MyJobTable from "./MyJobTable";
|
|||||||
import CommonHead from "../UserHeader/CommonHead";
|
import CommonHead from "../UserHeader/CommonHead";
|
||||||
|
|
||||||
export default function MyJobs(props) {
|
export default function MyJobs(props) {
|
||||||
const [selectTab, setValue] = useState("today");
|
const [selectTab, setValue] = useState("today");
|
||||||
const filterHandler = (value) => {
|
const filterHandler = (value) => {
|
||||||
setValue(value);
|
setValue(value);
|
||||||
};
|
};
|
||||||
console.log("AMEYE LOC1", props.MyJobList);
|
console.log("AMEYE LOC1", props.MyJobList);
|
||||||
return (
|
return (
|
||||||
<Layout>
|
<Layout>
|
||||||
<CommonHead />
|
<CommonHead />
|
||||||
<div className="notification-page w-full mb-10">
|
<div className="notification-page w-full mb-10">
|
||||||
<div className="notification-wrapper w-full">
|
<div className="notification-wrapper w-full">
|
||||||
{/* heading */}
|
{/* heading */}
|
||||||
<div className="sm:flex justify-between items-center mb-6">
|
<div className="sm:flex justify-between items-center mb-6">
|
||||||
<div className="mb-5 sm:mb-0">
|
<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">
|
<h1 className="text-26 font-bold flex items-center space-x-1 text-dark-gray dark:text-white">
|
||||||
<span
|
<span
|
||||||
className={`${selectTab === "today" ? "block" : "hidden"}`}
|
className={`${selectTab === "today" ? "block" : "hidden"}`}
|
||||||
>
|
>
|
||||||
My Jobs
|
My Jobs
|
||||||
</span>
|
</span>
|
||||||
|
|
||||||
<Link to='/add-job' className='w-20 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white'>
|
<Link
|
||||||
Add Job
|
to="/add-job"
|
||||||
</Link>
|
className="w-20 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
|
||||||
</h1>
|
>
|
||||||
</div>
|
Add Job
|
||||||
<div className="slider-btns flex space-x-4">
|
</Link>
|
||||||
<div onClick={() => filterHandler("today")} className="relative">
|
</h1>
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<MyJobTable MyJobList={props.MyJobList} />
|
|
||||||
</div>
|
|
||||||
</div>
|
</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 dataImage3 from "../../assets/images/data-table-user-3.png";
|
||||||
import dataImage4 from "../../assets/images/data-table-user-4.png";
|
import dataImage4 from "../../assets/images/data-table-user-4.png";
|
||||||
import SelectBox from "../Helpers/SelectBox";
|
import SelectBox from "../Helpers/SelectBox";
|
||||||
import ActiveJobsPopout from "../jobPopout/ActiveJobsPopout";
|
import PendingJobsPopout from "../jobPopout/PendingJobsPopout";
|
||||||
|
|
||||||
import PaginatedList from "../Pagination/PaginatedList";
|
import PaginatedList from "../Pagination/PaginatedList";
|
||||||
import { handlePagingFunc } from "../Pagination/HandlePagination";
|
import { handlePagingFunc } from "../Pagination/HandlePagination";
|
||||||
@@ -104,7 +104,7 @@ export default function MyPendingJobTable({MyJobList, className }) {
|
|||||||
|
|
||||||
{/* Active Job Popout */}
|
{/* Active Job Popout */}
|
||||||
{jobPopout.show &&
|
{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 */}
|
{/* End of Active Job Popout */}
|
||||||
</div>
|
</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";
|
import CommonHead from "../UserHeader/CommonHead";
|
||||||
|
|
||||||
export default function MyTasks() {
|
export default function MyTasks() {
|
||||||
const [selectTab, setValue] = useState("today");
|
const [selectTab, setValue] = useState("today");
|
||||||
const filterHandler = (value) => {
|
const filterHandler = (value) => {
|
||||||
setValue(value);
|
setValue(value);
|
||||||
};
|
};
|
||||||
return (
|
return (
|
||||||
<Layout>
|
<Layout>
|
||||||
<CommonHead />
|
<CommonHead />
|
||||||
<div className="notification-page w-full mb-10">
|
<div className="notification-page w-full mb-10">
|
||||||
<div className="notification-wrapper w-full">
|
<div className="notification-wrapper w-full">
|
||||||
{/* heading */}
|
{/* heading */}
|
||||||
<div className="sm:flex justify-between items-center mb-6">
|
<div className="sm:flex justify-between items-center mb-6">
|
||||||
<div className="mb-5 sm:mb-0">
|
<div className="mb-5 sm:mb-0">
|
||||||
<h1 className="text-26 font-bold text-dark-gray dark:text-white">
|
<h1 className="text-26 font-bold text-dark-gray dark:text-white">
|
||||||
<span
|
<span
|
||||||
className={`${selectTab === "today" ? "block" : "hidden"}`}
|
className={`${selectTab === "today" ? "block" : "hidden"}`}
|
||||||
>
|
>
|
||||||
My Tasks
|
My Tasks
|
||||||
</span>
|
</span>
|
||||||
|
</h1>
|
||||||
</h1>
|
|
||||||
</div>
|
|
||||||
<div className="slider-btns flex space-x-4">
|
|
||||||
<div onClick={() => filterHandler("today")} className="relative">
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<MyJobTable />
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</Layout>
|
<div className="slider-btns flex space-x-4">
|
||||||
);
|
<div
|
||||||
|
onClick={() => filterHandler("today")}
|
||||||
|
className="relative"
|
||||||
|
></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<MyJobTable />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Layout>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -12,7 +12,7 @@ export default function MobileSidebar({ sidebar, action, logoutModalHandler }) {
|
|||||||
|
|
||||||
let { jobLists } = useSelector((state) => state.jobLists);
|
let { jobLists } = useSelector((state) => state.jobLists);
|
||||||
const marketData = jobLists?.result_list;
|
const marketData = jobLists?.result_list;
|
||||||
let noOfJobs = marketData?.length;
|
let noOfJobs = marketData?.length <= 0 ? "0" : marketData?.length;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="w-full h-full">
|
<div className="w-full h-full">
|
||||||
@@ -163,19 +163,20 @@ export default function MobileSidebar({ sidebar, action, logoutModalHandler }) {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{!userDetails.post_jobs ?
|
{!userDetails.post_jobs ? (
|
||||||
<div className="setting-item">
|
<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 ">
|
<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">
|
<NavLink
|
||||||
<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">
|
to="/start-job"
|
||||||
Enable Job Post
|
className="nav-item flex items-center justify-start space-x-3.5"
|
||||||
</span>
|
>
|
||||||
</NavLink>
|
<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>
|
||||||
</div>
|
) : jobLists?.result_list?.length ? (
|
||||||
:
|
|
||||||
jobLists?.result_list?.length ?
|
|
||||||
(
|
|
||||||
<div className="setting-item">
|
<div className="setting-item">
|
||||||
<div className="heading mb-5">
|
<div className="heading mb-5">
|
||||||
<h1 className="title text-xl font-bold text-purple">My Jobs</h1>
|
<h1 className="title text-xl font-bold text-purple">My Jobs</h1>
|
||||||
@@ -224,33 +225,30 @@ export default function MobileSidebar({ sidebar, action, logoutModalHandler }) {
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)
|
) : (
|
||||||
:
|
<div className="setting-item">
|
||||||
(
|
<div className="heading mb-5">
|
||||||
<div className="setting-item">
|
<h1 className="title text-xl font-bold text-purple">My Jobs</h1>
|
||||||
<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>
|
||||||
)
|
<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>
|
</div>
|
||||||
{/* signout area */}
|
{/* signout area */}
|
||||||
{sidebar ? (
|
{sidebar ? (
|
||||||
@@ -345,4 +343,4 @@ const ListItem = ({ sidebar, route, title, bubble }) => {
|
|||||||
</NavLink>
|
</NavLink>
|
||||||
</li>
|
</li>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
+150
-154
@@ -13,7 +13,7 @@ export default function Sidebar({ sidebar, action, logoutModalHandler }) {
|
|||||||
|
|
||||||
let { jobLists } = useSelector((state) => state.jobLists);
|
let { jobLists } = useSelector((state) => state.jobLists);
|
||||||
const marketData = jobLists?.result_list;
|
const marketData = jobLists?.result_list;
|
||||||
let noOfJobs = marketData?.length;
|
let noOfJobs = marketData?.length <= 0 ? "0" : marketData?.length;
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const title = document.querySelectorAll(".menu-setting-items .heading");
|
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="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">
|
<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">
|
<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>
|
</NavLink>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{!userDetails.post_jobs ?
|
{!userDetails.post_jobs ? (
|
||||||
<div className="setting-item">
|
<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 ">
|
<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">
|
<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">
|
<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
|
Enable Job Post
|
||||||
</span>
|
</span>
|
||||||
</NavLink>
|
</NavLink>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
) : jobLists?.result_list?.length ? (
|
||||||
:
|
<div className="setting-item">
|
||||||
jobLists?.result_list?.length ?
|
<div className="heading mb-5">
|
||||||
(
|
<h1 className="title text-xl font-bold text-purple">My Jobs</h1>
|
||||||
<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>
|
|
||||||
</div>
|
</div>
|
||||||
)
|
<div className="items">
|
||||||
:
|
<ul className="flex flex-col space-y-6">
|
||||||
(
|
<li className="item group">
|
||||||
<div className="setting-item">
|
<NavLink
|
||||||
<div className="heading mb-5">
|
to="/myjobs"
|
||||||
<h1 className="title text-xl font-bold text-purple">My Jobs</h1>
|
className={`nav-item flex items-center ${
|
||||||
</div>
|
((navData) => (navData.isActive ? "active" : ""),
|
||||||
<div className="items">
|
sidebar ? "justify-start space-x-3.5" : "justify-center")
|
||||||
<ul className="flex flex-col space-y-6">
|
}`}
|
||||||
<li className="item group">
|
>
|
||||||
<NavLink
|
<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">
|
||||||
to="/add-job"
|
<Icons name="people-two" />
|
||||||
className={`nav-item flex items-center ${
|
</span>
|
||||||
((navData) => (navData.isActive ? "active" : ""),
|
<span
|
||||||
sidebar ? "justify-start space-x-3.5" : "justify-center")
|
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">
|
List
|
||||||
<Icons name="people-two" />
|
</span>
|
||||||
</span>
|
</NavLink>
|
||||||
<span
|
</li>
|
||||||
className={`item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium ${
|
<li className="item group">
|
||||||
sidebar ? "active flex-1" : "w-0"
|
<NavLink
|
||||||
}`}
|
to="/my-pending-jobs"
|
||||||
>
|
className={`nav-item flex items-center ${
|
||||||
Add Job
|
((navData) => (navData.isActive ? "active" : ""),
|
||||||
</span>
|
sidebar ? "justify-start space-x-3.5" : "justify-center")
|
||||||
</NavLink>
|
}`}
|
||||||
</li>
|
>
|
||||||
</ul>
|
<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">
|
||||||
</div>
|
<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>
|
||||||
}
|
) : (
|
||||||
|
<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>
|
</div>
|
||||||
{/* signout area */}
|
{/* signout area */}
|
||||||
{sidebar ? (
|
{sidebar ? (
|
||||||
|
|||||||
+3
-3
@@ -3,7 +3,7 @@ import Detail from './popoutcomponent/Detail'
|
|||||||
import ModalCom from '../Helpers/ModalCom'
|
import ModalCom from '../Helpers/ModalCom'
|
||||||
|
|
||||||
|
|
||||||
function ActiveJobsPopout({details, onClose, situation}) {
|
function PendingJobsPopout({details, onClose, situation}) {
|
||||||
return (
|
return (
|
||||||
<ModalCom action={onClose} situation={situation}>
|
<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">
|
<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">
|
||||||
@@ -66,7 +66,7 @@ function ActiveJobsPopout({details, onClose, situation}) {
|
|||||||
<div className='my-2 md:flex'>
|
<div className='my-2 md:flex'>
|
||||||
<Detail
|
<Detail
|
||||||
label='Offer Expire'
|
label='Offer Expire'
|
||||||
value={`${details.expire.split(' ')[0]} ${details.expire.split(' ')[1].split('.')[0]}`}
|
value={details.expire && `${details.expire.split(' ')[0]} ${details.expire.split(' ')[1].split('.')[0]}`}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -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);
|
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(){
|
getMyActiveJobList(){
|
||||||
var postData = {
|
var postData = {
|
||||||
uuid: localStorage.getItem("uid"),
|
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 () => {
|
const getMyActiveJobList = async () => {
|
||||||
try {
|
try {
|
||||||
const res = await api.getMyActiveJobList();
|
const res = await api.getMyActiveTaskList();
|
||||||
setMyActiveJobList(res.data);
|
setMyActiveJobList(res.data);
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.log("Error getting mode");
|
console.log("Error getting mode");
|
||||||
|
|||||||
Reference in New Issue
Block a user