Compare commits
15 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 victorAnumudu
|
5dad00096a | ||
|
CHIEFSOFT\ameye
|
72da5c707a | ||
 tolik
|
625928e34b | ||
|
tolik
|
6fd92600b4 | ||
|
tolik
|
133f500849 | ||
|
tolik
|
b1f1b34924 | ||
 ameye
|
e80c3528db | ||
|
Ebube
|
3eb6960cc7 | ||
|
Ebube
|
eb01e35c75 | ||
|
ameye
|
0cc70d66b3 | ||
|
victorAnumudu
|
7111e81f11 | ||
|
CHIEFSOFT\ameye
|
1c64771dcd | ||
|
CHIEFSOFT\ameye
|
ac1a4f895a | ||
|
CHIEFSOFT\ameye
|
22f5bd01d2 | ||
|
ameye
|
467528835a |
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" id="identificationcard"><path fill="#4687ba" d="M0 6v13c0 1.103.897 2 2 2h20c1.103 0 2-.897 2-2V6" class="color2d98d4 svgShape"></path><path fill="#ff6699" d="M22 3H2a2 2 0 0 0-2 2v2h24V5a2 2 0 0 0-2-2z" class="color0377be svgShape"></path><path fill="#e6e7f9" d="M22 3H2C.897 3 0 3.897 0 5v.25c0-1.103.897-2 2-2h20c1.103 0 2 .897 2 2V5c0-1.103-.897-2-2-2z" opacity=".2" class="colorffffff svgShape"></path><path fill="#4687ba" d="M22 20.75H2c-1.103 0-2-.897-2-2V19c0 1.103.897 2 2 2h20c1.103 0 2-.897 2-2v-.25c0 1.103-.897 2-2 2z" opacity=".1" class="color010101 svgShape"></path><path fill="#e6e7f9" d="M13 17h8v1h-8zM13 14h8v1h-8zM13 11h8v1h-8z" class="colorffffff svgShape"></path><circle cx="7" cy="12" r="2" fill="#e6e7f9" class="colorffffff svgShape"></circle><path fill="#e6e7f9" d="M9.987 15.237C9.288 14.9 8.203 14.5 7 14.5s-2.288.4-2.987.737c-.625.3-1.013.9-1.013 1.566V18h8v-1.197c0-.665-.388-1.265-1.013-1.566z" class="colorffffff svgShape"></path><circle cx="17" cy="5" r="1" fill="#ff6699" class="color0a70b9 svgShape"></circle><path fill="#4687ba" d="M17 4.25a.99.99 0 0 1 .975.875C17.98 5.082 18 5.045 18 5a1 1 0 0 0-2 0c0 .044.02.082.025.125A.99.99 0 0 1 17 4.25z" opacity=".1" class="color010101 svgShape"></path><linearGradient id="a" x1="6.973" x2="21.55" y1="1.973" y2="16.55" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#010101" stop-opacity=".1" class="stopColor010101 svgShape"></stop><stop offset="1" stop-color="#010101" stop-opacity="0" class="stopColor010101 svgShape"></stop></linearGradient><path fill="url(#a)" d="M22 21c1.103 0 2-.897 2-2V7H0l14 14h8z"></path><circle cx="7" cy="5" r="1" fill="#ff6699" class="color0a70b9 svgShape"></circle><path fill="#4687ba" d="M7 4.25a.99.99 0 0 1 .975.875C7.98 5.082 8 5.045 8 5a1 1 0 0 0-2 0c0 .044.02.082.025.125A.99.99 0 0 1 7 4.25z" opacity=".1" class="color010101 svgShape"></path><linearGradient id="b" x1="-.708" x2="24.708" y1="6.074" y2="17.925" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ffffff" stop-opacity=".2" class="stopColorffffff svgShape"></stop><stop offset="1" stop-color="#ffffff" stop-opacity="0" class="stopColorffffff svgShape"></stop></linearGradient><path fill="url(#b)" d="M22 3H2a2 2 0 0 0-2 2v14c0 1.103.897 2 2 2h20c1.103 0 2-.897 2-2V5a2 2 0 0 0-2-2z"></path></svg>
|
||||
|
After Width: | Height: | Size: 2.3 KiB |
@@ -0,0 +1,3 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 128 128" viewBox="0 0 128 128" id="Pin"><path fill="#4687ba" d="M106,13.8L91.7,4.6C86.2,1,78.9,2,74.5,7L41.9,46.9c-9.1,0.4-17.9,3.3-25.4,8.7c-0.7,0.5-0.7,1.6,0.1,2.1
|
||||
l10.2,6.6l0,0L46.4,77l-24,41.4c-1.2,2.1-0.7,4.9,1.4,6.3c2.2,1.6,5.2,1.1,6.7-1.1l28-38.8L78,97.5l0,0l10.2,6.6
|
||||
c0.7,0.5,1.7,0.1,1.9-0.8c1.8-9,0.9-18.3-2.5-26.8l23.1-46C113.6,24.5,111.5,17.4,106,13.8z" class="color2d3e50 svgShape"></path></svg>
|
||||
|
After Width: | Height: | Size: 482 B |
@@ -1,9 +1,11 @@
|
||||
import React, {useState, useEffect} from 'react'
|
||||
import { useLocation, useNavigate } from 'react-router-dom'
|
||||
import React, { useEffect } from 'react';
|
||||
import { useLocation, useNavigate } from 'react-router-dom';
|
||||
import usersService from '../../../services/UsersService';
|
||||
|
||||
function Redirect() {
|
||||
const location = useLocation();
|
||||
const navigate = useNavigate();
|
||||
const userApi = new usersService();
|
||||
|
||||
const queryParams = new URLSearchParams(location?.search);
|
||||
const codeResponse = queryParams.get("code");
|
||||
@@ -13,11 +15,40 @@ function Redirect() {
|
||||
navigate('/login', {replace: true})
|
||||
return
|
||||
}
|
||||
console.log(codeResponse)
|
||||
console.log(codeResponse);
|
||||
/*
|
||||
POST /token HTTP/1.1
|
||||
Host: oauth2.googleapis.com
|
||||
Content-Type: application/x-www-form-urlencoded
|
||||
|
||||
code=4/P7q7W91a-oMsCeLvIaQm6bTrgtp7&
|
||||
client_id=your_client_id&
|
||||
client_secret=your_client_secret&
|
||||
redirect_uri=https%3A//oauth2.example.com/code&
|
||||
grant_type=authorization_code
|
||||
*/
|
||||
var reqData = {
|
||||
auth_type: "GOOGLE",
|
||||
code: codeResponse,
|
||||
redirect_uri: process.env.REACT_APP_GOOGLE_REDIRECT_URL,
|
||||
};
|
||||
userApi
|
||||
.authStart(reqData)
|
||||
.then((res) => {
|
||||
console.log(res.data);
|
||||
if (res.status != 200 || res.internal_return < 0) {
|
||||
return;
|
||||
}
|
||||
// "{"message":"Endpoint not found.","URI":"http:\/\/localhost:9083\/index.php\/en\/wrench\/api\/v1\/authstart"}[]"
|
||||
alert(JSON.stringify(res.data));
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
});
|
||||
},[])
|
||||
return (
|
||||
<div>Redirecting ... </div>
|
||||
)
|
||||
}
|
||||
|
||||
export default Redirect
|
||||
export default Redirect
|
||||
|
||||
@@ -22,6 +22,8 @@ export default function Login() {
|
||||
const [checked, setValue] = useState(false);
|
||||
const [loginLoading, setLoginLoading] = useState(false);
|
||||
|
||||
const [showPassword, setShowPassword] = useState(false);
|
||||
|
||||
//login error state
|
||||
const [loginError, setLoginError] = useState(false);
|
||||
// for the catch error
|
||||
@@ -31,6 +33,11 @@ export default function Login() {
|
||||
setValue(!checked);
|
||||
};
|
||||
|
||||
// To Show and Hide Password
|
||||
const togglePasswordVisibility = () => {
|
||||
setShowPassword(!showPassword);
|
||||
};
|
||||
|
||||
//FUNCTION TO DETERMINE/CHANGE LOGIN COMPONENT
|
||||
const handleLoginType = ({ target: { name } }) => {
|
||||
setLoginType(name);
|
||||
@@ -189,7 +196,7 @@ export default function Login() {
|
||||
/>
|
||||
</Link>
|
||||
</div>
|
||||
<div className="content-wrapper login shadow-md w-full lg:max-w-[500px] mx-auto flex justify-center items-center xl:bg-white dark:bg-dark-white 2xl:w-[828px] rounded-[0.475rem] sm:p-7 p-5">
|
||||
<div className="content-wrapper login shadow-md w-full lg:max-w-[530px] mx-auto flex justify-center items-center xl:bg-white dark:bg-dark-white 2xl:w-[828px] rounded-[0.475rem] sm:p-7 p-5">
|
||||
<div className="w-full">
|
||||
<div className="title-area flex flex-col justify-center items-center relative text-center mb-7">
|
||||
{/* <h1 className="text-[#181c32] font-semibold dark:text-white mb-3 leading-[27.3px] text-[22.75px]">
|
||||
@@ -211,7 +218,7 @@ export default function Login() {
|
||||
<button
|
||||
name="full"
|
||||
className={`login-type-btn px-4 py-1 rounded-t-2xl ${
|
||||
loginType=='full' ? "bg-white text-[#000] border-t-[2px]" : "bg-[#4687ba] border-[2px] border-[#4687ba] text-white"
|
||||
loginType=='full' ? "bg-[#4687ba] border-[2px] border-[#4687ba] text-white" : "bg-white text-[#000] border-t-[2px]"
|
||||
}`}
|
||||
onClick={handleLoginType}
|
||||
>
|
||||
@@ -220,7 +227,7 @@ export default function Login() {
|
||||
<button
|
||||
name="family"
|
||||
className={`login-type-btn px-4 py-1 rounded-t-2xl ${
|
||||
loginType=='family' ? "bg-white text-[#000] border-t-[2px]" : "bg-[#4687ba] border-[2px] border-[#4687ba] text-white"
|
||||
loginType=='family' ? "bg-[#4687ba] border-[2px] border-[#4687ba] text-white" : "bg-white text-[#000] border-t-[2px]"
|
||||
}`}
|
||||
onClick={handleLoginType}
|
||||
>
|
||||
@@ -234,7 +241,7 @@ export default function Login() {
|
||||
{
|
||||
loginType == 'full' ? (
|
||||
//user login component
|
||||
<div className="p-2 input-area login-area border-2 border-[#4687ba] rounded-2xl">
|
||||
<div className="p-6 input-area login-area border-2 border-[#4687ba] rounded-2xl">
|
||||
<div className="input-item mb-5">
|
||||
<InputCom
|
||||
labelClass="tracking-wider"
|
||||
@@ -258,8 +265,9 @@ export default function Login() {
|
||||
placeholder="● ● ● ● ● ●"
|
||||
label="Password"
|
||||
name="password"
|
||||
type="password"
|
||||
iconName="password"
|
||||
type={showPassword ? "text" : "password"}
|
||||
onClick={togglePasswordVisibility}
|
||||
passIcon={showPassword ? "password" : "password"}
|
||||
forgotPassword
|
||||
/>
|
||||
</div>
|
||||
@@ -322,7 +330,7 @@ export default function Login() {
|
||||
) : (
|
||||
// END of user login compoenent
|
||||
// family login compoenent
|
||||
<div className="p-2 input-area login-area border-2 border-[#4687ba] rounded-2xl">
|
||||
<div className="p-6 input-area login-area border-2 border-[#4687ba] rounded-2xl">
|
||||
<div className="input-item mb-5">
|
||||
<InputCom
|
||||
labelClass="tracking-wider"
|
||||
@@ -333,7 +341,7 @@ export default function Login() {
|
||||
label="Username"
|
||||
name="email"
|
||||
type="email"
|
||||
iconName="message"
|
||||
iconName="family-id"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -346,9 +354,9 @@ export default function Login() {
|
||||
placeholder="● ● ● ● ● ●"
|
||||
label="Pin"
|
||||
name="password"
|
||||
type="password"
|
||||
iconName="password"
|
||||
// forgotPassword
|
||||
type={showPassword ? "text" : "password"}
|
||||
onClick={togglePasswordVisibility}
|
||||
passIcon={showPassword ? "family-pin" : "family-pin"}
|
||||
/>
|
||||
</div>
|
||||
{loginError && (
|
||||
|
||||
@@ -72,6 +72,12 @@ export default function SignUp() {
|
||||
return setTimeout(()=>{setMsgError("");},3000)
|
||||
}
|
||||
|
||||
//checks if terms and condition is checked
|
||||
if (!checked) {
|
||||
setMsgError("Terms and condition required");
|
||||
return setTimeout(()=>{setMsgError("");},3000)
|
||||
}
|
||||
|
||||
setSignUpLoading(true);
|
||||
const reqData = {
|
||||
country: country,
|
||||
@@ -89,7 +95,7 @@ export default function SignUp() {
|
||||
if (res.status === 200) {
|
||||
const { data } = res;
|
||||
if (data && data.acc === "DULPICATE") {
|
||||
setMsgError("This account has been already created");
|
||||
setMsgError("Unable to use this username. Please try another username.");
|
||||
setSignUpLoading(false);
|
||||
}
|
||||
if (data && data.status === "1") {
|
||||
@@ -131,7 +137,7 @@ export default function SignUp() {
|
||||
/>
|
||||
</Link>
|
||||
</div>
|
||||
<div className="content-wrapper login shadow-md w-full lg:max-w-[500px] mx-auto flex justify-center items-center xl:bg-white dark:bg-dark-white 2xl:w-[828px] rounded-[0.475rem] sm:p-7 p-5 mb-0">
|
||||
<div className="content-wrapper login relative shadow-md w-full lg:max-w-[530px] mx-auto flex justify-center items-center xl:bg-white dark:bg-dark-white 2xl:w-[828px] rounded-[0.475rem] sm:p-7 p-5 mb-0">
|
||||
<div>
|
||||
<div className="title-area flex flex-col justify-center items-center relative text-center mb-7">
|
||||
<h1 className="text-[#181c32] font-semibold dark:text-white mb-3 leading-[27.3px] text-[22.75px]">
|
||||
@@ -213,7 +219,7 @@ export default function SignUp() {
|
||||
/>
|
||||
</div>
|
||||
{msgError && (
|
||||
<div className="relative p-4 text-[#912741] bg-[#fcd9e2] border-[#fbc6d3] mb-4 rounded-[0.475rem] text-md font-light leading-[19.5px]">
|
||||
<div className="p-4 text-[#912741] bg-[#fcd9e2] border-[#fbc6d3] mb-4 rounded-[0.475rem] text-md font-light leading-[19.5px]">
|
||||
{msgError}
|
||||
</div>
|
||||
)}
|
||||
@@ -298,7 +304,7 @@ const SelectOption = ({
|
||||
<select
|
||||
name={name}
|
||||
id={name}
|
||||
className="input-wrapper border border-[#f5f8fa]] dark:border-[#5e6278] w-full rounded-[0.475rem] h-[42px] overflow-hidden relative font-medium leading-6 bg-clip-padding text-[#5e6278] dark:text-gray-100 bg-[#f5f8fa] dark:bg-[#5e6278] text-base focus-visible:border-transparent focus-visible:outline-0 focus-visible:ring-transparent "
|
||||
className="input-wrapper border border-[#f5f8fa] dark:border-[#5e6278] w-full rounded-full h-[42px] overflow-hidden relative font-medium leading-6 bg-clip-padding text-[#5e6278] dark:text-gray-100 bg-[#f5f8fa] dark:bg-[#5e6278] text-base focus-visible:border-transparent focus-visible:outline-0 focus-visible:ring-transparent "
|
||||
onChange={inputHandler}
|
||||
value={value}
|
||||
>
|
||||
|
||||
@@ -86,10 +86,14 @@ export default function VerifyLink() {
|
||||
const verifyRes = await userApi.verifyEmail(code);
|
||||
if (verifyRes.status === 200) {
|
||||
let { data } = verifyRes;
|
||||
|
||||
console.log('TESTING VERIFY',data)
|
||||
if (
|
||||
data &&
|
||||
data.internal_return >= 0 &&
|
||||
data.internal_return >= 0 &&
|
||||
data.status == 0 &&
|
||||
data.pending_id != '' &&
|
||||
data.pending_uid != '' &&
|
||||
data.username != '' &&
|
||||
data.status_text === "Link Verified"
|
||||
) {
|
||||
setPageLoader(false);
|
||||
|
||||
@@ -6,7 +6,7 @@ import LoadingSpinner from "../../Spinners/LoadingSpinner";
|
||||
import { PriceFormatter } from "../../Helpers/PriceFormatter";
|
||||
import { NewTasks } from "./forms";
|
||||
|
||||
function AssignTaskPopout({ action, situation, familyDetails }) {
|
||||
function AssignTaskPopout({ action, details, situation, familyDetails }) {
|
||||
const apiCall = new usersService();
|
||||
|
||||
let [requestStatus, setRequestStatus] = useState({
|
||||
@@ -17,7 +17,7 @@ function AssignTaskPopout({ action, situation, familyDetails }) {
|
||||
|
||||
let [familyTask, setFamilyTask] = useState({ loading: true, data: [] });
|
||||
|
||||
let [taskType, setTaskType] = useState("select"); // SWITCHES BTW SELECT TASK AND NEW TASK
|
||||
let [taskType, setTaskType] = useState(details ? "new" : "select"); // SWITCHES BTW SELECT TASK AND NEW TASK
|
||||
|
||||
let [activeTask, setActiveTask] = useState({ id: 0, data: {} }); // HOLDS SELECTED TASK
|
||||
|
||||
@@ -34,14 +34,14 @@ function AssignTaskPopout({ action, situation, familyDetails }) {
|
||||
// New Task
|
||||
const [formState, setFormState] = useState({
|
||||
// Initialize form state with desired fields
|
||||
banner: "" || "default.jpg",
|
||||
country: "" || "",
|
||||
price: "" || "",
|
||||
title: "" || "",
|
||||
description: "" || "",
|
||||
job_detail: "" || "",
|
||||
timeline_days: "" || "",
|
||||
category: [] || "",
|
||||
banner: details?.banner || "default.jpg",
|
||||
country: details?.country || "",
|
||||
price: details?.price || "",
|
||||
title: details?.title || "",
|
||||
description: details?.description || "",
|
||||
job_detail: details?.job_detail || "",
|
||||
timeline_days: details?.timeline_days || "",
|
||||
category: details?.category || "",
|
||||
});
|
||||
|
||||
const assignFamilyTask = () => {
|
||||
@@ -81,30 +81,29 @@ function AssignTaskPopout({ action, situation, familyDetails }) {
|
||||
title,
|
||||
} = formState;
|
||||
|
||||
const requiredFields = [
|
||||
const requiredFields = {
|
||||
banner,
|
||||
category,
|
||||
// category,
|
||||
country,
|
||||
description,
|
||||
job_detail,
|
||||
price,
|
||||
timeline_days,
|
||||
title,
|
||||
];
|
||||
};
|
||||
|
||||
if (requiredFields.some((field) => !field)) {
|
||||
const emptyField = requiredFields.find((field) => !field);
|
||||
setRequestStatus({
|
||||
loading: false,
|
||||
status: false,
|
||||
message: `${emptyField} Empty`,
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
setRequestStatus({ loading: false, status: false, message: "" });
|
||||
}, 3000);
|
||||
|
||||
return;
|
||||
for (let field in requiredFields) {
|
||||
if (requiredFields[field] == "") {
|
||||
// let currencyErrMsg = field == "country" && "currency"
|
||||
setRequestStatus({
|
||||
loading: false,
|
||||
status: false,
|
||||
message: `${field} is empty`,
|
||||
});
|
||||
return setTimeout(() => {
|
||||
setRequestStatus({ loading: false, status: false, message: "" });
|
||||
}, 3000);
|
||||
}
|
||||
}
|
||||
|
||||
reqData = {
|
||||
@@ -117,7 +116,7 @@ function AssignTaskPopout({ action, situation, familyDetails }) {
|
||||
timeline_days,
|
||||
title,
|
||||
assign_mode: 110055,
|
||||
family_uid: familyDetails.uid,
|
||||
family_uid: details?.family_uid || familyDetails?.uid,
|
||||
};
|
||||
}
|
||||
|
||||
@@ -180,14 +179,17 @@ function AssignTaskPopout({ action, situation, familyDetails }) {
|
||||
});
|
||||
}, []);
|
||||
|
||||
console.log("Trying to see form data >>", formState);
|
||||
return (
|
||||
<>
|
||||
<ModalCom action={action} situation={situation} className="assign-task-popup">
|
||||
<ModalCom
|
||||
action={action}
|
||||
situation={situation}
|
||||
className="assign-task-popup"
|
||||
>
|
||||
<div className="w-full h-full lg:w-[700px] lg:h-auto bg-white dark:bg-dark-white lg:rounded-2xl">
|
||||
<div className="w-full flex items-center justify-between lg:px-10 lg:py-8 px-[30px] py-[23px] border-b dark:border-[#5356fb29] border-light-purple">
|
||||
<h1 className="text-26 font-bold text-dark-gray dark:text-white tracking-wide">
|
||||
Assign task to {familyDetails?.firstname}
|
||||
Assign task to {familyDetails?.firstname || details.firstName}
|
||||
</h1>
|
||||
<button
|
||||
type="button"
|
||||
@@ -362,55 +364,62 @@ function AssignTaskPopout({ action, situation, familyDetails }) {
|
||||
</div>
|
||||
|
||||
{/* BTN */}
|
||||
<div className="p-2 border-t-2 flex justify-end items-center gap-3">
|
||||
<div className="py-2 px-4 border-t-2 flex justify-between items-center">
|
||||
{/* error or success display */}
|
||||
{requestStatus.message != "" &&
|
||||
(!requestStatus.status ? (
|
||||
<div
|
||||
className={`relative p-2 text-[#912741] bg-[#fcd9e2] border-[#fbc6d3] mb-4 rounded-[0.475rem] text-md font-light leading-[19.5px] text-[13px]`}
|
||||
>
|
||||
{requestStatus.message}
|
||||
</div>
|
||||
) : (
|
||||
requestStatus.status && (
|
||||
<div className="w-auto h-auto flex items-center">
|
||||
{requestStatus.message != "" &&
|
||||
(!requestStatus.status ? (
|
||||
<div
|
||||
className={`relative p-2 text-green-700 bg-slate-200 border-slate-800 mb-4 rounded-[0.475rem] text-md font-light leading-[19.5px] text-[13px]`}
|
||||
className={`relative p-2 text-[#912741] bg-[#fcd9e2] border-[#fbc6d3] rounded-[0.475rem] text-md font-light leading-[19.5px] text-[13px] self-start`}
|
||||
>
|
||||
{requestStatus.message}
|
||||
</div>
|
||||
)
|
||||
))}
|
||||
) : (
|
||||
requestStatus.status && (
|
||||
<div
|
||||
className={`relative p-2 text-green-700 bg-slate-200 border-slate-800 mb-4 rounded-[0.475rem] text-md font-light leading-[19.5px] text-[13px]`}
|
||||
>
|
||||
{requestStatus.message}
|
||||
</div>
|
||||
)
|
||||
))}
|
||||
</div>
|
||||
|
||||
{/* End of error or success display */}
|
||||
<button
|
||||
disabled={requestStatus.loading}
|
||||
onClick={action}
|
||||
type="button"
|
||||
className="w-20 h-11 flex justify-center items-center border-gradient text-base rounded-full text-white cursor-pointer"
|
||||
>
|
||||
<span className="text-gradient">Close</span>
|
||||
</button>
|
||||
<div className="">
|
||||
{requestStatus.loading ? (
|
||||
<LoadingSpinner color="sky-blue" size="8" />
|
||||
) : taskType == "select" ? (
|
||||
<button
|
||||
type="button"
|
||||
disabled={requestStatus.loading}
|
||||
onClick={assignFamilyTask}
|
||||
className="px-1 w-20 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white cursor-pointer"
|
||||
>
|
||||
Assign
|
||||
</button>
|
||||
) : (
|
||||
<button
|
||||
type="button"
|
||||
disabled={requestStatus.loading}
|
||||
onClick={assignFamilyTask}
|
||||
className="px-1 w-40 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white cursor-pointer"
|
||||
>
|
||||
{`Assign to ${familyDetails?.firstname}`}
|
||||
</button>
|
||||
)}
|
||||
<div className="w-auto h-auto flex items-center gap-3">
|
||||
<button
|
||||
disabled={requestStatus.loading}
|
||||
onClick={action}
|
||||
type="button"
|
||||
className="w-20 h-11 flex justify-center items-center border-gradient text-base rounded-full text-white cursor-pointer"
|
||||
>
|
||||
<span className="text-gradient">Close</span>
|
||||
</button>
|
||||
<div className="">
|
||||
{requestStatus.loading ? (
|
||||
<LoadingSpinner color="sky-blue" size="8" />
|
||||
) : taskType == "select" ? (
|
||||
<button
|
||||
type="button"
|
||||
disabled={requestStatus.loading}
|
||||
onClick={assignFamilyTask}
|
||||
className="px-1 w-20 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white cursor-pointer"
|
||||
>
|
||||
Assign
|
||||
</button>
|
||||
) : (
|
||||
<button
|
||||
type="button"
|
||||
disabled={requestStatus.loading}
|
||||
onClick={assignFamilyTask}
|
||||
className="px-1 w-40 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white cursor-pointer"
|
||||
>
|
||||
{`Assign to ${
|
||||
familyDetails?.firstname || details?.firstName
|
||||
}`}
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
|
||||
@@ -1,9 +1,8 @@
|
||||
import React, { useEffect, useState } from "react";
|
||||
import usersService from "../../../../services/UsersService";
|
||||
import InputCom from "../../../Helpers/Inputs/InputCom";
|
||||
import debounce from "../../../../hooks/debounce";
|
||||
|
||||
const DEFAULT_IMAGE = require("../../../../assets/images/taskbanners/default.jpg");
|
||||
// const DEFAULT_IMAGE =
|
||||
export default function NewTasks({ formState, setFormState }) {
|
||||
let [currency, setCurrency] = useState({
|
||||
loading: true,
|
||||
@@ -11,6 +10,9 @@ export default function NewTasks({ formState, setFormState }) {
|
||||
data: null,
|
||||
});
|
||||
|
||||
const selectImage = require(`../../../../assets/images/taskbanners/${
|
||||
formState.banner || "default.jpg"
|
||||
}`);
|
||||
const ApiCall = new usersService();
|
||||
|
||||
// FUNCTION TO GET Currency
|
||||
@@ -47,7 +49,7 @@ export default function NewTasks({ formState, setFormState }) {
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<form className="w-full flex justify-between items-center">
|
||||
<form className="w-full flex justify-between items-start">
|
||||
<div className="flex flex-col gap-3 max-w-[77%]">
|
||||
{/* inputs starts here */}
|
||||
<div className="grid md:grid-cols-3 grid-cols-1 gap-6 mb-[5px]">
|
||||
@@ -207,7 +209,7 @@ export default function NewTasks({ formState, setFormState }) {
|
||||
<div className="max-w-[20%] w-full">
|
||||
<div className="h-32 w-full">
|
||||
<img
|
||||
src={DEFAULT_IMAGE}
|
||||
src={selectImage}
|
||||
alt="task_banner_img"
|
||||
className="w-full h-full object-contain"
|
||||
/>
|
||||
|
||||
@@ -2,9 +2,14 @@ import { useState } from "react";
|
||||
import { handlePagingFunc, PaginatedList } from "../../Pagination";
|
||||
import LoadingSpinner from "../../Spinners/LoadingSpinner";
|
||||
import SuggestTask from "../../FamilyPopup/SuggestTask";
|
||||
import AssignTaskPopout from "../FamilyPopout/AssignTaskPopout";
|
||||
|
||||
const FamilyWaitlist = ({ familyData, className, accountDetails, loader }) => {
|
||||
const [popUp, setPopUp] = useState({ show: false, data: {} });
|
||||
const [continueTaskPopup, setContinueTaskPopup] = useState({
|
||||
show: false,
|
||||
data: {},
|
||||
});
|
||||
|
||||
let filteredFamilyData = familyData?.result_list?.filter(
|
||||
(data) => data?.family_uid === accountDetails?.family_uid
|
||||
@@ -112,9 +117,23 @@ const FamilyWaitlist = ({ familyData, className, accountDetails, loader }) => {
|
||||
onClose={() => {
|
||||
setPopUp({ show: false, data: {} });
|
||||
}}
|
||||
continuePopupData={(value) =>
|
||||
setContinueTaskPopup({ show: true, data: { ...value } })
|
||||
}
|
||||
situation={popUp.show}
|
||||
/>
|
||||
)}
|
||||
|
||||
{/* Continue Task */}
|
||||
{continueTaskPopup.show && (
|
||||
<AssignTaskPopout
|
||||
details={continueTaskPopup.data}
|
||||
action={() => {
|
||||
setContinueTaskPopup({ show: false, data: {} });
|
||||
}}
|
||||
situation={continueTaskPopup.show}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -7,7 +7,7 @@ import usersService from "../../services/UsersService";
|
||||
import Icons from "../Helpers/Icons";
|
||||
|
||||
const DEFAULT_IMAGE = require("../../assets/images/family/default.jpg");
|
||||
const SuggestTask = ({ details, onClose, situation }) => {
|
||||
const SuggestTask = ({ details, onClose, situation, continuePopupData }) => {
|
||||
const { pathname, state } = useLocation();
|
||||
const [submitTask, setSubmitTask] = useState({
|
||||
loading: false,
|
||||
@@ -16,7 +16,7 @@ const SuggestTask = ({ details, onClose, situation }) => {
|
||||
});
|
||||
const [suggestedNextStep, setSuggestedNextStep] = useState("Send Task");
|
||||
|
||||
const switchNextStep = (value) => {
|
||||
const switchNextStep = ({ target: value }) => {
|
||||
setSuggestedNextStep(value);
|
||||
};
|
||||
|
||||
@@ -29,7 +29,7 @@ const SuggestTask = ({ details, onClose, situation }) => {
|
||||
|
||||
const apiCall = new usersService();
|
||||
|
||||
const handleSubmit = async (values) => {
|
||||
const handleSuggestedTask = async (values) => {
|
||||
if (!values.title && !values.description) return;
|
||||
try {
|
||||
setSubmitTask({ loading: true });
|
||||
@@ -49,7 +49,15 @@ const SuggestTask = ({ details, onClose, situation }) => {
|
||||
}
|
||||
};
|
||||
|
||||
// console.log("state >-->>", state);
|
||||
const handleParentSuggestion = (values) => {
|
||||
if (suggestedNextStep == "Send Task") {
|
||||
let firstName = state?.firstname;
|
||||
let family_uid = state?.family_uid;
|
||||
continuePopupData({ ...details, firstName, family_uid });
|
||||
}
|
||||
onClose();
|
||||
};
|
||||
|
||||
return (
|
||||
<ModalCom action={onClose} situation={situation}>
|
||||
<div className="logout-modal-wrapper lw-[90%] md:w-[768px] h-full lg:h-auto bg-white dark:bg-dark-white lg:rounded-2xl overflow-y-auto">
|
||||
@@ -87,7 +95,11 @@ const SuggestTask = ({ details, onClose, situation }) => {
|
||||
</div>
|
||||
<Formik
|
||||
initialValues={initialValues}
|
||||
onSubmit={pathname !== "/manage-family" && handleSubmit}
|
||||
onSubmit={
|
||||
pathname !== "/manage-family"
|
||||
? handleSuggestedTask
|
||||
: handleParentSuggestion
|
||||
}
|
||||
>
|
||||
{(props) => {
|
||||
return (
|
||||
@@ -164,7 +176,7 @@ const SuggestTask = ({ details, onClose, situation }) => {
|
||||
</div>
|
||||
|
||||
{/* Radio buttons for family */}
|
||||
{pathname === "/manage-family" && (
|
||||
{pathname === "/manage-family" ? (
|
||||
<div className="h-[20px] w-full border-t dark:border-[#5356fb29] border-light-purple relative">
|
||||
<div id="my-radio-group" className="sr-only">
|
||||
Parent suggested next step
|
||||
@@ -182,18 +194,21 @@ const SuggestTask = ({ details, onClose, situation }) => {
|
||||
<label
|
||||
role="group"
|
||||
key={idx}
|
||||
htmlFor="parent-suggested"
|
||||
htmlFor={`parent-suggested-${idx}`}
|
||||
className={`transition duration-150 ease-in-out parent-suggest`}
|
||||
>
|
||||
<input
|
||||
type="radio"
|
||||
name="parent-suggested"
|
||||
value={title}
|
||||
checked={title == suggestedNextStep}
|
||||
checked={suggestedNextStep === title}
|
||||
onChange={switchNextStep}
|
||||
className={`transition duration-150 ease-in-out parent-suggest`}
|
||||
/>
|
||||
<span
|
||||
onClick={switchNextStep}
|
||||
onClick={() => setSuggestedNextStep(title)}
|
||||
id={`parent-suggested-${idx}`}
|
||||
name="parent-suggested"
|
||||
className={`ml-1 ${
|
||||
title == "Not Now"
|
||||
? "text-red-500"
|
||||
@@ -208,9 +223,10 @@ const SuggestTask = ({ details, onClose, situation }) => {
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
) : null}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full h-[70px] border-t border-light-purple dark:border-[#5356fb29] flex justify-end items-center">
|
||||
<div className="flex items-center space-x-4 mr-9">
|
||||
<button
|
||||
@@ -220,31 +236,33 @@ const SuggestTask = ({ details, onClose, situation }) => {
|
||||
>
|
||||
<span className="text-gradient"> Cancel</span>
|
||||
</button>
|
||||
{pathname !== "/manage-family" ? (
|
||||
<button
|
||||
type="submit"
|
||||
disabled={props.isSubmitting}
|
||||
className="text-white primary-gradient text-18 tracking-wide px-4 py-3 rounded-full transition duration-150 ease-in-out"
|
||||
>
|
||||
{submitTask.loading
|
||||
? "Submitting Task"
|
||||
: submitTask.state == "success"
|
||||
? "Task Submitted"
|
||||
: submitTask.state == "bad"
|
||||
? "An Error Occurred"
|
||||
: "Send to Parents"}
|
||||
</button>
|
||||
) : (
|
||||
<button className="text-white primary-gradient text-18 tracking-wide px-4 py-3 rounded-full flex items-center transition duration-150 ease-in-out">
|
||||
{suggestedNextStep == "Send Task" ? (
|
||||
<>
|
||||
Continue <Icons name="chevron-right" />
|
||||
</>
|
||||
) : (
|
||||
"Complete"
|
||||
)}
|
||||
</button>
|
||||
)}
|
||||
<button
|
||||
type="submit"
|
||||
disabled={props.isSubmitting}
|
||||
className="text-white primary-gradient text-18 tracking-wide px-4 py-3 rounded-full transition duration-150 ease-in-out flex items-center"
|
||||
>
|
||||
{pathname !== "/manage-family" ? (
|
||||
<>
|
||||
{submitTask.loading
|
||||
? "Submitting Task"
|
||||
: submitTask.state == "success"
|
||||
? "Task Submitted"
|
||||
: submitTask.state == "bad"
|
||||
? "An Error Occurred"
|
||||
: "Send to Parents"}
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
{suggestedNextStep == "Send Task" ? (
|
||||
<>
|
||||
Continue <Icons name="chevron-right" />
|
||||
</>
|
||||
) : (
|
||||
"Complete"
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</Form>
|
||||
|
||||
@@ -519,7 +519,11 @@ export default function Icons({ name }) {
|
||||
<img className="w-[17px] h-[17px]" src={localImgLoad('images/icons/market.svg')} alt="market" />
|
||||
) : name === "new-mytask" ? (
|
||||
<img className="w-[17px] h-[17px]" src={localImgLoad('images/icons/my-task.svg')} alt="task" />
|
||||
) : (
|
||||
) : name === "family-id" ? (
|
||||
<img className="w-[20px] h-[20px]" src={localImgLoad('images/icons/family-id.svg')} alt="family-id" />
|
||||
) : name === "family-pin" ? (
|
||||
<img className="w-[20px] h-[20px]" src={localImgLoad('images/icons/family-pin.svg')} alt="family-pin" />
|
||||
): (
|
||||
""
|
||||
)}
|
||||
</>
|
||||
|
||||
@@ -2,7 +2,7 @@ import React from 'react'
|
||||
|
||||
function CurrentJobAction() {
|
||||
return (
|
||||
<div className='job-action bg-white dark:bg-black'>
|
||||
<div className='job-action dark:bg-black'>
|
||||
<p className="my-3 py-1 text-base active-owner">
|
||||
<table className="w-full text-sm text-left text-gray-500">
|
||||
<tbody>
|
||||
|
||||
@@ -60,7 +60,7 @@ function CurrentTaskAction({jobDetails}) {
|
||||
}
|
||||
|
||||
return (
|
||||
<div className='job-action bg-white dark:bg-black'>
|
||||
<div className='job-action dark:bg-black'>
|
||||
|
||||
<table className="w-full text-sm text-left text-gray-500 active-worker">
|
||||
<tbody>
|
||||
|
||||
@@ -101,7 +101,7 @@ function PastDueJobAction({jobDetails}) {
|
||||
}
|
||||
|
||||
return (
|
||||
<div className='job-action bg-white dark:bg-black'>
|
||||
<div className='job-action dark:bg-black'>
|
||||
|
||||
<table className="w-full text-sm text-left text-gray-500 owner-pastdue">
|
||||
<tbody>
|
||||
|
||||
@@ -2,7 +2,7 @@ import React from 'react'
|
||||
|
||||
function PastDueTaskAction() {
|
||||
return (
|
||||
<div className='job-action bg-white dark:bg-black'>
|
||||
<div className='job-action dark:bg-black'>
|
||||
|
||||
<table className="w-full text-sm text-left text-gray-500 worker-pastdue">
|
||||
<tbody>
|
||||
|
||||
@@ -90,7 +90,7 @@ function ReviewJobAction({jobDetails}) {
|
||||
})
|
||||
}
|
||||
return (
|
||||
<div className='job-action bg-white dark:bg-black'>
|
||||
<div className='job-action dark:bg-black'>
|
||||
<div className="my-3 py-1 text-base">
|
||||
<table className="w-full text-sm text-left text-gray-500 review-owner">
|
||||
<tbody>
|
||||
|
||||
@@ -2,7 +2,7 @@ import React from 'react'
|
||||
|
||||
function ReviewTaskAction() {
|
||||
return (
|
||||
<div className='job-action bg-white dark:bg-black'>
|
||||
<div className='job-action dark:bg-black'>
|
||||
<p className="my-3 py-1 text-base text-dark-gray dark:text-white">
|
||||
Waiting for the completion message from the client before you can approve. Worker True & Review Job
|
||||
</p>
|
||||
|
||||
@@ -10,6 +10,7 @@ import AddFund from './AddFund'
|
||||
import AddRecipient from './AddRecipient'
|
||||
import ConfirmTransfer from './ConfirmTransfer'
|
||||
import ConfirmAddFund from './ConfirmAddFund'
|
||||
import WalletBox from "./WalletBox";
|
||||
|
||||
function Wallet() {
|
||||
return (
|
||||
@@ -71,7 +72,8 @@ const WalletRoutes = () => {
|
||||
<Route path='add-fund' element={<AddFund payment={paymentHistory} />} />
|
||||
<Route path='add-fund/confirm-add-fund' element={<ConfirmAddFund payment={paymentHistory} />} />
|
||||
<Route path='transfer-fund' element={<TransferFund payment={paymentHistory} wallet={walletList} />} />
|
||||
<Route index element={<Balance wallet={walletList} />} />
|
||||
{/*<Route index element={<Balance wallet={walletList} />} />*/}
|
||||
<Route index element={<WalletBox wallet={walletList} />} />
|
||||
<Route path='transfer-fund/add-recipient' element={<AddRecipient />} />
|
||||
<Route path='transfer-fund/confirm-transfer' element={<ConfirmTransfer payment={paymentHistory} wallet={walletList} />} />
|
||||
<Route path='*' element={<Navigate to='/' />} />
|
||||
|
||||
@@ -0,0 +1,273 @@
|
||||
import React from "react";
|
||||
import bank1 from "../../assets/images/bank-1.png";
|
||||
import bank2 from "../../assets/images/bank-2.png";
|
||||
import bank3 from "../../assets/images/bank-3.png";
|
||||
import bank4 from "../../assets/images/bank-4.png";
|
||||
import Layout from "../Partials/Layout";
|
||||
import CurrencyStaticsSection from "./CurrencyStaticsSection";
|
||||
import CurrentBalanceWidget from "./CurrentBalanceWidget";
|
||||
import InvestmentSection from "./InvestmentSection";
|
||||
import RecentTransactionWidget from "./RecentTransactionWidget";
|
||||
import LoadingSpinner from "../Spinners/LoadingSpinner";
|
||||
import WalletItemCard from "./WalletItemCard";
|
||||
|
||||
export default function WalletBox({wallet, coupon}) {
|
||||
return (
|
||||
<>
|
||||
|
||||
<div className="my-wallet-wrapper w-full mb-10">
|
||||
<div className="main-wrapper w-full">
|
||||
<div className="balance-inquery w-full lg:h-[436px] lg:flex lg:space-x-11 mb-11">
|
||||
{wallet.loading ?
|
||||
<LoadingSpinner size='16' color='sky-blue' />
|
||||
:
|
||||
wallet.data.length ?
|
||||
wallet.data.map((item, index)=> (
|
||||
<div className="lg:w-1/2 h-full mb-10 lg:mb-0">
|
||||
<WalletItemCard walletItem={item} />
|
||||
</div>
|
||||
)) : ''
|
||||
}
|
||||
|
||||
{/*<div className="flex-1">*/}
|
||||
{/* <CurrentBalanceWidget />*/}
|
||||
{/*</div>*/}
|
||||
{/* <div className="flex-1">*/}
|
||||
{/* <div className="my-wallets w-full h-full bg-white dark:bg-dark-white rounded-lg p-6">*/}
|
||||
{/* <div className="mb-4">*/}
|
||||
{/* <h1 className="text-xl font-bold tracking-wide text-dark-gray dark:text-white">*/}
|
||||
{/* My Wallet*/}
|
||||
{/* </h1>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className="content-area">*/}
|
||||
{/* <div className="flex justify-between items-center mb-6">*/}
|
||||
{/* <div className="flex space-x-5 items-center">*/}
|
||||
{/* <div className="account-name flex space-x-4 items-center">*/}
|
||||
{/* <div className="icon w-14 h-14 transition duration-300 ease-in-out rounded-full flex justify-center items-center bg-light-purple dark:bg-dark-light-purple ">*/}
|
||||
{/* <img src={bank1} alt="" />*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className="name">*/}
|
||||
{/* <p className="text-xl font-bold text-dark-gray dark:text-white tracking-wide">*/}
|
||||
{/* MetaMask*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className="flex space-x-5 items-center">*/}
|
||||
{/* <div>*/}
|
||||
{/* <p className="text-xl font-bold text-dark-gray dark:text-white text-right mb-3">*/}
|
||||
{/* $734.79*/}
|
||||
{/* </p>*/}
|
||||
{/* <p className="text-sm text-thin-light-gray">*/}
|
||||
{/* New Add*/}
|
||||
{/* <span className="text-light-green ml-1">*/}
|
||||
{/* +324.75*/}
|
||||
{/* </span>*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div>*/}
|
||||
{/*<span className="dark:text-thin-light-gray text-[#374557]">*/}
|
||||
{/* <svg*/}
|
||||
{/* width="6"*/}
|
||||
{/* height="26"*/}
|
||||
{/* viewBox="0 0 6 26"*/}
|
||||
{/* fill="none"*/}
|
||||
{/* className="fill-current"*/}
|
||||
{/* xmlns="http://www.w3.org/2000/svg"*/}
|
||||
{/* >*/}
|
||||
{/* <circle cx="3" cy="3" r="3" fillOpacity="0.6" />*/}
|
||||
{/* <circle*/}
|
||||
{/* cx="3"*/}
|
||||
{/* cy="12.75"*/}
|
||||
{/* r="3"*/}
|
||||
{/* fillOpacity="0.6"*/}
|
||||
{/* />*/}
|
||||
{/* <circle*/}
|
||||
{/* cx="3"*/}
|
||||
{/* cy="22.5"*/}
|
||||
{/* r="3"*/}
|
||||
{/* fillOpacity="0.6"*/}
|
||||
{/* />*/}
|
||||
{/* </svg>*/}
|
||||
{/*</span>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className="flex justify-between items-center mb-6">*/}
|
||||
{/* <div className="flex space-x-5 items-center">*/}
|
||||
{/* <div className="account-name flex space-x-4 items-center">*/}
|
||||
{/* <div className="icon w-14 h-14 transition duration-300 ease-in-out rounded-full flex justify-center items-center bg-light-purple dark:bg-dark-light-purple ">*/}
|
||||
{/* <img src={bank2} alt="" />*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className="name">*/}
|
||||
{/* <p className="text-xl font-bold text-dark-gray dark:text-white tracking-wide">*/}
|
||||
{/* Coinbase Wallet*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className="flex space-x-5 items-center">*/}
|
||||
{/* <div>*/}
|
||||
{/* <p className="text-xl font-bold text-dark-gray dark:text-white text-right mb-3">*/}
|
||||
{/* $734.79*/}
|
||||
{/* </p>*/}
|
||||
{/* <p className="text-sm text-thin-light-gray">*/}
|
||||
{/* New Add*/}
|
||||
{/* <span className="text-light-green ml-1">*/}
|
||||
{/* +324.75*/}
|
||||
{/* </span>*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div>*/}
|
||||
{/*<span className="dark:text-thin-light-gray text-[#374557]">*/}
|
||||
{/* <svg*/}
|
||||
{/* width="6"*/}
|
||||
{/* height="26"*/}
|
||||
{/* viewBox="0 0 6 26"*/}
|
||||
{/* fill="none"*/}
|
||||
{/* className="fill-current"*/}
|
||||
{/* xmlns="http://www.w3.org/2000/svg"*/}
|
||||
{/* >*/}
|
||||
{/* <circle cx="3" cy="3" r="3" fillOpacity="0.6" />*/}
|
||||
{/* <circle*/}
|
||||
{/* cx="3"*/}
|
||||
{/* cy="12.75"*/}
|
||||
{/* r="3"*/}
|
||||
{/* fillOpacity="0.6"*/}
|
||||
{/* />*/}
|
||||
{/* <circle*/}
|
||||
{/* cx="3"*/}
|
||||
{/* cy="22.5"*/}
|
||||
{/* r="3"*/}
|
||||
{/* fillOpacity="0.6"*/}
|
||||
{/* />*/}
|
||||
{/* </svg>*/}
|
||||
{/*</span>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className="flex justify-between items-center mb-6">*/}
|
||||
{/* <div className="flex space-x-5 items-center">*/}
|
||||
{/* <div className="account-name flex space-x-4 items-center">*/}
|
||||
{/* <div className="icon w-14 h-14 transition duration-300 ease-in-out rounded-full flex justify-center items-center bg-light-purple dark:bg-dark-light-purple ">*/}
|
||||
{/* <img src={bank3} alt="" />*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className="name">*/}
|
||||
{/* <p className="text-xl font-bold text-dark-gray dark:text-white tracking-wide">*/}
|
||||
{/* Bitski*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className="flex space-x-5 items-center">*/}
|
||||
{/* <div>*/}
|
||||
{/* <p className="text-xl font-bold text-dark-gray dark:text-white text-right mb-3">*/}
|
||||
{/* $734.79*/}
|
||||
{/* </p>*/}
|
||||
{/* <p className="text-sm text-thin-light-gray">*/}
|
||||
{/* New Add*/}
|
||||
{/* <span className="text-light-green ml-1">*/}
|
||||
{/* +324.75*/}
|
||||
{/* </span>*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div>*/}
|
||||
{/*<span className="dark:text-thin-light-gray text-[#374557]">*/}
|
||||
{/* <svg*/}
|
||||
{/* width="6"*/}
|
||||
{/* height="26"*/}
|
||||
{/* viewBox="0 0 6 26"*/}
|
||||
{/* fill="none"*/}
|
||||
{/* className="fill-current"*/}
|
||||
{/* xmlns="http://www.w3.org/2000/svg"*/}
|
||||
{/* >*/}
|
||||
{/* <circle cx="3" cy="3" r="3" fillOpacity="0.6" />*/}
|
||||
{/* <circle*/}
|
||||
{/* cx="3"*/}
|
||||
{/* cy="12.75"*/}
|
||||
{/* r="3"*/}
|
||||
{/* fillOpacity="0.6"*/}
|
||||
{/* />*/}
|
||||
{/* <circle*/}
|
||||
{/* cx="3"*/}
|
||||
{/* cy="22.5"*/}
|
||||
{/* r="3"*/}
|
||||
{/* fillOpacity="0.6"*/}
|
||||
{/* />*/}
|
||||
{/* </svg>*/}
|
||||
{/*</span>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className="flex justify-between items-center mb-6">*/}
|
||||
{/* <div className="flex space-x-5 items-center">*/}
|
||||
{/* <div className="account-name flex space-x-4 items-center">*/}
|
||||
{/* <div className="icon w-14 h-14 transition duration-300 ease-in-out rounded-full flex justify-center items-center bg-light-purple dark:bg-dark-light-purple ">*/}
|
||||
{/* <img src={bank4} alt="" />*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className="name">*/}
|
||||
{/* <p className="text-xl font-bold text-dark-gray dark:text-white tracking-wide">*/}
|
||||
{/* WalletConnect*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className="flex space-x-5 items-center">*/}
|
||||
{/* <div>*/}
|
||||
{/* <p className="text-xl font-bold text-dark-gray dark:text-white text-right mb-3">*/}
|
||||
{/* $734.79*/}
|
||||
{/* </p>*/}
|
||||
{/* <p className="text-sm text-thin-light-gray">*/}
|
||||
{/* New Add*/}
|
||||
{/* <span className="text-light-green ml-1">*/}
|
||||
{/* +324.75*/}
|
||||
{/* </span>*/}
|
||||
{/* </p>*/}
|
||||
{/* </div>*/}
|
||||
{/* <div>*/}
|
||||
{/*<span className="dark:text-thin-light-gray text-[#374557]">*/}
|
||||
{/* <svg*/}
|
||||
{/* width="6"*/}
|
||||
{/* height="26"*/}
|
||||
{/* viewBox="0 0 6 26"*/}
|
||||
{/* fill="none"*/}
|
||||
{/* className="fill-current"*/}
|
||||
{/* xmlns="http://www.w3.org/2000/svg"*/}
|
||||
{/* >*/}
|
||||
{/* <circle cx="3" cy="3" r="3" fillOpacity="0.6" />*/}
|
||||
{/* <circle*/}
|
||||
{/* cx="3"*/}
|
||||
{/* cy="12.75"*/}
|
||||
{/* r="3"*/}
|
||||
{/* fillOpacity="0.6"*/}
|
||||
{/* />*/}
|
||||
{/* <circle*/}
|
||||
{/* cx="3"*/}
|
||||
{/* cy="22.5"*/}
|
||||
{/* r="3"*/}
|
||||
{/* fillOpacity="0.6"*/}
|
||||
{/* />*/}
|
||||
{/* </svg>*/}
|
||||
{/*</span>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
</div>
|
||||
{/* flex space-x-11 */}
|
||||
{/*<div className="recent-and-investment grid lg:grid-cols-2 grid-cols-1 2xl:gap-[40px] xl:gap-7 gap-4 lg:h-[416px] w-full justify-between">*/}
|
||||
{/* <div className=" h-full">*/}
|
||||
{/* <RecentTransactionWidget />*/}
|
||||
{/* </div>*/}
|
||||
{/* <div className=" h-full">*/}
|
||||
{/* <InvestmentSection />*/}
|
||||
{/* </div>*/}
|
||||
{/*</div>*/}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,132 @@
|
||||
import React, { useState } from "react";
|
||||
import background from "../../assets/images/shape/balance-bg.svg";
|
||||
import {PriceFormatter} from "../Helpers/PriceFormatter";
|
||||
import {Link} from "react-router-dom";
|
||||
|
||||
export default function WalletItemCard({walletItem}) {
|
||||
const [eth] = useState(90);
|
||||
const [btc] = useState(85);
|
||||
const [ltc] = useState(20);
|
||||
return (
|
||||
<div
|
||||
className="current-balance-widget w-full h-full rounded-2xl overflow-hidden flex flex-col justify-between px-8 py-9"
|
||||
style={{
|
||||
background: `url(${background}) 0% 0% / cover no-repeat`,
|
||||
}}
|
||||
>
|
||||
<div className="wallet flex justify-between">
|
||||
<div className="w-[100px] h-[100px] rounded-full bg-[#485199] flex justify-center items-center">
|
||||
<div>
|
||||
<p className="text-26 font-bold text-white tracking-wide text-center">
|
||||
.
|
||||
</p>
|
||||
<p className="text-lg text-white tracking-wide text-center">
|
||||
{walletItem.code}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
{/*<p className="text-26 font-bold tracking-wide text-white text-right">*/}
|
||||
{/* 6,572.00*/}
|
||||
{/*</p>*/}
|
||||
{/*<p className="tracking-wide text-white text-lg opacity-[70%]">*/}
|
||||
{/* Total Transactions*/}
|
||||
{/*</p>*/}
|
||||
</div>
|
||||
</div>
|
||||
<div className="balance">
|
||||
<p className="text-lg text-white opacity-[70%] tracking-wide mb-6">
|
||||
Current Balance
|
||||
</p>
|
||||
<p className="text-[44px] font-bold text-white tracking-wide leading-10 mb-2">
|
||||
{PriceFormatter(walletItem.amount * 0.01, walletItem.code)}
|
||||
</p>
|
||||
<p className="text-lg text-white tracking-wide">
|
||||
HOLDINGS : {PriceFormatter(walletItem.escrow * 0.01, walletItem.code)}
|
||||
{/*<span className="text-light-green">(11.5%)</span>*/}
|
||||
</p>
|
||||
</div>
|
||||
<div className="counters flex space-x-16">
|
||||
<Link to='transfer-fund' className='px-2 py-1 flex items-center gap-2 user-balance cursor-pointer h-[48px] rounded-full relative bg-purple lg:text-xl text-lg font-bold text-white'>Transfer</Link>:''
|
||||
|
||||
<Link to='add-fund' state={{currency:walletItem.description}} className='px-2 py-1 flex items-center gap-2 user-balance cursor-pointer h-[48px] rounded-full relative bg-green lg:text-xl text-lg font-bold text-white'>
|
||||
<span className="">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="38"
|
||||
height="38" viewBox="0 0 42 42" fill="none"><path
|
||||
d="M21 0C16.8466 0 12.7865 1.23163 9.33303 3.53914C5.8796 5.84665 3.18798 9.1264 1.59854 12.9636C0.00909901 16.8009 -0.406771 21.0233 0.403518 25.0969C1.21381 29.1705 3.21386 32.9123 6.15077 35.8492C9.08767 38.7861 12.8295 40.7862 16.9031 41.5965C20.9767 42.4068 25.1991 41.9909 29.0364 40.4015C32.8736 38.812 36.1534 36.1204 38.4609 32.667C40.7684 29.2135 42 25.1534 42 21C41.994 15.4323 39.7796 10.0944 35.8426 6.15741C31.9056 2.22045 26.5677 0.00602189 21 0ZM28 22.75H22.75V28C22.75 28.4641 22.5656 28.9092 22.2374 29.2374C21.9093 29.5656 21.4641 29.75 21 29.75C20.5359 29.75 20.0908 29.5656 19.7626 29.2374C19.4344 28.9092 19.25 28.4641 19.25 28V22.75H14C13.5359 22.75 13.0908 22.5656 12.7626 22.2374C12.4344 21.9092 12.25 21.4641 12.25 21C12.25 20.5359 12.4344 20.0907 12.7626 19.7626C13.0908 19.4344 13.5359 19.25 14 19.25H19.25V14C19.25 13.5359 19.4344 13.0908 19.7626 12.7626C20.0908 12.4344 20.5359 12.25 21 12.25C21.4641 12.25 21.9093 12.4344 22.2374 12.7626C22.5656 13.0908 22.75 13.5359 22.75 14V19.25H28C28.4641 19.25 28.9093 19.4344 29.2374 19.7626C29.5656 20.0907 29.75 20.5359 29.75 21C29.75 21.4641 29.5656 21.9092 29.2374 22.2374C28.9093 22.5656 28.4641 22.75 28 22.75Z"
|
||||
fill="white"></path>
|
||||
</svg>
|
||||
</span>
|
||||
<span className='text-white'>Add Credit</span>
|
||||
</Link>
|
||||
|
||||
{/*<div className="circle-count">*/}
|
||||
{/* <div>*/}
|
||||
{/* <div className="percent">*/}
|
||||
{/* <svg>*/}
|
||||
{/* <circle cx="37" cy="37" r="30"></circle>*/}
|
||||
{/* <circle*/}
|
||||
{/* cx="37"*/}
|
||||
{/* cy="37"*/}
|
||||
{/* r="30"*/}
|
||||
{/* style={{ "--percent": `${eth}` }}*/}
|
||||
{/* ></circle>*/}
|
||||
{/* </svg>*/}
|
||||
{/* <div className="number">*/}
|
||||
{/* <h3>*/}
|
||||
{/* {eth}*/}
|
||||
{/* <span>%</span>*/}
|
||||
{/* </h3>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* <p className="text-18 text-white text-center">2.32 ETH</p>*/}
|
||||
{/* </div>*/}
|
||||
{/*</div>*/}
|
||||
{/*<div className="circle-count">*/}
|
||||
{/* <div>*/}
|
||||
{/* <div className="percent">*/}
|
||||
{/* <svg>*/}
|
||||
{/* <circle cx="37" cy="37" r="30"></circle>*/}
|
||||
{/* <circle*/}
|
||||
{/* cx="37"*/}
|
||||
{/* cy="37"*/}
|
||||
{/* r="30"*/}
|
||||
{/* style={{ "--percent": `${btc}` }}*/}
|
||||
{/* ></circle>*/}
|
||||
{/* </svg>*/}
|
||||
{/* <div className="number">*/}
|
||||
{/* <h3>*/}
|
||||
{/* {btc}*/}
|
||||
{/* <span>%</span>*/}
|
||||
{/* </h3>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* <p className="font-18 text-white text-center">1.76 BTC</p>*/}
|
||||
{/* </div>*/}
|
||||
{/*</div>*/}
|
||||
{/*<div className="circle-count">*/}
|
||||
{/* <div>*/}
|
||||
{/* <div className="percent">*/}
|
||||
{/* <svg>*/}
|
||||
{/* <circle cx="37" cy="37" r="30"></circle>*/}
|
||||
{/* <circle*/}
|
||||
{/* cx="37"*/}
|
||||
{/* cy="37"*/}
|
||||
{/* r="30"*/}
|
||||
{/* style={{ "--percent": `${ltc}` }}*/}
|
||||
{/* ></circle>*/}
|
||||
{/* </svg>*/}
|
||||
{/* <div className="number">*/}
|
||||
{/* <h3>*/}
|
||||
{/* {ltc}*/}
|
||||
{/* <span>%</span>*/}
|
||||
{/* </h3>*/}
|
||||
{/* </div>*/}
|
||||
{/* </div>*/}
|
||||
{/* <p className="text-18 text-white text-center">2.32 LTC</p>*/}
|
||||
{/* </div>*/}
|
||||
{/*</div>*/}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
+5
-2
@@ -3,7 +3,9 @@
|
||||
font-family: "Product Sans";
|
||||
src: url("./assets/fonts/Product Sans Regular.ttf");
|
||||
}
|
||||
|
||||
.nft-main-container{
|
||||
max-width: 1200px;
|
||||
}
|
||||
/* Bold Weight */
|
||||
@font-face {
|
||||
font-family: "Product Sans";
|
||||
@@ -30,9 +32,10 @@
|
||||
}
|
||||
|
||||
.job-action{
|
||||
background-color: lightgoldenrodyellow;
|
||||
background-color: aliceblue;
|
||||
height: 100px;
|
||||
border-radius: 15px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.msg_box{
|
||||
|
||||
@@ -1,4 +1,3 @@
|
||||
import React from "react";
|
||||
import Axios from "axios";
|
||||
|
||||
class usersService {
|
||||
@@ -26,10 +25,22 @@ class usersService {
|
||||
};
|
||||
return this.postAuxEnd("/dashdata", postData);
|
||||
}
|
||||
|
||||
logInUser(reqData) {
|
||||
localStorage.setItem("session_token", ``);
|
||||
return this.postAuxEnd("/userlogin", reqData);
|
||||
}
|
||||
|
||||
authStart(reqData) {
|
||||
localStorage.setItem("session_token", ``);
|
||||
return this.postAuxEnd("/authstart", reqData);
|
||||
}
|
||||
|
||||
authLogin(reqData) {
|
||||
localStorage.setItem("session_token", ``);
|
||||
return this.postAuxEnd("/authlogin", reqData);
|
||||
}
|
||||
|
||||
marketJobData(reqData) {
|
||||
var postData = {
|
||||
uuid: localStorage.getItem("uuid"),
|
||||
|
||||
Reference in New Issue
Block a user