@extends('layouts.app')

@section('title', 'Dashboard')

@section('content')
<div class="container-fluid">
    <!-- Page Header -->
    <div class="row mb-4">
        <div class="col-12">
            <div class="page-header">
                <h1 class="page-title">
                    <i class="fas fa-tachometer-alt"></i>
                    Dashboard
                </h1>
                <div class="page-subtitle">
                    Welcome back, {{ Auth::user()->name ?? 'User' }}!
                </div>
            </div>
        </div>
    </div>

    @if(isset($error))
    <div class="row mb-4">
        <div class="col-12">
            <div class="alert alert-danger">
                <i class="fas fa-exclamation-triangle"></i>
                {{ $error }}
            </div>
        </div>
    </div>
    @endif

    <!-- Statistics Cards -->
    <div class="row mb-4">
        <div class="col-lg-3 col-md-6 mb-3">
            <div class="card bg-primary text-white">
                <div class="card-body">
                    <div class="d-flex justify-content-between">
                        <div>
                            <h4 class="card-title">{{ number_format($pendingAssessmentsCount ?? 0) }}</h4>
                            <p class="card-text">Pending Assessments</p>
                        </div>
                        <div class="align-self-center">
                            <i class="fas fa-file-invoice fa-2x"></i>
                        </div>
                    </div>
                </div>
                <div class="card-footer">
                    <a href="{{ route('pending') }}" class="text-white">
                        View Details <i class="fas fa-arrow-right"></i>
                    </a>
                </div>
            </div>
        </div>

        <div class="col-lg-3 col-md-6 mb-3">
            <div class="card bg-warning text-white">
                <div class="card-body">
                    <div class="d-flex justify-content-between">
                        <div>
                            <h4 class="card-title">{{ number_format($declinedAssessmentsCount ?? 0) }}</h4>
                            <p class="card-text">Declined Assessments</p>
                        </div>
                        <div class="align-self-center">
                            <i class="fas fa-times-circle fa-2x"></i>
                        </div>
                    </div>
                </div>
                <div class="card-footer">
                    <a href="{{ route('declined') }}" class="text-white">
                        View Details <i class="fas fa-arrow-right"></i>
                    </a>
                </div>
            </div>
        </div>

        <div class="col-lg-3 col-md-6 mb-3">
            <div class="card bg-info text-white">
                <div class="card-body">
                    <div class="d-flex justify-content-between">
                        <div>
                            <h4 class="card-title">{{ number_format($pendingAdjustmentsCount ?? 0) }}</h4>
                            <p class="card-text">Pending Adjustments</p>
                        </div>
                        <div class="align-self-center">
                            <i class="fas fa-edit fa-2x"></i>
                        </div>
                    </div>
                </div>
                <div class="card-footer">
                    <a href="{{ route('pending-adjustments') }}" class="text-white">
                        View Details <i class="fas fa-arrow-right"></i>
                    </a>
                </div>
            </div>
        </div>

        <div class="col-lg-3 col-md-6 mb-3">
            <div class="card bg-danger text-white">
                <div class="card-body">
                    <div class="d-flex justify-content-between">
                        <div>
                            <h4 class="card-title">{{ number_format($declinedAdjustmentsCount ?? 0) }}</h4>
                            <p class="card-text">Declined Adjustments</p>
                        </div>
                        <div class="align-self-center">
                            <i class="fas fa-ban fa-2x"></i>
                        </div>
                    </div>
                </div>
                <div class="card-footer">
                    <a href="{{ route('declined-adjustments') }}" class="text-white">
                        View Details <i class="fas fa-arrow-right"></i>
                    </a>
                </div>
            </div>
        </div>
    </div>

    <!-- Dashboard Statistics -->
    @if(isset($dashboardStats))
    <div class="row mb-4">
        <div class="col-lg-6 mb-3">
            <div class="card">
                <div class="card-header">
                    <h5 class="card-title">
                        <i class="fas fa-chart-line"></i>
                        Revenue Overview
                    </h5>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6">
                            <div class="stat-item">
                                <label>Total Revenue:</label>
                                <span class="amount">₦{{ number_format($dashboardStats->TotalRevenue ?? 0, 2) }}</span>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="stat-item">
                                <label>Monthly Revenue:</label>
                                <span class="amount">₦{{ number_format($dashboardStats->MonthlyRevenue ?? 0, 2) }}</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-6 mb-3">
            <div class="card">
                <div class="card-header">
                    <h5 class="card-title">
                        <i class="fas fa-users"></i>
                        Taxpayer Statistics
                    </h5>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6">
                            <div class="stat-item">
                                <label>Total Taxpayers:</label>
                                <span class="count">{{ number_format($dashboardStats->TotalTaxpayers ?? 0) }}</span>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="stat-item">
                                <label>Active Taxpayers:</label>
                                <span class="count">{{ number_format($dashboardStats->ActiveTaxpayers ?? 0) }}</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @endif

    <!-- Assessment Summary -->
    @if(isset($assessmentSummary) && $assessmentSummary->count() > 0)
    <div class="row mb-4">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h5 class="card-title">
                        <i class="fas fa-list"></i>
                        Recent Assessments
                    </h5>
                </div>
                <div class="card-body">
                    <div class="table-responsive">
                        <table class="table table-striped">
                            <thead>
                                <tr>
                                    <th>Assessment Ref</th>
                                    <th>Taxpayer</th>
                                    <th>Amount</th>
                                    <th>Status</th>
                                    <th>Date</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($assessmentSummary->take(5) as $assessment)
                                <tr>
                                    <td>{{ $assessment->AssessmentRefNo ?? 'N/A' }}</td>
                                    <td>{{ $assessment->TaxpayerName ?? 'N/A' }}</td>
                                    <td>₦{{ number_format($assessment->AssessmentAmount ?? 0, 2) }}</td>
                                    <td>
                                        <span class="badge badge-{{ $assessment->StatusID == 1 ? 'warning' : ($assessment->StatusID == 2 ? 'success' : 'danger') }}">
                                            {{ $assessment->StatusName ?? 'N/A' }}
                                        </span>
                                    </td>
                                    <td>{{ $assessment->AssessmentDate ?? 'N/A' }}</td>
                                </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @endif

    <!-- Quick Actions -->
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h5 class="card-title">
                        <i class="fas fa-bolt"></i>
                        Quick Actions
                    </h5>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-3 mb-2">
                            <a href="{{ route('capture.individual.add') }}" class="btn btn-primary btn-block">
                                <i class="fas fa-user-plus"></i> Add Individual
                            </a>
                        </div>
                        <div class="col-md-3 mb-2">
                            <a href="{{ route('capture.corporate.add') }}" class="btn btn-success btn-block">
                                <i class="fas fa-building"></i> Add Company
                            </a>
                        </div>
                        <div class="col-md-3 mb-2">
                            <a href="{{ route('assessment.create') }}" class="btn btn-info btn-block">
                                <i class="fas fa-file-invoice"></i> Create Assessment
                            </a>
                        </div>
                        <div class="col-md-3 mb-2">
                            <a href="{{ route('report.list') }}" class="btn btn-warning btn-block">
                                <i class="fas fa-chart-bar"></i> Generate Report
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@section('styles')
<style>
.page-header {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    padding: 2rem;
    border-radius: 10px;
    margin-bottom: 2rem;
}

