Goutam/LynkedUpPro_CRM
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

adds subcontractor project history and payments table a amount column

Browse Source
This commit is contained in:
Satyam Rastogi
2026-05-20 19:32:55 +05:30
parent 6838d6c38e
commit ad39848b0f
1 changed files with 17 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/subcontractor/SubContractorDashboard.jsx
+17 -2
View File
@@ -258,6 +258,8 @@ const SubContractorDashboard = () => {
const status = t.paymentStatus === 'Paid' const status = t.paymentStatus === 'Paid'
? 'Paid' ? 'Paid'
: (requestedAt ? 'Requested' : 'Pending'); : (requestedAt ? 'Requested' : 'Pending');
const expenses = (t.expenses || []).reduce((s, e) => s + (Number(e.amount) || 0), 0);
const fees = (t.fees || []).reduce((s, f) => s + (Number(f.amount) || 0), 0);
return { return {
id: t.id, id: t.id,
projectId: t.projectId || null, projectId: t.projectId || null,
@@ -265,6 +267,7 @@ const SubContractorDashboard = () => {
projectAddress: project?.address || t.location || '', projectAddress: project?.address || t.location || '',
requestedAt, requestedAt,
receivedAt, receivedAt,
amount: expenses + fees,
note: t.title || '', note: t.title || '',
description: t.description || '', description: t.description || '',
status, status,
@@ -488,7 +491,7 @@ const SubContractorDashboard = () => {
</div> </div>
) : ( ) : (
<div className="overflow-x-auto rounded-xl border border-zinc-200 dark:border-white/5"> <div className="overflow-x-auto rounded-xl border border-zinc-200 dark:border-white/5">
<table className="w-full text-left min-w-[840px]"> <table className="w-full text-left min-w-[940px]">
<thead> <thead>
<tr className="border-b border-zinc-200 dark:border-white/5 bg-zinc-50 dark:bg-white/[0.02]"> <tr className="border-b border-zinc-200 dark:border-white/5 bg-zinc-50 dark:bg-white/[0.02]">
<th className="px-4 py-2.5 text-[10px] font-mono font-bold text-zinc-500 uppercase tracking-widest">Project ID</th> <th className="px-4 py-2.5 text-[10px] font-mono font-bold text-zinc-500 uppercase tracking-widest">Project ID</th>
@@ -505,6 +508,7 @@ const SubContractorDashboard = () => {
</button> </button>
</th> </th>
<th className="px-4 py-2.5 text-[10px] font-mono font-bold text-zinc-500 uppercase tracking-widest">Received</th> <th className="px-4 py-2.5 text-[10px] font-mono font-bold text-zinc-500 uppercase tracking-widest">Received</th>
<th className="px-4 py-2.5 text-[10px] font-mono font-bold text-zinc-500 uppercase tracking-widest text-right">Amount</th>
<th className="px-4 py-2.5 text-[10px] font-mono font-bold text-zinc-500 uppercase tracking-widest">Note</th> <th className="px-4 py-2.5 text-[10px] font-mono font-bold text-zinc-500 uppercase tracking-widest">Note</th>
<th className="px-4 py-2.5 text-[10px] font-mono font-bold text-zinc-500 uppercase tracking-widest">Status</th> <th className="px-4 py-2.5 text-[10px] font-mono font-bold text-zinc-500 uppercase tracking-widest">Status</th>
</tr> </tr>
@@ -554,6 +558,11 @@ const SubContractorDashboard = () => {
{row.receivedAt ? new Date(row.receivedAt).toLocaleDateString('en-US', { year: 'numeric', month: 'short', day: 'numeric' }) : 'Not received'} {row.receivedAt ? new Date(row.receivedAt).toLocaleDateString('en-US', { year: 'numeric', month: 'short', day: 'numeric' }) : 'Not received'}
</span> </span>
</td> </td>
<td className="px-4 py-3 text-right">
<span className={`font-mono text-xs font-bold whitespace-nowrap ${row.amount > 0 ? (row.status === 'Paid' ? 'text-emerald-600 dark:text-emerald-400' : 'text-amber-600 dark:text-amber-400') : 'text-zinc-400 dark:text-zinc-500'}`}>
{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD', maximumFractionDigits: 0 }).format(row.amount)}
</span>
</td>
<td className="px-4 py-3"> <td className="px-4 py-3">
<button <button
type="button" type="button"
@@ -633,7 +642,7 @@ const SubContractorDashboard = () => {
<div className="text-xs text-zinc-500 dark:text-zinc-400 mt-0.5">{noteModal.projectAddress}</div> <div className="text-xs text-zinc-500 dark:text-zinc-400 mt-0.5">{noteModal.projectAddress}</div>
)} )}
</div> </div>
<div className="grid grid-cols-2 gap-3 text-sm"> <div className="grid grid-cols-3 gap-3 text-sm">
<div className="p-3 rounded-xl bg-zinc-50 dark:bg-white/5 border border-zinc-200 dark:border-white/5"> <div className="p-3 rounded-xl bg-zinc-50 dark:bg-white/5 border border-zinc-200 dark:border-white/5">
<div className="text-[10px] uppercase font-bold tracking-wider text-zinc-500 mb-1">Requested</div> <div className="text-[10px] uppercase font-bold tracking-wider text-zinc-500 mb-1">Requested</div>
<div className="font-mono text-zinc-900 dark:text-white"> <div className="font-mono text-zinc-900 dark:text-white">
@@ -646,6 +655,12 @@ const SubContractorDashboard = () => {
{noteModal.receivedAt ? new Date(noteModal.receivedAt).toLocaleDateString('en-US', { year: 'numeric', month: 'short', day: 'numeric' }) : 'Not received'} {noteModal.receivedAt ? new Date(noteModal.receivedAt).toLocaleDateString('en-US', { year: 'numeric', month: 'short', day: 'numeric' }) : 'Not received'}
</div> </div>
</div> </div>
<div className="p-3 rounded-xl bg-zinc-50 dark:bg-white/5 border border-zinc-200 dark:border-white/5">
<div className="text-[10px] uppercase font-bold tracking-wider text-zinc-500 mb-1">Amount</div>
<div className={`font-mono font-bold ${noteModal.amount > 0 ? (noteModal.status === 'Paid' ? 'text-emerald-600 dark:text-emerald-400' : 'text-amber-600 dark:text-amber-400') : 'text-zinc-400'}`}>
{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD', maximumFractionDigits: 0 }).format(noteModal.amount || 0)}
</div>
</div>
</div> </div>
<div> <div>
<div className="text-[10px] uppercase font-bold tracking-wider text-zinc-500 mb-1">Note</div> <div className="text-[10px] uppercase font-bold tracking-wider text-zinc-500 mb-1">Note</div>