WrenchBoard/Users-Wrench
3
0
Fork 0
Code Issues Pull Requests Releases Activity

Walltet starter

Browse Source
This commit is contained in:
DESKTOP-GBA0BK8\Admin
2023-03-23 05:48:00 -04:00
parent 1741b298f3
commit bd3f172ccd
4 changed files with 228 additions and 115 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/MyWallet/WalletHeader.jsx
+127 -93
View File
@@ -3,9 +3,11 @@ import bank1 from "../../assets/images/bank-1.png";
import bank2 from "../../assets/images/bank-2.png"; import bank2 from "../../assets/images/bank-2.png";
import bank3 from "../../assets/images/bank-3.png"; import bank3 from "../../assets/images/bank-3.png";
import bank4 from "../../assets/images/bank-4.png"; import bank4 from "../../assets/images/bank-4.png";
import Accordion from "../Helpers/Accordion";
export default function WalletHeader(props) { export default function WalletHeader(props) {
// debugger; // debugger;
//props.myWalletList.result_list
return ( return (
<> <>
<div <div
@@ -36,98 +38,130 @@ export default function WalletHeader(props) {
</div> </div>
<div className="content px-7 pb-7"> <div className="content px-7 pb-7">
<ul> <ul>
<li className="content-item py-4 border-b dark:border-[#5356fb29] border-light-purple hover:border-purple dark:hover:border-purple">
<div className="sm:flex justify-between items-center"> {props.myWalletList &&
<div className="account-name flex space-x-4 items-center mb-2 sm:mb-0"> props.myWalletList?.result_list?.length > 0 &&
<div props.myWalletList.result_list.map((value) => (
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=""/> <li className="content-item py-4 border-b dark:border-[#5356fb29] border-light-purple hover:border-purple dark:hover:border-purple">
</div> <div className="sm:flex justify-between items-center">
<div className="name"> <div className="account-name flex space-x-4 items-center mb-2 sm:mb-0">
<p className="text-base text-dark-gray dark:text-white font-medium"> <div
MetaMask 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 ">
</p> <img src={bank1} alt=""/>
</div> </div>
</div> <div className="name">
<div> <p className="text-base text-dark-gray dark:text-white font-medium">
<p className="eth text-xl font-bold text-purple"> {value.description}
75,320 ETH </p>
</p> </div>
<p className="usd text-base text-thin-light-gray text-right"> </div>
(773.69 USD) <div>
</p> <p className="eth text-xl font-bold text-purple">
</div> {value.amount*0.01} {value.code}
</div> </p>
</li> <p className="usd text-base text-thin-light-gray text-right">
<li className="content-item py-4 border-b dark:border-[#5356fb29] border-light-purple hover:border-purple dark:hover:border-purple"> (773.69 USD)
<div className="sm:flex justify-between items-center"> </p>
<div className="account-name flex space-x-4 items-center mb-2 sm:mb-0"> </div>
<div </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 "> </li>
<img src={bank2} alt=""/>
</div> </>
<div className="name"> ))}
<p className="text-base text-dark-gray dark:text-white font-medium">
Coinbase Wallet {/*<li className="content-item py-4 border-b dark:border-[#5356fb29] border-light-purple hover:border-purple dark:hover:border-purple">*/}
</p> {/* <div className="sm:flex justify-between items-center">*/}
</div> {/* <div className="account-name flex space-x-4 items-center mb-2 sm:mb-0">*/}
</div> {/* <div*/}
<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 ">*/}
<p className="eth text-xl font-bold text-purple"> {/* <img src={bank1} alt=""/>*/}
56,124 ETH {/* </div>*/}
</p> {/* <div className="name">*/}
<p className="usd text-base text-thin-light-gray text-right"> {/* <p className="text-base text-dark-gray dark:text-white font-medium">*/}
(773.69 USD) {/* MetaMask*/}
</p> {/* </p>*/}
</div> {/* </div>*/}
</div> {/* </div>*/}
</li> {/* <div>*/}
<li className="content-item py-4 border-b dark:border-[#5356fb29] border-light-purple hover:border-purple dark:hover:border-purple"> {/* <p className="eth text-xl font-bold text-purple">*/}
<div className="sm:flex justify-between items-center"> {/* 75,320 ETH*/}
<div className="account-name flex space-x-4 items-center mb-2 sm:mb-0"> {/* </p>*/}
<div {/* <p className="usd text-base text-thin-light-gray text-right">*/}
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 "> {/* (773.69 USD)*/}
<img src={bank3} alt=""/> {/* </p>*/}
</div> {/* </div>*/}
<div className="name"> {/* </div>*/}
<p className="text-base text-dark-gray dark:text-white font-medium"> {/*</li>*/}
Bitski {/*<li className="content-item py-4 border-b dark:border-[#5356fb29] border-light-purple hover:border-purple dark:hover:border-purple">*/}
</p> {/* <div className="sm:flex justify-between items-center">*/}
</div> {/* <div className="account-name flex space-x-4 items-center mb-2 sm:mb-0">*/}
</div> {/* <div*/}
<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 ">*/}
<p className="eth text-xl font-bold text-purple"> {/* <img src={bank2} alt=""/>*/}
99,123 ETH {/* </div>*/}
</p> {/* <div className="name">*/}
<p className="usd text-base text-thin-light-gray text-right"> {/* <p className="text-base text-dark-gray dark:text-white font-medium">*/}
(773.69 USD) {/* Coinbase Wallet*/}
</p> {/* </p>*/}
</div> {/* </div>*/}
</div> {/* </div>*/}
</li> {/* <div>*/}
<li className="content-item py-5"> {/* <p className="eth text-xl font-bold text-purple">*/}
<div className="sm:flex justify-between items-center"> {/* 56,124 ETH*/}
<div className="account-name flex space-x-4 items-center mb-2 sm:mb-0"> {/* </p>*/}
<div {/* <p className="usd text-base text-thin-light-gray text-right">*/}
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 "> {/* (773.69 USD)*/}
<img src={bank4} alt=""/> {/* </p>*/}
</div> {/* </div>*/}
<div className="name"> {/* </div>*/}
<p className="text-base text-dark-gray dark:text-white font-medium"> {/*</li>*/}
WalletConnect {/*<li className="content-item py-4 border-b dark:border-[#5356fb29] border-light-purple hover:border-purple dark:hover:border-purple">*/}
</p> {/* <div className="sm:flex justify-between items-center">*/}
</div> {/* <div className="account-name flex space-x-4 items-center mb-2 sm:mb-0">*/}
</div> {/* <div*/}
<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 ">*/}
<p className="eth text-xl font-bold text-purple"> {/* <img src={bank3} alt=""/>*/}
43,728 ETH {/* </div>*/}
</p> {/* <div className="name">*/}
<p className="usd text-base text-thin-light-gray text-right"> {/* <p className="text-base text-dark-gray dark:text-white font-medium">*/}
(773.69 USD) {/* Bitski*/}
</p> {/* </p>*/}
</div> {/* </div>*/}
</div> {/* </div>*/}
</li> {/* <div>*/}
{/* <p className="eth text-xl font-bold text-purple">*/}
{/* 99,123 ETH*/}
{/* </p>*/}
{/* <p className="usd text-base text-thin-light-gray text-right">*/}
{/* (773.69 USD)*/}
{/* </p>*/}
{/* </div>*/}
{/* </div>*/}
{/*</li>*/}
{/*<li className="content-item py-5">*/}
{/* <div className="sm:flex justify-between items-center">*/}
{/* <div className="account-name flex space-x-4 items-center mb-2 sm:mb-0">*/}
{/* <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-base text-dark-gray dark:text-white font-medium">*/}
{/* WalletConnect*/}
{/* </p>*/}
{/* </div>*/}
{/* </div>*/}
{/* <div>*/}
{/* <p className="eth text-xl font-bold text-purple">*/}
{/* 43,728 ETH*/}
{/* </p>*/}
{/* <p className="usd text-base text-thin-light-gray text-right">*/}
{/* (773.69 USD)*/}
{/* </p>*/}
{/* </div>*/}
{/* </div>*/}
{/*</li>*/}
</ul> </ul>
<div className="add-money-btn flex justify-center items-center"> <div className="add-money-btn flex justify-center items-center">
<button <button
src/components/Partials/Header.jsx
+24 -2
View File
@@ -1,4 +1,4 @@
import React, { useContext } from "react"; import React, { useContext,useState, useEffect } from "react";
import { Link } from "react-router-dom"; import { Link } from "react-router-dom";
import bank1 from "../../assets/images/bank-1.png"; import bank1 from "../../assets/images/bank-1.png";
import bank2 from "../../assets/images/bank-2.png"; import bank2 from "../../assets/images/bank-2.png";
@@ -11,6 +11,7 @@ import Icons from "../Helpers/Icons";
import ModalCom from "../Helpers/ModalCom"; import ModalCom from "../Helpers/ModalCom";
import SearchCom from "../Helpers/SearchCom"; import SearchCom from "../Helpers/SearchCom";
import WalletHeader from "../MyWallet/WalletHeader"; import WalletHeader from "../MyWallet/WalletHeader";
import usersService from "../../services/UsersService";
export default function Header({ logoutModalHandler, sidebarHandler }) { export default function Header({ logoutModalHandler, sidebarHandler }) {
@@ -19,6 +20,23 @@ export default function Header({ logoutModalHandler, sidebarHandler }) {
const [userProfileDropdown, setProfileDropdown] = useToggle(false); const [userProfileDropdown, setProfileDropdown] = useToggle(false);
const [moneyPopup, setPopup] = useToggle(false); const [moneyPopup, setPopup] = useToggle(false);
const darkMode = useContext(DarkModeContext); const darkMode = useContext(DarkModeContext);
const [myWalletList, setMyWalletList] = useState([]);
const api = new usersService();
const getMyWalletList = async () => {
try {
const res = await api.getUserWallets(null);
console.log("wallet - > ",res.data);
setMyWalletList(res.data);
} catch (error) {
console.log("Error getting mode");
}
};
useEffect(() => {
getMyWalletList();
}, []);
const handlerBalance = () => { const handlerBalance = () => {
setbalanceValue.toggle(); setbalanceValue.toggle();
if (notificationDropdown) { if (notificationDropdown) {
@@ -196,7 +214,11 @@ export default function Header({ logoutModalHandler, sidebarHandler }) {
{/* balance */} {/* balance */}
{/*<div className="lg:hidden block"></div>*/} {/*<div className="lg:hidden block"></div>*/}
<WalletHeader handlerBalance={handlerBalance} balanceDropdown={balanceDropdown} addMoneyHandler={addMoneyHandler} /> <WalletHeader
myWalletList={myWalletList}
handlerBalance={handlerBalance}
balanceDropdown={balanceDropdown}
addMoneyHandler={addMoneyHandler} />
{/* notification */} {/* notification */}
<div className="user-notification lg:block hidden relative"> <div className="user-notification lg:block hidden relative">
<div <div
src/components/Partials/Sidebar.jsx
+60 -19
View File
@@ -240,6 +240,7 @@ export default function Sidebar({ sidebar, action, logoutModalHandler }) {
</ul> </ul>
</div> </div>
</div> </div>
<div className="setting-item"> <div className="setting-item">
<div className="heading mb-5"> <div className="heading mb-5">
<h1 className="title text-xl font-bold text-purple">My Jobs</h1> <h1 className="title text-xl font-bold text-purple">My Jobs</h1>
@@ -248,44 +249,84 @@ export default function Sidebar({ sidebar, action, logoutModalHandler }) {
<ul className="flex flex-col space-y-6"> <ul className="flex flex-col space-y-6">
<li className="item group"> <li className="item group">
<NavLink <NavLink
to="/profile" to="/market"
className={`nav-item flex items-center ${ className={`nav-item flex items-center ${
((navData) => (navData.isActive ? "active" : ""), ((navData) => (navData.isActive ? "active" : ""),
sidebar ? "justify-start space-x-3.5" : "justify-center") sidebar ? "justify-start space-x-3.5" : "justify-center")
}`} }`}
> >
<span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white dark:text-lighter-gray"> <span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white dark:text-lighter-gray">
<Icons name="people-two" /> <Icons name="people-two" />
</span> </span>
<span <span
className={`item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium ${ className={`item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium ${
sidebar ? "active flex-1" : "w-0" sidebar ? "active flex-1" : "w-0"
}`} }`}
> >
My Profile Job List
</span> </span>
</NavLink> </NavLink>
</li> </li>
<li className="item group"> <li className="item group">
<NavLink <NavLink
to="/settings" to="/market"
className={`nav-item flex items-center ${ className={`nav-item flex items-center ${
((navData) => (navData.isActive ? "active" : ""), ((navData) => (navData.isActive ? "active" : ""),
sidebar ? "justify-start space-x-3.5" : "justify-center") sidebar ? "justify-start space-x-3.5" : "justify-center")
}`} }`}
> >
<span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white dark:text-lighter-gray"> <span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white dark:text-lighter-gray">
<Icons name="setting" /> <Icons name="people-two" />
</span> </span>
<span <span
className={`item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium ${ className={`item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium ${
sidebar ? "active flex-1" : "w-0" sidebar ? "active flex-1" : "w-0"
}`} }`}
> >
Settings Active Jobs
</span> </span>
</NavLink> </NavLink>
</li> </li>
{/*<li className="item group">*/}
{/* <NavLink*/}
{/* to="/profile"*/}
{/* className={`nav-item flex items-center ${*/}
{/* ((navData) => (navData.isActive ? "active" : ""),*/}
{/* sidebar ? "justify-start space-x-3.5" : "justify-center")*/}
{/* }`}*/}
{/* >*/}
{/* <span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white dark:text-lighter-gray">*/}
{/* <Icons name="people-two" />*/}
{/* </span>*/}
{/* <span*/}
{/* className={`item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium ${*/}
{/* sidebar ? "active flex-1" : "w-0"*/}
{/* }`}*/}
{/* >*/}
{/* My Profile*/}
{/* </span>*/}
{/* </NavLink>*/}
{/*</li>*/}
{/*<li className="item group">*/}
{/* <NavLink*/}
{/* to="/settings"*/}
{/* className={`nav-item flex items-center ${*/}
{/* ((navData) => (navData.isActive ? "active" : ""),*/}
{/* sidebar ? "justify-start space-x-3.5" : "justify-center")*/}
{/* }`}*/}
{/* >*/}
{/* <span className="item-icon group-hover:bg-purple group-hover:text-white w-8 h-8 flex justify-center items-center transition-all duration-300 ease-in-out bg-light-purple dark:bg-dark-light-purple rounded-full text-dark-gray dark:text-white dark:text-lighter-gray">*/}
{/* <Icons name="setting" />*/}
{/* </span>*/}
{/* <span*/}
{/* className={`item-content group-hover:text-purple text-[18px] transition-all duration-300 ease-in-out text-lighter-gray relative font-medium ${*/}
{/* sidebar ? "active flex-1" : "w-0"*/}
{/* }`}*/}
{/* >*/}
{/* Settings*/}
{/* </span>*/}
{/* </NavLink>*/}
{/*</li>*/}
</ul> </ul>
</div> </div>
</div> </div>
src/services/UsersService.js
+17 -1
View File
@@ -26,7 +26,23 @@ class usersService {
}; };
return this.postAuxEnd("/getjobsdata", postData); return this.postAuxEnd("/getjobsdata", postData);
} }
//
getUserBankList(reqData){
var postData = {
uuid: localStorage.getItem("uuid"),
member_id: localStorage.getItem("member_id"),
sessionid: localStorage.getItem("session_token")
};
return this.postAuxEnd("/mybanklist", postData);
}
getUserWallets(reqData){
var postData = {
uuid: localStorage.getItem("uuid"),
member_id: localStorage.getItem("member_id"),
sessionid: localStorage.getItem("session_token")
};
return this.postAuxEnd("/getwallets", postData);
}
getApiGate(){ getApiGate(){
// localStorage.setItem("session_token", ``); // localStorage.setItem("session_token", ``);
return this.postAuxEnd("/apigate", null); return this.postAuxEnd("/apigate", null);