@extends('layouts.app')

@section('title', 'Родители')

@push('styles')
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-select@1.14.0-beta3/dist/css/bootstrap-select.min.css">
<style>
    .parent-name { font-weight: bold; }
    .list-group-item { min-height: 50px; }
</style>
@endpush

@section('content')
    <div class="container mt-4">
        @include('admin.partials.user-tabs', ['activeTab' => 'parents'])

        <div class="card p-3 mb-4">
            <div class="d-flex justify-content-between align-items-center">
                <h2 class="mb-0">Родители</h2>
                <button class="btn btn-success" data-bs-toggle="modal" data-bs-target="#addParentModal">Добавить родителя</button>
            </div>
        </div>

        <div class="d-flex justify-content-between align-items-center mb-3">
            <form class="d-flex" method="GET" action="/admin/parents.php">
                <input type="text" class="form-control me-2" name="search" placeholder="Поиск по имени или фамилии" value="{{ $search }}">
                <button class="btn btn-outline-secondary" type="submit">Поиск</button>
            </form>
        </div>

        @if ($canManageParents)
            <div class="d-flex justify-content-between align-items-center mb-2">
                <div class="form-check">
                    <input type="checkbox" class="form-check-input" id="selectAllParents">
                    <label class="form-check-label" for="selectAllParents">Выбрать всех</label>
                </div>
                <div id="bulkActionsBar" class="dropdown d-none">
                    <button class="btn btn-outline-secondary d-flex align-items-center gap-2" type="button" data-bs-toggle="dropdown">
                        <span id="bulkSelectedCount">0</span> выбрано
                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
                            <path d="M3 9.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm5 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3z"/>
                        </svg>
                    </button>
                    <ul class="dropdown-menu dropdown-menu-end">
                        <li><a class="dropdown-item" href="#" onclick="openBulkModal('bulkPremiumModal'); return false;">Премиум для выбранных</a></li>
                        <li><a class="dropdown-item text-danger" href="#" onclick="openBulkModal('bulkDeleteModal'); return false;">Удалить выбранных</a></li>
                    </ul>
                </div>
            </div>
        @endif

        <ul class="list-group mb-4">
            @if (! empty($parents))
                @foreach ($parents as $parent)
                    @php
                        $opts = $editStudentOptions[$parent->id];
                    @endphp
                    <li class="list-group-item d-flex justify-content-between align-items-center">
                        <div class="d-flex align-items-center gap-2">
                            @if ($canManageParents)
                                <input type="checkbox" class="parent-checkbox" value="{{ $parent->id }}">
                            @endif
                            <div>
                                <span class="parent-name">{{ $parent->name ?? '' }}</span>

                                @if (! empty($parent->email))
                                    — <span class="text-muted">{{ $parent->email }}</span>
                                @endif

                                @if (! empty($parent->student_first_name))
                                    — {{ $parent->student_first_name.' '.$parent->student_last_name }}
                                @endif

                                @if (! empty($parent->premium_until))
                                    — <span class="badge bg-warning text-dark">Premium до {{ date('d.m.Y', strtotime($parent->premium_until)) }}</span>
                                @else
                                    — <span class="badge bg-secondary">Нет Premium</span>
                                @endif
                            </div>
                        </div>

                        <div>
                            <button class="btn btn-sm btn-outline-primary" data-bs-toggle="modal" data-bs-target="#editParentModal{{ $parent->id }}">Редактировать</button>
                            <button class="btn btn-sm btn-warning" data-bs-toggle="modal" data-bs-target="#premiumModal{{ $parent->id }}">Премиум</button>
                            <button class="btn btn-sm btn-outline-danger" data-bs-toggle="modal" data-bs-target="#deleteParentModal{{ $parent->id }}">Удалить</button>
                        </div>
                    </li>

                    <div class="modal fade" id="deleteParentModal{{ $parent->id }}" tabindex="-1" aria-hidden="true">
                        <div class="modal-dialog">
                            <div class="modal-content">
                                <form action="/admin/delete_parent.php" method="POST">
                                    @csrf
                                    <input type="hidden" name="id" value="{{ $parent->id }}">
                                    <div class="modal-header">
                                        <h5 class="modal-title text-danger">Удалить родителя</h5>
                                        <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                                    </div>
                                    <div class="modal-body">
                                        Удалить родителя «{{ $parent->name }}»?
                                    </div>
                                    <div class="modal-footer">
                                        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Отмена</button>
                                        <button type="submit" class="btn btn-danger">Удалить</button>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>

                    <div class="modal fade" id="premiumModal{{ $parent->id }}" tabindex="-1" aria-labelledby="premiumModalLabel{{ $parent->id }}" aria-hidden="true">
                        <div class="modal-dialog">
                            <div class="modal-content">
                                <form action="/admin/set_premium.php" method="POST">
                                    @csrf
                                    <div class="modal-header">
                                        <h5 class="modal-title" id="premiumModalLabel{{ $parent->id }}">
                                            Премиум доступ для {{ $parent->name }}
                                        </h5>
                                        <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                                    </div>
                                    <div class="modal-body">
                                        <input type="hidden" name="parent_id" value="{{ $parent->id }}">
                                        <div class="mb-3">
                                            <label for="premium_until{{ $parent->id }}" class="form-label">Премиум до</label>
                                            <input type="date" class="form-control" id="premium_until{{ $parent->id }}" name="premium_until" value="{{ $parent->premium_until ?? date('Y-m-d') }}" required>
                                        </div>
                                    </div>
                                    <div class="modal-footer">
                                        <button type="submit" class="btn btn-primary">Сохранить</button>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>

                    <div class="modal fade" id="editParentModal{{ $parent->id }}" tabindex="-1" aria-labelledby="editParentModalLabel{{ $parent->id }}" aria-hidden="true">
                        <div class="modal-dialog modal-lg">
                            <div class="modal-content">
                                <form action="/admin/edit_parent.php" method="POST">
                                    @csrf
                                    <div class="modal-header">
                                        <h5 class="modal-title" id="editParentModalLabel{{ $parent->id }}">Редактировать родителя</h5>
                                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Закрыть"></button>
                                    </div>
                                    <div class="modal-body">
                                        <input type="hidden" name="parent_id" value="{{ $parent->id }}">

                                        <div class="mb-3">
                                            <label class="form-label">Имя</label>
                                            <input type="text" class="form-control" name="name" value="{{ $parent->name }}" required>
                                        </div>

                                        <div class="mb-3">
                                            <label class="form-label">Email</label>
                                            <input type="email" class="form-control" name="email" value="{{ $parent->email }}" required>
                                        </div>

                                        <div class="mb-3">
                                            <label class="form-label">ИИН родителя</label>
                                            <input type="text" class="form-control" name="iin" maxlength="12" inputmode="numeric" pattern="\d{12}"
                                                   value="{{ $parent->iin ?? '' }}">
                                        </div>

                                        <div class="mb-3">
                                            <label class="form-label">Пароль (оставьте пустым, если не хотите менять)</label>
                                            <input type="password" class="form-control" name="password">
                                        </div>

                                        <div class="mb-3">
                                            <label class="form-label">Выберите ученика</label>
                                            <select name="student_id" class="form-select selectpicker" data-live-search="true" required>
                                                @foreach ($opts['students'] as $student)
                                                    <option value="{{ $student->id }}" {{ $student->id == $opts['currentStudentId'] ? 'selected' : '' }}>
                                                        {{ $student->first_name.' '.$student->last_name.(! empty($student->iin) ? ' — ИИН: '.$student->iin : '') }}
                                                    </option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                    <div class="modal-footer">
                                        <button type="submit" class="btn btn-primary">Сохранить</button>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                @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 }}{{ $search ? '&search='.urlencode($search) : '' }}">
                                {{ $i }}
                            </a>
                        </li>
                    @endfor
                </ul>
            </nav>
        @endif
    </div>

    @if ($canManageParents)
        <div class="modal fade" id="bulkDeleteModal" tabindex="-1" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <form action="/admin/parents.php" method="POST">
                        @csrf
                        <input type="hidden" name="action" value="bulk_delete">
                        <div id="bulkDeleteParentIds"></div>
                        <div class="modal-header">
                            <h5 class="modal-title text-danger">Удалить родителей</h5>
                            <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                        </div>
                        <div class="modal-body">
                            Удалить выбранных родителей <span id="bulkDeleteModalCount"></span>?
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Отмена</button>
                            <button type="submit" class="btn btn-danger">Удалить</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>

        <div class="modal fade" id="bulkPremiumModal" tabindex="-1" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <form action="/admin/parents.php" method="POST">
                        @csrf
                        <input type="hidden" name="action" value="bulk_set_premium">
                        <div id="bulkPremiumParentIds"></div>
                        <div class="modal-header">
                            <h5 class="modal-title">Премиум для выбранных <span id="bulkPremiumModalCount"></span></h5>
                            <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                        </div>
                        <div class="modal-body">
                            <div class="mb-3">
                                <label for="bulkPremiumUntil" class="form-label">Премиум до</label>
                                <input type="date" class="form-control" id="bulkPremiumUntil" name="premium_until" value="{{ date('Y-m-d') }}" required>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="submit" class="btn btn-primary">Сохранить</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    @endif

    <div class="modal fade" id="addParentModal" tabindex="-1" aria-labelledby="addParentModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <form action="/admin/add_parent.php" method="POST">
                    @csrf
                    <div class="modal-header">
                        <h5 class="modal-title" id="addParentModalLabel">Добавить родителя</h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Закрыть"></button>
                    </div>
                    <div class="modal-body">
                        <div class="mb-3">
                            <label for="parent_name" class="form-label">Имя</label>
                            <input type="text" class="form-control" id="parent_name" name="name" required>
                        </div>
                        <div class="mb-3">
                            <label for="parent_email" class="form-label">Email</label>
                            <input type="email" class="form-control" id="parent_email" name="email" required>
                            <div id="emailFeedback" class="invalid-feedback"></div>
                        </div>
                        <div class="mb-3">
                            <label for="parent_iin" class="form-label">ИИН родителя</label>
                            <input type="text" class="form-control" id="parent_iin" name="iin" maxlength="12" inputmode="numeric" pattern="\d{12}">
                        </div>
                        <div class="mb-3">
                            <label for="parent_password" class="form-label">Пароль</label>
                            <input type="password" class="form-control" id="parent_password" name="password" required>
                        </div>
                        <div class="mb-3">
                            <label for="student_select" class="form-label">Выберите ученика</label>
                            <select name="student_id" id="student_select" class="selectpicker form-control" data-live-search="true" data-size="8" required>
                                @foreach ($availableStudents as $student)
                                    <option value="{{ $student->id }}">
                                        {{ $student->first_name.' '.$student->last_name.(! empty($student->iin) ? ' — ИИН: '.$student->iin : '') }}
                                    </option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="submit" class="btn btn-primary">Сохранить</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <script>
    document.addEventListener("DOMContentLoaded", function() {
        var addParentModal = document.getElementById('addParentModal');
        addParentModal.addEventListener('shown.bs.modal', function () {
            $('#student_select').selectpicker('render');
        });

        const emailInput = document.getElementById("parent_email");
        const emailFeedback = document.getElementById("emailFeedback");
        const form = addParentModal.querySelector("form");

        emailInput.addEventListener("blur", function() {
            let email = emailInput.value.trim();
            if (!email) return;

            fetch("/admin/check_email.php", {
                method: "POST",
                headers: {
                    "Content-Type": "application/x-www-form-urlencoded",
                    "X-CSRF-TOKEN": document.querySelector('meta[name="csrf-token"]').content
                },
                body: "email=" + encodeURIComponent(email)
            })
            .then(response => response.json())
            .then(data => {
                if (data.exists) {
                    emailInput.classList.add("is-invalid");
                    emailFeedback.textContent = "Такой email уже существует!";
                } else {
                    emailInput.classList.remove("is-invalid");
                    emailInput.classList.add("is-valid");
                    emailFeedback.textContent = "";
                }
            })
            .catch(err => console.error(err));
        });

        form.addEventListener("submit", function(e) {
            if (emailInput.classList.contains("is-invalid")) {
                e.preventDefault();
            }
        });
    });
    </script>
    @if ($canManageParents)
        <script>
        document.addEventListener('DOMContentLoaded', function () {
            const selectAllCb = document.getElementById('selectAllParents');
            const bulkBar = document.getElementById('bulkActionsBar');
            const bulkCount = document.getElementById('bulkSelectedCount');

            function getSelectedParentIds() {
                return Array.from(document.querySelectorAll('.parent-checkbox:checked')).map(cb => cb.value);
            }

            function refreshBulkBar() {
                const ids = getSelectedParentIds();
                bulkCount.textContent = ids.length;
                bulkBar.classList.toggle('d-none', ids.length === 0);

                const all = document.querySelectorAll('.parent-checkbox');
                const checked = document.querySelectorAll('.parent-checkbox:checked');
                selectAllCb.checked = all.length > 0 && all.length === checked.length;
            }

            document.addEventListener('change', function (e) {
                if (e.target.classList.contains('parent-checkbox')) refreshBulkBar();
            });

            selectAllCb.addEventListener('change', function () {
                document.querySelectorAll('.parent-checkbox').forEach(cb => cb.checked = selectAllCb.checked);
                refreshBulkBar();
            });

            window.openBulkModal = function (modalId) {
                const ids = getSelectedParentIds();
                if (ids.length === 0) return;

                const containerId = modalId === 'bulkDeleteModal' ? 'bulkDeleteParentIds' : 'bulkPremiumParentIds';
                document.getElementById(containerId).innerHTML =
                    ids.map(id => `<input type="hidden" name="parent_ids[]" value="${id}">`).join('');

                document.getElementById(modalId + 'Count').textContent = `(${ids.length})`;

                new bootstrap.Modal(document.getElementById(modalId)).show();
            };
        });
        </script>
    @endif
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap-select@1.14.0-beta3/dist/js/bootstrap-select.min.js"></script>
@endsection