Active Task Header Upgrade #143

Merged
ameye merged 1 commits from active-task-header-upgrade into master 2023-06-06 18:14:47 +00:00
+30 -44
View File
@@ -5,6 +5,8 @@ import { useNavigate } from "react-router-dom";
import ActiveJobMessage from "./ActiveJobMessage";
import LoadingSpinner from "../Spinners/LoadingSpinner";
import CountDown from "../Helpers/CountDown";
import usersService from "../../services/UsersService";
function ActiveJobs(props) {
@@ -148,7 +150,7 @@ function ActiveJobs(props) {
return (
<Layout>
<div className="py-[20px] bg-white px-4 rounded-2xl shadow-md md:flex justify-between items-start space-y-4 md:space-x-4 md:space-y-0">
<div className="py-[20px] bg-white px-4 rounded-2xl shadow-md md:flex justify-between items-start gap-8">
{/* job title */}
<div className="w-full md:w-8/12">
<div className="w-full flex justify-start space-x-3 items-start">
@@ -172,20 +174,14 @@ function ActiveJobs(props) {
</h1>
</div>
<div className="w-full my-4">
<div className="pb-2 w-full flex items-center">
<p className="w-full lg:w-2/3 text-base text-slate-700 dark:text-black">
{props.details?.contract && props.details.contract}
</p>
<p className="w-full lg:w-1/3 text-base text-sky-blue">
{userDetails.firstname && userDetails.firstname}
</p>
</div>
<p className="text-base text-slate-700 dark:text-black">
<span className="font-semibold">Description: </span>
{props.details?.description && props.details.description}
<div className="w-full my-2">
<p className="w-full text-base text-right text-sky-blue">
{userDetails.firstname && userDetails.firstname}
</p>
<div className="text-base text-slate-700 dark:text-black tracking-wide">
<p className="font-semibold text-black">Description: </p>
<p className="p-2 border border-sky-blue">{props.details?.description && props.details.description}</p>
</div>
</div>
</div>
{/* end of job title */}
@@ -193,19 +189,27 @@ function ActiveJobs(props) {
{/* job details */}
<div className="w-full md:w-4/12">
<p className="text-base text-sky-blue">Delivery Detail</p>
<div className="mt-2">
<p className="text-base text-slate-700 dark:text-black">
<span className="font-semibold">Due: </span>
{props.details?.delivery_date &&
props.details.delivery_date.split(" ")[0]}
</p>
<p className="py-2 text-base text-slate-700 dark:text-black">
{props.details?.delivery_date &&
props.details.delivery_date.split(" ")[1]}
</p>
<p className="text-base text-slate-700 dark:text-black">
{props.details?.timeline_days && props.details.timeline_days} day(s)
<div className="my-1 flex items-start gap-3">
<p className="font-semibold">Due: </p>
<div className="flex flex-col justify-between">
<p className="text-base text-slate-700 dark:text-black tracking-wide">
<CountDown lastDate={props.details.delivery_date} />
</p>
<div className="text-base text-slate-700 dark:text-black tracking-wide flex gap-[5px]">
<span>Hrs</span>
<span>Min</span>
<span>Sec</span>
</div>
</div>
</div>
<div className="my-1 text-base text-slate-700 dark:text-black tracking-wide flex items-center gap-3">
<span className="font-semibold text-black">Duration: </span>
<span className="">{props.details?.timeline_days && props.details.timeline_days} day(s)</span>
</div>
<div className="my-1 text-base text-slate-700 dark:text-black tracking-wide flex items-center gap-3">
<span className="font-semibold text-black">No: </span>
<span className="">{props.details?.contract && props.details.contract}</span>
</div>
</div>
{/* end of job details */}
@@ -293,24 +297,6 @@ function ActiveJobs(props) {
{/* Buttons Sections */}
<div className="py-2 sm:flex sm:justify-end sm:items-center">
{/* <div className="w-full mb-3 sm:mb-0 sm:w-2/4">
{tab == 'files' &&
(
<button
onClick={()=>{console.log('working')}}
type="button"
className="btn-gradient text-base tracking-wide px-4 py-2 rounded-md flex justify-center items-center"
>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" fill='white'>
<path d="M12 2L2 12h3v8h14v-8h3L12 2zm0 16v-6h-2v6H7l5-5 5 5h-3z"/>
</svg>
<span className="text-white">Upload Files</span>
</button>
)
}
</div> */}
<div className="w-full sm:w-2/4 flex justify-between items-center space-x-2">
<button
type="button"