.page-title {
    margin: 0;
    font-size: 2rem;
    font-weight: 600;
}

.page-subtitle {
    margin: 0.5rem 0 0 0;
    opacity: 0.9;
}

.card {
    border: none;
    border-radius: 10px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    transition: transform 0.2s;
}

.card:hover {
    transform: translateY(-2px);
}

.card-footer {
    background: rgba(255,255,255,0.1);
    border-top: 1px solid rgba(255,255,255,0.2);
}

.stat-item {
    margin-bottom: 1rem;
}

.stat-item label {
    display: block;
    font-weight: 600;
    color: #6c757d;
    margin-bottom: 0.25rem;
}

.stat-item .amount {
    font-size: 1.25rem;
    font-weight: 700;
    color: #28a745;
}

.stat-item .count {
    font-size: 1.25rem;
    font-weight: 700;
    color: #007bff;
}

.table th {
    border-top: none;
    font-weight: 600;
    color: #495057;
}

.badge {
    font-size: 0.75rem;
    padding: 0.375rem 0.75rem;
}

.btn-block {
    padding: 0.75rem;
    font-weight: 600;
}
</style>
@endsection

@section('scripts')
<script>
$(document).ready(function() {
    // Update session activity periodically
    setInterval(function() {
        $.post('{{ route("update-session-activity") }}', {
            _token: '{{ csrf_token() }}'
        });
    }, 300000); // Every 5 minutes

    // Add hover effects to cards
    $('.card').hover(
        function() {
            $(this).addClass('shadow-lg');
        },
        function() {
            $(this).removeClass('shadow-lg');
        }
    );
});
</script>
@endsection