@extends('admin.layouts.app')

@section('title', 'Reports & Analytics')

@section('content')
<div class="page-header">
    <div><h2>Reports & Analytics</h2><p>Business performance across customers, leads, services, revenue, technicians, payments and AMC</p></div>
</div>

<div class="report-nav">
    <button type="button" class="report-tab active" data-report-tab="customers">Customers</button><button type="button" class="report-tab" data-report-tab="leads">Leads</button><button type="button" class="report-tab" data-report-tab="services">Services</button><button type="button" class="report-tab" data-report-tab="revenue">Revenue</button><button type="button" class="report-tab" data-report-tab="technicians">Technicians</button><button type="button" class="report-tab" data-report-tab="payments">Payments</button><button type="button" class="report-tab" data-report-tab="amc">AMC</button><button type="button" class="report-tab" data-report-tab="platform">Platform</button>
</div>

<section class="report-section" id="customers"><h3><i class="fas fa-users"></i> Customer Reports</h3><div class="report-metrics"><div><small>Total Customers</small><strong>{{ $customerReport['total'] }}</strong></div><div><small>Active</small><strong>{{ $customerReport['active'] }}</strong></div><div><small>Inactive</small><strong>{{ $customerReport['inactive'] }}</strong></div></div><div class="table-card"><table class="admin-table"><thead><tr><th>Customer Type</th><th>Total</th></tr></thead><tbody>@forelse($customerReport['by_type'] as $type => $total)<tr><td>{{ $type ?: 'Not specified' }}</td><td>{{ $total }}</td></tr>@empty<tr><td colspan="2">No customer data.</td></tr>@endforelse</tbody></table></div></section>

<section class="report-section" id="leads"><h3><i class="fas fa-user-plus"></i> Lead Reports</h3><div class="report-metrics"><div><small>Total Leads</small><strong>{{ $leadReport['total'] }}</strong></div><div><small>Open</small><strong>{{ $leadReport['open'] }}</strong></div><div><small>Converted</small><strong>{{ $leadReport['converted'] }}</strong></div><div><small>Rejected</small><strong>{{ $leadReport['rejected'] }}</strong></div></div><div class="report-two"><div class="table-card"><table class="admin-table"><thead><tr><th>Status</th><th>Total</th></tr></thead><tbody>@foreach($leadReport['by_status'] as $status => $total)<tr><td>{{ $status }}</td><td>{{ $total }}</td></tr>@endforeach</tbody></table></div><div class="table-card"><table class="admin-table"><thead><tr><th>Enquiry Type</th><th>Total</th></tr></thead><tbody>@foreach($leadReport['by_enquiry'] as $type => $total)<tr><td>{{ $type ?: 'Not specified' }}</td><td>{{ $total }}</td></tr>@endforeach</tbody></table></div></div></section>

<section class="report-section" id="services"><h3><i class="fas fa-calendar-check"></i> Service Reports</h3><div class="report-metrics"><div><small>Total Bookings</small><strong>{{ $serviceReport['total'] }}</strong></div><div><small>Completed</small><strong>{{ $serviceReport['completed'] }}</strong></div><div><small>Cancelled</small><strong>{{ $serviceReport['cancelled'] }}</strong></div></div><div class="table-card"><table class="admin-table"><thead><tr><th>Service Status</th><th>Total</th></tr></thead><tbody>@foreach($serviceReport['by_status'] as $status => $total)<tr><td>{{ $status }}</td><td>{{ $total }}</td></tr>@endforeach</tbody></table></div></section>

<section class="report-section" id="revenue"><h3><i class="fas fa-chart-line"></i> Revenue Reports</h3><div class="report-metrics money"><div><small>Total Invoiced</small><strong>₹{{ number_format($revenueReport['invoiced'],2) }}</strong></div><div><small>Revenue Received</small><strong>₹{{ number_format($revenueReport['received'],2) }}</strong></div><div><small>Outstanding</small><strong>₹{{ number_format($revenueReport['outstanding'],2) }}</strong></div><div><small>GST Amount</small><strong>₹{{ number_format($revenueReport['gst'],2) }}</strong></div></div></section>

