import React, { useState } from 'react'; import { Head } from '@inertiajs/react'; import AdminLayout from '@/Layouts/AdminLayout'; import { FileText, Users, ShieldAlert, CreditCard, Search, RefreshCw, Download, Building2, DollarSign } from 'lucide-react'; export default function AnalyticsHub({ worker_stats = { total: 0, verified: 0, active: 0, inactive: 0 }, sponsor_stats = { total: 0, verified: 0, active_subscribers: 0, unpaid: 0 }, dispute_stats = { total: 0, open: 0, under_review: 0, resolved: 0 }, safety_stats = { total: 0, pending: 0, resolved: 0 }, payments = [], total_revenue = 0 }) { const [searchTerm, setSearchTerm] = useState(''); const [statusFilter, setStatusFilter] = useState('all'); // Filter payments dynamically const filteredPayments = payments.filter(payment => { const matchesSearch = payment.id.toString().toLowerCase().includes(searchTerm.toLowerCase()) || payment.user_name.toLowerCase().includes(searchTerm.toLowerCase()) || payment.user_email.toLowerCase().includes(searchTerm.toLowerCase()) || payment.description.toLowerCase().includes(searchTerm.toLowerCase()); const matchesStatus = statusFilter === 'all' || payment.status.toLowerCase() === statusFilter.toLowerCase(); return matchesSearch && matchesStatus; }); const handleExportCSV = () => { const headers = ['Payment ID,Customer,Email,Details,Amount,Status,Date\n']; const rows = filteredPayments.map(p => `"${p.id}","${p.user_name}","${p.user_email}","${p.description}",${p.amount},"${p.status}","${p.created_at}"` ); const blob = new Blob([headers.concat(rows.join('\n'))], { type: 'text/csv;charset=utf-8;' }); const link = document.createElement('a'); link.href = URL.createObjectURL(blob); link.setAttribute('download', `financial_report_${new Date().toISOString().split('T')[0]}.csv`); document.body.appendChild(link); link.click(); document.body.removeChild(link); }; return (
{/* Simplified Header */}

Platform Reports

Summary of workers, employers, disputes, and payments.

{/* Simplified Summary Cards */}
{/* Workers Card */}
Workers
Total Workers {worker_stats.total}
Verified {worker_stats.verified}
Active {worker_stats.active}
{/* Sponsors Card */}
Employers
Total Employers {sponsor_stats.total}
Active Plan {sponsor_stats.active_subscribers}
Unpaid {sponsor_stats.unpaid}
{/* Disputes Card */}
Disputes
Total Disputes {dispute_stats.open + dispute_stats.under_review}
Resolved {dispute_stats.resolved}
Pending Flags {safety_stats.pending}
{/* Revenue Card */}
Revenue
Total Revenue AED {total_revenue.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}
Total Paid {payments.length}
Average Amount AED {payments.length > 0 ? (total_revenue / payments.length).toFixed(0) : '0'}
{/* Simplified Payment Ledger */}

Payment List

Search and check payments.

{/* Search & Status Filters */}
setSearchTerm(e.target.value)} />
{/* Payments Table */}
{filteredPayments.map(p => ( ))} {filteredPayments.length === 0 && ( )}
Payment ID Customer Details Amount Status Date
TXN-{p.id}
{p.user_name} {p.user_email}
{p.description} {p.amount.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 })} {p.currency} {p.status} {p.created_at}
No payments found.
); }