loans API added

This commit is contained in:
victorAnumudu
2025-04-22 19:03:02 +01:00
parent 239b912585
commit fc9925a837
+17 -16
View File
@@ -1,6 +1,5 @@
import React from 'react'
import { useQuery } from "@tanstack/react-query";
import {Link} from 'react-router-dom'
import BreadcrumbCom from '../breadcrumb/BreadcrumbCom'
import TableWrapper from '../tableWrapper/TableWrapper'
@@ -10,17 +9,19 @@ import Avatar from '../../assets/user_avatar.jpg'
import queryKeys from '../../services/queryKeys'
import { getLoans } from '../../services/siteServices'
import getDateFromDateString from '../../helpers/GetDateFromDateString';
import formatNumber from '../../helpers/formatNumber'
import getTimeFromDateString from '../../helpers/GetTimeFromDateString';
export default function LoansCom() {
const {data, isFetching, isError, error} = useQuery({
const {data:allLoans, isFetching, isError, error} = useQuery({
queryKey: queryKeys.loans,
queryFn: () => getLoans()
})
const loans = data // LOANS LIST
console.log('LOANS', loans)
const loans = allLoans?.data?.loans // LOANS LIST
const loansCount = allLoans?.data?.count // LOANS LIST COUNT
// console.log('LOANS', loans)
return (
<div className='w-full flex flex-col gap-8'>
@@ -34,19 +35,19 @@ export default function LoansCom() {
: isError ?
<p className='text-red-500'>{error.message}</p>
:
<TableWrapper data={selectUsers} itemsPerPage={15}>
<TableWrapper data={loans} itemsPerPage={15}>
{({ data }) => (
<>
<table className="py-2 w-full text-sm">
<table className="table-auto py-2 w-full text-sm">
<thead className="py-2 text-sm text-slate-500 text-left">
<tr>
<th scope="col" className="px-2 py-2">
Name
</th>
<th scope="col" className="px-2">
Loan
<th scope="col" className="px-2 text-right">
Loan Amount
</th>
<th scope="col" className="px-2">
<th scope="col" className="px-2 text-right">
Added
</th>
<th scope="col" className="px-2 text-right">
@@ -61,20 +62,20 @@ export default function LoansCom() {
<div className='w-full min-w-48 flex items-center gap-2 whitespace-nowrap'>
<img className="w-10 h-10 rounded-md" src={Avatar} alt="Jese image" />
<div className="text-left">
<div className="text-base font-semibold">{item?.name || ''}</div>
<div className="font-normal text-gray-500">{item?.bvn}</div>
<div className="text-base font-semibold">{item?.account_id || ''}</div>
<div className="font-normal text-gray-500">{item?.customer_id}</div>
</div>
</div>
</td>
<td className="px-2">
<div className="text-left">
<div className="text-base font-semibold">{item?.loan}</div>
<div className="font-normal text-gray-500">{item?.description}</div>
<div className="text-right">
{/* <div className="text-base font-semibold">{formatNumber(item?.initial_loan_amount)}</div> */}
<div className="font-normal text-gray-500">{formatNumber(item?.initial_loan_amount)}</div>
</div>
</td>
<td className="px-2">
<div className="text-left">
<div className="font-normal text-gray-500">{getDateFromDateString(item?.added)} {getTimeFromDateString(item?.added)}</div>
<div className="text-right">
<div className="font-normal text-gray-500">{getDateFromDateString(item?.created_at)}</div>
</div>
</td>
<td className="px-2 text-right">