loan repay API added
This commit is contained in:
victorAnumudu
+15
-15
@@ -2,15 +2,15 @@
|
||||
import { useQuery } from "@tanstack/react-query";
|
||||
import { useNavigate } from 'react-router-dom'
|
||||
|
||||
import { CiPhone } from "react-icons/ci"
|
||||
import { CiBank } from "react-icons/ci";
|
||||
import { MdOutlineEmail } from "react-icons/md"
|
||||
import { FaMapPin } from "react-icons/fa";
|
||||
import { BsCash } from "react-icons/bs";
|
||||
import { MdUpdate } from "react-icons/md"
|
||||
import { FaUser, FaMapPin } from "react-icons/fa";
|
||||
|
||||
import { demoUsersList } from "../services/siteServices"
|
||||
import queryKeys from "../services/queryKeys"
|
||||
import myLinks from "../myLinks";
|
||||
import TableWrapper from "./TableWrapper";
|
||||
import formatNumber from "../helpers/formatNumber";
|
||||
|
||||
export default function HomeCom() {
|
||||
|
||||
@@ -56,27 +56,27 @@ export default function HomeCom() {
|
||||
<div className="card-body flex flex-col gap-2">
|
||||
<div className="contact text-slate-700 flex gap-2 items-center">
|
||||
<span className="min-w-[30px] min-h-[30px] max-w-[30px] max-h-[30px] rounded-full flex flex-col justify-center items-center bg-slate-100/90 text-slate-700">
|
||||
<CiBank />
|
||||
<FaUser />
|
||||
</span>
|
||||
<span>{user.bvn}</span>
|
||||
<span>{user.accountid}</span>
|
||||
</div>
|
||||
<div className="contact text-slate-700 flex gap-3 items-center">
|
||||
<span className="min-w-[30px] min-h-[30px] max-w-[30px] max-h-[30px] rounded-full flex flex-col justify-center items-center bg-slate-100/90 text-slate-700">
|
||||
<CiPhone />
|
||||
<BsCash />
|
||||
</span>
|
||||
<span>{user.mobile}</span>
|
||||
</div>
|
||||
<div className="contact text-slate-700 flex gap-3 items-center">
|
||||
<span className="min-w-[30px] min-h-[30px] max-w-[30px] max-h-[30px] rounded-full flex flex-col justify-center items-center bg-slate-100/90 text-slate-700">
|
||||
<MdOutlineEmail />
|
||||
</span>
|
||||
<span className="break-words">{user.email}</span>
|
||||
<span>{formatNumber(user.balance)}</span>
|
||||
</div>
|
||||
<div className="contact text-slate-700 flex gap-3 items-center">
|
||||
<span className="min-w-[30px] min-h-[30px] max-w-[30px] max-h-[30px] rounded-full flex flex-col justify-center items-center bg-slate-100/90 text-slate-700">
|
||||
<FaMapPin />
|
||||
</span>
|
||||
<span>{user.pin}</span>
|
||||
<span className="break-words">{user.pin}</span>
|
||||
</div>
|
||||
<div className="contact text-slate-700 flex gap-3 items-center">
|
||||
<span className="min-w-[30px] min-h-[30px] max-w-[30px] max-h-[30px] rounded-full flex flex-col justify-center items-center bg-slate-100/90 text-slate-700">
|
||||
<MdUpdate />
|
||||
</span>
|
||||
<span>{user.updated}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -2,10 +2,12 @@ import React, { useState } from 'react'
|
||||
import { useMutation } from '@tanstack/react-query'
|
||||
import Label from '../../Label'
|
||||
import InputText from '../../InputText'
|
||||
import { verifyLoan } from '../../../services/siteServices'
|
||||
import { repayLoan } from '../../../services/siteServices'
|
||||
|
||||
export default function PinRepayment({step, handleStep, screens}) {
|
||||
|
||||
console.log('step', step.activeUser, step.details)
|
||||
|
||||
const [isSuccess, setIsSuccess] = useState(false)
|
||||
|
||||
const [error, setError] = useState('')
|
||||
@@ -19,17 +21,15 @@ export default function PinRepayment({step, handleStep, screens}) {
|
||||
|
||||
const proceed = useMutation({
|
||||
mutationFn: () => {
|
||||
let fields = {pin, bvn:step.activeUser.bvn, loan_application_id:step.details.loan_application_id}
|
||||
let fields = {pin, loan_id:step.details.selected_loan_id, customerID:step.activeUser.customerid}
|
||||
if(!fields.pin){
|
||||
throw ({message:'Please enter pin'})
|
||||
}
|
||||
// if(isNaN(fields.pin)){
|
||||
// throw ({message:'Amount must be a valid figure'})
|
||||
// }
|
||||
|
||||
if(fields.pin.length != 4){
|
||||
throw ({message:'Pin must be 4 digits'})
|
||||
}
|
||||
return verifyLoan(fields)
|
||||
return repayLoan(fields)
|
||||
},
|
||||
onError: (error) => {
|
||||
setError(error.message)
|
||||
@@ -41,14 +41,6 @@ export default function PinRepayment({step, handleStep, screens}) {
|
||||
}
|
||||
})
|
||||
|
||||
const handleClick = (selectedAmount) => { // remove later
|
||||
if(!pin){
|
||||
return setError('Enter Pin')
|
||||
}
|
||||
setIsSuccess(true)
|
||||
// handleStep({selectedAmount}, screens.finished)
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
{!isSuccess ?
|
||||
@@ -57,8 +49,7 @@ export default function PinRepayment({step, handleStep, screens}) {
|
||||
<p className='text-center text-base md:text-xl'>{`Your loan amount due is ${step.details.selectedAmount}`}</p>
|
||||
<Label name='Enter your 4 Digit pin' htmlfor='pin' />
|
||||
<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={()=>handleClick()} 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>
|
||||
:
|
||||
|
||||
@@ -17,27 +17,23 @@ export default function RepayLoanList({step, handleStep, screens}) {
|
||||
|
||||
const loanInfoList = data?.data // LOAN INFO LIST
|
||||
|
||||
const selectedLoan = useMutation({
|
||||
mutationFn: (details) => {
|
||||
let fields = {bvn:step.activeUser.bvn, loan: details.loan}
|
||||
// if(!fields.bvn){
|
||||
// throw new Error('*')
|
||||
// }
|
||||
setSelectedAmount(details.amount)
|
||||
return loanSelect(fields)
|
||||
},
|
||||
onError: (error) => {
|
||||
// setError('*')
|
||||
},
|
||||
onSuccess: (res) => {
|
||||
const selectedOffer = res.data.loan
|
||||
handleStep({selectedAmount, selectedOffer, ...res.data}, screens.repay_pin)
|
||||
}
|
||||
})
|
||||
// const selectedLoan = useMutation({
|
||||
// mutationFn: (details) => {
|
||||
// let fields = {bvn:step.activeUser.bvn, loan: details.loan}
|
||||
// setSelectedAmount(details.amount)
|
||||
// return loanSelect(fields)
|
||||
// },
|
||||
// onError: (error) => {
|
||||
// },
|
||||
// onSuccess: (res) => {
|
||||
// const selectedOffer = res.data.loan
|
||||
// handleStep({selectedAmount, selectedOffer, ...res.data}, screens.repay_pin)
|
||||
// }
|
||||
// })
|
||||
|
||||
const handleClick = (selectedAmount) => { // remove later
|
||||
handleStep({selectedAmount}, screens.repay_pin)
|
||||
}
|
||||
const handleClick = (selected_loan_id, selectedAmount) => {
|
||||
handleStep({selected_loan_id, selectedAmount}, screens.repay_pin)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className='mt-3 flex flex-col gap-4'>
|
||||
@@ -64,7 +60,7 @@ export default function RepayLoanList({step, handleStep, screens}) {
|
||||
disabled={isDisabled || selectedLoan.isPending}
|
||||
// value={item.loan}
|
||||
// onClick={()=>selectedLoan.mutate(item)}
|
||||
onClick={()=>handleClick(amount)}
|
||||
onClick={()=>handleClick(item.loan_id, amount)}
|
||||
className={`w-full flex gap-2 justify-between items-center p-2 bg-purple-800 ${selectedLoan.isPending && 'bg-purple-800/50'} text-base sm:text-xl text-white font-bold rounded ${isDisabled && 'opacity-50'}`}
|
||||
>
|
||||
{item?.description}
|
||||
|
||||
@@ -0,0 +1,6 @@
|
||||
const formatNumber = (number = 0) => {
|
||||
// return new Intl.NumberFormat().format(number);
|
||||
return number.toFixed(2);
|
||||
};
|
||||
|
||||
export default formatNumber
|
||||
@@ -58,7 +58,7 @@ export const verifyPin = (reqData) => {
|
||||
return postAuxEnd('/salary/verifypin', postData, false)
|
||||
}
|
||||
|
||||
// FUNCTION TO LOGIN USER IN
|
||||
// FUNCTION TO VERIFY LOAN
|
||||
export const verifyLoan = (reqData) => {
|
||||
let postData = {
|
||||
...reqData
|
||||
@@ -66,6 +66,14 @@ export const verifyLoan = (reqData) => {
|
||||
return postAuxEnd('/salary/verifloan', postData, false)
|
||||
}
|
||||
|
||||
// FUNCTION TO REPAY LOAN
|
||||
export const repayLoan = (reqData) => {
|
||||
let postData = {
|
||||
...reqData
|
||||
}
|
||||
return postAuxEnd('/loan/repay', postData, false)
|
||||
}
|
||||
|
||||
// FUNCTION TO RUN WHEN USER SELECTS A LOAN
|
||||
export const loanSelect = (reqData) => {
|
||||
let postData = {
|
||||
|
||||
Reference in New Issue
Block a user