@php
    $modalId = 'ModalForm_add_to_training_multi';
    $formId = 'form_add_to_training_multi';

    $aktywneOsoby = DB::table('t035_osoby')
        ->where('status_aktywny', '1')
        ->where('pracownik', '1')
        ->orderBy('nazwisko')
        ->orderBy('imie')
        ->get();

    $komorki = DB::table('sw020_komorki_organizacyjne')
        ->orderBy('nazwa_pelna')
        ->get();

    $aktualniUczestnicy = DB::table('t052_szkolenie_osoba')
        ->where('id_szkolenie', $data->id)
        ->pluck('id_osoba')
        ->toArray();

    // Mapowanie osoby -> pierwszy przypisany wydzial (KO).
    $koByPersonId = [];
    $osobaIds = $aktywneOsoby->pluck('id')->toArray();
    if (!empty($osobaIds)) {
        $powiazaniaKO = DB::table('t021_pracownicy_w_dziale as pwd')
            ->leftJoin('sw020_komorki_organizacyjne as ko', 'ko.id', '=', 'pwd.dzial_id')
            ->whereIn('pwd.pracownik_id', $osobaIds)
            ->whereNotNull('pwd.status')
            ->orderBy('pwd.pracownik_id')
            ->orderBy('pwd.id')
            ->get([
                'pwd.pracownik_id',
                'pwd.dzial_id',
                'ko.nazwa_skrot',
            ]);

        foreach ($powiazaniaKO as $itemKO) {
            if (!isset($koByPersonId[$itemKO->pracownik_id])) {
                $koByPersonId[$itemKO->pracownik_id] = [
                    'id' => (int) ($itemKO->dzial_id ?? 0),
                    'skrot' => $itemKO->nazwa_skrot ?? '',
                ];
            }
        }
    }
@endphp

<style>
    #{{ $modalId }} .col-form-label {
        font-size: 1rem !important;
        display: flex;
        align-items: flex-start;
        justify-content: flex-end;
    }

    #{{ $modalId }} input.form-control,
    #{{ $modalId }} textarea.form-control,
    #{{ $modalId }} select.form-control {
        font-size: 1rem !important;
    }
</style>

