@extends('layouts.app')

@section('title', 'Fees Invoices | Institution Axis')

@section('sidebar-menu')
    @include('schooladmin.partials.sidebar')
@endsection

@section('sidebar-footer')
    <p>{{ auth()->user()->school?->name ?? 'Institution Axis' }}</p>
@endsection

@section('breadcrumb')
    <span><a href="{{ route('schooladmin.dashboard') }}">Home</a></span> / <span>Finance</span> / <span class="active-page">Invoices</span>
@endsection

@section('content')
<div class="container-fluid">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h3 class="fw-bold text-dark"><i class="fas fa-file-invoice me-2"></i>Fees Invoices</h3>
        <a href="{{ route('schooladmin.finance.invoices.create') }}" class="btn btn-primary rounded-pill px-4">
            <i class="fas fa-magic me-2"></i>Generate Bulk Invoices
        </a>
    </div>

    @if(session('success'))
        <div class="alert alert-success alert-dismissible fade show" role="alert">
            {{ session('success') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
    @endif
    @if(session('error'))
        <div class="alert alert-danger alert-dismissible fade show" role="alert">
            {{ session('error') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
    @endif

    <div class="card shadow-sm border-0 rounded-4">
        <div class="card-body p-0">
            <div class="table-responsive">
                <table class="table table-hover align-middle mb-0">
                    <thead class="bg-light">
                        <tr>
                            <th class="ps-4">Invoice #</th>
                            <th>Student</th>
                            <th>Class</th>
                            <th>Term</th>
                            <th>Total (KES)</th>
                            <th>Paid (KES)</th>
                            <th>Status</th>
                            <th class="text-end pe-4">Actions</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($invoices as $invoice)
                        <tr>
                            <td class="ps-4 fw-bold text-muted">{{ $invoice->invoice_number }}</td>
                            <td>
                                <div class="d-flex align-items-center">
                                    <img src="https://ui-avatars.com/api/?name={{ $invoice->student->first_name }}+{{ $invoice->student->last_name }}&background=random" class="avatar-xs rounded-circle me-2" alt="Avatar">
                                    <span>{{ $invoice->student->fullName() }}</span>
                                </div>
                            </td>
                            <td>{{ $invoice->student->schoolClass->name }}</td>
                            <td>T{{ $invoice->term }} {{ $invoice->academic_year }}</td>
                            <td class="fw-semibold">{{ number_format($invoice->total_amount, 2) }}</td>
                            <td class="text-success">{{ number_format($invoice->paid_amount, 2) }}</td>
                            <td>
                                @if($invoice->status == 'paid')
                                    <span class="badge bg-success rounded-pill">Paid</span>
                                @elseif($invoice->status == 'partial')
                                    <span class="badge bg-info rounded-pill">Partial</span>
                                @else
                                    <span class="badge bg-warning rounded-pill">Pending</span>
                                @endif
                            </td>
                            <td class="text-end pe-4">
                                <a href="{{ route('schooladmin.finance.invoices.show', $invoice) }}" class="btn btn-sm btn-outline-primary">
                                    <i class="fas fa-eye"></i> View
                                </a>
                            </td>
                        </tr>
                        @empty
                        <tr>
                            <td colspan="8" class="text-center py-5">
                                <p class="text-muted mb-0">No invoices found. Use the generate button to create billing for students.</p>
                            </td>
                        </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>
        @if($invoices->hasPages())
        <div class="card-footer bg-white border-0">
            {{ $invoices->links() }}
        </div>
        @endif
    </div>
</div>
@endsection