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

Add fund page

Browse Source
This commit is contained in:
CHIEFSOFT\ameye
2023-06-17 08:55:12 -04:00
parent fcca050ff6
commit 134be6a1f0
1 changed files with 47 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/MyWallet/AddFund.jsx
+47 -36
View File
@@ -36,49 +36,60 @@ function AddFund({payment}) {
setInput('')
}
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">
<h2 className='md:p-8 p-4 text-slate-900 dark:text-white text-xl lg:text-2xl font-medium'>Add Credit with Account Deposit</h2>
<hr />
<form className='md:p-8 p-4 add-fund-info'>
<div className='md:flex items-center'>
<label className='w-full md:w-2/4 text-slate-600 text-lg'>Amount(Naira) <span className='text-red-500'>*</span></label>
<input className='w-full md:w-2/4 p-3 text-lg text-right bg-slate-100 rounded-md outline-0 placeholder:text-slate-500 placeholder:text-lg'
value={input}
name='amount'
type="text"
placeholder='Amount'
required
onChange={handleChange}
<div>
{/* heading */}
<div className="sm:flex justify-between items-center mb-6">
<div className="mb-5 sm:mb-0">
<h1 className="text-26 font-bold inline-flex gap-3 text-dark-gray dark:text-white items-center">
Add Credit
</h1>
</div>
<div className="slider-btns flex space-x-4">
<div
onClick={() => filterHandler("today")}
className="relative"
></div>
</div>
</div>
<div className="content-wrapper w-full lg:flex xl:space-x-8 lg:space-x-4 bottomMargin">
<div className="lg:w-2/2 w-full mb-10 lg:mb-0">
<div className="add-fund w-full bg-white dark:bg-dark-white rounded-2xl shadow">
{/*<h2 className='md:p-8 p-4 text-slate-900 dark:text-white text-xl lg:text-2xl font-medium'>Add Credit with Account Deposit</h2>*/}
{/*<hr />*/}
<form className='md:p-8 p-4 add-fund-info'>
<div className='md:flex items-center'>
<label className='w-full md:w-2/4 text-slate-600 text-lg'>Amount(Naira) <span className='text-red-500'>*</span></label>
<input className='w-full md:w-2/4 p-3 text-lg text-right bg-slate-100 rounded-md outline-0 placeholder:text-slate-500 placeholder:text-lg'
value={input}
name='amount'
type="text"
placeholder='Amount'
required
onChange={handleChange}
/>
</div>
{inputError && <p className='text-base text-red-500'>{inputError}</p>}
</form>
</div>
{inputError && <p className='text-base text-red-500'>{inputError}</p>}
</form>
<hr />
<div className='md:p-8 p-4 add-fund-btn flex justify-end items-center py-4'>
<button onClick={handleSubmit} className='text-lg text-white bg-sky-blue px-4 py-2 hover:opacity-90 rounded-md'>Continue</button>
</div>
</div>
<div className="add-fund py-4 my-2 w-full bg-white dark:bg-dark-white rounded-2xl shadow">
<h2 className='md:px-8 px-4 py-4 text-slate-900 dark:text-white text-xl lg:text-2xl font-medium'>Add Credit with Account Deposit</h2>
<hr />
<p className='md:px-8 px-4 py-2 text-slate-600 dark:text-white text-base lg:text-xl font-medium'>Transfer fund to WrenchBoard GTB Account 0250869867</p>
<p className='md:px-8 px-4 py-2 text-slate-500 dark:text-white text-sm lg:text-base font-medium'>
Make sure you add your account username in the notes part of the transfer for prompt processing. When the transfer is complete notify here <a className='text-sky-blue' href='#'>Contact us</a>
</p>
</div>
</div>
</div>
<div className="lg:w-1/2 w-full mb-10 lg:mb-0">
<div className="wallet w-full md:p-8 p-4 h-full max-h-[590px] bg-white dark:bg-dark-white overflow-y-auto rounded-2xl shadow">
<h2 className='text-gray-900 dark:text-white text-xl lg:text-2xl font-medium'>Recent Activity</h2>
{/* <p className='text-base text-gray-600 dark:text-white'>Activity Report</p> */}
{payment.loading ?
<LoadingSpinner size='16' color='sky-blue' />
:
<RecentActivityTable payment={payment}/>
}
<div className="content-wrapper w-full lg:flex xl:space-x-8 lg:space-x-4 bottomMargin">
<div className="lg:w-2/2 w-full mb-10 lg:mb-0">
<div className="wallet w-full md:p-8 p-4 h-full max-h-[590px] bg-white dark:bg-dark-white overflow-y-auto rounded-2xl shadow">
<h2 className='text-gray-900 dark:text-white text-xl lg:text-2xl font-medium'>Recent Activity</h2>
{/* <p className='text-base text-gray-600 dark:text-white'>Activity Report</p> */}
{payment.loading ?
<LoadingSpinner size='16' color='sky-blue' />
:
<RecentActivityTable payment={payment}/>
}
</div>
</div>
</div>
</div>