<div class="modal fade" id="{{ $modalId }}" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog my_modal_alert" role="document" style="max-width: 800px;">
        <div class="alert-success" style="border-radius: 15px; pointer-events: auto; width: 800px;">
            <form id="{{ $formId }}" method="post" action="{{ route('m_szkol_form_add_to_training_multi_save') }}" enctype="multipart/form-data">
                @csrf
                <div class="modal-header card-header" style="border-radius: 15px 15px 0 0;">
                    <div style="margin-right: 1vw;">
                        <i class="fa fa-plus-circle fa-2x"></i>
                    </div>
                    <div class="my-auto ml-1 row">
                        Dodaj Uczestnikow (wielopoziomowo)
                    </div>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>

                <div class="modal-body text-lg-center" style="max-height: 70vh; overflow: overlay;">
                    <input name="return_to" type="hidden" value="{{ $return_to ?? null }}">
                    <input name="return_to_after_delete" type="hidden" value="{{ $return_to_after_delete ?? null }}">
                    <input name="modal_return_to" type="hidden" value="{{ $modal_return_to ?? null }}">
                    <input name="site_back" type="hidden" value="{{ $site_back ?? null }}">
                    <input type="hidden" name="szkolenie_id_hidden" value="{{ $data->id }}">
                    <input type="hidden" name="user_id" value="{{ Auth::id() }}">

                    <div class="form-group row">
                        <div class="col-md-12">
                            <div class="table-responsive">
                                <table class="table table-sm mb-0">
                                    <tr>
                                        <td class="text-end align-middle" rowspan="2" style="border: unset;"><label class="d-block text-center font-weight-bold mb-2">Poziom wyboru:</label></td>
                                        <th class="text-center align-middle" style="border: unset;">Cala organizacja</th>
                                        <th class="text-center align-middle" style="border: unset;">Wybrane komorki organizacyjne</th>
                                        <th class="text-center align-middle" style="border: unset;">Wybrane osoby</th>
                                    </tr>
                                    <tr>
                                        <td class="text-center align-middle" style="border: unset; padding-bottom: 0.5rem;">
                                            <div class="form-check d-flex justify-content-center mb-0">
                                                <input class="form-check-input js_scope_type position-static" type="radio" name="scope_type" id="scope_type_org" value="org" checked>
                                            </div>
                                        </td>
                                        <td class="text-center align-middle" style="border: unset; padding-bottom: 0.5rem;">
                                            <div class="form-check d-flex justify-content-center mb-0">
                                                <input class="form-check-input js_scope_type position-static" type="radio" name="scope_type" id="scope_type_departments" value="departments">
                                            </div>
                                        </td>
                                        <td class="text-center align-middle" style="border: unset; padding-bottom: 0.5rem;">
                                            <div class="form-check d-flex justify-content-center mb-0">
                                                <input class="form-check-input js_scope_type position-static" type="radio" name="scope_type" id="scope_type_people" value="people">
                                            </div>
                                        </td>
                                    </tr>
                                </table>
                            </div>
                        </div>
                    </div>

                    <hr class="form_info">

                    <div id="scope_box_org" class="scope_box border rounded p-2 mb-2">
                        <p class="mb-2">
                            Dodanie wszystkich aktywnych pracownikow organizacji.
                        </p>
                        <div class="form-check">
                            <label class="form-check-label" for="org_all">
                                Potwierdzam dodanie calej organizacji
                            </label>
                            <input class="form-check-input" type="checkbox" id="org_all" name="org_all" value="1" checked style="margin-left: 0.5rem;">
                        </div>
                        <small class="text-muted">
                            Aktywne osoby w systemie: {{ $aktywneOsoby->count() }}
                        </small>
                    </div>

                    <div id="scope_box_departments" class="scope_box border rounded p-2 mb-2 d-none">
                        <div class="input-group mb-2">
                            <input type="text" class="form-control form-control-sm" id="search_departments_multi" placeholder="Szukaj komorki...">
                            <div class="input-group-append">
                                <button type="button" class="btn btn-outline-secondary" id="clear_departments_multi" title="Wyczysc">
                                    <i class="fas fa-times"></i>
                                </button>
                            </div>
                            <div class="input-group-append">
                                <span class="input-group-text end_date_calendar"><i class="fas fa-search"></i></span>
                            </div>
                        </div>

                        <div class="mb-2" style="text-align: end; padding-right: 1rem;">
                            <label class="mb-0">
                                Zaznacz wszystkie widoczne <input type="checkbox" id="check_all_departments_multi" style="margin-left: 0.5rem;">
                            </label>
                        </div>

                        <hr class="form_info">

                        <div class="table-responsive my_scrollbar_new" style="max-height: 280px;">
                            <table class="table table-sm table-hover table-striped mb-0">
                                <thead>
                                <tr>
                                    <th>Skrot</th>
                                    <th>Nazwa</th>
                                    <th style="width: 40px;"></th>
                                </tr>
                                </thead>
                                <tbody>
                                @foreach($komorki as $komorka)
                                    @php
                                        $searchString = trim(($komorka->nazwa_skrot ?? '').' '.($komorka->nazwa_pelna ?? ''));
                                    @endphp
                                    <tr class="row_department_multi" data-search="{{ $searchString }}">
                                        <td>{{ $komorka->nazwa_skrot }}</td>
                                        <td>{{ $komorka->nazwa_pelna }}</td>
                                        <td>
                                            <input type="checkbox" class="department_checkbox_multi" name="department_ids[]" value="{{ $komorka->id }}">
                                        </td>
                                    </tr>
                                @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>

                    <div id="scope_box_people" class="scope_box border rounded p-2 mb-2 d-none">
                        <div class="input-group mb-2">
                            <select class="form-control form-control-sm" id="filter_people_department_multi" style="max-width: 260px;">
                                <option value="">-- Wszystkie wydzialy --</option>
                                @foreach($komorki as $komorka)
                                    <option value="{{ $komorka->id }}">
                                        {{ $komorka->nazwa_skrot }} - {{ $komorka->nazwa_pelna }}
                                    </option>
                                @endforeach
                            </select>
                            <input type="text" class="form-control form-control-sm" id="search_people_multi" placeholder="Szukaj osoby...">
                            <div class="input-group-append">
                                <button type="button" class="btn btn-outline-secondary" id="clear_people_multi" title="Wyczysc">
                                    <i class="fas fa-times"></i>
                                </button>
                            </div>
                            <div class="input-group-append">
                                <span class="input-group-text end_date_calendar"><i class="fas fa-search"></i></span>
                            </div>
                        </div>

                        <div class="mb-2" style="text-align: end; padding-right: 1rem;">
                            <label class="mb-0">
                                Zaznacz wszystkie widoczne <input type="checkbox" id="check_all_people_multi" style="margin-left: 0.5rem;">
                            </label>
                        </div>

                        <hr class="form_info">

                        <div class="table-responsive my_scrollbar_new" style="max-height: 280px;">
                            <table class="table table-sm table-hover table-striped mb-0">
                                <thead>
                                <tr>
                                    <th>Nazwisko i imie</th>
                                    <th style="width: 90px;">KO</th>
                                    <th>Status</th>
                                    <th style="width: 40px;"></th>
                                </tr>
                                </thead>
                                <tbody>
                                @foreach($aktywneOsoby as $osoba)
                                    @php
                                        $personKoId = (int)($koByPersonId[$osoba->id]['id'] ?? 0);
                                        $personKoShort = trim((string)($koByPersonId[$osoba->id]['skrot'] ?? '---'));
                                        $searchString = trim(($osoba->nazwisko ?? '').' '.($osoba->imie ?? '').' '.$personKoShort);
                                        $alreadyAdded = in_array($osoba->id, $aktualniUczestnicy);
                                    @endphp
                                    <tr class="row_people_multi" data-search="{{ $searchString }}" data-ko-id="{{ $personKoId }}">
                                        <td>{{ $osoba->nazwisko }} {{ $osoba->imie }}</td>
                                        <td>{{ $personKoShort }}</td>
                                        <td>
                                            @if($alreadyAdded)
                                                <span class="badge badge-secondary">Juz dodana</span>
                                            @else
                                                <span class="badge badge-light">Nowa</span>
                                            @endif
                                        </td>
                                        <td>
                                            <input type="checkbox"
                                                   class="people_checkbox_multi"
                                                   name="person_ids[]"
                                                   value="{{ $osoba->id }}"
                                                   {{ $alreadyAdded ? 'disabled' : '' }}>
                                        </td>
                                    </tr>
                                @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>

                    <div class="text-right text-muted">
                        Zaznaczone: <strong id="selected_count_multi">0</strong>
                    </div>
                </div>

                <div class="modal-footer" style="justify-content: center !important;">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Anuluj</button>
                    <button type="submit" class="btn btn-success">Dodaj zaznaczone</button>
                </div>
            </form>
        </div>
    </div>
