@extends('layouts.admin')

@section('title', 'Student Registration Dashboard')

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

@section('content')
@php
    $byStatus = $stats['by_student_status'] ?? [];
    $statusLabels = [];
    $statusValues = [];
    foreach ($byStatus as $status => $count) {
        $enum = \App\Enums\StudentStatus::tryFrom($status);
        $statusLabels[] = $enum?->label() ?? ucfirst(str_replace('_', ' ', (string) $status));
        $statusValues[] = (int) $count;
    }

    $byReg = $stats['by_registration_status'] ?? [];
    $workflowLabels = [];
    $workflowValues = [];
    foreach ($byReg as $status => $count) {
        $enum = \App\Enums\RegistrationWorkflowStatus::tryFrom($status);
        $workflowLabels[] = $enum?->label() ?? ucfirst(str_replace('_', ' ', (string) $status));
        $workflowValues[] = (int) $count;
    }
@endphp

<div class="bv-page-header">
    <div>
        <x-ui.breadcrumb :items="[
            ['label' => 'Home', 'href' => route('dashboard')],
            ['label' => 'Student Registration'],
        ]" />
        <h1 class="bv-page-header__title">Registration Dashboard</h1>
        <p class="bv-page-header__subtitle">Students, semester registrations, and online requests.</p>
    </div>
    <div class="bv-page-header__actions">
        <x-ui.button variant="ghost" icon="bi-gear" :href="route('registration.settings.index')">Settings</x-ui.button>
        <x-ui.button variant="primary" icon="bi-person-plus" :href="route('registration.students.create')">New Student</x-ui.button>
    </div>
</div>

@include('institution.partials.flash')

<div class="row g-4 mb-2 bv-stagger">
    <div class="col-6 col-lg-3">
        <x-ui.stat-card label="Students" :counter="$stats['total_students'] ?? 0" icon="bi-people-fill" trend="All records" trend-direction="neutral" />
    </div>
    <div class="col-6 col-lg-3">
        <x-ui.stat-card label="Active" :counter="$stats['active_students'] ?? 0" icon="bi-person-check" trend="Active / registered" trend-direction="up" variant="success" />
    </div>
    <div class="col-6 col-lg-3">
        <x-ui.stat-card label="Pending" :counter="$stats['pending_registrations'] ?? 0" icon="bi-hourglass-split" trend="In workflow" trend-direction="neutral" variant="warning" />
    </div>
    <div class="col-6 col-lg-3">
        <x-ui.stat-card label="Online requests" :counter="$stats['pending_online_requests'] ?? 0" icon="bi-inbox" trend="Awaiting review" trend-direction="up" variant="info" />
    </div>
</div>

<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">Registration workflow</h4>
                    <span class="text-muted-bv small">Students by registration status</span>
                </div>
                <span class="bv-badge bv-badge--primary"><i class="bi bi-diagram-3"></i> Live</span>
            </div>
            <div class="bv-chart-card__canvas bv-chart-card__canvas--320">
                <canvas id="chart-registration-workflow"
                    data-labels='@json($workflowLabels)'
                    data-values='@json($workflowValues)'>
                </canvas>
            </div>
        </div>
    </div>
    <div class="col-lg-4">
        <div class="bv-chart-card">
            <h4 class="bv-widget__title mb-3">By student status</h4>
            <div class="bv-chart-card__canvas bv-chart-card__canvas--320">
                <canvas id="chart-registration-status"
                    data-labels='@json($statusLabels)'
                    data-values='@json($statusValues)'>
                </canvas>
            </div>
        </div>
    </div>
</div>

<div class="row g-4 mt-1">
    <div class="col-lg-6">
        <x-ui.card title="Quick actions">
            <div class="d-flex flex-wrap gap-2">
                <x-ui.button variant="ghost" icon="bi-people" :href="route('registration.students.index')">Students</x-ui.button>
                <x-ui.button variant="ghost" icon="bi-magic" :href="route('registration.wizard.index')">Wizard</x-ui.button>
                <x-ui.button variant="ghost" icon="bi-inbox" :href="route('registration.online-requests.index')">Online requests</x-ui.button>
                <x-ui.button variant="ghost" icon="bi-journal-text" :href="route('registration.semester-registrations.index')">Semester regs</x-ui.button>
                <x-ui.button variant="ghost" icon="bi-bar-chart" :href="route('registration.analytics.index')">Analytics</x-ui.button>
            </div>
            <p class="text-muted-bv small mt-3 mb-0">Semester registrations: {{ $stats['semester_registrations'] ?? 0 }}</p>
        </x-ui.card>
    </div>
    <div class="col-lg-6">
        <x-ui.card title="Numbering">
            <div class="d-flex flex-wrap gap-2">
                <x-ui.button variant="ghost" icon="bi-hash" :href="route('registration.computer-number.index')">Computer numbers</x-ui.button>
                <x-ui.button variant="ghost" icon="bi-card-heading" :href="route('registration.update-student-id.index')">Student numbers</x-ui.button>
                <x-ui.button variant="ghost" icon="bi-list-ul" :href="route('registration.class-list.index')">Class list</x-ui.button>
            </div>
        </x-ui.card>
    </div>
</div>
@endsection