Compare commits

..

1 Commits

Author SHA1 Message Date
victorAnumudu 10189a89c4 repositioned offer list display 2024-09-24 21:10:16 +01:00
8 changed files with 54 additions and 53 deletions
@@ -5,15 +5,13 @@ 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, imageServer }) => { const AccountDashboard = ({ className, bannerList, offersList }) => {
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 - offersListLength); const getUpperBanner = bannerList?.filter((value, idx) => idx <= 2);
const getLowerBanner = bannerList?.filter((value, idx) => !getUpperBanner?.map(item => item?.title)?.includes(value.title)); const getLowerBanner = bannerList?.filter((value, idx) => idx > 2);
let getImage = ({ banner_location, banner }) => { let getImage = ({ banner_location, banner }) => {
if (banner_location == "LOCAL") { if (banner_location == "LOCAL") {
@@ -35,15 +33,15 @@ const AccountDashboard = ({ className, bannerList, offersList, imageServer }) =>
{/* OFFER LIST DISPLAY */} {/* OFFER LIST DISPLAY */}
<> <>
{(offersList && offersList?.length > 0) && {(offersList && offersList?.result_list?.length > 0) &&
offersList.map((item, index) => { offersList.result_list.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 = `${imageServer}${localStorage.getItem("session_token")}/job/${item.job_uid}` let image = `${offersList.session_image_server}${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} />
@@ -5,6 +5,7 @@ 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 }) { export default function HomeDashboard({ className, bannerList, nextDueTask }) {
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,6 +5,7 @@ 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,6 +5,7 @@ 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);
+12 -11
View File
@@ -22,6 +22,7 @@ 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":
@@ -30,6 +31,7 @@ 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":
@@ -38,6 +40,7 @@ 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":
@@ -46,6 +49,7 @@ 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:
@@ -58,19 +62,16 @@ 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} imageServer={props.imageServer} /> <AccountDashboard className="mb-4" bannerList={props.bannerList} offersList={props.offersList?.data} />
)} )}
{ {props?.dashTypes !== "undefined" &&
// props?.dashTypes !== "undefined" && props.offersList?.data?.result_list?.length ? (
// props.offersList?.data?.result_list?.length ? ( <MyOffersTable
// <MyOffersTable MyActiveOffersList={props.offersList?.data}
// MyActiveOffersList={props.offersList?.data} className="mb-10"
// 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">
+32 -31
View File
@@ -5,16 +5,19 @@ 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 {
@@ -29,41 +32,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'){
getMyActiveJobList(); fetchData();
} }
}, []); }, []);
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
@@ -75,12 +78,11 @@ 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>
@@ -88,7 +90,6 @@ export default function Home(props) {
</div> </div>
)} )}
</div> </div>
}
</Layout> </Layout>
); );
} }
-2
View File
@@ -7,8 +7,6 @@ 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 (