</div>

<script>
    (function () {
        function normalizeText(text) {
            var value = (text || '').toString().toLowerCase();
            var polishMap = {
                'ą': 'a',
                'ć': 'c',
                'ę': 'e',
                'ł': 'l',
                'ń': 'n',
                'ó': 'o',
                'ś': 's',
                'ż': 'z',
                'ź': 'z'
            };

            value = value.replace(/[ąćęłńóśżź]/g, function (char) {
                return polishMap[char] || char;
            });

            return value.replace(/\s+/g, ' ').trim();
        }

        function updateScopeBox() {
            var scope = $('input[name="scope_type"]:checked').val();
            $('.scope_box').addClass('d-none');
            $('#scope_box_' + scope).removeClass('d-none');
            updateSelectedCounter();
        }

        function filterRows(inputSelector, rowSelector) {
            var phrase = normalizeText($(inputSelector).val());
            $(rowSelector).each(function () {
                var haystackRaw = $(this).attr('data-search');
                if (haystackRaw === undefined || haystackRaw === null || haystackRaw === '') {
                    haystackRaw = $(this).text();
                }
                var haystack = normalizeText(haystackRaw);
                $(this).toggle(haystack.indexOf(phrase) !== -1);
            });
        }

        function filterPeopleRows() {
            var phrase = normalizeText($('#search_people_multi').val());
            var selectedKoId = ($('#filter_people_department_multi').val() || '').toString();

            $('.row_people_multi').each(function () {
                var $row = $(this);
                var haystackRaw = $row.attr('data-search');
                if (haystackRaw === undefined || haystackRaw === null || haystackRaw === '') {
                    haystackRaw = $row.text();
                }
                var haystack = normalizeText(haystackRaw);
                var rowKoId = (($row.attr('data-ko-id') || '') + '').trim();

                var matchesText = (haystack.indexOf(phrase) !== -1);
                var matchesKo = (selectedKoId === '' || rowKoId === selectedKoId);

                $row.toggle(matchesText && matchesKo);
            });
        }

        function updateSelectedCounter() {
            var scope = $('input[name="scope_type"]:checked').val();
            var count = 0;

            if (scope === 'org') {
                count = $('#org_all').is(':checked') ? 1 : 0;
            } else if (scope === 'departments') {
                count = $('.department_checkbox_multi:checked').length;
            } else if (scope === 'people') {
                count = $('.people_checkbox_multi:checked').length;
            }

            $('#selected_count_multi').text(count);
        }

        function showValidationError(message) {
            if (typeof my_ShowAppNotification === 'function') {
                my_ShowAppNotification('warning', message);
            } else {
                alert(message);
            }
        }

        $(document).on('change', '.js_scope_type', updateScopeBox);
        $(document).on('keyup', '#search_departments_multi', function () {
            filterRows('#search_departments_multi', '.row_department_multi');
        });
        $(document).on('click', '#clear_departments_multi', function () {
            $('#search_departments_multi').val('');
            filterRows('#search_departments_multi', '.row_department_multi');
            $('#search_departments_multi').focus();
        });
        $(document).on('keyup', '#search_people_multi', function () {
            filterPeopleRows();
        });
        $(document).on('change', '#filter_people_department_multi', function () {
            filterPeopleRows();
        });
        $(document).on('click', '#clear_people_multi', function () {
            $('#search_people_multi').val('');
            $('#filter_people_department_multi').val('');
            filterPeopleRows();
            $('#search_people_multi').focus();
        });

        $(document).on('change', '#check_all_departments_multi', function () {
            var checked = $(this).is(':checked');
            $('.row_department_multi:visible .department_checkbox_multi').prop('checked', checked);
            updateSelectedCounter();
        });

        $(document).on('change', '#check_all_people_multi', function () {
            var checked = $(this).is(':checked');
            $('.row_people_multi:visible .people_checkbox_multi:not(:disabled)').prop('checked', checked);
            updateSelectedCounter();
        });

        $(document).on('change', '.department_checkbox_multi, .people_checkbox_multi, #org_all', updateSelectedCounter);

        $(document).on('submit', '#form_add_to_training_multi', function (e) {
            var scope = $('input[name="scope_type"]:checked').val();

            if (scope === 'org' && !$('#org_all').is(':checked')) {
                e.preventDefault();
                showValidationError('Potwierdz dodanie calej organizacji.');
                return;
            }

            if (scope === 'departments' && $('.department_checkbox_multi:checked').length === 0) {
                e.preventDefault();
                showValidationError('Wybierz co najmniej jedna komorke organizacyjna.');
                return;
            }

            if (scope === 'people' && $('.people_checkbox_multi:checked').length === 0) {
                e.preventDefault();
                showValidationError('Wybierz co najmniej jedna osobe.');
                return;
            }
        });

        $(document).on('shown.bs.modal', '#ModalForm_add_to_training_multi', function () {
            $('#search_departments_multi').val('');
            $('#search_people_multi').val('');
            $('#filter_people_department_multi').val('');
            filterRows('#search_departments_multi', '.row_department_multi');
            filterPeopleRows();
            updateScopeBox();
        });
    })();
</script>