@extends('layouts.admin')

@section('title', 'Executive Dashboard')

@push('scripts')
    @vite('resources/js/pages/dashboard.js')
@endpush

@section('content')
@php
    $user = auth()->user();
    $greeting = now()->hour < 12 ? 'Good morning' : (now()->hour < 17 ? 'Good afternoon' : 'Good evening');
    $session = config('app.academic_session', now()->year . '/' . (now()->year + 1));

    $route = fn ($name) => \Illuminate\Support\Facades\Route::has($name) ? route($name) : '#';

    $quickActions = [
        ['label' => 'New Admission', 'icon' => 'bi-person-plus', 'route' => 'admission.applications.index'],
        ['label' => 'Register Student', 'icon' => 'bi-person-badge', 'route' => 'registration.students.index'],
        ['label' => 'Fee Payment', 'icon' => 'bi-receipt', 'route' => 'finance.receipts.index'],
        ['label' => 'Print ID', 'icon' => 'bi-person-vcard', 'route' => 'id-cards.print-queue.index'],
        ['label' => 'Generate Reports', 'icon' => 'bi-file-earmark-bar-graph', 'route' => 'reports.enrollment.index'],
        ['label' => 'Timetable', 'icon' => 'bi-calendar3', 'route' => 'examination.schedule.index'],
        ['label' => 'Course Allocation', 'icon' => 'bi-diagram-3', 'route' => 'course.managers.index'],
        ['label' => 'Graduation', 'icon' => 'bi-mortarboard', 'route' => 'examination.result-processing.index'],
        ['label' => 'Bulk SMS', 'icon' => 'bi-chat-left-dots', 'route' => 'communications.sms.index'],
        ['label' => 'Email Centre', 'icon' => 'bi-envelope-paper', 'route' => 'communications.email.index'],
        ['label' => 'Users', 'icon' => 'bi-people', 'route' => 'system.users.index'],
        ['label' => 'Settings', 'icon' => 'bi-gear', 'route' => 'system.settings.index'],
    ];
@endphp

{{-- Welcome header --}}
<div class="bv-page-header">
    <div>
        <x-ui.breadcrumb :items="[['label' => 'Home', 'href' => route('dashboard')], ['label' => 'Executive Dashboard']]" />
        <h1 class="bv-page-header__title">{{ $greeting }}, {{ \Illuminate\Support\Str::of($user->name ?? 'Administrator')->explode(' ')->first() }}</h1>
        <p class="bv-page-header__subtitle">Institution overview for academic session {{ $session }}.</p>
    </div>
    <div class="bv-page-header__actions">
        <a href="{{ $route('reports.enrollment.index') }}" class="bv-btn bv-btn--ghost bv-btn--md">
            <i class="bi bi-download"></i> Export
        </a>
        <a href="{{ $route('admission.applications.index') }}" class="bv-btn bv-btn--primary bv-btn--md">
            <i class="bi bi-plus-lg"></i> New Admission
        </a>
    </div>
</div>

{{-- Executive KPIs --}}
<div class="row g-4 mb-2 bv-stagger">
    <div class="col-6 col-lg-3">
        <x-ui.stat-card label="Total Students" :counter="12458" icon="bi-people-fill" trend="+4.2% vs last session" trend-direction="up" />
    </div>
    <div class="col-6 col-lg-3">
        <x-ui.stat-card label="Admissions Today" :counter="86" icon="bi-person-plus-fill" trend="+12 since morning" trend-direction="up" variant="info" />
    </div>
    <div class="col-6 col-lg-3">
        <x-ui.stat-card label="Registrations" :counter="9821" icon="bi-journal-check" trend="78.8% of enrolled" trend-direction="up" variant="success" />
    </div>
    <div class="col-6 col-lg-3">
        <x-ui.stat-card label="Pending Registrations" :counter="342" icon="bi-hourglass-split" trend="Needs review" trend-direction="neutral" variant="warning" />
    </div>
    <div class="col-6 col-lg-3">
        <x-ui.stat-card label="Revenue (Session)" :counter="24.6" prefix="K " suffix="M" :decimals="1" icon="bi-cash-coin" trend="+8.1% vs target" trend-direction="up" variant="success" />
    </div>
    <div class="col-6 col-lg-3">
        <x-ui.stat-card label="Outstanding Fees" :counter="5.2" prefix="K " suffix="M" :decimals="1" icon="bi-exclamation-diamond" trend="-2.3% this month" trend-direction="down" variant="danger" />
    </div>
    <div class="col-6 col-lg-3">
        <x-ui.stat-card label="Scholarships" :counter="418" icon="bi-award" trend="Active awards" trend-direction="neutral" variant="accent" />
    </div>
    <div class="col-6 col-lg-3">
        <x-ui.stat-card label="Hostel Occupancy" :counter="92" suffix="%" icon="bi-house-door" trend="1,840 / 2,000 beds" trend-direction="up" variant="info" />
    </div>
    <div class="col-6 col-lg-3">
        <x-ui.stat-card label="Examinations" :counter="1264" icon="bi-clipboard-check" trend="Scheduled papers" trend-direction="neutral" />
    </div>
    <div class="col-6 col-lg-3">
        <x-ui.stat-card label="Graduation Candidates" :counter="1187" icon="bi-mortarboard-fill" trend="Cleared for graduation" trend-direction="up" variant="success" />
    </div>
    <div class="col-6 col-lg-3">
        <x-ui.stat-card label="Alumni" :counter="48920" icon="bi-people" trend="Lifetime graduates" trend-direction="neutral" variant="info" />
    </div>
    <div class="col-6 col-lg-3">
        <x-ui.stat-card label="Current Session" value="{{ $session }}" icon="bi-calendar-range" trend="Semester 2 · Week 6" trend-direction="neutral" variant="accent" />
    </div>
