@extends('layouts.app')

@section('title', 'Информация о группе')

{{--
    Ports app/Views/lesson/attendance_form.php (legacy, 799 lines) + the
    render() payload from App\Controllers\LessonController::attendanceForm()
    (app/Controllers/LessonController.php:413-461) — see the Phase 22 plan.

    Every write form/fetch on this page (check_lesson.php/check_lesson_exists.php/
    submit_test_results.php/add_student_to_group_teacher.php/
    remove_student_from_group.php/check_student_in_group.php) still posts to
    its exact unchanged legacy endpoint. Real Laravel CSRF as of Phase 62 —
    @csrf on the real forms, an X-CSRF-TOKEN header (read from the page's
    csrf-token meta tag, via layouts.app) on the two $.ajax calls.
    check_student_in_group.php has no backend anywhere (dead route) — its
    fetch() + .catch() fallback is ported byte-for-byte, not fixed.

    No page-level role restriction beyond SessionAuth::check() — matches the
    legacy controller's constructor exactly.

    $localGroupInfo/$localStudents/$comments/$commentCategories are DB::select()
    results (stdClass rows), unlike the legacy view's $pdo-fetched associative
    arrays — property access (->) is used throughout instead of array access.
    The two SQL queries the legacy view ran directly against $pdo (comments
    list, comment_categories+comments for the Comments modal) were moved into
    the controller — see its docblock.
--}}

