Merge branch 'assign-job-label' of WrenchBoard/Users-Wrench into master

This commit is contained in:
2024-03-18 13:05:13 +00:00
committed by Gogs
6 changed files with 73 additions and 47 deletions
@@ -187,6 +187,7 @@ export default function FamilyManageTabs({
familyData={details.familyWaitList.data} familyData={details.familyWaitList.data}
accountDetails={accountDetails} accountDetails={accountDetails}
loader={details.familyWaitList.loading} loader={details.familyWaitList.loading}
setUpdatePage={setUpdatePage}
/> />
), ),
Pending: ( Pending: (
@@ -1,4 +1,4 @@
import React, { useState } from "react"; import React, { useEffect, useState } from "react";
import { useDispatch } from "react-redux"; import { useDispatch } from "react-redux";
import { useLocation } from "react-router-dom"; import { useLocation } from "react-router-dom";
import usersService from "../../../services/UsersService"; import usersService from "../../../services/UsersService";
@@ -24,12 +24,13 @@ const AssignTaskPopout = ({
const apiCall = new usersService(); const apiCall = new usersService();
let { pathname, state } = useLocation(); let { pathname, state } = useLocation();
const [selectedFamilyUid, setSelectedFamilyUid] = useState(null); const [selectedFamilyUid, setSelectedFamilyUid] = useState('');
const handleFamChange = (event) => { const handleFamChange = (event) => {
setSelectedFamilyUid(event.target.value); setSelectedFamilyUid(event.target.value);
}; };
const dispatch = useDispatch(); const dispatch = useDispatch();
const getFamilySession = JSON.parse(sessionStorage.getItem("family_list")); const getFamilySession = JSON.parse(sessionStorage.getItem("family_list"));
@@ -73,6 +74,14 @@ const AssignTaskPopout = ({
const assignFamilyTask = () => { const assignFamilyTask = () => {
setRequestStatus({ loading: true, status: false, message: "" }); setRequestStatus({ loading: true, status: false, message: "" });
if(!selectedFamilyUid){ // If no family found, throw error
setRequestStatus({ loading: false, status: false, message: "Please Select Family Member" });
return setTimeout(() => {
setRequestStatus({ loading: false, status: false, message: "" });
}, 3000);
}
let reqData = {}; let reqData = {};
if (taskType == "select") { if (taskType == "select") {
// RUNS HERE IF TASK TYPE IS SELECT // RUNS HERE IF TASK TYPE IS SELECT
@@ -147,48 +156,42 @@ const AssignTaskPopout = ({
timeline_days, timeline_days,
title, title,
assign_mode: 110055, assign_mode: 110055,
family_uid: details?.family_uid || familyDetailsData?.uid, family_uid: selectedFamilyUid
? selectedFamilyUid
: familyDetailsData?.uid || details?.family_uid,
}; };
} }
apiCall apiCall
.assignFamilyTask(reqData) .assignFamilyTask(reqData)
.then((res) => { .then((res) => {
console.log("Assign task 1", res);
if (res.status != 200 || res.data.internal_return < 0) { if (res.status != 200 || res.data.internal_return < 0) {
console.log("Assign task 2");
setRequestStatus({ setRequestStatus({
loading: false, loading: false,
status: false, status: false,
message: "failed to assign task", message: "failed to assign task",
}); });
console.log("Assign task 3");
return setTimeout(() => { return setTimeout(() => {
setRequestStatus({ loading: false, status: false, message: "" }); setRequestStatus({ loading: false, status: false, message: "" });
}, 5000); }, 5000);
} }
if (res.status === 200) { if (res.status === 200) {
console.log("Assign task 4");
setRequestStatus({ setRequestStatus({
loading: false, loading: false,
status: true, status: true,
message: "action successful", message: "action successful",
}); });
console.log("Assign task 5");
// setUpdatePage(prev => !prev); // Updates family task page by calling the useeffect hook setUpdatePage(prev => !prev); // Updates family task page by calling the useeffect hook
console.log("Assign task 6");
dispatch(tableReload({ type: "WALLETTABLE" })); // RELOADS USER WALLET dispatch(tableReload({ type: "WALLETTABLE" })); // RELOADS USER WALLET
console.log("Assign task 7");
setTimeout(() => { setTimeout(() => {
setRequestStatus({ loading: false, status: false, message: "" }); setRequestStatus({ loading: false, status: false, message: "" });
action(); // FUNCTION THAT CLOSES THE MODAL BOX action(); // FUNCTION THAT CLOSES THE MODAL BOX
}, 5000); }, 5000);
console.log("Assign task 8");
} }
}) })
.catch((err) => { .catch((err) => {
@@ -198,13 +201,22 @@ const AssignTaskPopout = ({
message: "An Error occured, try again", message: "An Error occured, try again",
}); });
console.log("This is a test error " + err);
setTimeout(() => { setTimeout(() => {
setRequestStatus({ loading: false, status: false, message: "" }); setRequestStatus({ loading: false, status: false, message: "" });
}, 5000); }, 5000);
}); });
}; };
useEffect(()=>{ // effect to update family UID when components mounts
if(familyDetailsData?.uid){
setSelectedFamilyUid(familyDetailsData?.uid)
}else if(details?.family_uid){
setSelectedFamilyUid(details?.family_uid)
}else{
setSelectedFamilyUid('')
}
},[])
return ( return (
<> <>
<ModalCom action={action} situation={situation}> <ModalCom action={action} situation={situation}>
@@ -226,7 +238,7 @@ const AssignTaskPopout = ({
onChange={handleFamChange} onChange={handleFamChange}
value={selectedFamilyUid} value={selectedFamilyUid}
> >
<option value="" disabled selected> <option value="">
Select a member Select a member
</option> </option>
{familyList} {familyList}
@@ -358,7 +370,7 @@ const AssignTaskPopout = ({
</div> </div>
<div className="flex items-center"> <div className="flex items-center">
<div className="my-3 w-full flex items-center gap-1"> <div className="my-3 w-full flex items-center gap-1">
<label className="text-slate-900 dark:text-white tracking-wide font-semibold"> <label className="job-label">
Price Price
</label> </label>
<p className="p-1 text-sm text-slate-900 dark:text-white"> <p className="p-1 text-sm text-slate-900 dark:text-white">
@@ -371,22 +383,23 @@ const AssignTaskPopout = ({
</div> </div>
<div className="my-3 w-full flex items-center gap-1"> <div className="my-3 w-full flex items-center gap-1">
<label className="text-slate-900 dark:text-white tracking-wide font-semibold"> <label className="job-label">
Timeline Timeline
</label> </label>
<p className="p-1 text-sm text-slate-900 dark:text-white">{`${activeTask?.data?.timeline_days} day(s)`}</p> <p className="p-1 text-sm text-slate-900 dark:text-white">{`${activeTask?.data?.timeline_days} day(s)`}</p>
</div> </div>
</div> </div>
<div className="my-3 sm:flex items-center"> {/* Dummy, no value found for created! thus commented*/}
{/* <div className="my-3 sm:flex items-center">
<Detail <Detail
label="Created" label="Created"
value={`Dummy, no value found for created!`} value={`Dummy, no value found for created!`}
/> />
</div> </div> */}
<div className="my-3"> <div className="my-3">
<label className="w-full text-slate-900 dark:text-white tracking-wide font-semibold"> <label className="w-full job-label">
Delivery Detail Delivery Detail
</label> </label>
<textarea <textarea
@@ -430,7 +443,7 @@ const AssignTaskPopout = ({
</div> </div>
{/* End of error or success display */} {/* End of error or success display */}
<div className="w-auto h-auto flex items-center gap-3"> <div className="w-auto h-auto flex items-center gap-20">
<button <button
disabled={requestStatus.loading} disabled={requestStatus.loading}
onClick={action} onClick={action}
@@ -442,7 +455,7 @@ const AssignTaskPopout = ({
<div className=""> <div className="">
{requestStatus.loading ? ( {requestStatus.loading ? (
<LoadingSpinner color="sky-blue" size="8" /> <LoadingSpinner color="sky-blue" size="8" />
) : taskType == "select" ? ( ) : (
<button <button
type="button" type="button"
disabled={requestStatus.loading} disabled={requestStatus.loading}
@@ -451,20 +464,22 @@ const AssignTaskPopout = ({
> >
Assign Assign
</button> </button>
) : ( )
<button // : (
type="button" // <button
disabled={requestStatus.loading} // type="button"
onClick={assignFamilyTask} // disabled={requestStatus.loading}
className="px-1 w-40 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white cursor-pointer" // onClick={assignFamilyTask}
> // className="px-1 w-40 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white cursor-pointer"
{details // >
? `Assign task to ${details?.firstname}` // {details
: familyDetailsData // ? `Assign task to ${details?.firstname}`
? `Assign task to ${familyDetailsData.firstname}` // : familyDetailsData
: "Assign"} // ? `Assign task to ${familyDetailsData.firstname}`
</button> // : "Assign"}
)} // </button>
// )
}
</div> </div>
</div> </div>
</div> </div>
@@ -56,7 +56,7 @@ export default function NewTasks({ formState, setFormState }) {
<div className="field w-full mb-6 xl:mb-0"> <div className="field w-full mb-6 xl:mb-0">
<label <label
htmlFor="country" htmlFor="country"
className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold flex item-center gap-1" className="job-label"
> >
Currency Currency
{/* {props.errors.country && props.touched.country && <span className="text-[12px] text-red-500">{props.errors.country}</span>} */} {/* {props.errors.country && props.touched.country && <span className="text-[12px] text-red-500">{props.errors.country}</span>} */}
@@ -98,10 +98,11 @@ export default function NewTasks({ formState, setFormState }) {
{/* Price */} {/* Price */}
<div className="field w-full"> <div className="field w-full">
<label htmlFor="price" className="job-label">Price</label>
<InputCom <InputCom
fieldClass="px-6 text-right" fieldClass="px-6 text-right"
label="Price" // label="Price"
labelClass="tracking-wide" // labelClass="tracking-wide"
inputBg="bg-slate-100" inputBg="bg-slate-100"
type="number" type="number"
name="price" name="price"
@@ -117,7 +118,7 @@ export default function NewTasks({ formState, setFormState }) {
<div className="field w-full mb-6 xl:mb-0"> <div className="field w-full mb-6 xl:mb-0">
<label <label
htmlFor="timeline_days" htmlFor="timeline_days"
className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold flex item-center gap-1" className="job-label"
> >
Timeline Timeline
{/* {props.errors.country && props.touched.country && <span className="text-[12px] text-red-500">{props.errors.country}</span>} */} {/* {props.errors.country && props.touched.country && <span className="text-[12px] text-red-500">{props.errors.country}</span>} */}
@@ -151,10 +152,11 @@ export default function NewTasks({ formState, setFormState }) {
{/* Title */} {/* Title */}
<div className="field w-full mb-[5px]"> <div className="field w-full mb-[5px]">
<label htmlFor="title" className="job-label">Title</label>
<InputCom <InputCom
fieldClass="px-6" fieldClass="px-6"
label="Title" // label="Title"
labelClass="tracking-wide" // labelClass="tracking-wide"
inputBg="bg-slate-100" inputBg="bg-slate-100"
type="text" type="text"
name="title" name="title"
@@ -167,10 +169,11 @@ export default function NewTasks({ formState, setFormState }) {
{/* Description */} {/* Description */}
<div className="field w-full mb-[5px]"> <div className="field w-full mb-[5px]">
<label htmlFor="description" className="job-label">Description</label>
<InputCom <InputCom
fieldClass="px-6" fieldClass="px-6"
label="Description" // label="Description"
labelClass="tracking-wide" // labelClass="tracking-wide"
inputBg="bg-slate-100" inputBg="bg-slate-100"
type="text" type="text"
name="description" name="description"
@@ -186,7 +189,7 @@ export default function NewTasks({ formState, setFormState }) {
<div className="w-full"> <div className="w-full">
<label <label
htmlFor="Job Delivery Details" htmlFor="Job Delivery Details"
className='className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold flex items-center gap-1' className='job-label'
> >
Job Delivery Details Job Delivery Details
{/* {props.errors.job_detail && props.touched.job_detail && <span className="text-[12px] text-red-500">{props.errors.job_detail}</span>} */} {/* {props.errors.job_detail && props.touched.job_detail && <span className="text-[12px] text-red-500">{props.errors.job_detail}</span>} */}
@@ -5,7 +5,7 @@ import LoadingSpinner from "../../Spinners/LoadingSpinner";
import AssignTaskPopout from "../FamilyPopout/AssignTaskPopout"; import AssignTaskPopout from "../FamilyPopout/AssignTaskPopout";
const FamilyWaitlist = memo( const FamilyWaitlist = memo(
({ familyData, className, accountDetails, loader }) => { ({ familyData, className, accountDetails, loader, setUpdatePage }) => {
const [popUp, setPopUp] = useState({ show: false, data: {} }); const [popUp, setPopUp] = useState({ show: false, data: {} });
const [continueTaskPopup, setContinueTaskPopup] = useState({ const [continueTaskPopup, setContinueTaskPopup] = useState({
show: false, show: false,
@@ -144,6 +144,7 @@ const FamilyWaitlist = memo(
details={continueTaskPopup.data} details={continueTaskPopup.data}
action={closeContinueTaskPopup} action={closeContinueTaskPopup}
situation={continueTaskPopup.show} situation={continueTaskPopup.show}
setUpdatePage={setUpdatePage}
/> />
)} )}
</div> </div>
@@ -3,7 +3,7 @@ import React from 'react'
function Detail({label, value, bg,}) { function Detail({label, value, bg,}) {
return ( return (
<> <>
<label className='w-full md:w-1/4 text-slate-900 dark:text-white tracking-wide font-semibold'>{label}</label> <label className='job-label w-full md:w-1/4'>{label}</label>
<p className={`p-1 w-full md:w-3/4 text-sm text-slate-900 dark:text-white ${bg ? bg : null}`}>{value}</p> <p className={`p-1 w-full md:w-3/4 text-sm text-slate-900 dark:text-white ${bg ? bg : null}`}>{value}</p>
</> </>
) )
+6
View File
@@ -152,6 +152,12 @@
--toastify-color-success: #f539f8; --toastify-color-success: #f539f8;
} }
@layer components{
.job-label{
@apply text-slate-900 dark:text-white tracking-wide font-semibold
}
}
/* ===================== EXTRA ===================== */ /* ===================== EXTRA ===================== */
.bottomMargin { .bottomMargin {
margin-bottom: 15px; margin-bottom: 15px;