Merge branch 'master' of https://gitlab.chiefsoft.net/WrenchBoard/Users-Wrench into enable-and-active-jobs

This commit is contained in:
Ebube
2023-05-25 08:49:01 +01:00
4 changed files with 55 additions and 44 deletions
+34 -21
View File
@@ -1,4 +1,4 @@
import React, { useState } from "react"; import React, { useEffect, useState } from "react";
import { Link, useNavigate } from "react-router-dom"; import { Link, useNavigate } from "react-router-dom";
import linkedInLogo from "../../../assets/images/Linkedin.png"; import linkedInLogo from "../../../assets/images/Linkedin.png";
import appleLogo from "../../../assets/images/apple-black.svg"; import appleLogo from "../../../assets/images/apple-black.svg";
@@ -17,7 +17,7 @@ import { updateUserDetails } from "../../../store/UserDetails";
export default function Login() { export default function Login() {
const dispatch = useDispatch(); const dispatch = useDispatch();
let [loginCom, setLoginCom] = useState({ user: true, family: false }); let [loginType, setLoginType] = useState({ full: true, family: false });
const [checked, setValue] = useState(false); const [checked, setValue] = useState(false);
const [loginLoading, setLoginLoading] = useState(false); const [loginLoading, setLoginLoading] = useState(false);
@@ -32,11 +32,11 @@ export default function Login() {
}; };
//FUNCTION TO DETERMINE/CHANGE LOGIN COMPONENT //FUNCTION TO DETERMINE/CHANGE LOGIN COMPONENT
const handleLoginCom = ({ target: { name } }) => { const handleLoginType = ({ target: { name } }) => {
if (name == "user") { if (name == "full") {
setLoginCom({ [name]: true, family: false }); setLoginType({ [name]: true, family: false });
} else { } else if(name='family') {
setLoginCom({ [name]: false, family: true }); setLoginType({ [name]: false, family: true });
} }
}; };
@@ -56,8 +56,9 @@ export default function Login() {
// FUNCTION TO HANDLE USER LOGIN // FUNCTION TO HANDLE USER LOGIN
const doLogin = ({ target: { name } }) => { const doLogin = ({ target: { name } }) => {
setMsgError(""); setMsgError("");
setLoginError(false)
setLoginLoading(true); setLoginLoading(true);
let postData = {}; // Post Data for API let postData; // Post Data for API
if (!email || !password) { if (!email || !password) {
setLoginLoading(false); setLoginLoading(false);
setMsgError("Please fill all the fields"); setMsgError("Please fill all the fields");
@@ -67,14 +68,15 @@ export default function Login() {
return; return;
} }
if (name == "userlogin") { // Post Data Info for normal Login if (name == "loginfull") { // Post Data Info for normal Login
postData = { postData = {
username: email, username: email,
password: password, password: password,
sessionid: "STARTING", sessionid: "STARTING",
login_mode: 1100,
action: 11025, action: 11025,
}; };
} else if (name == "familylogin") { // Post Data Info for family Login } else if (name == "loginfamily") { // Post Data Info for family Login
postData = { postData = {
username: email, username: email,
pin: password, pin: password,
@@ -82,8 +84,14 @@ export default function Login() {
login_mode: 1105, login_mode: 1105,
action: 11025, action: 11025,
}; };
}else{
setLoginLoading(false);
setMsgError("Invalid Login Type. Consider refreshing the page");
setTimeout(() => {
setMsgError("");
}, Number(process.env.REACT_APP_LOGIN_ERROR_TIMEOUT));
return;
} }
userApi.logInUser(postData).then((res) => { userApi.logInUser(postData).then((res) => {
if (res.status != 200 || res.data.internal_return < 0) { if (res.status != 200 || res.data.internal_return < 0) {
// setMsgError("Wrong, email/password"); // setMsgError("Wrong, email/password");
@@ -112,6 +120,11 @@ export default function Login() {
}); });
}; };
useEffect(()=>{
setMail('')
setPassword('')
},[loginType.full, loginType.family])
return ( return (
<> <>
<AuthLayout slogan="Welcome to WrenchBoard"> <AuthLayout slogan="Welcome to WrenchBoard">
@@ -145,20 +158,20 @@ export default function Login() {
{/* switch login component */} {/* switch login component */}
<div className="flex justify-start items-end"> <div className="flex justify-start items-end">
<button <button
name="user" name="full"
className={`px-2 py-1 w-[100px] text-left h-[40px] text-lg font-bold text-[#4687ba] hover:text-[#009ef7] tracking-wide transition outline-none border-2 border-b-0 border-r-0 border-[#4687ba] ${ className={`px-2 py-1 w-[100px] text-left h-[40px] text-lg font-bold text-[#4687ba] hover:text-[#009ef7] tracking-wide transition outline-none border-2 border-b-0 border-r-0 border-[#4687ba] ${
loginCom.user && "border-r-2 h-[45px]" loginType.full && "border-r-2 h-[45px]"
}`} }`}
onClick={handleLoginCom} onClick={handleLoginType}
> >
Sign in Sign in
</button> </button>
<button <button
name="family" name="family"
className={`px-2 py-1 w-[100px] text-left h-[40px] text-lg font-bold text-[#4687ba] hover:text-[#009ef7] tracking-wide transition outline-none border-2 border-b-0 border-l-0 border-[#4687ba] ${ className={`px-2 py-1 w-[100px] text-left h-[40px] text-lg font-bold text-[#4687ba] hover:text-[#009ef7] tracking-wide transition outline-none border-2 border-b-0 border-l-0 border-[#4687ba] ${
loginCom.family && "border-l-2 h-[45px]" loginType.family && "border-l-2 h-[45px]"
}`} }`}
onClick={handleLoginCom} onClick={handleLoginType}
> >
Family Family
</button> </button>
@@ -168,7 +181,7 @@ export default function Login() {
{/* for login component */} {/* for login component */}
{ {
loginCom.user ? ( loginType.full ? (
//user login compoenent //user login compoenent
<div className="p-2 input-area border-2 border-[#4687ba]"> <div className="p-2 input-area border-2 border-[#4687ba]">
<div className="input-item mb-5"> <div className="input-item mb-5">
@@ -219,7 +232,7 @@ export default function Login() {
<div className="signin-area mb-3.5"> <div className="signin-area mb-3.5">
<div className="flex justify-center"> <div className="flex justify-center">
<button <button
name="userlogin" name="loginfull"
onClick={doLogin} onClick={doLogin}
type="button" type="button"
disabled={loginLoading} disabled={loginLoading}
@@ -228,7 +241,7 @@ export default function Login() {
{loginLoading ? ( {loginLoading ? (
<div className="signup btn-loader"></div> <div className="signup btn-loader"></div>
) : ( ) : (
<span>Continue</span> <>Continue</>
)} )}
</button> </button>
</div> </div>
@@ -302,7 +315,7 @@ export default function Login() {
<div className="signin-area mb-1.5"> <div className="signin-area mb-1.5">
<div className="flex justify-center"> <div className="flex justify-center">
<button <button
name="familylogin" name="loginfamily"
onClick={doLogin} onClick={doLogin}
disabled={loginLoading} disabled={loginLoading}
type="button" type="button"
@@ -311,7 +324,7 @@ export default function Login() {
{loginLoading ? ( {loginLoading ? (
<div className="signup btn-loader"></div> <div className="signup btn-loader"></div>
) : ( ) : (
<span>Continue</span> <>Continue</>
)} )}
</button> </button>
</div> </div>
+1 -1
View File
@@ -47,7 +47,7 @@ export default function FamilyActiveLSlde({ className, trending }) {
<div> <div>
<h1 className="text-26 font-bold text-dark-gray dark:text-white">Current Tasks</h1> <h1 className="text-26 font-bold text-dark-gray dark:text-white">Current Tasks</h1>
</div> </div>
<div className="slider-btns flex space-x-4"> <div className="slider-btns flex space-x-3">
<button onClick={nextHandler} type="button"> <button onClick={nextHandler} type="button">
<div className="trending-slider-left-btn relative text-white w-10 h-10 flex justify-center items-center rounded-full overflow-hidden"> <div className="trending-slider-left-btn relative text-white w-10 h-10 flex justify-center items-center rounded-full overflow-hidden">
<svg <svg
+3 -13
View File
@@ -1,14 +1,6 @@
import React from "react"; import React from "react";
import datas from "../../data/product_data.json"; import datas from "../../data/product_data.json";
import Layout from "../Partials/Layout"; import Layout from "../Partials/Layout";
import CreateNft from "./CreateNft";
import Hero from "./Hero";
import SellHistoryMarketVisitorAnalytic from "./SellHistoryMarketVisitorAnalytic";
import TopSellerTopBuyerSliderSection from "./TopSellerTopBuyerSliderSection";
import TrendingSection from "./TrendingSection";
import UpdateTable from "./UpdateTable";
import HomeTaskDisplay from "./HomeTaskDisplay";
import UsersService from "../../services/UsersService";
import usersService from "../../services/UsersService"; import usersService from "../../services/UsersService";
import { useSelector } from "react-redux"; import { useSelector } from "react-redux";
import FamilyDash from "./FamilyDash"; import FamilyDash from "./FamilyDash";
@@ -19,12 +11,10 @@ export default function Home(props) {
console.log("PROPS IN HOME->",props); console.log("PROPS IN HOME->",props);
const trending = datas.datas; // const trending = datas.datas;
const jobData = datas.datas; // api calls or cache // const jobData = datas.datas; // api calls or cache
//getHomeDate
const userApi = new usersService(); const userApi = new usersService();
const homeData = userApi.getHomeDate(); // const homeData = userApi.getHomeDate();
const {userDetails} = useSelector((state) => state?.userDetails) const {userDetails} = useSelector((state) => state?.userDetails)
const commonHeadData =()=>{ const commonHeadData =()=>{
+17 -9
View File
@@ -10,7 +10,7 @@ function Balance({wallet, coupon}) {
<div className="content-wrapper"> <div className="content-wrapper">
<div className='w-full lg:flex xl:space-x-8 lg:space-x-4 bottomMargin'> <div className='w-full lg:flex xl:space-x-8 lg:space-x-4 bottomMargin'>
{/* WALLET SECTION */} {/* WALLET SECTION */}
<div className="lg:w-1/2 w-full mb-10 lg:mb-0"> <div className="lg:w-3/4 w-full mb-10 lg:mb-0">
<div className="wallet w-full md:p-8 p-4 h-full bg-white dark:bg-dark-white rounded-2xl shadow"> <div className="wallet w-full md:p-8 p-4 h-full bg-white dark:bg-dark-white rounded-2xl shadow">
<div className='flex items-baseline justify-between'> <div className='flex items-baseline justify-between'>
<h2 className='text-slate-900 dark:text-white text-xl lg:text-2xl font-medium'>Wallet</h2> <h2 className='text-slate-900 dark:text-white text-xl lg:text-2xl font-medium'>Wallet</h2>
@@ -42,9 +42,11 @@ function Balance({wallet, coupon}) {
<div className='w-full my-2 md:my-0 md:w-1/2 flex space-x-2 items-center justify-start md:justify-end'> <div className='w-full my-2 md:my-0 md:w-1/2 flex space-x-2 items-center justify-start md:justify-end'>
{ {
item.action_type != 'AC_AD_FD_ONLY' ? item.action_type != 'AC_AD_FD_ONLY' ?
<Link to='transfer-fund' className='text-base text-white px-3 py-1 bg-purple rounded-md hover:opacity-80'>Transfer</Link>:'' <Link to='transfer-fund' className='lg:flex hidden user-balance cursor-pointer lg:w-[152px] w-[150px] h-[48px]
items-center rounded-full relative bg-purple pr-1.5 pl-4'>Transfer</Link>:''
} }
<Link to='add-fund' className='text-base text-white px-3 py-1 bg-[orange] rounded-md hover:opacity-80'>Top Up</Link> <Link to='add-fund' className='lg:flex hidden user-balance cursor-pointer lg:w-[152px] w-[150px] h-[48px]
items-center rounded-full relative bg-purple pr-1.5 pl-4'>+Add Credit</Link>
</div> </div>
</div> </div>
)) ))
@@ -68,19 +70,25 @@ function Balance({wallet, coupon}) {
{/* END OF WALLET SECTION */} {/* END OF WALLET SECTION */}
</div>
<div className='w-full lg:flex xl:space-x-8 lg:space-x-4 bottomMargin'>
{/* COUPON SECTION */} {/* COUPON SECTION */}
<div className="lg:w-1/2 w-full mb-10 lg:mb-0"> <div className="lg:w-3/4 w-full mb-10 lg:mb-0">
<div className="wallet w-full md:p-8 p-4 h-full max-h-[500px] bg-white dark:bg-dark-white overflow-y-auto rounded-2xl shadow"> <div className="wallet w-full md:p-8 p-4 h-full max-h-[500px] bg-white dark:bg-dark-white overflow-y-auto rounded-2xl shadow">
<h2 className='text-slate-900 dark:text-white text-xl lg:text-2xl font-medium'>Coupons</h2> <h2 className='text-slate-900 dark:text-white text-xl lg:text-2xl font-medium'>Coupons</h2>
{coupon.loading ? {coupon.loading ?
<LoadingSpinner size='16' color='sky-blue' /> <LoadingSpinner size='16' color='sky-blue' />
: :
<CouponTable coupon={coupon} /> <CouponTable coupon={coupon} />
} }
</div> </div>
</div> </div>
{/* END OF COUPON SECTION */} {/* END OF COUPON SECTION */}
</div>
</div>
</div> </div>
) )
} }