<section class="report-section" id="technicians"><h3><i class="fas fa-user-gear"></i> Technician Performance Reports</h3><div class="table-card"><table class="admin-table data-table"><thead><tr><th>Technician</th><th>Total Jobs</th><th>Completed</th><th>Cancelled</th><th>Completion Rate</th><th>Availability</th></tr></thead><tbody>@foreach($technicianReport as $technician)@php($rate = $technician->assignments_count > 0 ? round(($technician->completed_jobs_count / $technician->assignments_count) * 100, 1) : 0)<tr><td>{{ $technician->technician_name }}</td><td>{{ $technician->assignments_count }}</td><td>{{ $technician->completed_jobs_count }}</td><td>{{ $technician->cancelled_jobs_count }}</td><td>{{ $rate }}%</td><td>{{ $technician->availability }}</td></tr>@endforeach</tbody></table></div></section>

<section class="report-section" id="payments"><h3><i class="fas fa-credit-card"></i> Payment Reports</h3><div class="report-metrics money"><div><small>Online Received</small><strong>₹{{ number_format($paymentReport['online_received'],2) }}</strong></div><div><small>AMC Received</small><strong>₹{{ number_format($paymentReport['amc_received'],2) }}</strong></div><div><small>Total Recorded</small><strong>₹{{ number_format($paymentReport['total_received'],2) }}</strong></div><div><small>Pending Invoices</small><strong>{{ $paymentReport['pending_invoices'] }}</strong></div></div></section>

<section class="report-section" id="amc"><h3><i class="fas fa-rotate"></i> AMC Reports</h3><div class="report-metrics"><div><small>Total Contracts</small><strong>{{ $amcReport['total'] }}</strong></div><div><small>Active Contracts</small><strong>{{ $amcReport['active'] }}</strong></div><div><small>Renewals in 30 Days</small><strong>{{ $amcReport['renewals'] }}</strong></div><div><small>Scheduled Visits</small><strong>{{ $amcReport['scheduled_visits'] }}</strong></div><div><small>Outstanding</small><strong>₹{{ number_format($amcReport['outstanding'],2) }}</strong></div></div></section>

<section class="report-section" id="platform"><h3><i class="fas fa-gauge-high"></i> Platform Report</h3><div class="report-metrics"><div><small>Customers</small><strong>{{ $platformReport['customers'] }}</strong></div><div><small>Leads</small><strong>{{ $platformReport['leads'] }}</strong></div><div><small>Bookings</small><strong>{{ $platformReport['bookings'] }}</strong></div><div><small>Active Technicians</small><strong>{{ $platformReport['technicians'] }}</strong></div><div><small>Service Completion</small><strong>{{ $platformReport['completion_rate'] }}%</strong></div><div><small>Lead Conversion</small><strong>{{ $platformReport['lead_conversion_rate'] }}%</strong></div></div></section>

<style>
.report-nav{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px;padding:10px;background:#fff;border:1px solid #e2e8f0;border-radius:14px}.report-tab{padding:9px 14px;border-radius:20px;background:#fff;border:1px solid #dbe4e1;color:#047857;font-size:13px;font-weight:600;cursor:pointer}.report-tab:hover,.report-tab.active{background:#16a34a;border-color:#16a34a;color:#fff}.report-section{display:none;margin-bottom:26px;padding:22px;border-radius:16px;background:#fff;box-shadow:0 8px 24px rgba(0,0,0,.06)}.report-section.active{display:block}.report-section>h3{margin-bottom:18px;color:#0f172a}.report-section>h3 i{margin-right:8px;color:#16a34a}.report-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin-bottom:18px}.report-metrics>div{padding:16px;border-radius:12px;background:#f8fafc;border:1px solid #e2e8f0}.report-metrics small{display:block;color:#64748b;margin-bottom:7px}.report-metrics strong{font-size:23px}.report-metrics.money strong{font-size:20px}.report-two{display:grid;grid-template-columns:1fr 1fr;gap:18px}.report-section .table-card{box-shadow:none;margin:0}@media(max-width:800px){.report-two{grid-template-columns:1fr}}
</style>
<script>
document.addEventListener('DOMContentLoaded', function () {
    const tabs = document.querySelectorAll('[data-report-tab]');
    const sections = document.querySelectorAll('.report-section');

    function showReport(name) {
        tabs.forEach(tab => tab.classList.toggle('active', tab.dataset.reportTab === name));
        sections.forEach(section => section.classList.toggle('active', section.id === name));
    }

    tabs.forEach(tab => tab.addEventListener('click', function () {
        showReport(this.dataset.reportTab);
    }));

    showReport('customers');
});
</script>
@endsection