Compare commits

...

7 Commits

8 changed files with 54 additions and 55 deletions
@@ -5,13 +5,15 @@ import OfferJobPopout from '../../components/jobPopout/OfferJobPopout'
import { PriceFormatter } from "../Helpers/PriceFormatter"; import { PriceFormatter } from "../Helpers/PriceFormatter";
import CountDown from '../Helpers/CountDown' import CountDown from '../Helpers/CountDown'
const AccountDashboard = ({ className, bannerList, offersList }) => { const AccountDashboard = ({ className, bannerList, offersList, imageServer }) => {
let [offerPopout, setOfferPopout] = useState({ show: false, data: {} }); // STATE TO HOLD THE VALUE OF THE ALERT DETAILS AND DETERMINE WHEN TO SHOW let [offerPopout, setOfferPopout] = useState({ show: false, data: {} }); // STATE TO HOLD THE VALUE OF THE ALERT DETAILS AND DETERMINE WHEN TO SHOW
let offersListLength = offersList?.length
// getting the upper three banners for the home layout // getting the upper three banners for the home layout
const getUpperBanner = bannerList?.filter((value, idx) => idx <= 2); const getUpperBanner = bannerList?.filter((value, idx) => idx <= 2 - offersListLength);
const getLowerBanner = bannerList?.filter((value, idx) => idx > 2); const getLowerBanner = bannerList?.filter((value, idx) => !getUpperBanner?.map(item => item?.title)?.includes(value.title));
let getImage = ({ banner_location, banner }) => { let getImage = ({ banner_location, banner }) => {
if (banner_location == "LOCAL") { if (banner_location == "LOCAL") {
@@ -33,15 +35,15 @@ const AccountDashboard = ({ className, bannerList, offersList }) => {
{/* OFFER LIST DISPLAY */} {/* OFFER LIST DISPLAY */}
<> <>
{(offersList && offersList?.result_list?.length > 0) && {(offersList && offersList?.length > 0) &&
offersList.result_list.map((item, index) => { offersList.map((item, index) => {
let thePrice = PriceFormatter( let thePrice = PriceFormatter(
item?.price * 0.01, item?.price * 0.01,
item?.currency_code, item?.currency_code,
item?.currency item?.currency
); );
let image = `${offersList.session_image_server}${localStorage.getItem("session_token")}/job/${item.job_uid}` let image = `${imageServer}${localStorage.getItem("session_token")}/job/${item.job_uid}`
return ( return (
<div key={item.id}> <div key={item.id}>
<NewOfferCard datas={item} image={image} price={thePrice} setOfferPopout={setOfferPopout} /> <NewOfferCard datas={item} image={image} price={thePrice} setOfferPopout={setOfferPopout} />
@@ -147,7 +149,7 @@ const TopBanner = ({ image, title = "", desc = "", btn, link_path, key }) => {
const NewOfferCard = ({ datas, hidden = false, price, setOfferPopout, image }) => { const NewOfferCard = ({ datas, hidden = false, price, setOfferPopout, image }) => {
return ( return (
<div className="flex flex-col shadow-md bg-red-50 rounded-xl dark:border-[#5356fb29] overflow-hidden"> <div className="flex flex-col shadow-md bg-red-50 dark:bg-dark-white rounded-xl dark:border-[#5356fb29] overflow-hidden">
<div className="h-[12rem] bg-transparent"> <div className="h-[12rem] bg-transparent">
{/* thumbnail image/video */} {/* thumbnail image/video */}
{datas.job_type == "MEDIA" ? {datas.job_type == "MEDIA" ?
@@ -5,7 +5,6 @@ import { useSelector } from "react-redux";
export default function FamilyParentDashboard({ export default function FamilyParentDashboard({
className, className,
bannerList, bannerList,
nextDueTask,
}) { }) {
const { userDetails } = useSelector((state) => state?.userDetails); const { userDetails } = useSelector((state) => state?.userDetails);
+1 -1
View File
@@ -2,7 +2,7 @@ import React from "react";
// import HomeSliders from "./HomeSliders"; // import HomeSliders from "./HomeSliders";
import { useSelector } from "react-redux"; import { useSelector } from "react-redux";
export default function HomeDashboard({ className, bannerList, nextDueTask }) { export default function HomeDashboard({ className, bannerList }) {
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];
@@ -5,7 +5,6 @@ import { useSelector } from "react-redux";
export default function JobOwnerDashboard({ export default function JobOwnerDashboard({
className, className,
bannerList, bannerList,
nextDueTask,
}) { }) {
const { userDetails } = useSelector((state) => state?.userDetails); const { userDetails } = useSelector((state) => state?.userDetails);
@@ -5,7 +5,6 @@ import { useSelector } from "react-redux";
export default function WorkerDashboard({ export default function WorkerDashboard({
className, className,
bannerList, bannerList,
nextDueTask,
}) { }) {
const { userDetails } = useSelector((state) => state?.userDetails); const { userDetails } = useSelector((state) => state?.userDetails);
+11 -12
View File
@@ -22,7 +22,6 @@ export default function FullAccountDash(props) {
className="mb-4" className="mb-4"
data={userDetails} data={userDetails}
bannerList={props.bannerList} bannerList={props.bannerList}
nextDueTask={props.nextDueTask}
/> />
); );
case "FAMILY_PARENT_DASH": case "FAMILY_PARENT_DASH":
@@ -31,7 +30,6 @@ export default function FullAccountDash(props) {
className="mb-4" className="mb-4"
data={userDetails} data={userDetails}
bannerList={props.bannerList} bannerList={props.bannerList}
nextDueTask={props.nextDueTask}
/> />
); );
case "WORKER_HOME_DASH": case "WORKER_HOME_DASH":
@@ -40,7 +38,6 @@ export default function FullAccountDash(props) {
className="mb-4" className="mb-4"
data={userDetails} data={userDetails}
bannerList={props.bannerList} bannerList={props.bannerList}
nextDueTask={props.nextDueTask}
/> />
); );
case "JOBOWNER_HOME_DASH": case "JOBOWNER_HOME_DASH":
@@ -49,7 +46,6 @@ export default function FullAccountDash(props) {
className="mb-4" className="mb-4"
data={userDetails} data={userDetails}
bannerList={props.bannerList} bannerList={props.bannerList}
nextDueTask={props.nextDueTask}
/> />
); );
default: default:
@@ -62,16 +58,19 @@ export default function FullAccountDash(props) {
<div className="home-page-wrapper"> <div className="home-page-wrapper">
{renderDashboard()} {renderDashboard()}
{process.env.REACT_APP_SHOW_ACCOUNT_DASH == "1" && ( {process.env.REACT_APP_SHOW_ACCOUNT_DASH == "1" && (
<AccountDashboard className="mb-4" bannerList={props.bannerList} offersList={props.offersList?.data} /> <AccountDashboard className="mb-4" bannerList={props.bannerList} offersList={props.offersList} imageServer={props.imageServer} />
)} )}
{props?.dashTypes !== "undefined" && {
props.offersList?.data?.result_list?.length ? ( // props?.dashTypes !== "undefined" &&
<MyOffersTable // props.offersList?.data?.result_list?.length ? (
MyActiveOffersList={props.offersList?.data} // <MyOffersTable
className="mb-10" // MyActiveOffersList={props.offersList?.data}
/> // className="mb-10"
) : props.MyActiveJobList?.data?.length ? ( // />
// )
// :
props.MyActiveJobList?.data?.length ? (
<> <>
<div className="w-full mb-5 flex justify-between items-center gap-1"> <div className="w-full mb-5 flex justify-between items-center gap-1">
<h1 className="text-26 font-bold text-dark-gray dark:text-white"> <h1 className="text-26 font-bold text-dark-gray dark:text-white">
+31 -32
View File
@@ -5,19 +5,16 @@ import usersService from "../../services/UsersService";
import { useSelector } from "react-redux"; import { useSelector } from "react-redux";
import FamilyDash from "./FamilyDash"; import FamilyDash from "./FamilyDash";
import FullAccountDash from "./FullAccountDash"; import FullAccountDash from "./FullAccountDash";
import LoadingSpinner from '../../components/Spinners/LoadingSpinner'
export default function Home(props) { export default function Home(props) {
// console.log("PROPS IN HOME->", props); // console.log("PROPS IN HOME->", props);
const userApi = new usersService(); const userApi = new usersService();
const { commonHeadBanner } = useSelector((state) => state.commonHeadBanner); const { commonHeadBanner } = useSelector((state) => state.commonHeadBanner);
let [nextDueTask, setNextDueTask] = useState({});
const [MyOffersList, setMyOffersList] = useState({loading: true, data: []});
const { userDetails } = useSelector((state) => state?.userDetails); const { userDetails } = useSelector((state) => state?.userDetails);
const [MyActiveJobList, setMyActiveJobList] = useState({loading:true, data:[]}); // STATE TO HOLD ACTIVE/CURRENT TASKS const [MyActiveJobList, setMyActiveJobList] = useState({loading:true, data:[]}); // STATE TO HOLD ACTIVE/CURRENT TASKS
// const [MyActiveJobList, setMyActiveJobList] = useState([]); // STATE TO HOLD ACTIVE/CURRENT TASKS
const getMyActiveJobList = async () => { // FUNCTION TO POPULATE ACTIVE/CURRENT TASK LIST const getMyActiveJobList = async () => { // FUNCTION TO POPULATE ACTIVE/CURRENT TASK LIST
try { try {
@@ -32,41 +29,41 @@ export default function Home(props) {
}; };
// FUNCTION TO GET DASH DATA TO DETERMINE CURRENT TASK DUE TIME // FUNCTION TO GET DASH DATA TO DETERMINE CURRENT TASK DUE TIME
const getHomeDate = () => { // const getHomeDate = () => {
userApi // userApi
.getHomeDate() // .getHomeDate()
.then((res) => { // .then((res) => {
if (res.status != 200 || res.internal_return < 0) { // if (res.status != 200 || res.internal_return < 0) {
return; // return;
} // }
setNextDueTask(res.data); // setNextDueTask(res.data);
}) // })
.catch((error) => { // .catch((error) => {
console.log(error); // console.log(error);
}); // });
}; // };
const getMyOffersList = async () => { // const getMyOffersList = async () => {
try { // try {
const res = await userApi.getOffersList(); // const res = await userApi.getOffersList();
setMyOffersList({loading:false, data:res.data}); // setMyOffersList({loading:false, data:res.data});
} catch (error) { // } catch (error) {
setMyOffersList({loading:false, data:[]}); // setMyOffersList({loading:false, data:[]});
console.log("Error getting offers", error); // console.log("Error getting offers", error);
} // }
}; // };
useEffect(() => { useEffect(() => {
const fetchData = async () => {
await Promise.all([getHomeDate(), getMyOffersList(), getMyActiveJobList()]);
};
if(userDetails?.account_type == 'FULL'){ if(userDetails?.account_type == 'FULL'){
fetchData(); getMyActiveJobList();
} }
}, []); }, []);
return ( return (
<Layout> <Layout>
{Object.keys(commonHeadBanner).length < 1 ?
<LoadingSpinner height='h-48' size='16' />
:
<div className="w-full"> <div className="w-full">
{userDetails && userDetails?.account_type == "FAMILY" ? ( {userDetails && userDetails?.account_type == "FAMILY" ? (
<FamilyDash <FamilyDash
@@ -78,11 +75,12 @@ export default function Home(props) {
/> />
) : userDetails && userDetails?.account_type == "FULL" ? ( ) : userDetails && userDetails?.account_type == "FULL" ? (
<FullAccountDash <FullAccountDash
nextDueTask={nextDueTask}
bannerList={props.bannerList} bannerList={props.bannerList}
dashTypes={props.dashTypes} dashTypes={props.dashTypes}
offersList={MyOffersList} // offersList={MyOffersList}
MyActiveJobList={MyActiveJobList} MyActiveJobList={MyActiveJobList}
offersList={props.offersList}
imageServer={props.imageServer}
/> />
) : ( ) : (
<div> <div>
@@ -90,6 +88,7 @@ export default function Home(props) {
</div> </div>
)} )}
</div> </div>
}
</Layout> </Layout>
); );
} }
+2
View File
@@ -7,6 +7,8 @@ export default function HomePages() {
const bannerOptions = { const bannerOptions = {
bannerList: commonHeadBanner?.result_list, bannerList: commonHeadBanner?.result_list,
dashTypes: commonHeadBanner?.home_dash_type, dashTypes: commonHeadBanner?.home_dash_type,
offersList: commonHeadBanner?.offers_list,
imageServer: commonHeadBanner?.session_image_server
}; };
return ( return (