@extends('layouts.app', ['title' => 'Historial Académico', 'pageClass' => 'page-admin'])

@section('content')
    <section class="hero-card compact admin-hero">
        <div>
            <p class="eyebrow">Administración</p>
            <h2>Historial Académico</h2>
            <p>
                Editá el recorrido académico de cada alumno sin tocar la sección de consultas.
                Acá podés ajustar estado, calificación final, fecha de examen y año lectivo de las materias en curso.
            </p>
        </div>
    </section>

    @include('admin.partials.nav', ['active' => 'academic-history'])

    <section class="admin-history-layout">
        <aside class="panel admin-history-sidebar">
            <div class="result-heading">
                <div>
                    <p class="eyebrow">Buscar alumno</p>
                    <h3>Selección</h3>
                </div>
                <span class="result-count">{{ $studentsTotal }}</span>
            </div>

            <form class="stack-form" method="GET" action="{{ route('admin.academic-history.index') }}">
                <label>
                    Nombre, DNI o correo
                    <input type="search" name="q" value="{{ $search }}" placeholder="Ej: Cabrera, 29712440 o correo">
                </label>
                <label class="inline-check filter-toggle">
                    <input type="checkbox" name="ex_students" value="1" @checked($showExStudents) onchange="this.form.submit()">
                    <span>ExAlumnos</span>
                </label>
                @if ($selectedStudent)
                    <input type="hidden" name="student_id" value="{{ $selectedStudent->id }}">
                @endif
            </form>

            <div class="admin-history-student-list">
                @forelse ($students as $student)
                    <a
                        href="{{ route('admin.academic-history.index', array_filter(['q' => $search, 'student_id' => $student->id, 'ex_students' => $showExStudents ? 1 : null])) }}"
                        class="admin-history-student-item {{ $selectedStudent?->id === $student->id ? 'is-active' : '' }}"
                    >
                        <strong>{{ $student->full_name }}</strong>
                        <span>DNI: {{ $student->dni ?: 'Sin dato' }}</span>
                        <span>Perfiles: {{ $student->academic_profiles_count }}</span>
                    </a>
                @empty
                    <div class="empty-state">
                        No se encontraron alumnos con ese criterio.
                    </div>
                @endforelse
            </div>
        </aside>

        <section class="admin-history-main">
            @if ($selectedStudent)
                <article class="panel result-panel">
                    <div class="result-heading">
                        <div>
                            <p class="eyebrow">Alumno seleccionado</p>
                            <h2>{{ $selectedStudent->full_name }}</h2>
                            <p class="muted">
                                DNI: {{ $selectedStudent->dni ?: 'Sin dato' }} ·
                                Email: {{ $selectedStudent->email ?: 'Sin dato' }}
                            </p>
                        </div>
                        <div class="history-action-group">
                            <a href="{{ route('consultations.student-history', $selectedStudent) }}" class="button-muted" target="_blank">
                                Ver consulta
                            </a>
                        </div>
                    </div>

                    @if ($historySummary)
                        <section class="dashboard-stat-grid compact">
                            <article class="dashboard-stat-card accent-violet">
                                <div class="dashboard-stat-copy">
                                    <span>Perfiles</span>
                                    <strong>{{ $historySummary['profiles'] }}</strong>
                                </div>
                                <div class="dashboard-stat-bar"><span></span></div>
                            </article>
                            <article class="dashboard-stat-card accent-sky">
                                <div class="dashboard-stat-copy">
                                    <span>Aprobadas</span>
                                    <strong>{{ $historySummary['approved'] }}</strong>
                                </div>
                                <div class="dashboard-stat-bar"><span></span></div>
                            </article>
                            <article class="dashboard-stat-card accent-amber">
                                <div class="dashboard-stat-copy">
                                    <span>En curso</span>
                                    <strong>{{ $historySummary['in_course'] }}</strong>
                                </div>
                                <div class="dashboard-stat-bar"><span></span></div>
                            </article>
                            <article class="dashboard-stat-card accent-mint">
                                <div class="dashboard-stat-copy">
                                    <span>Registros</span>
                                    <strong>{{ $historySummary['subjects'] }}</strong>
                                </div>
                                <div class="dashboard-stat-bar"><span></span></div>
                            </article>
                        </section>
                    @endif
                </article>

                @forelse ($selectedStudent->academicProfiles as $profile)
                    <article class="panel history-editor-panel">
                        <div class="result-heading">
                            <div>
                                <p class="eyebrow">Carrera</p>
                                <h3>{{ $profile->career_name }}</h3>
                                <p class="muted">
                                    {{ $profile->plan_name ?: 'Plan no informado' }}
                                    @if ($profile->resolution_text)
                                        · Res. {{ $profile->resolution_text }}
                                    @endif
                                    @if ($profile->legajo_text)
                                        · Legajo {{ $profile->legajo_text }}
                                    @endif
                                </p>
                            </div>
                        </div>

                        @foreach ($profile->entries->groupBy('year_label') as $yearLabel => $entries)
                            <h4 class="group-title">{{ $yearLabel }}</h4>
                            <div class="table-wrap">
                                <table class="data-table history-editor-table">
                                    <thead>
                                        <tr>
                                            <th>N°</th>
                                            <th>Espacio curricular</th>
                                            <th>Estado</th>
                                            <th>Calificación final</th>
                                            <th>Fecha ex.</th>
                                            <th>Año en curso</th>
                                            <th>Acción</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach ($entries as $entry)
                                            @php
                                                $normalizedStatus = \App\Support\AcademicHistoryStatus::canonicalize($entry->status);
                                                $statusSlug = \App\Support\AcademicHistoryStatus::slug($entry->status);
                                            @endphp
                                            <tr>
                                                <td>{{ $entry->row_number ?: $loop->iteration }}</td>
                                                <td>
                                                    <strong>{{ $entry->subject_name }}</strong>
                                                    @if ($entry->notes)
                                                        <div class="history-inline-note">{{ $entry->notes }}</div>
                                                    @endif
                                                    @if ($entry->establishment)
                                                        <div class="history-inline-note">{{ $entry->establishment }}</div>
                                                    @endif
                                                </td>
                                                <td>
                                                    <select name="status" form="history-entry-{{ $entry->id }}" class="history-status-select is-{{ $statusSlug }}" data-history-status>
                                                        <option value="">Sin estado</option>
                                                        @foreach ($statusOptions as $status)
                                                            <option value="{{ $status }}" @selected($normalizedStatus === $status)>{{ $status }}</option>
                                                        @endforeach
                                                    </select>
                                                </td>
                                                <td>
                                                    <select name="final_grade" form="history-entry-{{ $entry->id }}">
                                                        <option value="">Sin nota</option>
                                                        @foreach (($gradeOptions[$entry->id] ?? ['4', '5', '6', '7', '8', '9', '10']) as $grade)
                                                            <option value="{{ $grade }}" @selected((string) $entry->final_grade === (string) $grade)>{{ $grade }}</option>
                                                        @endforeach
                                                    </select>
                                                </td>
                                                <td>
                                                    <input type="date" name="exam_date" form="history-entry-{{ $entry->id }}" value="{{ $entry->exam_date?->format('Y-m-d') }}">
                                                </td>
                                                <td>
                                                    <select name="in_course_year" form="history-entry-{{ $entry->id }}">
                                                        <option value="">—</option>
                                                        @for ($year = now()->year - 2; $year <= now()->year + 4; $year++)
                                                            <option value="{{ $year }}" @selected($entry->in_course_year === $year)>{{ $year }}</option>
                                                        @endfor
                                                    </select>
                                                </td>
                                                <td class="history-editor-actions">
                                                    <button type="submit" form="history-entry-{{ $entry->id }}">Guardar</button>
                                                </td>
                                            </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>

                            <div class="history-editor-form-bank" aria-hidden="true">
                                @foreach ($entries as $entry)
                                    <form id="history-entry-{{ $entry->id }}" method="POST" action="{{ route('admin.academic-history.entries.update', $entry) }}">
                                        @csrf
                                        @method('PUT')
                                        <input type="hidden" name="q" value="{{ $search }}">
                                    </form>
                                @endforeach
                            </div>
                        @endforeach
                    </article>
                @empty
                    <article class="panel empty-state">
                        Este alumno todavía no tiene historial académico cargado.
                    </article>
                @endforelse
            @else
                <article class="panel empty-state">
                    Elegí un alumno para editar su historial académico.
                </article>
            @endif
        </section>
    </section>