</div>

{{-- Charts row 1 --}}
<div class="row g-4 mt-1">
    <div class="col-lg-8">
        <div class="bv-chart-card">
            <div class="d-flex align-items-center justify-content-between mb-3">
                <div>
                    <h4 class="bv-widget__title">Admissions &amp; Registration Trend</h4>
                    <span class="text-muted-bv small">Last 8 months</span>
                </div>
                <span class="bv-badge bv-badge--primary"><i class="bi bi-graph-up-arrow"></i> Live</span>
            </div>
            <div class="bv-chart-card__canvas bv-chart-card__canvas--320">
                <canvas id="chart-admissions-trend"></canvas>
            </div>
        </div>
    </div>
    <div class="col-lg-4">
        <div class="bv-chart-card">
            <h4 class="bv-widget__title mb-3">Programme Distribution</h4>
            <div class="bv-chart-card__canvas bv-chart-card__canvas--320">
                <canvas id="chart-programme-distribution"></canvas>
            </div>
        </div>
    </div>
</div>

{{-- Charts row 2 --}}
<div class="row g-4 mt-1">
    <div class="col-lg-4">
        <div class="bv-chart-card">
            <h4 class="bv-widget__title mb-3">Revenue Trend</h4>
            <div class="bv-chart-card__canvas bv-chart-card__canvas--240">
                <canvas id="chart-revenue-trend"></canvas>
            </div>
        </div>
    </div>
    <div class="col-lg-4">
        <div class="bv-chart-card">
            <h4 class="bv-widget__title mb-3">Payment Collection</h4>
            <div class="bv-chart-card__canvas bv-chart-card__canvas--240">
                <canvas id="chart-payment-collection"></canvas>
            </div>
        </div>
    </div>
    <div class="col-lg-4">
        <div class="bv-chart-card">
            <h4 class="bv-widget__title mb-3">Gender &amp; Campus Split</h4>
            <div class="bv-chart-card__canvas bv-chart-card__canvas--240">
                <canvas id="chart-gender-distribution"></canvas>
            </div>
        </div>
    </div>
</div>

{{-- Quick action tiles --}}
<div class="mt-4">
    <div class="bv-widget">
        <div class="bv-widget__header">
            <h4 class="bv-widget__title"><i class="bi bi-lightning-charge-fill text-gradient me-1"></i> Quick Actions</h4>
            <span class="text-muted-bv small">Jump straight into common tasks</span>
        </div>
        <div class="bv-quick-actions bv-stagger">
            @foreach($quickActions as $action)
                <a href="{{ $route($action['route']) }}" class="bv-quick-action">
                    <span class="bv-quick-action__icon"><i class="bi {{ $action['icon'] }}"></i></span>
                    <span>{{ $action['label'] }}</span>
                </a>
            @endforeach
        </div>
    </div>
</div>

