Updated api usage, corrected table designs
This commit is contained in:
@@ -353,27 +353,27 @@ export const SiteVisitsPage: React.FC = () => {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-[#0f1523]/80 backdrop-blur-md rounded-2xl border border-slate-800/80 shadow-xl overflow-hidden">
|
||||
<div className="bg-[#0f1523]/80 rounded-2xl border border-slate-800/80 shadow-lg backdrop-blur-sm overflow-hidden">
|
||||
<div className="overflow-x-auto">
|
||||
<table className="w-full text-left border-collapse">
|
||||
<table className="w-full text-left text-xs border-collapse">
|
||||
<thead>
|
||||
<tr className="border-b border-slate-800/80 bg-slate-900/50 text-[11px] font-semibold text-slate-400 uppercase tracking-wider">
|
||||
<SortableTh column="inspectorName" currentColumn={visitSortCol} direction={visitSortDir} onSort={handleVisitSort}>
|
||||
<tr className="bg-[#0d121f]/95 border-b border-slate-800/80 text-slate-400 uppercase tracking-wider font-semibold text-[11px]">
|
||||
<SortableTh column="inspectorName" currentColumn={visitSortCol} direction={visitSortDir} onSort={handleVisitSort} className="py-3.5 px-5 whitespace-nowrap">
|
||||
Inspector Name
|
||||
</SortableTh>
|
||||
<SortableTh column="visitedAt" currentColumn={visitSortCol} direction={visitSortDir} onSort={handleVisitSort}>
|
||||
<SortableTh column="visitedAt" currentColumn={visitSortCol} direction={visitSortDir} onSort={handleVisitSort} className="py-3.5 px-4 whitespace-nowrap">
|
||||
Inspection Date
|
||||
</SortableTh>
|
||||
<SortableTh column="findings" currentColumn={visitSortCol} direction={visitSortDir} onSort={handleVisitSort}>
|
||||
<SortableTh column="findings" currentColumn={visitSortCol} direction={visitSortDir} onSort={handleVisitSort} className="py-3.5 px-4 whitespace-nowrap">
|
||||
Field Observations & Findings
|
||||
</SortableTh>
|
||||
<SortableTh column="status" currentColumn={visitSortCol} direction={visitSortDir} onSort={handleVisitSort}>
|
||||
<SortableTh column="status" currentColumn={visitSortCol} direction={visitSortDir} onSort={handleVisitSort} className="py-3.5 px-4 whitespace-nowrap">
|
||||
Verification Status
|
||||
</SortableTh>
|
||||
<th className="py-3 px-4 text-right">Actions</th>
|
||||
<th className="py-3.5 px-5 text-right font-medium whitespace-nowrap">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="divide-y divide-slate-800/60 text-xs">
|
||||
<tbody className="divide-y divide-slate-800/60">
|
||||
{loadingVisits ? (
|
||||
<tr>
|
||||
<td colSpan={5} className="py-12 text-center text-slate-400">
|
||||
@@ -391,14 +391,14 @@ export const SiteVisitsPage: React.FC = () => {
|
||||
</tr>
|
||||
) : (
|
||||
sortedVisits.map((v) => (
|
||||
<tr key={v.id} className="hover:bg-slate-800/30 transition">
|
||||
<td className="py-3.5 px-4 font-semibold text-white">
|
||||
<tr key={v.id} className="hover:bg-slate-800/40 transition-colors">
|
||||
<td className="py-3.5 px-5 whitespace-nowrap font-semibold text-white">
|
||||
<div className="flex items-center gap-2">
|
||||
<User className="w-3.5 h-3.5 text-emerald-400 shrink-0" />
|
||||
<span>{v.inspectorName || 'Field Officer'}</span>
|
||||
</div>
|
||||
</td>
|
||||
<td className="py-3.5 px-4 text-slate-300 font-medium">
|
||||
<td className="py-3.5 px-4 whitespace-nowrap text-slate-300 font-medium">
|
||||
<div className="flex items-center gap-1.5 text-slate-300">
|
||||
<Calendar className="w-3 h-3 text-slate-500" />
|
||||
<span>{formatDate(v.visitedAt)}</span>
|
||||
@@ -407,8 +407,8 @@ export const SiteVisitsPage: React.FC = () => {
|
||||
<td className="py-3.5 px-4 text-slate-300 max-w-sm truncate" title={v.findings || ''}>
|
||||
{v.findings || 'No findings recorded.'}
|
||||
</td>
|
||||
<td className="py-3.5 px-4">{getApprovalStatusBadge(v.status)}</td>
|
||||
<td className="py-3.5 px-4 text-right space-x-2">
|
||||
<td className="py-3.5 px-4 whitespace-nowrap">{getApprovalStatusBadge(v.status)}</td>
|
||||
<td className="py-3.5 px-5 text-right whitespace-nowrap space-x-2">
|
||||
<button
|
||||
onClick={() => {
|
||||
setSelectedVisitForDetail(v);
|
||||
|
||||
Reference in New Issue
Block a user