DigiFi/digifi-FirstOffice
1
0
Fork 0
Code Issues Pull Requests Releases Activity

loans API added

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