Compare commits
7 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 0440b36f24 | |||
| de56fb601a | |||
| f286960bed | |||
| a8a090c671 | |||
| 24e2a905d2 | |||
| 19c2500263 | |||
| 909c74b734 |
@@ -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);
|
||||||
|
|
||||||
|
|||||||
@@ -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);
|
||||||
|
|
||||||
|
|||||||
@@ -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">
|
||||||
|
|||||||
@@ -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>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -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 (
|
||||||
|
|||||||
Reference in New Issue
Block a user