@section('content')
<div class="container-fluid">
    <div class="ax-page-header">
        <h1 class="mb-0">Информация о группе</h1>
    </div>

    @if ($localGroupInfo['success'])
        @php
            $local = $localGroupInfo['data'];
        @endphp

        <div class="card shadow-sm mb-4">
            <div class="card-body">
                <div class="d-flex justify-content-between align-items-center"
                     role="button"
                     data-bs-toggle="collapse"
                     data-bs-target="#groupInfoCollapse"
                     aria-expanded="false"
                     style="cursor: pointer;">
                    <h4 class="card-title mb-0">
                        {{ $local->group_name ?? '—' }}
                    </h4>
                    <span class="collapse-arrow transition">▼</span>
                </div>

                <div class="collapse mt-3" id="groupInfoCollapse">
                    <p><strong>Отделение:</strong> {{ $local->language_name ?? 'не указано' }}</p>
                    <p><strong>Предмет:</strong> {!! nl2br(e($local->discipline_name ?? '—')) !!}</p>
                    <p><strong>Класс:</strong> {{ $local->class_name }}</p>
                    <p><strong>Тип обучения:</strong> {{ $local->learning_type_name }}</p>
                </div>
            </div>
        </div>
    @endif

    @if ($date !== $today)
        <div class="alert alert-warning">
            Вы заполняете аттенданс задним числом — за {{ date('d.m.Y', strtotime($date)) }}.
            @if (empty($isSubstitution))
                Урок будет засчитан только после подтверждения администратором.
            @endif
        </div>
    @endif

    @if (!empty($isSubstitution))
        <div class="alert alert-info">
            <strong>Замена.</strong> Вы заполняете урок за
            {{ $originalTeacherName ?? 'другого преподавателя' }}.
            Урок будет засчитан только после одобрения администратором.
        </div>
    @endif

    <!-- Фильтр даты -->
    <div class="card p-3 mb-3">
        <form method="GET" id="filter-form" class="row g-3 align-items-center">
            <div class="col-md-3">
                <label for="date" class="form-label">Дата урока:</label>
                <input type="date" id="date" name="date" class="form-control" required
                       value="{{ $date }}" max="{{ $today }}"
                       onchange="if (this.value) submitForm()">
            </div>
            <input type="hidden" name="group_id" value="{{ (string) $groupId }}">
            @if (!empty($isSubstitution))
                <input type="hidden" name="substitute_for" value="{{ (int) $originalTeacherId }}">
            @endif
        </form>
    </div>

    <form method="post" action="/submit_test_results.php" id="studentForm" novalidate>
        @csrf
        <input type="hidden" name="ed_unit_id" value="{{ $groupId }}">
        <input type="hidden" id="beginTime" name="beginTime" value="{{ $beginTime ?? '' }}">
        <input type="hidden" id="endTime" name="endTime" value="{{ $endTime ?? '' }}">
        <input type="hidden" id="lesson_date" name="lesson_date" value="{{ $date ?? '' }}">
        <input type="hidden" id="teacher_id" name="teacher_id" value="{{ $teacherId }}">
        @if (!empty($isSubstitution))
            <input type="hidden" name="is_substitution" value="1">
            <input type="hidden" name="original_teacher_id" value="{{ (int) $originalTeacherId }}">
        @endif

        <div class="card shadow-sm mb-4">
            <div class="card-body">
                <div class="form-check form-switch">
                    <input class="form-check-input" type="checkbox" id="enableTest">
                    <label class="form-check-label fw-bold" for="enableTest">Добавить срез</label>
                </div>
                <div id="testHeader" class="mt-3 d-none">
                    <label class="form-label">Максимальный балл за срез</label>
                    <input type="number" min="1" class="form-control w-25"
                           name="test_max_score" id="test_max_score" placeholder="Например: 20">
                </div>
            </div>
        </div>

        @if (!empty($localStudents))
            <div class="card shadow-sm mb-4">
                <div class="card-body d-flex justify-content-between">
                    <h4 class="card-title mb-0">Студенты</h4>
                    <button type="button" class="btn btn-primary"
                            data-bs-toggle="modal" data-bs-target="#addStudentModal">
                        Добавить
                    </button>
                </div>

                <div id="attendanceStudentsAlert"></div>
                <ul class="list-group">
                    {{-- Roster must reflect who was active ON THE LESSON DATE ($date),
                         not today — otherwise retroactive fills show the wrong students. --}}
                    @foreach ($localStudents as $student)
                        @php
                            $joinedAt = date('Y-m-d', strtotime($student->joined_at));
                            $endDate = ($student->end_date === '1970-01-01') ? null : $student->end_date;
                            $isActive = ($date >= $joinedAt) && (is_null($endDate) || $date <= $endDate);
                            $isFrozen = (bool) $student->is_frozen;
                        @endphp
                        @continue(!$isActive)
                        <li id="student-row-{{ $student->id }}"
                            class="list-group-item d-flex align-items-center flex-wrap justify-content-between gap-2 {{ $isFrozen ? 'bg-light text-muted' : '' }}">

                            <!-- Имя студента и чекбокс -->
                            <div class="d-flex align-items-center">
                            <span class="fw-bold text-nowrap me-2">
                                {{ trim("{$student->last_name} {$student->first_name}") }}
                            </span>
                                @if ($isFrozen)
                                    <span class="badge bg-info text-dark me-2">Заморожен</span>
                                @endif
                                <input type="hidden" name="students[{{ $student->id }}][id]"
                                       value="{{ $student->id }}">
                                <div class="form-check">
                                    <input class="form-check-input toggle-details border border-dark rounded"
                                           type="checkbox"
                                           id="checkbox-{{ $student->id }}"
                                           data-student-id="{{ $student->id }}"
                                           name="students[{{ $student->id }}][pass]"
                                           value="1"
                                           @disabled($isFrozen)
                                           @if ($isFrozen) title="Студент заморожен на эту дату — аттенданс не учитывается" @endif>
                                </div>
                            </div>

                            <!-- Скрытые дополнительные поля -->
                            <div id="details-{{ $student->id }}"
                                 class="ax-student-details d-none d-flex align-items-center flex-wrap gap-2 flex-grow-1">

                                <!-- КР -->
                                <label class="form-label mb-0 text-nowrap">КР:
                                    <select name="students[{{ $student->id }}][kr_score]"
                                            class="form-select form-select-sm w-auto kr-select">
                                        <option value="" disabled selected>—</option>
                                        @for ($i = 0; $i <= 10; $i++)
                                            <option value="{{ $i }}">{{ $i }}</option>
                                        @endfor
                                    </select>
                                    <div class="invalid-feedback">Заполните это поле</div>
                                </label>

                                <!-- ДЗ -->
                                <label class="form-label mb-0 text-nowrap">ДЗ:
                                    <select name="students[{{ $student->id }}][dz_score]"
                                            class="form-select form-select-sm w-auto dz-select">
                                        <option value="" disabled selected>—</option>
                                        @for ($i = 0; $i <= 10; $i++)
                                            <option value="{{ $i }}">{{ $i }}</option>
                                        @endfor
                                        <option value="не задавалось">Не задавалось</option>
                                    </select>
                                    <div class="invalid-feedback">Заполните это поле</div>
                                </label>

                                <!-- Опоздание -->
                                <label class="form-label mb-0 text-nowrap">Опоздание:
                                    <select name="students[{{ $student->id }}][lateness]"
                                            class="form-select form-select-sm w-auto lateness-select">
                                        <option value="" disabled selected>—</option>
                                        <option value="Пришел во время">Пришел во время</option>
                                        <option value="Опоздал">Опоздал</option>
                                        <option value="Опоздал сильно">Опоздал сильно</option>
                                    </select>
                                    <div class="invalid-feedback">Заполните это поле</div>
                                </label>

                                <!-- Комментарий -->
                                <div class="mb-2 ax-comment-field">
                                    <label class="form-label mb-0 text-nowrap">Комментарий:</label>
                                    <div class="d-flex gap-2 align-items-center flex-grow-1">
                                        <div class="dropdown ax-comment-dropdown">
                                            <button class="btn btn-outline-secondary btn-sm dropdown-toggle w-100 text-start"
                                                    type="button"
                                                    id="dropdownComments-{{ $student->id }}"
                                                    data-bs-toggle="dropdown"
                                                    aria-expanded="false">
                                                Выберите комментарии
                                            </button>
                                            <ul class="dropdown-menu w-100 p-2"
                                                aria-labelledby="dropdownComments-{{ $student->id }}"
                                                style="max-height: 300px; overflow-y: auto;">
                                                @foreach ($comments as $c)
                                                    <li>
                                                        <div class="form-check d-flex align-items-center">
                                                            <input class="form-check-input comment-checkbox me-2"
                                                                   type="checkbox"
                                                                   name="students[{{ $student->id }}][comment_id][]"
                                                                   value="{{ $c->id }}"
                                                                   id="comment_{{ $student->id }}_{{ $c->id }}"
                                                                   data-text="{{ $c->id . ' - ' . $c->text }}">
                                                            <label class="form-check-label d-flex gap-2 align-items-center"
                                                                   for="comment_{{ $student->id }}_{{ $c->id }}">
                                                                <span class="text-muted small">{{ $c->id }}</span>
                                                                <span>{{ $c->text }}</span>
                                                            </label>
                                                        </div>
                                                    </li>
                                                @endforeach
                                            </ul>
                                        </div>

                                        <input type="text"
                                               name="students[{{ $student->id }}][manual_comment]"
                                               class="form-control form-control-sm w-auto"
                                               placeholder="Или введите свой комментарий">
                                    </div>
                                </div>

                                <!-- Баллы за срез -->
                                <label class="form-label mb-0 text-nowrap test-score-field d-none">
                                    Срез:
                                    <input type="number"
                                           class="form-control form-control-sm w-auto"
                                           min="0"
                                           name="students[{{ $student->id }}][test_score]"
                                           placeholder="0">
                                </label>
                            </div>

                            <!-- Кнопка удаления. Форма НЕ вложена сюда — вложенные <form> внутри
                                 #studentForm невалидны и браузер закрывает #studentForm раньше
                                 времени, из-за чего кнопка "Отправить результаты" переставала
                                 работать. Форма вынесена за пределы #studentForm ниже и связана
                                 через атрибут form=. -->
                            <button type="submit" class="btn btn-danger btn-sm"
                                    form="removeStudentForm-{{ $student->id }}">×</button>
                        </li>
                    @endforeach
                </ul>
            </div>
        @else
            <p class="text-muted">В этой группе нет студентов в локальной базе данных. Урок можно засчитать без учеников — оплата составит 0.5.</p>
        @endif

        <div id="lessonError" class="alert alert-warning mt-2 d-none"></div>

        <div class="mt-3">
            <button type="submit" id="submitBtn" class="btn btn-success w-100">Отправить результаты</button>
        </div>
    </form>

    @foreach ($localStudents as $student)
        <form id="removeStudentForm-{{ $student->id }}" action="/remove_student_from_group.php"
              method="POST" class="d-none js-ajax-form"
              data-remove-target="#student-row-{{ $student->id }}" data-alert-target="#attendanceStudentsAlert"
              onsubmit="return confirm('Вы уверены, что хотите удалить этого студента?')">
            @csrf
            <input type="hidden" name="id" value="{{ $student->id }}">
            <input type="hidden" name="group_id" value="{{ $groupId }}">
        </form>
    @endforeach

    <!-- Кнопка "Комментарии" -->
    <button class="btn btn-warning rounded-circle position-fixed"
            style="width: 50px; height: 50px; bottom: 80px; right: 20px; font-size: 24px;"
            data-bs-toggle="modal" data-bs-target="#commentsModal">!</button>

    <!-- Кнопка добавления студента -->
    <button class="btn btn-success rounded-circle position-fixed"
            style="width: 50px; height: 50px; bottom: 20px; right: 20px; font-size: 24px;"
            data-bs-toggle="modal" data-bs-target="#addStudentModal">+</button>


    <!-- Модальное окно: список комментариев -->
    <div class="modal fade" id="commentsModal" tabindex="-1" aria-hidden="true">
        <div class="modal-dialog modal-dialog-scrollable">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">Доступные комментарии</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    @foreach ($commentCategories as $cat)
                        <p><strong>{{ $cat->id }} {{ $cat->name }}</strong></p>
                        @foreach ($commentsByCategory[$cat->id] as $c)
                            <p style="padding-left: 20px;">{{ $c->id }} {{ $c->text }}</p>
                        @endforeach
                    @endforeach
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Закрыть</button>
                </div>
            </div>
        </div>
    </div>

    <!-- Модальное окно: добавить студента -->
    <div class="modal fade" id="addStudentModal" tabindex="-1" aria-labelledby="addStudentModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="addStudentModalLabel">Добавить студента</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Закрыть"></button>
                </div>
                <div class="modal-body">
                    <form action="/add_student_to_group_teacher.php" method="POST" id="addStudentForm">
                        @csrf
                        <div class="mb-3">
                            <label for="student_search" class="form-label">Поиск студента</label>
                            <input type="text" class="form-control" id="student_search"
                                   name="student_search" placeholder="Начните вводить имя..." autocomplete="off" required>
                            <input type="hidden" id="student_id" name="student_id">
                            <input type="hidden" name="group_id" value="{{ $local->id ?? $groupId }}">
                            <ul id="student-suggestions" class="list-group mt-2" style="display: none;"></ul>
                        </div>
                        <input type="hidden" id="joined_at" name="joined_at" value="{{ date('Y-m-d') }}">
                        <div class="mb-3">
                            <button type="submit" class="btn btn-primary">Добавить</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <br><a href="/index.php">Вернуться на панель</a>
