Compare commits

...

1 Commits

Author SHA1 Message Date
victorAnumudu aa9482bb95 transfer fund implemented 2023-04-28 15:23:43 +01:00
5 changed files with 139 additions and 95 deletions
+2 -2
View File
@@ -31,11 +31,11 @@ function Balance({wallet, payment, coupon, purchase}) {
</div>
<div className='balance-info'>
<p className='py-2'>balance</p>
<span className='text-sm py-1 px-2 bg-green-100 text-green-500 rounded-lg'>{item.symbol}{(item.amount*1).toFixed(2)}</span>
<span className='text-sm py-1 px-2 bg-green-100 text-green-500 rounded-lg'>{item.symbol}{(item.amount*0.01).toFixed(2)}</span>
</div>
<div className='balance-info'>
<p className='py-2'>Escrow</p>
<span className='text-sm py-1 px-2 bg-red-100 text-red-500 rounded-lg'>{item.symbol}{(item.escrow*1).toFixed(2)}</span>
<span className='text-sm py-1 px-2 bg-red-100 text-red-500 rounded-lg'>{item.symbol}{(item.escrow*0.01).toFixed(2)}</span>
</div>
</div>
+122 -91
View File
@@ -1,10 +1,15 @@
import React, {useState} from 'react'
import React, {useState, useEffect} from 'react'
import {useLocation, useNavigate} from 'react-router-dom'
import RecentActivityTable from './WalletComponent/RecentActivityTable'
import LoadingSpinner from '../Spinners/LoadingSpinner'
import InputCom from '../Helpers/Inputs/InputCom'
import {toast} from 'react-toastify'
import usersService from '../../services/UsersService'
function ConfirmTransfer({payment, wallet}) {
const apiURL = new usersService()
const navigate = useNavigate()
let {state} = useLocation()
@@ -14,107 +19,133 @@ function ConfirmTransfer({payment, wallet}) {
}
let [requestStatus, setRequestStatus] = useState({message: '', loading: false, status: false})
let [pageLoading, setPageLoading] = useState(true)
//FUNCTION TO HANDLE SUBMIT
const handleSubmit = () => {
// let [requestStatus, setRequestStatus] = useState({message: '', loading: true, status: false})
//valid inputs before submitting. Just for texting remove later
setRequestStatus({message: '', loading: true, status: false})
let reqData = {
amount: Number(state.amount),
Fee: Number(state.fee),
recipientid: Number(state.recipientID)
}
apiURL.sendMoney(reqData).then((res)=>{
if(res.data.internal_return < 0){
setRequestStatus({message: 'Could not perform transaction', loading: false, status: false})
return
}
setRequestStatus({message: 'transfer successful', loading: false, status: true})
toast.success('Transfer sucessful')
setTimeout(()=>{
navigate('/', {replace: true})
}, 1000)
}).catch(error=>{
setRequestStatus({message: 'Opps! something went wrong! Try Again', loading: false, status: false})
})
}
useEffect(()=>{
setPageLoading(false)
},[])
return (
<div className="content-wrapper w-full lg:flex xl:space-x-8 lg:space-x-4 bottomMargin">
<div className="lg:w-1/2 w-full mb-10 lg:mb-0">
<div className="add-fund w-full bg-white dark:bg-dark-white rounded-2xl shadow">
<div className='px-4 md:px-8 py-4'>
{wallet.loading ?
{pageLoading ?
<LoadingSpinner size='8' color='sky-blue' />
:
(
<div className="lg:w-1/2 w-full mb-10 lg:mb-0">
<div className="add-fund w-full bg-white dark:bg-dark-white rounded-2xl shadow">
<div className='px-4 md:px-8 py-4'>
{wallet.loading ?
<LoadingSpinner size='8' color='sky-blue' />
:
wallet.data.length ?
<h2 className='my-4 text-slate-500 dark:text-white text-sm xl:text-xl font-medium'>
{wallet.data.map(item => {
if(item.description == 'Naira'){
return `Withdraw from Naira Wallet : ${item.symbol}${(item.amount*0.01).toFixed(2)}`
}
})}
</h2>
:
wallet.error ?
<h2 className='my-4 text-slate-500 dark:text-white text-sm xl:text-xl font-medium'>Opps! An Error Occured</h2>
:
<h2 className='my-4 text-slate-500 dark:text-white text-sm xl:text-xl font-medium'>No Wallet Information Found!</h2>
}
</div>
<hr />
<div className='px-4 md:px-8 py-4 add-fund-info'>
<h2 className='my-2 text-slate-900 dark:text-white text-sm xl:text-xl font-medium'>Confirm Withdraw to Account</h2>
{/* AMOUNT */}
<div className="field w-full mb-3">
<InputCom
label="Amount:"
type="text"
name="amount"
value={state?.amount || ''}
disable={true}
/>
</div>
{/* RECIPIENT ACC: */}
<div className="field w-full mb-3">
<InputCom
label="Recipient Acc:"
type="text"
name="recipient"
value={state?.details.recipient || ''}
disable={true}
/>
</div>
{/* PROCESSING FEE: */}
<div className="field w-full mb-3">
<InputCom
label="Processing Fee:"
type="text"
name="processingFee"
value={state?.fee || ''}
disable={true}
/>
</div>
{/* TOTAL */}
<div className="field w-full mb-3">
<InputCom
label="Total"
type="text"
name="total"
value={state?.total || ''}
disable={true}
/>
</div>
{/* COMMENT/NOTE */}
<div className="field w-full mb-3">
<InputCom
label="Comment/Note:"
type="text"
name="comment"
value={state?.comment || ''}
disable={true}
/>
</div>
</div>
<hr />
{requestStatus.message && <p className={`text-base ${requestStatus.status? 'text-green-500' : 'text-red-500'} px-4 md:px-8 py-4`}>{requestStatus.message}</p>}
<div className='px-4 md:px-8 py-4 add-fund-btn flex justify-end items-center'>
{requestStatus.loading ?
<LoadingSpinner size='8' color='sky-blue' />
:
wallet.data.length ?
<h2 className='my-4 text-slate-500 dark:text-white text-sm xl:text-xl font-medium'>
{wallet.data.map(item => {
if(item.description == 'Naira'){
return `Withdraw from Naira Wallet : ${item.symbol}${(item.amount*1).toFixed(2)}`
}
})}
</h2>
:
wallet.error ?
<h2 className='my-4 text-slate-500 dark:text-white text-sm xl:text-xl font-medium'>Opps! An Error Occured</h2>
:
<h2 className='my-4 text-slate-500 dark:text-white text-sm xl:text-xl font-medium'>No Wallet Information Found!</h2>
}
</div>
<hr />
<div className='px-4 md:px-8 py-4 add-fund-info'>
<h2 className='my-2 text-slate-900 dark:text-white text-sm xl:text-xl font-medium'>Confirm Withdraw to Account</h2>
{/* AMOUNT */}
<div className="field w-full mb-3">
<InputCom
label="Amount:"
type="text"
name="amount"
value={state?.amount || ''}
disable={true}
/>
<button onClick={handleSubmit} className='text-lg text-white bg-sky-blue px-4 py-2 hover:opacity-90 rounded-md'>Transfer</button>
}
</div>
{/* RECIPIENT ACC: */}
<div className="field w-full mb-3">
<InputCom
label="Recipient Acc:"
type="text"
name="recipient"
value={state?.details.recipient || ''}
disable={true}
/>
</div>
{/* PROCESSING FEE: */}
<div className="field w-full mb-3">
<InputCom
label="Processing Fee:"
type="text"
name="processingFee"
value={state?.fee || ''}
disable={true}
/>
</div>
{/* TOTAL */}
<div className="field w-full mb-3">
<InputCom
label="Total"
type="text"
name="total"
value={state?.total || ''}
disable={true}
/>
</div>
{/* COMMENT/NOTE */}
<div className="field w-full mb-3">
<InputCom
label="Comment/Note:"
type="text"
name="comment"
value={state?.comment || ''}
disable={true}
/>
</div>
</div>
<hr />
<div className='px-4 md:px-8 py-4 add-fund-btn flex justify-end items-center'>
{requestStatus.loading ?
<LoadingSpinner size='8' color='sky-blue' />
:
<button onClick={handleSubmit} className='text-lg text-white bg-sky-blue px-4 py-2 hover:opacity-90 rounded-md'>Transfer</button>
}
</div>
</div>
</div>
)
}
<div className="lg:w-1/2 w-full mb-10 lg:mb-0">
<div className="wallet w-full px-4 md:px-8 py-4 h-full max-h-[800px] bg-white dark:bg-dark-white overflow-y-auto rounded-2xl shadow">
+1 -1
View File
@@ -103,7 +103,7 @@ function TransferFund({payment, wallet}) {
<h2 className='my-4 py-2 text-slate-900 dark:text-white text-xl lg:text-2xl font-medium'>
{wallet.data.map(item => {
if(item.description == 'Naira'){
return `Withdraw from Naira Wallet : ${item.symbol}${(item.amount*1).toFixed(2)}`
return `Withdraw from Naira Wallet : ${item.symbol}${(item.amount*0.01).toFixed(2)}`
}
})}
</h2>
+1 -1
View File
@@ -58,7 +58,7 @@ export default function WalletHeader(props) {
</div>
<div>
<p className="eth text-xl font-bold text-purple">
{(value.amount*1).toFixed(2)} {value.code}
{(value.amount*0.01).toFixed(2)} {value.code}
</p>
<p className="usd text-base text-thin-light-gray text-right">
{/*(773.69 USD)*/}
+13
View File
@@ -230,6 +230,19 @@ class usersService {
};
return this.postAuxEnd("/paymenthx", postData);
}
// API FUNCTION TO GET PAYMENT HISTORY
sendMoney(reqData){
var postData = {
uid: localStorage.getItem("uid"),
member_id: localStorage.getItem("member_id"),
sessionid: localStorage.getItem("session_token"),
senderid: localStorage.getItem("member_id"),
action: 33020,
...reqData
};
return this.postAuxEnd("/sendmoney", postData);
}
//END POINT CALL FOR REFERRAL HISTORY
getReferralHx(){