MERMS/MermsFirstOffice
1
0
Fork 0
Code Issues Pull Requests 1 Releases Activity

account view subscription table data fixed

Browse Source
This commit is contained in:
victorAnumudu
2025-09-28 14:31:22 +01:00
parent 9a0ed2d78c
commit ebcde80a3d
5 changed files with 242 additions and 161 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/account_view/CustomerPaymentsView.jsx
+61 -42
View File
@@ -1,48 +1,67 @@
export default function CustomerPaymentsView() {
export default function CustomerPaymentsView({payments}) {
return <>
<div className="row" style={{paddingBottom:'20px'}}>
<div className="col-12 col-lg-12">
<div className="card card-statistics">
<div className="card-header">
<div className="card-heading">
<h4 className="card-title"><b>Payments</b></h4>
</div>
</div>
<div className="card-body">
<div className="table-responsive">
<table className="table table-hover mb-0" style={{width:'100%', backgroundColor: 'aliceblue', borderRadius: '10px'}}>
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">First</th>
<th scope="col">Last</th>
<th scope="col">Handle</th>
<div className="pb-5">
<div className="flex flex-col gap-1">
<div className="w-full">
<h4 className="font-semibold text-lg">Payments</h4>
</div>
<div className="w-full overflow-x-auto">
<>
<table className="py-2 w-full text-sm" style={{backgroundColor: 'aliceblue', borderRadius: '10px'}}>
<thead className="py-2 text-sm text-slate-500 text-left">
<tr>
<th scope="col" className="px-2 py-2">
#
</th>
<th scope="col" className="px-2">
First
</th>
<th scope="col" className="px-2">
Last
</th>
<th scope="col" className="px-2">
Handle
</th>
</tr>
</thead>
<tbody>
{(payments && payments.length > 0) ? payments?.map((item, index) => (
<tr key={index} className="py-2 border-t border-dashed border-slate-300">
<td className="px-2 py-2">
<div className="text-left">
<div className="text-base font-semibold">{index+1}</div>
</div>
</td>
<td className="px-2">
<div className="text-left">
<div className="text-base font-semibold">{item?.first}</div>
</div>
</td>
<td className="px-2">
<div className="text-left">
<div className="text-base font-semibold">{item?.last}</div>
</div>
</td>
<td className="px-2">
<div className="text-left">
<div className="text-base font-semibold">{item?.handle}</div>
</div>
</td>
</tr>
))
:
<tr className="py-2 border-t border-dashed border-slate-300">
<td className="px-3 py-2" colSpan={4}>
<div className="flex justify-center items-center">
No Record Found
</div>
</td>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>Mark</td>
<td>Otto</td>
<td>@mdo</td>
</tr>
<tr>
<th scope="row">2</th>
<td>Jacob</td>
<td>Thornton</td>
<td>@fat</td>
</tr>
<tr>
<th scope="row">3</th>
<td>Larry</td>
<td>the Bird</td>
<td>@twitter</td>
</tr>
</tbody>
</table>
</div>
</div>
}
</tbody>
</table>
</>
</div>
</div>
</div>