Merge branch 'Recent-Activities' of WrenchBoard/Users-Wrench into master

This commit is contained in:
2023-10-02 13:07:50 +00:00
committed by Gogs
7 changed files with 112 additions and 93 deletions
@@ -90,7 +90,7 @@ export default function FamilyTasks({
<h1 className="font-bold text-xl text-dark-gray dark:text-white">
{value.title}
</h1>
<div className="flex gap-4 items-center">
<div className="flex flex-col sm:flex-row items-start gap-1 md:gap-4 md:items-center">
<span className="text-sm text-thin-light-gray flex flex-start gap-1">
Price:{" "}
<span className="text-purple">
+25 -12
View File
@@ -10,24 +10,25 @@ import ActiveJobMessage from "./ActiveJobMessage";
import IndexJobActions from "./JobActions/IndexJobActions";
import usersService from "../../services/UsersService";
import { PriceFormatter } from "../Helpers/PriceFormatter";
function ActiveJobs(props) {
const ApiCall = new usersService();
let navigate = useNavigate();
const navigate = useNavigate();
let { userDetails } = useSelector((state) => state.userDetails);
const { userDetails } = useSelector((state) => state.userDetails);
let [passDue, setPassDue] = useState(
const [passDue, setPassDue] = useState(
new Date() > new Date(props.details?.delivery_date)
); // STATE TO KNOW IF TASK IS PASSED DUE TIME
let [messageToSend, setMessageToSend] = useState(""); // State to hold the value of message to be sent
const [messageToSend, setMessageToSend] = useState(""); // State to hold the value of message to be sent
let [filesToSend, setFilesToSend] = useState([]); // State to hold the value of files to be sent
const [filesToSend, setFilesToSend] = useState([]); // State to hold the value of files to be sent
let [tab, setTab] = useState("message");
const [tab, setTab] = useState("message");
let [requestStatus, setRequestStatus] = useState({
const [requestStatus, setRequestStatus] = useState({
loading: false,
status: false,
message: "",
@@ -248,7 +249,11 @@ function ActiveJobs(props) {
}
}, [passDue]);
console.log("AC JOBS >>", props);
let thePrice = PriceFormatter(
props.details?.price * 0.01,
props.details?.currency_code,
props.details?.currency
);
return (
<Layout>
@@ -311,10 +316,11 @@ function ActiveJobs(props) {
<span className="font-semibold">Due: </span>
{props?.details && props.details.delivery_date.split(" ")[0]}
</p>
<p className="py-2 text-base text-slate-700">
{props?.delivery_date &&
props.details.delivery_date.split(" ")[1]}
</p>
{props?.delivery_date && (
<p className="py-2 text-base text-slate-700">
{props.details.delivery_date.split(" ")[1]}
</p>
)}
</div>
) : (
<div className="my-1 flex items-start gap-3">
@@ -334,6 +340,13 @@ function ActiveJobs(props) {
</div>
)}
<div className="my-1 text-base text-slate-700 tracking-wide flex items-center gap-3">
<span className="font-semibold text-black dark:text-white">
Price:{" "}
</span>
<span className="">{thePrice}</span>
</div>
<div className="my-1 text-base text-slate-700 tracking-wide flex items-center gap-3">
<span className="font-semibold text-black dark:text-white">
Duration:{" "}
@@ -1,10 +1,9 @@
import React, { useState } from "react";
import { useLocation, useNavigate } from "react-router-dom";
import dataImage2 from "../../assets/images/data-table-user-2.png";
import localImgLoad from "../../lib/localImgLoad";
import { PriceFormatter } from "../Helpers/PriceFormatter";
import { handlePagingFunc } from "../Pagination/HandlePagination";
import PaginatedList from "../Pagination/PaginatedList";
import { PriceFormatter } from "../Helpers/PriceFormatter";
import localImgLoad from "../../lib/localImgLoad";
export default function MyActiveJobTable({ MyJobList, className }) {
const navigate = useNavigate();
@@ -25,7 +24,7 @@ export default function MyActiveJobTable({ MyJobList, className }) {
return (
<div
className={`update-table w-full p-8 bg-white dark:bg-dark-white overflow-hidden rounded-2xl section-shadow min-h-[520px] ${
className={`update-table w-full p-3 sm:p-8 bg-white dark:bg-dark-white overflow-hidden rounded-2xl section-shadow min-h-[520px] ${
className || ""
}`}
>
@@ -33,11 +32,6 @@ export default function MyActiveJobTable({ MyJobList, className }) {
<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>*/}
{
<>
{MyJobList &&
@@ -59,7 +53,9 @@ export default function MyActiveJobTable({ MyJobList, className }) {
<div className="flex space-x-2 items-center w-full">
<div className="w-[60px] h-[60px] p-2 bg-alice-blue rounded-full overflow-hidden flex justify-center items-center">
<img
src={localImgLoad(`images/taskbanners/${value.banner}`)}
src={localImgLoad(
`images/taskbanners/${value.banner}`
)}
alt="data"
className="w-full h-full rounded-full"
/>
@@ -75,7 +71,7 @@ export default function MyActiveJobTable({ MyJobList, className }) {
{thePrice}
</span>
</span>
<div className="flex gap-4 items-center">
<div className="flex flex-col sm:flex-row items-start gap-1 md:gap-4 md:items-center">
<span className="text-sm text-thin-light-gray">
Duration:{" "}
<span className="text-purple">
@@ -115,7 +111,9 @@ export default function MyActiveJobTable({ MyJobList, className }) {
}}
className="px-4 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
>
{value.owner_status == 'OWNER' ? 'Manage' : 'Send Updates'}
{value.owner_status == "OWNER"
? "Manage"
: "Send Updates"}
</button>
</div>
</td>
+28 -31
View File
@@ -1,42 +1,39 @@
import React, { useState } from "react";
import { Link } from "react-router-dom";
import Layout from "../Partials/Layout";
import CommonHead from "../UserHeader/CommonHead";
import MyActiveJobTable from "./MyActiveJobTable";
export default function MyReviewDueJobs(props) {
const [selectTab, setValue] = useState("today");
const filterHandler = (value) => {
setValue(value);
};
return (
<Layout>
<CommonHead
commonHeadData={props.commonHeadData}
/>
<div className="notification-page w-full mb-10">
<div className="notification-wrapper w-full">
{/* heading */}
<div className="sm:flex justify-between items-center mb-6">
<div className="mb-5 sm:mb-0">
<h1 className="text-26 font-bold text-dark-gray dark:text-white">
const [selectTab, setValue] = useState("today");
const filterHandler = (value) => {
setValue(value);
};
return (
<Layout>
<CommonHead commonHeadData={props.commonHeadData} />
<div className="notification-page w-full mb-10">
<div className="notification-wrapper w-full">
{/* heading */}
<div className="sm:flex justify-between items-center mb-6">
<div className="mb-5 sm:mb-0">
<h1 className="text-26 font-bold text-dark-gray dark:text-white">
<span
className={`${selectTab === "today" ? "block" : "hidden"}`}
className={`${selectTab === "today" ? "block" : "hidden"}`}
>
Review Due Job(s)
Review Due Job(s)
</span>
</h1>
</div>
<div className="slider-btns flex space-x-4">
<div
onClick={() => filterHandler("today")}
className="relative"
></div>
</div>
</div>
<MyActiveJobTable MyJobList={props.MyJobList} />
</div>
</h1>
</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>
);
}
+1 -1
View File
@@ -96,7 +96,7 @@ export default function MyJobTable({ className, ActiveJobList, Account }) {
Price:
<span className="text-purple ml-1">{thePrice}</span>
</span>
<div className="flex gap-4 items-center">
<div className="flex flex-col sm:flex-row items-start gap-1 md:gap-4 md:items-center">
<span className="text-sm text-thin-light-gray">
Duration:
<span className="text-purple ml-1">
+16 -10
View File
@@ -1,31 +1,37 @@
import React, { useState, useEffect } from "react";
import ActiveJobs from "../components/MyActiveJobs/ActiveJobs";
import React, { useEffect, useState } from "react";
import { useLocation, useNavigate } from "react-router-dom";
import ActiveJobs from "../components/MyActiveJobs/ActiveJobs";
import usersService from "../services/UsersService";
/**
* This code defines a React functional component called `ManageActiveJobs`.
* It fetches a list of active job messages and renders the `ActiveJobs` component with the necessary props.
*/
function ManageActiveJobs() {
const ApiCall = new usersService();
let navigate = useNavigate();
let { state } = useLocation();
const navigate = useNavigate();
const { state } = useLocation();
let [details, setDetails] = useState({}); // to hold state values
const [details, setDetails] = useState({});
let [activeJobMesList, setActiveJobMesList] = useState({
const [activeJobMesList, setActiveJobMesList] = useState({
loading: true,
error: false,
data: [],
});
let [activeJobMesListReload, setActiveJobMesListReload] = useState(false); // state to determine when ACTIVE JOB MESSAGE LIST RELOADS/RE-RENDERS
const [activeJobMesListReload, setActiveJobMesListReload] = useState(false);
/**
* Fetches the active job message list.
*/
const getActiveJobMesList = () => {
// FUNCTION TO GET ACTIVE JOB MESSAGE LIST
setActiveJobMesList({ loading: true, error: false, data: [] });
let contract = { contract: state.contract };
const contract = { contract: state.contract };
ApiCall.activeJobMesList(contract)
.then((res) => {
if (res.status != 200 || res.data.internal_return < 0) {
if (res.status !== 200 || res.data.internal_return < 0) {
setActiveJobMesList({ loading: false, error: false, data: [] });
return;
}
+31 -26
View File
@@ -1,31 +1,36 @@
import React, { useContext,useState, useEffect } from "react";
import usersService from "../services/UsersService";
import MyReviewDueJobs from "../components/MyActiveJobs/MyReviewDueJobs";
import React, { useEffect, useState } from "react";
import { useSelector } from "react-redux";
import MyReviewDueJobs from "../components/MyActiveJobs/MyReviewDueJobs";
import usersService from "../services/UsersService";
/**
* React component that fetches a list of review due jobs and renders the `MyReviewDueJobs` component with the fetched data.
*/
export default function MyReviewDueJobsPage() {
let {commonHeadBanner} = useSelector(state => state.commonHeadBanner)
const [MyJobList, setMyJobList] = useState([]);
const api = new usersService();
const getMyJobList = async () => {
try {
const res = await api.getMyReviewDueJobList();
setMyJobList(res.data);
} catch (error) {
console.log("Error getting mode");
}
};
useEffect(() => {
getMyJobList();
}, []);
const { commonHeadBanner } = useSelector((state) => state.commonHeadBanner);
const [myJobList, setMyJobList] = useState([]);
// debugger;
return (
<>
<MyReviewDueJobs
MyJobList={MyJobList}
commonHeadData={commonHeadBanner.result_list}
/>
</>
);
useEffect(() => {
const api = new usersService();
const getMyJobList = async () => {
try {
const res = await api.getMyReviewDueJobList();
setMyJobList(res.data);
} catch (error) {
console.log("Error getting mode");
}
};
getMyJobList();
}, []);
return (
<>
<MyReviewDueJobs
myJobList={myJobList}
commonHeadData={commonHeadBanner.result_list}
/>
</>
);
}