</div>
@endsection

@push('styles')
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-select@1.14.0-beta3/dist/css/bootstrap-select.min.css">
<style>
    .ax-comment-dropdown {
        min-width: 300px;
    }

    /* КР/ДЗ/Опоздание/Комментарий/Срез are inline fields that get cramped and
       hard to tap on a phone-width screen — stack them one per row instead
       and size them for a comfortable touch target. */
    @media (max-width: 575.98px) {
        .ax-student-details {
            flex-direction: column;
            align-items: stretch !important;
        }

        .ax-student-details > .form-label {
            display: flex;
            flex-direction: column;
            align-items: stretch;
            gap: 0.35rem;
            white-space: normal;
            width: 100%;
        }

        .ax-student-details .form-select,
        .ax-student-details .form-control {
            width: 100% !important;
            font-size: 1rem;
            padding: 0.5rem 0.75rem;
        }

        .ax-comment-field {
            width: 100%;
        }

        .ax-comment-field > .d-flex {
            flex-direction: column;
            align-items: stretch !important;
        }

        .ax-comment-dropdown {
            min-width: 100%;
        }
    }
</style>
@endpush

@push('scripts')
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap-select@1.14.0-beta3/dist/js/bootstrap-select.min.js"></script>

<script>
    // Data needed to render a newly-added student's row client-side (see
    // "Add student form" handler below) without a full page reload — a reload
    // would wipe any КР/ДЗ/etc. already entered for the other students.
    const AX_COMMENTS   = @json($comments);
    const AX_CSRF_TOKEN = document.querySelector('meta[name="csrf-token"]').content;
    const AX_GROUP_ID   = @json((string) $groupId);

    function axEscapeHtml(value) {
        return String(value)
            .replace(/&/g, "&amp;")
            .replace(/</g, "&lt;")
            .replace(/>/g, "&gt;")
            .replace(/"/g, "&quot;")
            .replace(/'/g, "&#039;");
    }

    function axBuildStudentRow(id, firstName, lastName) {
        const displayName = `${lastName} ${firstName}`.trim();

        let scoreOptions = '<option value="" disabled selected>—</option>';
        for (let i = 0; i <= 10; i++) scoreOptions += `<option value="${i}">${i}</option>`;

        let commentsHtml = '';
        AX_COMMENTS.forEach(function (c) {
            commentsHtml += `
                <li>
                    <div class="form-check d-flex align-items-center">
                        <input class="form-check-input comment-checkbox me-2" type="checkbox"
                               name="students[${id}][comment_id][]" value="${c.id}"
                               id="comment_${id}_${c.id}" data-text="${axEscapeHtml(c.id + ' - ' + c.text)}">
                        <label class="form-check-label d-flex gap-2 align-items-center" for="comment_${id}_${c.id}">
                            <span class="text-muted small">${c.id}</span>
                            <span>${axEscapeHtml(c.text)}</span>
                        </label>
                    </div>
                </li>`;
        });

        const testEnabled = document.getElementById("enableTest").checked;

        const li = document.createElement("li");
        li.className = "list-group-item d-flex align-items-center flex-wrap justify-content-between gap-2";
        li.innerHTML = `
            <div class="d-flex align-items-center">
                <span class="fw-bold text-nowrap me-2">${axEscapeHtml(displayName)}</span>
                <input type="hidden" name="students[${id}][id]" value="${id}">
                <div class="form-check">
                    <input class="form-check-input toggle-details border border-dark rounded" type="checkbox"
                           id="checkbox-${id}" data-student-id="${id}" name="students[${id}][pass]" value="1">
                </div>
            </div>
            <div id="details-${id}" class="ax-student-details d-none d-flex align-items-center flex-wrap gap-2 flex-grow-1">
                <label class="form-label mb-0 text-nowrap">КР:
                    <select name="students[${id}][kr_score]" class="form-select form-select-sm w-auto kr-select">
                        ${scoreOptions}
                    </select>
                    <div class="invalid-feedback">Заполните это поле</div>
                </label>
                <label class="form-label mb-0 text-nowrap">ДЗ:
                    <select name="students[${id}][dz_score]" class="form-select form-select-sm w-auto dz-select">
                        ${scoreOptions}
                        <option value="не задавалось">Не задавалось</option>
                    </select>
                    <div class="invalid-feedback">Заполните это поле</div>
                </label>
                <label class="form-label mb-0 text-nowrap">Опоздание:
                    <select name="students[${id}][lateness]" class="form-select form-select-sm w-auto lateness-select">
                        <option value="" disabled selected>—</option>
                        <option value="Пришел во время">Пришел во время</option>
                        <option value="Опоздал">Опоздал</option>
                        <option value="Опоздал сильно">Опоздал сильно</option>
                    </select>
                    <div class="invalid-feedback">Заполните это поле</div>
                </label>
                <div class="mb-2 ax-comment-field">
                    <label class="form-label mb-0 text-nowrap">Комментарий:</label>
                    <div class="d-flex gap-2 align-items-center flex-grow-1">
                        <div class="dropdown ax-comment-dropdown">
                            <button class="btn btn-outline-secondary btn-sm dropdown-toggle w-100 text-start" type="button"
                                    id="dropdownComments-${id}" data-bs-toggle="dropdown" aria-expanded="false">
                                Выберите комментарии
                            </button>
                            <ul class="dropdown-menu w-100 p-2" aria-labelledby="dropdownComments-${id}"
                                style="max-height: 300px; overflow-y: auto;">
                                ${commentsHtml}
                            </ul>
                        </div>
                        <input type="text" name="students[${id}][manual_comment]"
                               class="form-control form-control-sm w-auto"
                               placeholder="Или введите свой комментарий">
                    </div>
                </div>
                <label class="form-label mb-0 text-nowrap test-score-field${testEnabled ? '' : ' d-none'}">
                    Срез:
                    <input type="number" class="form-control form-control-sm w-auto" min="0"
                           name="students[${id}][test_score]" placeholder="0">
                </label>
            </div>
            <button type="submit" class="btn btn-danger btn-sm" form="removeStudentForm-${id}">×</button>
        `;
        return li;
    }

    function axAppendRemoveForm(id) {
        const form = document.createElement("form");
        form.id = "removeStudentForm-" + id;
        form.action = "/remove_student_from_group.php";
        form.method = "POST";
        form.className = "d-none";
        form.onsubmit = function () {
            return confirm("Вы уверены, что хотите удалить этого студента?");
        };
        form.innerHTML = `
            <input type="hidden" name="_token" value="${axEscapeHtml(AX_CSRF_TOKEN)}">
            <input type="hidden" name="id" value="${id}">
            <input type="hidden" name="group_id" value="${axEscapeHtml(AX_GROUP_ID)}">
        `;
        document.body.appendChild(form);
    }

    // ─── Set lesson date from URL or today ───────────────────────────────────
    document.addEventListener("DOMContentLoaded", function () {
        let urlParams  = new URLSearchParams(window.location.search);
        let dateParam  = urlParams.get("date");
        let lessonDate = dateParam || new Date().toISOString().slice(0, 10);

        let lessonDateInput = document.getElementById("lesson_date");
        if (lessonDateInput) lessonDateInput.value = lessonDate;
    });

    // ─── Show/hide student detail fields on checkbox toggle ──────────────────
    // Delegated on document (not queried once at load) so rows added later by
    // "Add student" — see axBuildStudentRow below — pick up the behavior too.
    $(document).on("change", ".toggle-details", function () {
        let studentId    = this.getAttribute("data-student-id");
        let detailsBlock = document.getElementById("details-" + studentId);

        if (this.checked) {
            detailsBlock.classList.remove("d-none");
            detailsBlock.classList.add("d-flex");
            detailsBlock.querySelectorAll("select").forEach(function (select) {
                select.setAttribute("required", "required");
            });
        } else {
            detailsBlock.classList.add("d-none");
            detailsBlock.classList.remove("d-flex");
            detailsBlock.querySelectorAll("select").forEach(function (select) {
                select.removeAttribute("required");
                select.value = "";
            });
        }
    });

    // ─── Comment checkbox → update dropdown button label ─────────────────────
    $(document).on("change", ".comment-checkbox", function () {
        let studentId  = this.id.split("_")[1];
        let dropdownBtn = document.getElementById("dropdownComments-" + studentId);
        let checkboxes  = dropdownBtn.closest(".dropdown").querySelectorAll(".comment-checkbox");

        let selected = [];
        checkboxes.forEach(ch => { if (ch.checked) selected.push(ch.dataset.text); });

        if (selected.length === 0)     dropdownBtn.textContent = "Выберите комментарии";
        else if (selected.length === 1) dropdownBtn.textContent = selected[0];
        else                            dropdownBtn.textContent = "Выбрано: " + selected.length;
    });

    // ─── Test toggle ─────────────────────────────────────────────────────────
    document.addEventListener("DOMContentLoaded", function () {
        const enableTest   = document.getElementById("enableTest");
        const testHeader   = document.getElementById("testHeader");
        const maxScoreInput = document.getElementById("test_max_score");

        enableTest.addEventListener("change", function () {
            document.querySelectorAll(".test-score-field").forEach(el => {
                el.classList.toggle("d-none", !this.checked);
            });
            testHeader.classList.toggle("d-none", !this.checked);

            if (!this.checked) {
                maxScoreInput.value = "";
                document.querySelectorAll('input[name$="[test_score]"]').forEach(i => i.value = "");
            }
        });

        document.addEventListener("input", function (e) {
            if (e.target.name && e.target.name.includes("[test_score]")) {
                let max = parseInt(maxScoreInput.value);
                let val = parseInt(e.target.value);
                if (!isNaN(max) && val > max) e.target.value = max;
                if (val < 0) e.target.value = 0;
            }
        });
    });

    // ─── Remove invalid class on select change ────────────────────────────────
    $(document).on("change", "select.is-invalid", function () {
        if ($(this).val()) $(this).removeClass("is-invalid");
    });

    // ─── Main form submit: validate → check group duplicate → check teacher duplicate → submit ───
    $(document).ready(function () {
        $("#studentForm").on("submit", function (e) {
            e.preventDefault();

            const form       = this;
            const lessonDate = $("#lesson_date").val().trim();
            const beginTime  = $("#beginTime").val().trim();
            const teacherId  = $("#teacher_id").val().trim();
            const groupId    = $('input[name="ed_unit_id"]').val().trim();

            // 1. Basic field presence check
            if (!lessonDate || !beginTime || !teacherId) {
                Swal.fire({
                    icon: "error", title: "Ошибка",
                    text: "Заполните все поля перед отправкой!",
                    timer: 3000, showConfirmButton: false, toast: true, position: "top-end"
                });
                return;
            }

            // 2. Validate KR / DZ / lateness for checked students
            let valid       = true;
            let firstInvalid = null;

            $(".toggle-details:checked").each(function () {
                let studentId    = $(this).data("student-id");
                let detailsBlock = $("#details-" + studentId);

                detailsBlock.find("select.kr-select, select.dz-select, select.lateness-select").each(function () {
                    if (!$(this).val()) {
                        valid = false;
                        $(this).addClass("is-invalid");
                        if (!firstInvalid) firstInvalid = this;
                    } else {
                        $(this).removeClass("is-invalid");
                    }
                });
            });

            if (!valid) {
                Swal.fire({
                    icon: "error", title: "Ошибка",
                    text: "Пожалуйста, выберите КР, ДЗ и Опоздание для всех учеников!",
                    timer: 3000, showConfirmButton: false, toast: true, position: "top-end"
                });
                if (firstInvalid) firstInvalid.scrollIntoView({ behavior: "smooth", block: "center" });
                return;
            }

            // 3. Disable submit button while checking
            $("#submitBtn").prop("disabled", true);

            // 4. Check group duplicate (check_lesson_exists.php)
            $.ajax({
                url: "/check_lesson_exists.php",
                type: "POST",
                headers: { "X-CSRF-TOKEN": AX_CSRF_TOKEN },
                data: { ed_unit_id: groupId, lesson_date: lessonDate, begin_time: beginTime },
                dataType: "json",
                success: function (groupCheck) {
                    if (groupCheck.exists) {
                        Swal.fire({
                            icon: "warning", title: "Аттенданс уже заполнен!",
                            text: "Урок для этой группы на данную дату и время уже существует.",
                            timer: 3000, showConfirmButton: false, toast: true, position: "top-end"
                        });
                        $("#submitBtn").prop("disabled", false);
                        return;
                    }

                    // 5. Check teacher duplicate (check_lesson.php)
                    $.ajax({
                        url: "/check_lesson.php",
                        type: "POST",
                        headers: { "X-CSRF-TOKEN": AX_CSRF_TOKEN },
                        data: { lesson_date: lessonDate, begin_time: beginTime, teacher_id: teacherId },
                        dataType: "json",
                        success: function (teacherCheck) {
                            if (teacherCheck.status === "exists") {
                                Swal.fire({
                                    icon: "warning", title: "Конфликт расписания!",
                                    text: "У преподавателя уже есть урок в это время.",
                                    timer: 3000, showConfirmButton: false, toast: true, position: "top-end"
                                });
                                $("#submitBtn").prop("disabled", false);
                                return;
                            }

                            // 6. All clear — confirm and submit
                            Swal.fire({
                                title: "Подтвердите действие",
                                text: "Вы уверены, что хотите заполнить аттенданс?",
                                icon: "question",
                                showCancelButton: true,
                                confirmButtonColor: "#3085d6",
                                cancelButtonColor: "#d33",
                                confirmButtonText: "Да, заполнить!",
                                cancelButtonText: "Отмена"
                            }).then((result) => {
                                if (result.isConfirmed) {
                                    $("#studentForm").off("submit").submit();
                                } else {
                                    $("#submitBtn").prop("disabled", false);
                                }
                            });
                        },
                        error: function () {
                            // Teacher check failed — still allow submit
                            $("#studentForm").off("submit").submit();
                        }
                    });
                },
                error: function () {
                    // Group check failed — still allow submit
                    $("#studentForm").off("submit").submit();
                }
            });
        });
    });

    // ─── Add student form: check duplicate, then add via AJAX ────────────────
    // Submitted via fetch (not a real form submit) so the page never reloads —
    // a reload would wipe any КР/ДЗ/Опоздание/comments already entered for the
    // other students in #studentForm.
    function axSubmitAddStudent() {
        const addForm = document.getElementById("addStudentForm");

        fetch("/add_student_to_group_teacher.php", {
            method: "POST",
            body: new FormData(addForm)
        })
            .then(r => r.json())
            .then(data => {
                if (!data.success) {
                    alert(data.message || "Не удалось добавить студента.");
                    return;
                }

                const student = data.student;
                const studentsList = document.querySelector("#studentForm .list-group");
                if (!studentsList) {
                    // No students were rendered on load (the "Студенты" card/list
                    // doesn't exist yet) — nothing entered to preserve, so a reload
                    // is the simplest way to get the full card scaffolding in place.
                    window.location.reload();
                    return;
                }

                studentsList.appendChild(axBuildStudentRow(student.id, student.first_name, student.last_name));
                axAppendRemoveForm(student.id);

                const modalEl = document.getElementById("addStudentModal");
                bootstrap.Modal.getOrCreateInstance(modalEl).hide();
                addForm.reset();
                $("#student-suggestions").hide().empty();
            })
            .catch(() => {
                alert("Не удалось добавить студента. Попробуйте позже.");
            });
    }

    $(document).ready(function () {
        $("#addStudentForm").on("submit", function (e) {
            e.preventDefault();

            const studentId = $("#student_id").val().trim();
            const groupId   = $('input[name="group_id"]').val().trim();

            if (!studentId) {
                alert("Пожалуйста, выберите студента из списка.");
                return;
            }

            fetch("/check_student_in_group.php", {
                method: "POST",
                headers: { "Content-Type": "application/x-www-form-urlencoded" },
                body: `student_id=${encodeURIComponent(studentId)}&group_id=${encodeURIComponent(groupId)}`
            })
                .then(r => r.json())
                .then(data => {
                    if (data.active_exists) {
                        alert("⚠️ Этот студент уже числится в этой группе (активная запись).");
                    } else {
                        axSubmitAddStudent();
                    }
                })
                .catch(() => {
                    axSubmitAddStudent();
                });
        });
    });

    // ─── Student search autocomplete ──────────────────────────────────────────
    $(document).ready(function () {
        $("#student_search").on("input", function () {
            const query = $(this).val();
            if (query.length > 2) {
                $.ajax({
                    url: "/search_students.php",
                    method: "GET",
                    data: { query: query },
                    success: function (data) {
                        $("#student-suggestions").empty().show();
                        data.forEach(function (student) {
                            $("#student-suggestions").append(
                                `<li class="list-group-item student-suggestion d-flex justify-content-between align-items-center" data-id="${student.id}">
                                <span>${student.first_name} ${student.last_name}</span>
                                <span class="text-muted small">${student.class_name || ''}</span>
                             </li>`
                            );
                        });
                    }
                });
            } else {
                $("#student-suggestions").hide();
            }
        });

        $(document).on("click", ".student-suggestion", function () {
            $("#student_search").val($(this).find("span").first().text().trim());
            $("#student_id").val($(this).data("id"));
            $("#student-suggestions").hide();
        });
    });

    // ─── Filter form helper ───────────────────────────────────────────────────
    function submitForm() {
        document.getElementById("filter-form").submit();
    }
</script>
@endpush