{{-- Widgets row --}}
<div class="row g-4 mt-1">
    {{-- Today's activities / timeline --}}
    <div class="col-lg-4">
        <div class="bv-widget">
            <div class="bv-widget__header">
                <h4 class="bv-widget__title">Today's Activities</h4>
                <a href="#" class="small">View all</a>
            </div>
            <x-ui.timeline :items="[
                ['time' => now()->subMinutes(12)->diffForHumans(), 'title' => 'New application received', 'description' => 'BSc Computer Science — J. Mwansa'],
                ['time' => now()->subMinutes(48)->diffForHumans(), 'title' => 'Fee payment recorded', 'description' => 'Receipt #INV-20486 · K 4,500'],
                ['time' => now()->subHours(2)->diffForHumans(), 'title' => 'Registration approved', 'description' => 'Semester 2 — 42 students'],
                ['time' => now()->subHours(4)->diffForHumans(), 'title' => 'Results released', 'description' => 'School of Business — Year 3'],
            ]" />
        </div>
    </div>

    {{-- Pending approvals --}}
    <div class="col-lg-4">
        <div class="bv-widget">
            <div class="bv-widget__header">
                <h4 class="bv-widget__title">Pending Approvals</h4>
                <span class="bv-badge bv-badge--warning">7</span>
            </div>
            <div class="d-flex flex-column gap-3">
                @foreach([
                    ['icon' => 'bi-person-badge', 'title' => 'Student registrations', 'meta' => '18 awaiting', 'variant' => 'primary'],
                    ['icon' => 'bi-arrow-left-right', 'title' => 'Programme switches', 'meta' => '5 requests', 'variant' => 'info'],
                    ['icon' => 'bi-cash-stack', 'title' => 'Fee waivers', 'meta' => '3 requests', 'variant' => 'success'],
                    ['icon' => 'bi-file-earmark-text', 'title' => 'Online applications', 'meta' => '24 to review', 'variant' => 'warning'],
                ] as $item)
                    <div class="d-flex align-items-center gap-3">
                        <span class="bv-notifications__icon bv-notifications__icon--info"><i class="bi {{ $item['icon'] }}"></i></span>
                        <div class="flex-grow-1">
                            <div class="fw-semibold" style="font-size:.85rem">{{ $item['title'] }}</div>
                            <div class="text-muted-bv small">{{ $item['meta'] }}</div>
                        </div>
                        <a href="#" class="bv-btn bv-btn--ghost bv-btn--sm">Review</a>
                    </div>
                @endforeach
            </div>
        </div>
    </div>

    {{-- Academic calendar --}}
    <div class="col-lg-4">
        <div class="bv-widget">
            <div class="bv-widget__header">
                <h4 class="bv-widget__title">Academic Calendar</h4>
                <span class="text-muted-bv small">{{ now()->format('F Y') }}</span>
            </div>
            <x-ui.calendar-card :events="[6, 12, 18, 24, 28]" />
        </div>
    </div>
</div>

{{-- Widgets row 2 --}}
<div class="row g-4 mt-1">
    {{-- Recent transactions --}}
    <div class="col-lg-6">
        <div class="bv-table-wrapper">
            <div class="bv-table-wrapper__toolbar">
                <h4 class="bv-widget__title mb-0">Recent Transactions</h4>
                <a href="{{ $route('finance.receipts.index') }}" class="small">View all</a>
            </div>
            <div class="table-responsive">
                <table class="bv-table">
                    <thead>
                        <tr><th>Student</th><th>Reference</th><th>Amount</th><th>Status</th></tr>
                    </thead>
                    <tbody>
                        @foreach([
                            ['C. Banda', 'INV-20486', 'K 4,500', 'active', 'Paid'],
                            ['M. Phiri', 'INV-20485', 'K 2,000', 'pending', 'Partial'],
                            ['T. Zulu', 'INV-20484', 'K 6,750', 'active', 'Paid'],
                            ['L. Tembo', 'INV-20483', 'K 1,200', 'withdraw', 'Reversed'],
                            ['N. Chanda', 'INV-20482', 'K 3,300', 'active', 'Paid'],
                        ] as $tx)
                            <tr>
                                <td>{{ $tx[0] }}</td>
                                <td class="text-mono text-muted-bv">{{ $tx[1] }}</td>
                                <td class="fw-semibold">{{ $tx[2] }}</td>
                                <td><span class="bv-status-pill bv-status-pill--{{ $tx[3] }}">{{ $tx[4] }}</span></td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    {{-- System health + announcements --}}
    <div class="col-lg-6">
        <div class="bv-widget mb-4">
            <div class="bv-widget__header">
                <h4 class="bv-widget__title">System Health</h4>
                <span class="bv-status-pill bv-status-pill--active">Operational</span>
            </div>
            <div class="d-flex flex-column gap-3">
                <div>
                    <div class="bv-progress__label"><span>Server load</span><span>38%</span></div>
                    <div class="bv-progress"><div class="bv-progress__bar bv-progress__bar--40"></div></div>
                </div>
                <div>
                    <div class="bv-progress__label"><span>Database storage</span><span>65%</span></div>
                    <div class="bv-progress bv-progress--warning"><div class="bv-progress__bar bv-progress__bar--65"></div></div>
                </div>
                <div>
                    <div class="bv-progress__label"><span>Backup completion</span><span>100%</span></div>
                    <div class="bv-progress bv-progress--success"><div class="bv-progress__bar bv-progress__bar--100"></div></div>
                </div>
            </div>
        </div>

        <div class="bv-widget">
            <div class="bv-widget__header">
                <h4 class="bv-widget__title">Announcements</h4>
                <a href="#" class="small">Manage</a>
            </div>
            <div class="d-flex flex-column gap-3">
                @foreach([
                    ['icon' => 'bi-megaphone', 'title' => 'Semester 2 registration closes Friday', 'time' => '2 days left'],
                    ['icon' => 'bi-calendar-event', 'title' => 'Mid-semester exams begin next week', 'time' => 'Starts Mon'],
                    ['icon' => 'bi-bank', 'title' => 'New bank payment channel available', 'time' => 'Just added'],
                ] as $a)
                    <div class="d-flex align-items-start gap-3">
                        <span class="bv-notifications__icon bv-notifications__icon--warning"><i class="bi {{ $a['icon'] }}"></i></span>
                        <div>
                            <div class="fw-semibold" style="font-size:.85rem">{{ $a['title'] }}</div>
                            <div class="text-muted-bv small">{{ $a['time'] }}</div>
                        </div>
                    </div>
                @endforeach
            </div>
        </div>
    </div>
</div>
@endsection