@extends('layouts.app')

@section('title', 'Панель преподавателя')

@push('styles')
<style>
    .group-name {
        text-decoration: none;
        font-weight: bold;
    }
    .list-group-item:hover {
        background-color: var(--ax-gray-100, #eef1f6);
    }
    .list-group-item {
        min-height: 50px;
    }
</style>
@endpush

@section('content')
    <div class="container-fluid">
        @if (request('feedback') === 'success')
            <div class="alert alert-success">
                Сообщение успешно отправлено!
            </div>
        @endif

        <div class="ax-page-header">
            <h1 class="mb-0">Добро пожаловать</h1>
        </div>

        <div class="ax-card p-3 mb-4">
            <div class="d-flex justify-content-between align-items-center">
                <h2 class="mb-0">{{ \App\Support\SessionAuth::user()['name'] ?? '' }}</h2>
                <a href="/journal.php" class="btn btn-primary">Журнал</a>
            </div>
        </div>

        <h2 class="mb-3">Ваши группы:</h2><br>
        <ul class="list-group mb-4">
            @if (! empty($paginatedUnits))
                @foreach ($paginatedUnits as $unit)
                    <li class="list-group-item d-flex justify-content-between align-items-center">
                        <a href="/group_att.php?group_id={{ urlencode((string) $unit['id']) }}" class="group-name fw-bold">
                            {{ $unit['group_name'] ?? 'Без названия' }}
                        </a>

                        <span class="badge bg-secondary fs-6">
                            @php
                                $beginTime = \DateTime::createFromFormat('H:i:s', $unit['begin_time'])->format('H:i');
                                $endTime = \DateTime::createFromFormat('H:i:s', $unit['end_time'])->format('H:i');
                            @endphp
                            {{ $beginTime }} - {{ $endTime }}
                        </span>
                    </li>
                @endforeach
            @else
                <li class="list-group-item text-muted">На сегодня нет групп с уроками.</li>
            @endif
        </ul>

        @if ($totalPages > 1)
            <nav>
                <ul class="pagination">
                    @for ($i = 1; $i <= $totalPages; $i++)
                        <li class="page-item {{ $i === $currentPage ? 'active' : '' }}">
                            <a class="page-link" href="?page={{ $i }}">{{ $i }}</a>
                        </li>
                    @endfor
                </ul>
            </nav>
        @endif

        <br>
        <div class="row mt-4">
            <div class="col-md-6">
                <div class="card text-white mb-3 shadow" style="background-color:#FFAF39">
                    <div class="card-body">
                        <h5 class="card-title">Количество уроков в этом месяце</h5>
                        <p class="card-text display-6">{{ $hoursCount ?? 0 }}</p>
                    </div>
                </div>
            </div>
            <div class="col-md-6">
                <div class="card text-white mb-3 shadow" style="background-color:#2196F3">
                    <div class="card-body">
                        <h5 class="card-title">Зарплата за этот месяц</h5>
                        <p class="card-text display-6">{{ number_format($earning ?? 0, 0, ',', ' ') }} ₸</p>
                    </div>
                </div>
            </div>
        </div>

        <div class="text-center mt-4">
            <button type="button" class="btn btn-warning me-2" data-bs-toggle="modal" data-bs-target="#replacementModal">
                Запрос на замену
            </button>

            <a href="/rec_students_list.php" class="btn btn-success">
                Жалоба / Похвала
            </a>
        </div>

        <div class="modal fade" id="replacementModal" tabindex="-1" aria-labelledby="replacementModalLabel" aria-hidden="true">
            <div class="modal-dialog modal-dialog-centered">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title" id="replacementModalLabel">Запрос на замену</h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Закрыть"></button>
                    </div>
                    <div class="modal-body">
                        <form id="replacementForm">
                            <div class="mb-3">
                                <label for="teacherSelect" class="form-label">Выберите преподавателя</label>
                                <select class="form-select" id="teacherSelect" name="teacher_id" required>
                                    <option value="" selected disabled>Выберите преподавателя</option>
                                    @foreach ($teachers as $teacher)
                                        <option value="{{ (int) $teacher->id }}">{{ $teacher->name }}</option>
                                    @endforeach
                                </select>
                            </div>

                            <div class="mb-3">
                                <label for="dateInput" class="form-label">Дата урока</label>
                                <input type="date" class="form-control" id="dateInput" name="lesson_date" required>
                            </div>

                            <div class="mb-3">
                                <label for="timeSelect" class="form-label">Выберите время урока</label>
                                <select class="form-select" id="timeSelect" name="lesson_time" required>
                                    <option value="" selected disabled>Выберите время</option>
                                    @foreach (['08:00','09:00','10:00','11:00','12:00','13:00','14:00','15:00','16:00','17:00','18:00','19:00','20:00'] as $time)
                                        <option value="{{ $time }}">{{ $time }}</option>
                                    @endforeach
                                </select>
                            </div>

                            <div id="replacementError" class="alert alert-warning d-none"></div>

                            <button type="submit" class="btn btn-primary">Заменить</button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script>
    document.addEventListener('DOMContentLoaded', () => {
        const replacementForm = document.getElementById('replacementForm');
        const teacherSelect    = document.getElementById('teacherSelect');
        const dateInput        = document.getElementById('dateInput');
        const timeSelect       = document.getElementById('timeSelect');
        const errorBox         = document.getElementById('replacementError');

        dateInput.value = new Date().toISOString().slice(0, 10);

        replacementForm.addEventListener('submit', (e) => {
            e.preventDefault();
            errorBox.classList.add('d-none');

            const teacherId = teacherSelect.value;
            const date      = dateInput.value;
            const time      = timeSelect.value;

            if (!teacherId || !date || !time) return;

            const submitBtn = replacementForm.querySelector('button[type="submit"]');
            submitBtn.disabled = true;

            fetch(`/get_free_times.php?teacher_id=${encodeURIComponent(teacherId)}&date=${encodeURIComponent(date)}&time=${encodeURIComponent(time)}`)
                .then(res => res.json())
                .then(data => {
                    if (data.success && data.group_id) {
                        window.location.href = `/group_att.php?group_id=${data.group_id}&date=${encodeURIComponent(date)}&substitute_for=${encodeURIComponent(teacherId)}`;
                    } else {
                        errorBox.textContent = data.message || 'Группа не найдена у преподавателя в это время.';
                        errorBox.classList.remove('d-none');
                        submitBtn.disabled = false;
                    }
                })
                .catch(err => {
                    console.error(err);
                    errorBox.textContent = 'Ошибка при проверке группы у преподавателя.';
                    errorBox.classList.remove('d-none');
                    submitBtn.disabled = false;
                });
        });
    });
    </script>
@endsection