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

added top banner

Browse Source
This commit was merged in pull request #586.
This commit is contained in:
Chukwumdiebube Ojinta
2024-02-27 18:35:49 +01:00
parent d91a3bf9f0
commit 2390670d8c
6 changed files with 290 additions and 264 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Dashboards/FamilyParentDashboard.jsx
+45 -62
View File
@@ -1,31 +1,22 @@
import React, { useState } from "react"; import React from "react";
import { Link } from "react-router-dom";
import { toast } from "react-toastify";
import heroBg from "../../assets/images/bg-sky-blue.jpg"; //hero-bg.svg";
import heroUser from "../../assets/images/hero-user.png";
import CountDown from "../Helpers/CountDown"; import CountDown from "../Helpers/CountDown";
// import HomeSliders from "./HomeSliders"; // import HomeSliders from "./HomeSliders";
import { useSelector } from "react-redux"; import { useSelector } from "react-redux";
import HomeSliders from "../Home/HomeSliders";
export default function FamilyParentDashboard({ className, bannerList, nextDueTask }) { export default function JobOwnerDashboard({
const settings = { className,
autoplay: true, bannerList,
dots: true, nextDueTask,
arrows: false, }) {
infinite: true,
swipe: true,
};
const sildeData = null;
const { userDetails } = useSelector((state) => state?.userDetails); const { userDetails } = useSelector((state) => state?.userDetails);
let loginDate = userDetails?.last_login.split(" ")[0]; let loginDate = userDetails?.last_login.split(" ")[0];
let { firstname, lastname, email, profile_pic } = userDetails; let { firstname, lastname, email } = userDetails;
let userEmail = email.split("@")[0]; let userEmail = email.split("@")[0];
return ( return (
<div <div
className={`w-full min-h-[400px] md:grid grid-cols-2 lg:p-8 p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-blue-500 ${ className={`w-full min-h-[100px] flex lg:p-8 p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-sky-blue ${
className || "" className || ""
}`} }`}
style={{ style={{
@@ -34,64 +25,56 @@ export default function FamilyParentDashboard({ className, bannerList, nextDueTa
backgroundSize: "cover", backgroundSize: "cover",
}} }}
> >
<div className="h-full flex flex-col justify-between mb-5 lg:mb-0"> <div className="h-full flex w-full justify-between mb-5 lg:mb-0">
{/* heading */} {/* heading */}
<div> <div className="flex gap-8">
<h1 className="lg:text-2xl text-xl font-medium text-white tracking-wide"> <h1 className="lg:text-2xl text-xl font-medium text-white tracking-wide">
Welcome Welcome
</h1> </h1>
<span className="text-[18px] font-thin tracking-wide text-white"> {/* user */}
Last Login : {loginDate}
</span>
</div>
{/* user */}
<div className="flex items-center space-x-3">
<div className="w-14 h-14 flex justify-center items-center rounded-full overflow-hidden">
<img src={profile_pic != "" ? profile_pic : heroUser} alt="" />
</div>
<div> <div>
<p className="text-xl tracking-wide font-bold antise text-white"> <p className="text-3xl tracking-wide font-bold antise text-white">
{`${firstname} ${lastname}`} {`${firstname} ${lastname}`}
</p> </p>
<p className="text-sm tracking-wide text-white">@{userEmail}</p> <p className="text-sm tracking-wide text-white">@{userEmail}</p>
</div> </div>
</div> </div>
{/* countdown */} {/* countdown */}
{nextDueTask?.next_due && Object.keys(nextDueTask.next_due)?.length != 0 && ( {nextDueTask?.next_due &&
<div className="w-full h-32 flex justify-evenly items-center sm:p-6 p-1 rounded-2xl border back-dark1 border-white-opacity"> Object.keys(nextDueTask.next_due)?.length != 0 && (
<div className="flex flex-col justify-between"> <div className="w-full h-32 flex justify-evenly items-center sm:p-6 p-1 rounded-2xl border back-dark1 border-white-opacity">
<p className="text-base text-white tracking-wide">Current Task</p> <div className="flex flex-col justify-between">
<p className="lg:text-2xl text-lg font-bold tracking-wide text-white"> <p className="text-base text-white tracking-wide">
{(nextDueTask.next_due.item_code).substr(0,4)+'...'} Current Task
</p> </p>
<p className="text-base text-white tracking-wide"> <p className="lg:text-2xl text-lg font-bold tracking-wide text-white">
{nextDueTask.next_due.price * 0.01} Naira {nextDueTask.next_due.item_code.substr(0, 4) + "..."}
</p> </p>
</div> <p className="text-base text-white tracking-wide">
<div className="w-[1px] h-full bg-white-opacity"></div> {nextDueTask.next_due.price * 0.01} Naira
<div className="flex flex-col justify-between"> </p>
<p className="text-base text-white tracking-wide">Next due in</p> </div>
<p className="lg:text-2xl text-lg font-bold tracking-wide text-white"> <div className="w-[1px] h-full bg-white-opacity"></div>
{/* <CountDown lastDate="2023-04-26 4:00:00" /> */} <div className="flex flex-col justify-between">
<CountDown lastDate={nextDueTask.next_due.due_date} /> <p className="text-base text-white tracking-wide">
</p> Next due in
<div className="text-base text-white tracking-wide flex gap-[23px]"> </p>
<span>Hrs</span> <p className="lg:text-2xl text-lg font-bold tracking-wide text-white">
<span>Min</span> {/* <CountDown lastDate="2023-04-26 4:00:00" /> */}
<span>Sec</span> <CountDown lastDate={nextDueTask.next_due.due_date} />
</p>
<div className="text-base text-white tracking-wide flex gap-[23px]">
<span>Hrs</span>
<span>Min</span>
<span>Sec</span>
</div>
</div> </div>
</div> </div>
</div> )}
)} <span className="text-[18px] font-thin tracking-wide text-white flex items-end">
{/* action */} Last Login : {loginDate}
<div className="flex lg:space-x-3 space-x-1 items-center"> </span>
<Link to="/mytask" className="text-white text-base">
<span className=" border-b dark:border-[#5356fb29] border-white">
{" "}
View All Task(s)
</span>
</Link>
</div>
</div> </div>
</div> </div>
); );
src/components/Dashboards/HomeDashboard.jsx
+46 -63
View File
@@ -1,97 +1,80 @@
import React, { useState } from "react"; import React from "react";
import { Link } from "react-router-dom";
import { toast } from "react-toastify";
import heroBg from "../../assets/images/bg-sky-blue.jpg"; //hero-bg.svg";
import heroUser from "../../assets/images/hero-user.png";
import CountDown from "../Helpers/CountDown"; import CountDown from "../Helpers/CountDown";
// import HomeSliders from "./HomeSliders"; // import HomeSliders from "./HomeSliders";
import { useSelector } from "react-redux"; import { useSelector } from "react-redux";
import HomeSliders from "../Home/HomeSliders";
export default function HomeDashboard({ className, bannerList, nextDueTask }) { export default function JobOwnerDashboard({
const settings = { className,
autoplay: true, bannerList,
dots: true, nextDueTask,
arrows: false, }) {
infinite: true,
swipe: true,
};
const sildeData = null;
const { userDetails } = useSelector((state) => state?.userDetails); const { userDetails } = useSelector((state) => state?.userDetails);
let loginDate = userDetails?.last_login.split(" ")[0]; let loginDate = userDetails?.last_login.split(" ")[0];
let { firstname, lastname, email, profile_pic } = userDetails; let { firstname, lastname, email } = userDetails;
let userEmail = email.split("@")[0]; let userEmail = email.split("@")[0];
return ( return (
<div <div
className={`w-full min-h-[400px] md:grid grid-cols-2 lg:p-8 p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden ${ className={`w-full min-h-[100px] flex lg:p-8 p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-sky-blue ${
className || "" className || ""
}`} }`}
style={{ style={{
background: `url(${heroBg})`, // background: `url(${heroBg})`,
backgroundRepeat: "no-repeat", backgroundRepeat: "no-repeat",
backgroundSize: "cover", backgroundSize: "cover",
}} }}
> >
<div className="h-full flex flex-col justify-between mb-5 lg:mb-0"> <div className="h-full flex w-full justify-between mb-5 lg:mb-0">
{/* heading */} {/* heading */}
<div> <div className="flex gap-8">
<h1 className="lg:text-2xl text-xl font-medium text-white tracking-wide"> <h1 className="lg:text-2xl text-xl font-medium text-white tracking-wide">
Welcome Welcome
</h1> </h1>
<span className="text-[18px] font-thin tracking-wide text-white"> {/* user */}
Last Login : {loginDate}
</span>
</div>
{/* user */}
<div className="flex items-center space-x-3">
<div className="w-14 h-14 flex justify-center items-center rounded-full overflow-hidden">
<img src={profile_pic != "" ? profile_pic : heroUser} alt="" />
</div>
<div> <div>
<p className="text-xl tracking-wide font-bold antise text-white"> <p className="text-3xl tracking-wide font-bold antise text-white">
{`${firstname} ${lastname}`} {`${firstname} ${lastname}`}
</p> </p>
<p className="text-sm tracking-wide text-white">@{userEmail}</p> <p className="text-sm tracking-wide text-white">@{userEmail}</p>
</div> </div>
</div> </div>
{/* countdown */} {/* countdown */}
{nextDueTask?.next_due && Object.keys(nextDueTask.next_due)?.length != 0 && ( {nextDueTask?.next_due &&
<div className="w-full h-32 flex justify-evenly items-center sm:p-6 p-1 rounded-2xl border back-dark1 border-white-opacity"> Object.keys(nextDueTask.next_due)?.length != 0 && (
<div className="flex flex-col justify-between"> <div className="w-full h-32 flex justify-evenly items-center sm:p-6 p-1 rounded-2xl border back-dark1 border-white-opacity">
<p className="text-base text-white tracking-wide">Current Task</p> <div className="flex flex-col justify-between">
<p className="lg:text-2xl text-lg font-bold tracking-wide text-white"> <p className="text-base text-white tracking-wide">
{(nextDueTask.next_due.item_code).substr(0,4)+'...'} Current Task
</p> </p>
<p className="text-base text-white tracking-wide"> <p className="lg:text-2xl text-lg font-bold tracking-wide text-white">
{nextDueTask.next_due.price * 0.01} Naira {nextDueTask.next_due.item_code.substr(0, 4) + "..."}
</p> </p>
</div> <p className="text-base text-white tracking-wide">
<div className="w-[1px] h-full bg-white-opacity"></div> {nextDueTask.next_due.price * 0.01} Naira
<div className="flex flex-col justify-between"> </p>
<p className="text-base text-white tracking-wide">Next due in</p> </div>
<p className="lg:text-2xl text-lg font-bold tracking-wide text-white"> <div className="w-[1px] h-full bg-white-opacity"></div>
{/* <CountDown lastDate="2023-04-26 4:00:00" /> */} <div className="flex flex-col justify-between">
<CountDown lastDate={nextDueTask.next_due.due_date} /> <p className="text-base text-white tracking-wide">
</p> Next due in
<div className="text-base text-white tracking-wide flex gap-[23px]"> </p>
<span>Hrs</span> <p className="lg:text-2xl text-lg font-bold tracking-wide text-white">
<span>Min</span> {/* <CountDown lastDate="2023-04-26 4:00:00" /> */}
<span>Sec</span> <CountDown lastDate={nextDueTask.next_due.due_date} />
</p>
<div className="text-base text-white tracking-wide flex gap-[23px]">
<span>Hrs</span>
<span>Min</span>
<span>Sec</span>
</div>
</div> </div>
</div> </div>
</div> )}
)} <span className="text-[18px] font-thin tracking-wide text-white flex items-end">
{/* action */} Last Login : {loginDate}
<div className="flex lg:space-x-3 space-x-1 items-center"> </span>
<Link to="/mytask" className="text-white text-base">
<span className=" border-b dark:border-[#5356fb29] border-white">
{" "}
View All Task(s)
</span>
</Link>
</div>
</div> </div>
</div> </div>
); );
src/components/Dashboards/JobOwnerDashboard.jsx
+46 -67
View File
@@ -1,31 +1,22 @@
import React, { useState } from "react"; import React from "react";
import { Link } from "react-router-dom";
import { toast } from "react-toastify";
import heroBg from "../../assets/images/bg-sky-blue.jpg"; //hero-bg.svg";
import heroUser from "../../assets/images/hero-user.png";
import CountDown from "../Helpers/CountDown"; import CountDown from "../Helpers/CountDown";
// import HomeSliders from "./HomeSliders"; // import HomeSliders from "./HomeSliders";
import { useSelector } from "react-redux"; import { useSelector } from "react-redux";
import HomeSliders from "../Home/HomeSliders";
export default function JobOwnerDashboard({ className, bannerList, nextDueTask }) { export default function JobOwnerDashboard({
const settings = { className,
autoplay: true, bannerList,
dots: true, nextDueTask,
arrows: false, }) {
infinite: true,
swipe: true,
};
const sildeData = null;
const { userDetails } = useSelector((state) => state?.userDetails); const { userDetails } = useSelector((state) => state?.userDetails);
let loginDate = userDetails?.last_login.split(" ")[0]; let loginDate = userDetails?.last_login.split(" ")[0];
let { firstname, lastname, email, profile_pic } = userDetails; let { firstname, lastname, email } = userDetails;
let userEmail = email.split("@")[0]; let userEmail = email.split("@")[0];
return ( return (
<div <div
className={`w-full min-h-[400px] md:grid grid-cols-2 lg:p-8 p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-blue-800 ${ className={`w-full min-h-[100px] flex lg:p-8 p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-sky-blue ${
className || "" className || ""
}`} }`}
style={{ style={{
@@ -34,70 +25,58 @@ export default function JobOwnerDashboard({ className, bannerList, nextDueTask }
backgroundSize: "cover", backgroundSize: "cover",
}} }}
> >
<div className="h-full flex flex-col justify-between mb-5 lg:mb-0"> <div className="h-full flex w-full justify-between mb-5 lg:mb-0">
{/* heading */} {/* heading */}
<div> <div className="flex gap-8">
<h1 className="lg:text-2xl text-xl font-medium text-white tracking-wide"> <h1 className="lg:text-2xl text-xl font-medium text-white tracking-wide">
Welcome Welcome
</h1> </h1>
<span className="text-[18px] font-thin tracking-wide text-white"> {/* user */}
Last Login : {loginDate}
</span>
</div>
{/* user */}
<div className="flex items-center space-x-3">
<div className="w-14 h-14 flex justify-center items-center rounded-full overflow-hidden">
<img src={profile_pic != "" ? profile_pic : heroUser} alt="" />
</div>
<div> <div>
<p className="text-xl tracking-wide font-bold antise text-white"> <p className="text-3xl tracking-wide font-bold antise text-white">
{`${firstname} ${lastname}`} {`${firstname} ${lastname}`}
</p> </p>
<p className="text-sm tracking-wide text-white">@{userEmail}</p> <p className="text-sm tracking-wide text-white">@{userEmail}</p>
</div> </div>
</div> </div>
{/* countdown */} {/* countdown */}
{nextDueTask?.next_due && Object.keys(nextDueTask.next_due)?.length != 0 && ( {nextDueTask?.next_due &&
<div className="w-full h-32 flex justify-evenly items-center sm:p-6 p-1 rounded-2xl border back-dark1 border-white-opacity"> Object.keys(nextDueTask.next_due)?.length != 0 && (
<div className="flex flex-col justify-between"> <div className="w-full h-32 flex justify-evenly items-center sm:p-6 p-1 rounded-2xl border back-dark1 border-white-opacity">
<p className="text-base text-white tracking-wide">Current Task</p> <div className="flex flex-col justify-between">
<p className="lg:text-2xl text-lg font-bold tracking-wide text-white"> <p className="text-base text-white tracking-wide">
{(nextDueTask.next_due.item_code).substr(0,4)+'...'} Current Task
</p> </p>
<p className="text-base text-white tracking-wide"> <p className="lg:text-2xl text-lg font-bold tracking-wide text-white">
{nextDueTask.next_due.price * 0.01} Naira {nextDueTask.next_due.item_code.substr(0, 4) + "..."}
</p> </p>
</div> <p className="text-base text-white tracking-wide">
<div className="w-[1px] h-full bg-white-opacity"></div> {nextDueTask.next_due.price * 0.01} Naira
<div className="flex flex-col justify-between"> </p>
<p className="text-base text-white tracking-wide">Next due in</p> </div>
<p className="lg:text-2xl text-lg font-bold tracking-wide text-white"> <div className="w-[1px] h-full bg-white-opacity"></div>
{/* <CountDown lastDate="2023-04-26 4:00:00" /> */} <div className="flex flex-col justify-between">
<CountDown lastDate={nextDueTask.next_due.due_date} /> <p className="text-base text-white tracking-wide">
</p> Next due in
<div className="text-base text-white tracking-wide flex gap-[23px]"> </p>
<span>Hrs</span> <p className="lg:text-2xl text-lg font-bold tracking-wide text-white">
<span>Min</span> {/* <CountDown lastDate="2023-04-26 4:00:00" /> */}
<span>Sec</span> <CountDown lastDate={nextDueTask.next_due.due_date} />
</p>
<div className="text-base text-white tracking-wide flex gap-[23px]">
<span>Hrs</span>
<span>Min</span>
<span>Sec</span>
</div>
</div> </div>
</div> </div>
</div> )}
)} <span className="text-[18px] font-thin tracking-wide text-white flex items-end">
{/* action */} Last Login : {loginDate}
<div className="flex lg:space-x-3 space-x-1 items-center"> </span>
<Link to="/mytask" className="text-white text-base">
<span className=" border-b dark:border-[#5356fb29] border-white">
{" "}
View All Task(s)
</span>
</Link>
</div>
</div> </div>
<HomeSliders
settings={settings}
sideData={sildeData}
bannerList={bannerList}
/>
</div> </div>
); );
} }
src/components/Dashboards/OldDashboard.jsx
+103
View File
@@ -0,0 +1,103 @@
import React, { useState } from "react";
import { Link } from "react-router-dom";
import { toast } from "react-toastify";
import heroBg from "../../assets/images/bg-sky-blue.jpg"; //hero-bg.svg";
import heroUser from "../../assets/images/hero-user.png";
import CountDown from "../Helpers/CountDown";
// import HomeSliders from "./HomeSliders";
import { useSelector } from "react-redux";
import HomeSliders from "../Home/HomeSliders";
export default function WorkerDashboard({ className, bannerList, nextDueTask }) {
const settings = {
autoplay: true,
dots: true,
arrows: false,
infinite: true,
swipe: true,
};
const sildeData = null;
const { userDetails } = useSelector((state) => state?.userDetails);
let loginDate = userDetails?.last_login.split(" ")[0];
let { firstname, lastname, email, profile_pic } = userDetails;
let userEmail = email.split("@")[0];
return (
<div
className={`w-full min-h-[400px] md:grid grid-cols-2 lg:p-8 p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-blue-900 ${
className || ""
}`}
style={{
// background: `url(${heroBg})`,
backgroundRepeat: "no-repeat",
backgroundSize: "cover",
}}
>
<div className="h-full flex flex-col justify-between mb-5 lg:mb-0">
{/* heading */}
<div>
<h1 className="lg:text-2xl text-xl font-medium text-white tracking-wide">
Welcome
</h1>
<span className="text-[18px] font-thin tracking-wide text-white">
Last Login : {loginDate}
</span>
</div>
{/* user */}
<div className="flex items-center space-x-3">
<div className="w-14 h-14 flex justify-center items-center rounded-full overflow-hidden">
<img src={profile_pic != "" ? profile_pic : heroUser} alt="" />
</div>
<div>
<p className="text-xl tracking-wide font-bold antise text-white">
{`${firstname} ${lastname}`}
</p>
<p className="text-sm tracking-wide text-white">@{userEmail}</p>
</div>
</div>
{/* countdown */}
{nextDueTask?.next_due && Object.keys(nextDueTask.next_due)?.length != 0 && (
<div className="w-full h-32 flex justify-evenly items-center sm:p-6 p-1 rounded-2xl border back-dark1 border-white-opacity">
<div className="flex flex-col justify-between">
<p className="text-base text-white tracking-wide">Current Task</p>
<p className="lg:text-2xl text-lg font-bold tracking-wide text-white">
{(nextDueTask.next_due.item_code).substr(0,4)+'...'}
</p>
<p className="text-base text-white tracking-wide">
{nextDueTask.next_due.price * 0.01} Naira
</p>
</div>
<div className="w-[1px] h-full bg-white-opacity"></div>
<div className="flex flex-col justify-between">
<p className="text-base text-white tracking-wide">Next due in</p>
<p className="lg:text-2xl text-lg font-bold tracking-wide text-white">
{/* <CountDown lastDate="2023-04-26 4:00:00" /> */}
<CountDown lastDate={nextDueTask.next_due.due_date} />
</p>
<div className="text-base text-white tracking-wide flex gap-[23px]">
<span>Hrs</span>
<span>Min</span>
<span>Sec</span>
</div>
</div>
</div>
)}
{/* action */}
<div className="flex lg:space-x-3 space-x-1 items-center">
<Link to="/mytask" className="text-white text-base">
<span className=" border-b dark:border-[#5356fb29] border-white">
{" "}
View All Task(s)
</span>
</Link>
</div>
</div>
<HomeSliders
settings={settings}
sideData={sildeData}
bannerList={bannerList}
/>
</div>
);
}
src/components/Dashboards/WorkerDashboard.jsx
+45 -67
View File
@@ -1,31 +1,22 @@
import React, { useState } from "react"; import React from "react";
import { Link } from "react-router-dom";
import { toast } from "react-toastify";
import heroBg from "../../assets/images/bg-sky-blue.jpg"; //hero-bg.svg";
import heroUser from "../../assets/images/hero-user.png";
import CountDown from "../Helpers/CountDown"; import CountDown from "../Helpers/CountDown";
// import HomeSliders from "./HomeSliders"; // import HomeSliders from "./HomeSliders";
import { useSelector } from "react-redux"; import { useSelector } from "react-redux";
import HomeSliders from "../Home/HomeSliders";
export default function WorkerDashboard({ className, bannerList, nextDueTask }) { export default function JobOwnerDashboard({
const settings = { className,
autoplay: true, bannerList,
dots: true, nextDueTask,
arrows: false, }) {
infinite: true,
swipe: true,
};
const sildeData = null;
const { userDetails } = useSelector((state) => state?.userDetails); const { userDetails } = useSelector((state) => state?.userDetails);
let loginDate = userDetails?.last_login.split(" ")[0]; let loginDate = userDetails?.last_login.split(" ")[0];
let { firstname, lastname, email, profile_pic } = userDetails; let { firstname, lastname, email } = userDetails;
let userEmail = email.split("@")[0]; let userEmail = email.split("@")[0];
return ( return (
<div <div
className={`w-full min-h-[400px] md:grid grid-cols-2 lg:p-8 p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-blue-900 ${ className={`w-full min-h-[100px] flex lg:p-8 p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-sky-blue ${
className || "" className || ""
}`} }`}
style={{ style={{
@@ -34,70 +25,57 @@ export default function WorkerDashboard({ className, bannerList, nextDueTask })
backgroundSize: "cover", backgroundSize: "cover",
}} }}
> >
<div className="h-full flex flex-col justify-between mb-5 lg:mb-0"> <div className="h-full flex w-full justify-between mb-5 lg:mb-0">
{/* heading */} {/* heading */}
<div> <div className="flex gap-8">
<h1 className="lg:text-2xl text-xl font-medium text-white tracking-wide"> <h1 className="lg:text-2xl text-xl font-medium text-white tracking-wide">
Welcome Welcome
</h1> </h1>
<span className="text-[18px] font-thin tracking-wide text-white"> {/* user */}
Last Login : {loginDate}
</span>
</div>
{/* user */}
<div className="flex items-center space-x-3">
<div className="w-14 h-14 flex justify-center items-center rounded-full overflow-hidden">
<img src={profile_pic != "" ? profile_pic : heroUser} alt="" />
</div>
<div> <div>
<p className="text-xl tracking-wide font-bold antise text-white"> <p className="text-3xl tracking-wide font-bold antise text-white">
{`${firstname} ${lastname}`} {`${firstname} ${lastname}`}
</p> </p>
<p className="text-sm tracking-wide text-white">@{userEmail}</p> <p className="text-sm tracking-wide text-white">@{userEmail}</p>
</div> </div>
</div> </div>
{/* countdown */} {/* countdown */}
{nextDueTask?.next_due && Object.keys(nextDueTask.next_due)?.length != 0 && ( {nextDueTask?.next_due &&
<div className="w-full h-32 flex justify-evenly items-center sm:p-6 p-1 rounded-2xl border back-dark1 border-white-opacity"> Object.keys(nextDueTask.next_due)?.length != 0 && (
<div className="flex flex-col justify-between"> <div className="w-full h-32 flex justify-evenly items-center sm:p-6 p-1 rounded-2xl border back-dark1 border-white-opacity">
<p className="text-base text-white tracking-wide">Current Task</p> <div className="flex flex-col justify-between">
<p className="lg:text-2xl text-lg font-bold tracking-wide text-white"> <p className="text-base text-white tracking-wide">
{(nextDueTask.next_due.item_code).substr(0,4)+'...'} Current Task
</p> </p>
<p className="text-base text-white tracking-wide"> <p className="lg:text-2xl text-lg font-bold tracking-wide text-white">
{nextDueTask.next_due.price * 0.01} Naira {nextDueTask.next_due.item_code.substr(0, 4) + "..."}
</p> </p>
</div> <p className="text-base text-white tracking-wide">
<div className="w-[1px] h-full bg-white-opacity"></div> {nextDueTask.next_due.price * 0.01} Naira
<div className="flex flex-col justify-between"> </p>
<p className="text-base text-white tracking-wide">Next due in</p> </div>
<p className="lg:text-2xl text-lg font-bold tracking-wide text-white"> <div className="w-[1px] h-full bg-white-opacity"></div>
{/* <CountDown lastDate="2023-04-26 4:00:00" /> */} <div className="flex flex-col justify-between">
<CountDown lastDate={nextDueTask.next_due.due_date} /> <p className="text-base text-white tracking-wide">
</p> Next due in
<div className="text-base text-white tracking-wide flex gap-[23px]"> </p>
<span>Hrs</span> <p className="lg:text-2xl text-lg font-bold tracking-wide text-white">
<span>Min</span> {/* <CountDown lastDate="2023-04-26 4:00:00" /> */}
<span>Sec</span> <CountDown lastDate={nextDueTask.next_due.due_date} />
</p>
<div className="text-base text-white tracking-wide flex gap-[23px]">
<span>Hrs</span>
<span>Min</span>
<span>Sec</span>
</div>
</div> </div>
</div> </div>
</div> )}
)} <span className="text-[18px] font-thin tracking-wide text-white flex items-end">
{/* action */} Last Login : {loginDate}
<div className="flex lg:space-x-3 space-x-1 items-center"> </span>
<Link to="/mytask" className="text-white text-base">
<span className=" border-b dark:border-[#5356fb29] border-white">
{" "}
View All Task(s)
</span>
</Link>
</div>
</div> </div>
<HomeSliders
settings={settings}
sideData={sildeData}
bannerList={bannerList}
/>
</div> </div>
); );
} }
src/components/Home/FullAccountDash.jsx
+5 -5
View File
@@ -21,7 +21,7 @@ export default function FullAccountDash(props) {
case "DEFAULT_HOME_DASH": case "DEFAULT_HOME_DASH":
return ( return (
<HomeDashboard <HomeDashboard
className="mb-10" className="mb-4"
data={userDetails} data={userDetails}
bannerList={props.bannerList} bannerList={props.bannerList}
nextDueTask={props.nextDueTask} nextDueTask={props.nextDueTask}
@@ -30,7 +30,7 @@ export default function FullAccountDash(props) {
case "FAMILY_PARENT_DASH": case "FAMILY_PARENT_DASH":
return ( return (
<FamilyParentDashboard <FamilyParentDashboard
className="mb-10" className="mb-4"
data={userDetails} data={userDetails}
bannerList={props.bannerList} bannerList={props.bannerList}
nextDueTask={props.nextDueTask} nextDueTask={props.nextDueTask}
@@ -39,7 +39,7 @@ export default function FullAccountDash(props) {
case "WORKER_HOME_DASH": case "WORKER_HOME_DASH":
return ( return (
<WorkerDashboard <WorkerDashboard
className="mb-10" className="mb-4"
data={userDetails} data={userDetails}
bannerList={props.bannerList} bannerList={props.bannerList}
nextDueTask={props.nextDueTask} nextDueTask={props.nextDueTask}
@@ -48,7 +48,7 @@ export default function FullAccountDash(props) {
case "JOBOWNER_HOME_DASH": case "JOBOWNER_HOME_DASH":
return ( return (
<JobOwnerDashboard <JobOwnerDashboard
className="mb-10" className="mb-4"
data={userDetails} data={userDetails}
bannerList={props.bannerList} bannerList={props.bannerList}
nextDueTask={props.nextDueTask} nextDueTask={props.nextDueTask}
@@ -62,10 +62,10 @@ export default function FullAccountDash(props) {
return ( return (
<> <>
<div className="home-page-wrapper"> <div className="home-page-wrapper">
{renderDashboard()}
{process.env.REACT_APP_SHOW_ACCOUNT_DASH == "1" && ( {process.env.REACT_APP_SHOW_ACCOUNT_DASH == "1" && (
<AccountDashboard className="mb-4" bannerList={props.bannerList} /> <AccountDashboard className="mb-4" bannerList={props.bannerList} />
)} )}
{renderDashboard()}
{props?.dashTypes !== "undefined" && {props?.dashTypes !== "undefined" &&
props.offersList?.data?.result_list?.length ? ( props.offersList?.data?.result_list?.length ? (