Compare commits

...

7 Commits

Author SHA1 Message Date
victorAnumudu 87523beba9 Side bar Menu Close Bug Fixed 2023-05-17 05:05:27 +01:00
CHIEFSOFT\ameye 448c1c69ba active job message 2023-05-16 19:03:39 -04:00
ameye b535326c51 Merge branch 'centering-btn' of WrenchBoard/Users-Wrench into master 2023-05-16 19:40:51 +00:00
ameye dad2b6781e Merge branch 'task-layout' of WrenchBoard/Users-Wrench into master 2023-05-16 19:40:45 +00:00
victorAnumudu 3cb0604e81 Button centered 2023-05-16 17:58:14 +01:00
Ebube 73a21a2367 added for mobile 2023-05-16 17:25:08 +01:00
Ebube 8716b16a70 Implented zero state for market bubble 2023-05-16 17:22:08 +01:00
5 changed files with 1348 additions and 146 deletions
File diff suppressed because it is too large Load Diff
+3 -5
View File
@@ -3,6 +3,7 @@ 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);
@@ -120,6 +121,7 @@ function ActiveJobs() {
<span className="text-white">Send</span>
</button>
</div>
</div>
{/* end of Buttons Sections */}
</div>
@@ -138,11 +140,7 @@ function ActiveJobs() {
<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>
<textarea
className="p-4 w-full text-base text-slate-600 border border-slate-300 outline-none rounded-md"
rows="10"
style={{ resize: "none" }}
/>
<ActiveJobMessage />
</div>
</div>
@@ -96,15 +96,17 @@ export default function MyActiveJobTable({ MyJobList, className }) {
</td>
<td className="text-right py-4 px-2">
<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 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>
))}
+1 -1
View File
@@ -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">
+196 -131
View File
@@ -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");
@@ -112,7 +112,7 @@ export default function Sidebar({ sidebar, action, logoutModalHandler }) {
title={name}
route={path}
bubble={bubble}
sidebar
sidebar = {sidebar}
/>
))}
{/*<li className="item group">*/}
@@ -220,46 +220,38 @@ export default function Sidebar({ sidebar, action, logoutModalHandler }) {
</ul>
</div>
</div>
{/*<div className="setting-item">*/}
{/* <div class="heading bg-pink dark:bg-dark-white rounded-2xl p-6 2xl:w-[180px] w-full 2xl:mb-10 2xl:border-none border ">*/}
{/* <NavLink to="/acc-family">*/}
{/* <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">*/}
{/* Family Account*/}
{/* </span>*/}
{/* </NavLink>*/}
{/* </div>*/}
{/*</div>*/}
<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>
</NavLink>
</div>
</div>
{/* <div className="setting-item">
<div class="heading bg-pink dark:bg-dark-white rounded-2xl p-6 2xl:w-[180px] w-full 2xl:mb-10 2xl:border-none border ">
<NavLink to="/acc-family">
<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">
Family Account
</span>
</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>
</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">
{/* menu and settings item */}
<div className="menu-setting-items mb-11">
{/* menus item */}
<div className={`menu-item transition-all duration-300 ease-in-out ${
sidebar ? "mb-14" : ""
}`}>
{/* <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>
</NavLink>
</div> */}
<div className="items">
<div className="heading mb-5">
<h1 className="title text-xl font-bold text-purple">Family</h1>
</div>
<ul className="flex flex-col space-y-6">
<li className="item group">
<NavLink
to="/myjobs"
to="/acc-family"
className={`nav-item flex items-center ${
((navData) => (navData.isActive ? "active" : ""),
sidebar ? "justify-start space-x-3.5" : "justify-center")
@@ -273,105 +265,39 @@ export default function Sidebar({ sidebar, action, logoutModalHandler }) {
sidebar ? "active flex-1" : "w-0"
}`}
>
List
Family Corner
</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>
</div>
{!userDetails.post_jobs ? (
<div className="menu-setting-items mb-11">
{/* menus item */}
<div className={`menu-item transition-all duration-300 ease-in-out bg-pink dark:bg-dark-white rounded-2xl p-3 ${
sidebar ? "mb-14" : "rounded-none p-0"
}`}>
{/* <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 className="items">
<div className="heading mb-5">
<h1 className="title text-xl font-bold text-purple">Job Post</h1>
</div>
<ul className="flex flex-col space-y-6">
<li className="item group">
<NavLink
to="/add-job"
to="/start-job"
className={`nav-item flex items-center ${
((navData) => (navData.isActive ? "active" : ""),
sidebar ? "justify-start space-x-3.5" : "justify-center")
@@ -385,16 +311,155 @@ export default function Sidebar({ sidebar, action, logoutModalHandler }) {
sidebar ? "active flex-1" : "w-0"
}`}
>
Add Job
Enable Job Post
</span>
</NavLink>
</li>
</ul>
</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>
</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 ? (