handling adding recipient done

This commit is contained in:
victorAnumudu
2023-04-27 13:49:19 +01:00
parent 53b9db85a5
commit e26330af9a
4 changed files with 110 additions and 58 deletions
+50 -48
View File
@@ -2,6 +2,7 @@ import React, {useEffect, useState} from 'react'
import { Link } from 'react-router-dom'
import RecentActivityTable from './WalletComponent/RecentActivityTable'
import LoadingSpinner from '../Spinners/LoadingSpinner'
import InputCom from '../Helpers/Inputs/InputCom'
import usersService from '../../services/UsersService'
@@ -97,57 +98,53 @@ function TransferFund({payment, wallet}) {
:
<h2 className='my-4 py-2 text-slate-900 dark:text-white text-xl lg:text-2xl font-medium'>No Wallet Information Found!</h2>
}
<div className='my-3 md:flex items-center justify-between space-x-2'>
<div className='transfer-input w-full md:w-1/2'>
<label className='w-full text-slate-600 text-lg'>Amount <span className='text-red-500'>*</span></label>
<input className='w-full p-3 text-lg text-right bg-slate-100 rounded-md outline-0 placeholder:text-slate-500 placeholder:text-lg'
value={inputs.amount}
name='amount'
type="text"
placeholder='Amount'
required
onChange={handleChange}
<div className="xl:flex xl:space-x-7 mb-6">
<div className="field w-full mb-6 xl:mb-0">
<InputCom
label="Amount"
type="text"
name="amount"
value={inputs.amount}
inputHandler={handleChange}
onMouseEnter={()=>{setNewFee(false)}}
onMouseLeave={()=>{setNewFee(true)}}
/>
/>
</div>
<div className='transfer-input w-full md:w-1/2'>
<label className='w-full text-slate-600 text-lg'>Fee <span className='text-red-500'>*</span></label>
<input className='w-full p-3 text-lg text-right bg-slate-100 opacity-50 rounded-md outline-0 placeholder:text-slate-500 placeholder:text-lg'
value={sendMoneyFee.fee}
name='fee'
type="text"
placeholder='Fee'
required
disabled
/>
<div className="field w-full">
<InputCom
label="Fee"
type="text"
name="fee"
value={sendMoneyFee.fee}
disable={true}
/>
</div>
</div>
<div className='my-3 md:flex items-center justify-end space-x-2'>
<div className='transfer-input w-full md:w-1/2'>
<label className='w-full text-slate-600 text-lg'>Total <span className='text-red-500'>*</span></label>
<input className='w-full p-3 text-lg text-right bg-slate-100 opacity-50 rounded-md outline-0 placeholder:text-slate-500 placeholder:text-lg'
value={sendMoneyFee.total}
name='total'
type="text"
placeholder='Total'
required
disabled
/>
<div className='md:flex items-center justify-end'>
<div className="field w-full lg:w-1/2 mb-6">
<InputCom
label="Total"
type="text"
name="total"
value={sendMoneyFee.total}
disable={true}
/>
</div>
</div>
<div className='relative my-3 md:flex items-center'>
<div className='transfer-input w-full'>
<div className='flex items-center justify-start'>
<label className='text-slate-600 text-lg'>Recipient
<div className='flex items-center justify-start py-2'>
<label className='text-[#181c32] dark:text-white text-base font-semibold block mb-2.5'>Recipient
<span className='text-red-500 mx-2'>*</span>
<span title='Transfer Recipient' className={`text-white text-sm bg-slate-500 w-1 h-1 rounded-full px-3 py-1 cursor-pointer`}>!</span>
</label>
<Link to='add-recipient' className='mx-1 text-base text-white p-3 bg-[orange] rounded-md hover:opacity-80'>Add New</Link>
<Link to='add-recipient' className='mx-1 text-base text-white p-2 bg-[orange] rounded-md hover:opacity-80'>Add New</Link>
</div>
<select className='mt-2 w-full p-3 text-lg bg-white rounded-md border border-slate-300 outline-0' value={inputs.recipient} name='recipient' onChange={handleChange}>
<select className='w-full text-base p-2 text-dark-gray dark:text-white rounded-md border border-slate-300 outline-0' value={inputs.recipient} name='recipient' onChange={handleChange}>
{recepients.loading ?
<option className='text-slate-500 text-lg' value="">Loading...</option>
:
@@ -168,18 +165,23 @@ function TransferFund({payment, wallet}) {
</div>
</div>
<div className='my-3 md:flex items-center'>
<div className='transfer-input w-full'>
<label className='w-full text-slate-600 text-lg'>Comment <span className='text-red-500'>*</span></label>
<input className='w-full p-3 text-lg bg-slate-100 rounded-md outline-0 placeholder:text-slate-500 placeholder:text-lg'
value={inputs.comment}
name='comment'
type="text"
placeholder='Comment'
required
onChange={handleChange}
/>
</div>
<div className="field w-full mb-6">
{/* <InputCom
label="Comment"
type="text"
name="comment"
value={inputs.comment}
inputHandler={handleChange}
/> */}
<label className='text-[#181c32] dark:text-white text-base font-semibold block mb-2.5'>Comment</label>
<textarea style={{resize: 'none'}}
className='text-base px-6 text-dark-gray dark:text-white w-full bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-none'
name="comment"
value={inputs.comment}
onChange={handleChange}
cols="30"
rows="2"
/>
</div>
<div className='transfer-fund-btn flex justify-end items-center py-4'>