@endsection

@push('scripts')
    <script>
        (() => {
            const slugify = (value) => String(value || '')
                .normalize('NFD')
                .replace(/[\u0300-\u036f]/g, '')
                .toLowerCase()
                .replace(/[^a-z0-9]+/g, '-')
                .replace(/^-+|-+$/g, '');

            document.querySelectorAll('[data-history-status]').forEach((select) => {
                const paint = () => {
                    select.className = 'history-status-select';
                    select.classList.add(`is-${select.value.trim() ? slugify(select.value) : 'sin-estado'}`);
                };

                paint();
                select.addEventListener('change', paint);
            });

            const filterForm = document.querySelector('form[action="{{ route('admin.academic-history.index') }}"]');
            const filterInput = filterForm?.querySelector('input[type="search"][name="q"]');
            const selectedStudentInput = filterForm?.querySelector('input[type="hidden"][name="student_id"]');

            if (filterForm && filterInput) {
                let timeoutId = null;

                const submitFilter = () => {
                    if (selectedStudentInput) {
                        selectedStudentInput.remove();
                    }
                    filterForm.submit();
                };

                filterInput.addEventListener('input', () => {
                    window.clearTimeout(timeoutId);
                    timeoutId = window.setTimeout(submitFilter, 250);
                });

                filterInput.addEventListener('search', submitFilter);
            }
        })();
    </script>
@endpush