added verifyloan API

This commit is contained in:
victorAnumudu
2025-02-18 00:12:11 +01:00
parent dc2c1e7eab
commit 4bf728a38d
7 changed files with 80 additions and 33 deletions
@@ -11,11 +11,13 @@ import Pin from './loan_screen/Pin';
import Offers from './loan_screen/Offers';
import LoanPin from './loan_screen/LoanPin';
import SelectedOffer from './loan_screen/SelectedOffer';
import GetLoan from './loan_screen/GetLoan';
export default function GetLoan() {
export default function GetLoanScreens() {
let screens = {
products: 'products-screen',
getLoan: 'get-loan',
pin: 'pin-screen',
offers: 'offers-screen',
selected_offer: 'selected-offer-screen',
@@ -89,7 +91,7 @@ export default function GetLoan() {
<button
key={product?.cid}
disabled={isDisabled}
onClick={()=>handleStep(product, screens.pin)}
onClick={()=>handleStep(product, screens.getLoan)}
className={`w-full flex gap-2 justify-between items-center p-2 bg-purple-800 text-base sm:text-xl text-white font-bold rounded ${isDisabled && 'opacity-50'}`}
>
<span>{product?.description}</span>
@@ -100,14 +102,25 @@ export default function GetLoan() {
)}
</>
}
{/* <button
onClick={()=>handleStep({}, screens.getLoan)}
className={`w-full flex gap-2 justify-between items-center p-2 bg-purple-800 text-base sm:text-xl text-white font-bold rounded`}
>
<span>{'product?.description'}</span>
<IoIosArrowForward />
</button> */}
</div>
{products &&
{/* {products &&
<div className='mt-3 w-full h-full flex flex-col justify-end'>
<button onClick={()=>console.log('working')} className='w-full p-3 bg-orange-500 text-lg sm:text-2xl text-white font-bold rounded'>Pay Loan</button>
</div>
}
} */}
</>
: step?.screen[step.screen.length -1 ] == screens.pin ?
: step?.screen[step.screen.length -1 ] == screens.getLoan ?
<>
<GetLoan step={step} handleStep={handleStep} screens={screens} />
</>
:step?.screen[step.screen.length -1 ] == screens.pin ?
<>
<Pin step={step} handleStep={handleStep} screens={screens} />
</>
+20
View File
@@ -0,0 +1,20 @@
import React from 'react'
export default function GetLoan({step, handleStep, screens}) {
const handleGetLoan = () => {
handleStep({...step.details}, screens.pin)
}
return (
<div className='mt-3 h-full flex flex-col gap-3'>
<div className='mt-3 flex justify-center'>
<button onClick={handleGetLoan} className='p-3 bg-purple-800 text-lg sm:text-2xl text-white font-bold rounded'>Get Loan</button>
</div>
<div className='mt-3 w-full h-full flex flex-col justify-end'>
<button onClick={()=>console.log('working')} className='w-full p-3 bg-orange-500 text-lg sm:text-2xl text-white font-bold rounded'>Pay Loan</button>
</div>
</div>
)
}
+31 -14
View File
@@ -1,38 +1,47 @@
import React, { useState } from 'react'
import { useMutation } from '@tanstack/react-query'
import Label from '../Label'
import InputText from '../InputText'
import { verifyLoan } from '../../services/siteServices'
export default function LoanPin({step, handleStep, screens}) {
const [error, SetError] = useState('')
const [isSuccess, setIsSuccess] = useState(false)
const [error, setError] = useState('')
const [pin, setPin] = useState('')
const handlePinChange = ({target:{value}}) => {
SetError('')
setError('')
setPin(value)
}
const [isSuccess, setIsSuccess] = useState(false)
const handleContinue = () => {
if(!pin){
SetError('enter pin')
return setTimeout(()=>{
SetError('')
}, 5000)
const proceed = useMutation({
mutationFn: () => {
let fields = {pin, bvn:step.activeUser.bvn, loan_application_id:step.details.loan_application_id}
if(!fields.pin){
throw ({message:'Please enter pin'})
}
return verifyLoan(fields)
},
onError: (error) => {
setError(error.message)
setTimeout(()=>{setError('')},3000)
},
onSuccess: (res) => {
setIsSuccess(true)
}
setIsSuccess(prev => !prev)
}
})
return (
<>
{!isSuccess ?
<div className='mt-3 flex flex-col gap-4'>
<div className='text-input font-semibold w-full flex flex-col gap-4 justify-center items-center'>
<Label name='Enter your pin' htmlfor='pin' error={error} />
<Label name='Enter your pin' htmlfor='pin' />
<InputText id='pin' name='pin' type='text' value={pin} handleChange={handlePinChange} />
<button onClick={handleContinue} className='p-3 bg-purple-800 text-base sm:text-xl text-white font-bold rounded'>Continue</button>
<button onClick={()=>{proceed.mutate()}} disabled={proceed.isPending} className='p-3 bg-purple-800 text-base sm:text-xl text-white font-bold rounded'>{proceed.isPending ? 'loading...' : 'Continue'}</button>
</div>
</div>
:
@@ -44,6 +53,14 @@ export default function LoanPin({step, handleStep, screens}) {
</div>
}
{error &&
<>
<div className="w-full text-center p-2">
<p className='text-red-500 text-sm'>{error}</p>
</div>
</>
}
</>
)
}
-11
View File
@@ -32,16 +32,6 @@ export default function Pin({step, handleStep, screens}) {
}
})
const handleContinue = () => {
if(!pin){
SetError('enter pin')
return setTimeout(()=>{
SetError('')
}, 5000)
}
handleStep(step.details, screens.offers)
}
return (
<div className='mt-3 flex flex-col gap-4'>
{(!proceed.error || proceed?.error?.message == '*') &&
@@ -49,7 +39,6 @@ export default function Pin({step, handleStep, screens}) {
<Label name='Enter your pin' htmlfor='pin' error={error} />
<InputText id='pin' name='pin' type='text' value={pin} handleChange={handlePinChange} />
<button onClick={()=>{proceed.mutate()}} disabled={proceed.isPending} className='p-3 bg-purple-800 text-base sm:text-xl text-white font-bold rounded'>{proceed.isPending ? 'loading...' : 'Continue'}</button>
{/* <button onClick={handleContinue} className='p-3 bg-purple-800 text-base sm:text-xl text-white font-bold rounded'>Continue</button> */}
</div>
}
+1 -1
View File
@@ -34,7 +34,7 @@ export default function SelectedOffer({step, handleStep, screens}) {
},
onSuccess: (res) => {
// const selectedOffer = res.data.loan[0].loan
handleStep(step.details, screens.loan_pin)
handleStep({loan_application_id:res.data.loan_application_id[0], ...step.details}, screens.loan_pin)
}
})
+2 -2
View File
@@ -1,8 +1,8 @@
import React from 'react'
import GetLoan from '../components/GetLoan'
import GetLoanScreens from '../components/GetLoanScreens'
export default function GetLoanPage() {
return (
<GetLoan />
<GetLoanScreens />
)
}
+8
View File
@@ -58,6 +58,14 @@ export const verifyPin = (reqData) => {
return postAuxEnd('/salary/verifypin', postData, false)
}
// FUNCTION TO LOGIN USER IN
export const verifyLoan = (reqData) => {
let postData = {
...reqData
}
return postAuxEnd('/salary/verifloan', postData, false)
}
// FUNCTION TO RUN WHEN USER SELECTS A LOAN
export const loanSelect = (reqData) => {
let postData = {