@extends('layouts.site')

@section('title','Słowniki AJAX - sw030_zasoby')

@php
    $sw030_search_column_options = [
        ['key' => 'id', 'label' => 'ID', 'checked' => true],
        ['key' => 'nazwa', 'label' => 'Nazwa zasobu', 'checked' => true],
        ['key' => 'skrot', 'label' => 'Nazwa skrót', 'checked' => true],
        ['key' => 'opis', 'label' => 'Opis', 'checked' => true],
    ];
    $sw030_column_options = [
        ['key' => 'id', 'label' => 'ID', 'checked' => true],
        ['key' => 'rodzaj', 'label' => 'Rodzaj', 'checked' => true],
        ['key' => 'nazwa', 'label' => 'Nazwa zasobu', 'checked' => true],
        ['key' => 'skrot', 'label' => 'Nazwa skrót', 'checked' => true],
        ['key' => 'opis', 'label' => 'Opis', 'checked' => true],
        ['key' => 'modyfikacja', 'label' => 'Modyfikacja', 'checked' => true],
    ];
    $sw030_filters = [
        [
            'type' => 'select',
            'key' => 'rodzaj_zasobu_id',
            'id' => 'sw030-filter-rodzaj',
            'name' => 'sw030_filter_rodzaj',
            'label' => 'Rodzaj zasobu:',
            'placeholder' => 'wszystkie',
            'options' => $rodzaje_zasobu ?? [],
        ],
    ];
@endphp

@section('content')
<div class="tab-content_2 ajax-crud-theme">
    <div class="row justify-content-center">
        <div class="col-md-12">
            <div class="row col-12 index-info" style="justify-content: space-between; padding-left: 0px; padding-right: 0px; margin: 1rem 0 1rem 0.5rem;">
                <div class="col-6" style="padding-left: 0px;">
                    <h5><i>Słowniki AJAX - T-sw030 Zasoby</i></h5>
                </div>
                <div class="col-6 text-right ajax-div-export-component">
                    <div class="d-inline-flex align-items-center" style="gap: 1rem;">
                        <x-ajax-table-export-buttons id="sw030-export-toolbar" />
                        <x-view-close-button
                            id="sw030-close-view-btn"
                            :href="url('/m_admin')"
                            title="Zamknij widok"
                        />
                    </div>
                </div>
            </div>

            <div class="ajax-crud-card">
                <div class="card-body">
                    <div class="row ajax-crud-toolbar">
                        <div class="col-md-1">
                            <div style="display:flex; justify-content:flex-start; margin-bottom: 0.2rem;">
                                <x-ajax-filters-status-indicator
                                    id="sw030-filters-status"
                                    filters-id="sw030-filters"
                                />
                            </div>
                        </div>

                        <div class="col-md-5"></div>

                        <div class="col-md-2 text-right">
                            <x-ajax-filters
                                id="sw030-filters"
                                :filters="$sw030_filters"
                                wrapper-class="ajax-filters d-flex align-items-start"
                                item-class="mb-0 w-100"
                                :auto-bind="true"
                                event-name="ajax-filters:changed"
                                :emit-on-init="false"
                            />
                        </div>
                        <div class="col-md-4 row text-right" style="column-gap: 1rem;display: flex;justify-content: flex-end; padding-right: unset;">
                            <div>
                            <x-ajax-search-box
                                input-id="sw030-search"
                                search-btn-id="sw030-search-btn"
                                clear-btn-id="sw030-search-clear"
                                placeholder="Wpisz tekst aby wyszukać ..."
                                search-columns-id="sw030-search-columns"
                                search-columns-label="Wybierz kolumny do przeszukania."
                                :search-columns-options="$sw030_search_column_options"
                                search-columns-button-class="btn btn-secondary"
                            />
                            </div><div>
                            <x-column-visibility-selector
                                id="sw030-columns"
                                label="Wybierz kolumny do wyświetlenia na widoku."
                                :columns="$sw030_column_options"
                                :counter="false"
                            />
                            </div>
                        </div>
                    </div>

                    <div class="col-sm-12 m-md-auto ajax-crud-theme_div_new_table ajax-crud-table-shell">
                    <div class="table-responsive ajax-crud-theme_div_TableScroll tableFixHead my_scrollbar_new ajax-crud-table-wrap">
                        <input type="hidden" id="active_row" value="{{ session()->get('active_record_'.session()->get('function_id')) ?? '0' }}"/>
                        <table class="table table-sm new_table_app ajax-crud-table" id="sw030-table">
                            <thead>
                                <tr class="tabela-naglowek">
                                    <th class="text-center" style="width: 4rem;">Lp</th>
                                    <th class="text-center th-sort" data-col-key="id" data-sort="id" style="cursor: pointer; width: 6rem;">ID <span class="sw030-sort ajax-crud-sort"></span></th>
                                    <th class="text-center th-sort" data-col-key="rodzaj" data-sort="rodzaj_zasobu_id" style="cursor: pointer; width: 14rem;">Rodzaj <span class="sw030-sort ajax-crud-sort"></span></th>
                                    <th class="text-center th-sort" data-col-key="nazwa" data-sort="zasob_nazwa" style="cursor: pointer;">Nazwa zasobu <span class="sw030-sort ajax-crud-sort"></span></th>
                                    <th class="text-center th-sort" data-col-key="skrot" data-sort="zasob_nazwa_skrot" style="cursor: pointer; width: 16rem;">Nazwa skrót <span class="sw030-sort ajax-crud-sort"></span></th>
                                    <th class="text-center" data-col-key="opis">Opis</th>
                                    <th class="text-center th-sort" data-col-key="modyfikacja" data-sort="updated_at" style="cursor: pointer; width: 13rem;">Modyfikacja <span class="sw030-sort ajax-crud-sort"></span></th>
                                    <th class="text-center table_action" style="width: 9rem;">
                                        <button type="button" class="btn new-table-add-btn-success btn_table new-btn-border-1 btn-ajax-add sw030-btn-add-trigger" data-toggle="tooltip" title="Dodaj rekord">
                                            <i class="fa fa-plus" aria-hidden="true"></i>
                                        </button>
                                    </th>
                                </tr>
                            </thead>
                            <tbody id="sw030-table-body">
                                <tr>
                                    <td colspan="9" class="text-center"><div class="no_records">Ładowanie...</div></td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                    </div>

                    <div class="d-flex align-items-center justify-content-between ajax-pagination-footer" style="margin-top: 0.7rem;">
                        <div class="ajax-pagination-left-tools">
                            <x-ajax-records-count id="sw030-count" value="0 / 0" />

                        </div>
                        <div class="flex-md-nowrap row ajax-div-pagination-and-row-per-site">
                            <x-ajax-pagination-controls
                                prev-id="sw030-page-prev"
                                next-id="sw030-page-next"
                                pages-id="sw030-page-list"
                                info-id="sw030-page-info"
                                wrapper-class=""
                                container-style="margin-top: 0;"
                            />
                            <x-records-per-page-selector
                                id="sw030-per-page"
                                name="sw030_per_page"
                                label=""
                                :value="15"
                                wrapper-class="ajax-records-per-page-footer"
                            />
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
(function ($) {
    var routes = {
        list: "{{ route('m_slownik_ajax_sw030_zasoby_list') }}",
        store: "{{ route('m_slownik_ajax_sw030_zasoby_store') }}",
        update: "{{ route('m_slownik_ajax_sw030_zasoby_update', ['id' => '__ID__']) }}",
        del: "{{ route('m_slownik_ajax_sw030_zasoby_delete', ['id' => '__ID__']) }}",
        export: "{{ route('m_slownik_ajax_sw030_zasoby_export', ['format' => '__FORMAT__']) }}",
        settings_get: "{{ route('user_settings_app_get') }}",
        settings_set: "{{ route('user_settings_app_set') }}"
    };

    var state = {
        page: 1,
        per_page: 15,
        search: '',
        search_columns: {
            id: true,
            nazwa: true,
            skrot: true,
            opis: true
        },
        rodzaj_zasobu_id: '',
        sort: 'id',
        direction: 'desc',
        active_row_id: '',
        active_row_scroll_pending: false,
        records: {},
        pagination: null,
        visible_columns: {
            id: true,
            rodzaj: true,
            nazwa: true,
            skrot: true,
            opis: true,
            modyfikacja: true
        },
        column_order: ['id', 'rodzaj', 'nazwa', 'skrot', 'opis', 'modyfikacja']
    };
    var perPageStorageKey = 'sw030_zasoby_per_page';
    var allowedPerPageValues = [];
    var columnStorageKey = 'sw030_zasoby_visible_columns';
    var columnOrderStorageKey = 'sw030_zasoby_column_order';
    var searchColumnStorageKey = 'sw030_zasoby_search_columns';
    var searchColumnDbMap = {
        id: 'id',
        nazwa: 'zasob_nazwa',
        skrot: 'zasob_nazwa_skrot',
        opis: 'zasob_opis'
    };
    var tableSettingsKey = 'm_slownik_ajax_sw030_zasoby_index';
    var tableSettingsLocalStorageKey = 'user_settings_app_' + tableSettingsKey + '_u{{ (int) (Auth::id() ?? 0) }}';
    var tableSettingsLoaded = false;
    var tableSettingsSaveTimer = null;

    function notify(type, msg) {
        if (typeof my_ShowAppNotification === 'function') {
            my_ShowAppNotification(type, msg);
            return;
        }
        alert(msg || 'Operacja zakończona.');
    }

    function normalizePerPage(value) {
        if (!allowedPerPageValues.length) {
            allowedPerPageValues = $('#sw030-per-page option').map(function () {
                return parseInt($(this).val(), 10);
            }).get().filter(function (v) {
                return !isNaN(v) && v > 0;
            });
        }

        var parsed = parseInt(value, 10);
        if (allowedPerPageValues.indexOf(parsed) === -1) {
            return allowedPerPageValues.length ? allowedPerPageValues[0] : 15;
        }
        return parsed;
    }

    function loadPerPagePreference() {
        var preferred = null;
        if (window.localStorage) {
            preferred = window.localStorage.getItem(perPageStorageKey);
        }

        state.per_page = normalizePerPage(preferred);
        $('#sw030-per-page').val(String(state.per_page));
    }

    function savePerPagePreference(value) {
        if (!window.localStorage) {
            return;
        }

        window.localStorage.setItem(perPageStorageKey, String(normalizePerPage(value)));
    }

    function buildTableSettingsPayload() {
        return {
            page: state.page,
            per_page: state.per_page,
            search: state.search,
            search_columns: $.extend({}, state.search_columns),
            rodzaj_zasobu_id: state.rodzaj_zasobu_id,
            sort: state.sort,
            direction: state.direction,
            visible_columns: $.extend({}, state.visible_columns),
            column_order: state.column_order.slice(),
            active_row_id: state.active_row_id
        };
    }

    function saveTableSettingsToLocalStorage(settings) {
        if (!window.localStorage) {
            return;
        }

        try {
            window.localStorage.setItem(tableSettingsLocalStorageKey, JSON.stringify(settings || {}));
        } catch (e) {
            // Ignore localStorage write errors.
        }
    }

    function loadTableSettingsFromLocalStorage() {
        if (!window.localStorage) {
            return null;
        }

        try {
            var raw = window.localStorage.getItem(tableSettingsLocalStorageKey);
            if (!raw) {
                return null;
            }

            var parsed = JSON.parse(raw);
            return (parsed && typeof parsed === 'object') ? parsed : null;
        } catch (e) {
            return null;
        }
    }

    function saveTableSettings(immediate) {
        if (!tableSettingsLoaded) {
            return;
        }

        var settingsPayload = buildTableSettingsPayload();
        saveTableSettingsToLocalStorage(settingsPayload);

        var saveFn = function () {
            $.ajax({
                url: routes.settings_set,
                type: 'POST',
                dataType: 'json',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content'),
                    'X-Requested-With': 'XMLHttpRequest',
                    'Accept': 'application/json'
                },
                data: {
                    table_key: tableSettingsKey,
                    settings: JSON.stringify(settingsPayload),
                    _token: '{{ csrf_token() }}'
                }
            }).done(function (res) {
                if (!res || res.ok !== true) {
                    // eslint-disable-next-line no-console
                    console.warn('user_settings_app_set: unexpected response', res);
                }
            }).fail(function (xhr) {
                // eslint-disable-next-line no-console
                console.warn('user_settings_app_set: request failed', xhr && xhr.status, xhr && xhr.responseText);
            });
        };

        clearTimeout(tableSettingsSaveTimer);
        if (immediate === true) {
            saveFn();
            return;
        }

        tableSettingsSaveTimer = setTimeout(saveFn, 250);
    }

    function applyTableSettings(rawSettings) {
        if (!rawSettings || typeof rawSettings !== 'object') {
            return;
        }

        if (Object.prototype.hasOwnProperty.call(rawSettings, 'search')) {
            state.search = String(rawSettings.search || '');
        }

        if (Object.prototype.hasOwnProperty.call(rawSettings, 'per_page')) {
            state.per_page = normalizePerPage(rawSettings.per_page);
        }

        if (Object.prototype.hasOwnProperty.call(rawSettings, 'page')) {
            var parsedPage = parseInt(rawSettings.page, 10);
            state.page = (!isNaN(parsedPage) && parsedPage > 0) ? parsedPage : 1;
        }

        if (Object.prototype.hasOwnProperty.call(rawSettings, 'rodzaj_zasobu_id')) {
            state.rodzaj_zasobu_id = String(rawSettings.rodzaj_zasobu_id || '');
        }

        if (Object.prototype.hasOwnProperty.call(rawSettings, 'sort')) {
            state.sort = String(rawSettings.sort || 'id');
        }

        if (Object.prototype.hasOwnProperty.call(rawSettings, 'direction')) {
            var dir = String(rawSettings.direction || 'desc').toLowerCase();
            state.direction = (dir === 'asc' || dir === 'desc') ? dir : 'desc';
        }

        if (rawSettings.search_columns && typeof rawSettings.search_columns === 'object') {
            state.search_columns = normalizeSearchColumns(rawSettings.search_columns);
        }

        if (rawSettings.visible_columns && typeof rawSettings.visible_columns === 'object') {
            state.visible_columns = normalizeColumns(rawSettings.visible_columns);
        }

        if (Array.isArray(rawSettings.column_order)) {
            state.column_order = normalizeColumnOrder(rawSettings.column_order);
        }

        if (Object.prototype.hasOwnProperty.call(rawSettings, 'active_row_id')) {
            state.active_row_id = String(rawSettings.active_row_id || '');
            state.active_row_scroll_pending = !!state.active_row_id && state.active_row_id !== '0';
        }
    }

    function applyStateToControls() {
        state.per_page = normalizePerPage(state.per_page);
        $('#sw030-per-page').val(String(state.per_page));
        $('#sw030-search').val(state.search || '');
        $('#sw030-filter-rodzaj').val(state.rodzaj_zasobu_id || '');

        syncColumnToggles();
        syncColumnOrderUi();
        applyColumnLayout();
        syncSearchColumnToggles();
    }

    function loadTableSettingsFromServer() {
        return $.ajax({
            url: routes.settings_get,
            type: 'GET',
            dataType: 'json',
            data: {
                table_key: tableSettingsKey
            }
        }).done(function (res) {
            if (!res || !res.ok) {
                var localSettings = loadTableSettingsFromLocalStorage();
                if (localSettings) {
                    applyTableSettings(localSettings);
                }
                return;
            }

            var serverSettings = res.settings || {};
            if (serverSettings && typeof serverSettings === 'object' && Object.keys(serverSettings).length > 0) {
                applyTableSettings(serverSettings);
                saveTableSettingsToLocalStorage(serverSettings);
                return;
            }

            var localSettings = loadTableSettingsFromLocalStorage();
            if (localSettings) {
                applyTableSettings(localSettings);
            }
        }).fail(function () {
            var localSettings = loadTableSettingsFromLocalStorage();
            if (localSettings) {
                applyTableSettings(localSettings);
            }
        });
    }

    function normalizeSearchColumns(rawColumns) {
        var defaults = {
            id: true,
            nazwa: true,
            skrot: true,
            opis: true
        };

        if (!rawColumns || typeof rawColumns !== 'object') {
            return $.extend({}, defaults);
        }

        var normalized = {};
        Object.keys(defaults).forEach(function (key) {
            normalized[key] = !!rawColumns[key];
        });

        return normalized;
    }

    function saveSearchColumnPreference() {
        if (!window.localStorage) {
            return;
        }

        window.localStorage.setItem(searchColumnStorageKey, JSON.stringify(state.search_columns));
    }

    function syncSearchColumnToggles() {
        var changed = false;

        $('.sw030-search-columns-toggle').each(function () {
            var key = String($(this).data('column-key') || '');
            if (!key || !Object.prototype.hasOwnProperty.call(searchColumnDbMap, key)) {
                return;
            }

            var visible = !!state.visible_columns[key];
            $(this).prop('disabled', !visible);

            if (!visible && state.search_columns[key]) {
                state.search_columns[key] = false;
                changed = true;
            }

            $(this).prop('checked', visible && !!state.search_columns[key]);
        });

        if (changed) {
            saveSearchColumnPreference();
        }
        $(document).trigger('sw030-search-columns:refresh');
    }

    function loadSearchColumnPreference() {
        var stored = null;

        if (window.localStorage) {
            try {
                stored = JSON.parse(window.localStorage.getItem(searchColumnStorageKey) || '{}');
            } catch (_err) {
                stored = null;
            }
        }

        state.search_columns = normalizeSearchColumns(stored);
        syncSearchColumnToggles();
    }

    function getActiveSearchColumns() {
        return Object.keys(searchColumnDbMap).filter(function (key) {
            return !!state.visible_columns[key] && !!state.search_columns[key];
        }).map(function (key) {
            return searchColumnDbMap[key];
        });
    }

    function visibleColumnsCount(columnsMap) {
        var count = 0;
        Object.keys(columnsMap || {}).forEach(function (key) {
            if (columnsMap[key]) {
                count++;
            }
        });
        return count;
    }

    function normalizeColumns(rawColumns) {
        var defaults = {
            id: true,
            rodzaj: true,
            nazwa: true,
            skrot: true,
            opis: true,
            modyfikacja: true
        };

        if (!rawColumns || typeof rawColumns !== 'object') {
            return $.extend({}, defaults);
        }

        var normalized = {};
        Object.keys(defaults).forEach(function (key) {
            normalized[key] = !!rawColumns[key];
        });

        if (visibleColumnsCount(normalized) < 1) {
            return $.extend({}, defaults);
        }

        return normalized;
    }

    function normalizeColumnOrder(rawOrder) {
        var defaults = ['id', 'rodzaj', 'nazwa', 'skrot', 'opis', 'modyfikacja'];
        if (!Array.isArray(rawOrder)) {
            return defaults.slice();
        }

        var result = [];
        rawOrder.forEach(function (key) {
            key = String(key || '');
            if (defaults.indexOf(key) !== -1 && result.indexOf(key) === -1) {
                result.push(key);
            }
        });

        defaults.forEach(function (key) {
            if (result.indexOf(key) === -1) {
                result.push(key);
            }
        });

        return result;
    }

    function syncColumnToggles() {
        $('.sw030-columns-toggle').each(function () {
            var key = String($(this).data('column-key') || '');
            if (!key) {
                return;
            }
            $(this).prop('checked', !!state.visible_columns[key]);
        });
        $(document).trigger('sw030-columns:refresh');
    }

    function syncColumnOrderUi() {
        var $list = $('.sw030-columns-list');
        if (!$list.length) {
            return;
        }

        state.column_order.forEach(function (key) {
            var $item = $list.find('.sw030-columns-item[data-column-key="' + key + '"]');
            if ($item.length) {
                $list.append($item);
            }
        });
    }

    function applyColumnLayout() {
        $('#sw030-table tr').each(function () {
            var $row = $(this);
            if ($row.find('[data-col-key]').length < 1) {
                return;
            }

            var $first = $row.children('th,td').first();
            var $last = $row.children('th,td').last();
            var $separator = $row.children('th.separate-column,td.separate-column').first();
            var colMap = {};

            $row.find('[data-col-key]').each(function () {
                var key = String($(this).data('col-key') || '');
                if (key) {
                    colMap[key] = $(this);
                }
            });

            $row.append($first);
            state.column_order.forEach(function (key) {
                if (colMap[key]) {
                    $row.append(colMap[key]);
                }
            });
            if ($separator.length && !$separator.is($first) && !$separator.is($last)) {
                $row.append($separator);
            }
            $row.append($last);
        });

        Object.keys(state.visible_columns).forEach(function (key) {
            var isVisible = !!state.visible_columns[key];
            $('#sw030-table [data-col-key="' + key + '"]').toggle(isVisible);
        });
    }

    function loadColumnPreference() {
        var storedVisibility = null;
        var storedOrder = null;

        if (window.localStorage) {
            try {
                storedVisibility = JSON.parse(window.localStorage.getItem(columnStorageKey) || '{}');
            } catch (e) {
                storedVisibility = null;
            }

            try {
                storedOrder = JSON.parse(window.localStorage.getItem(columnOrderStorageKey) || '[]');
            } catch (e2) {
                storedOrder = null;
            }
        }

        state.visible_columns = normalizeColumns(storedVisibility);
        state.column_order = normalizeColumnOrder(storedOrder);
        syncColumnToggles();
        syncColumnOrderUi();
        applyColumnLayout();
        syncSearchColumnToggles();
    }

    function saveColumnPreference() {
        if (!window.localStorage) {
            return;
        }

        window.localStorage.setItem(columnStorageKey, JSON.stringify(state.visible_columns));
        window.localStorage.setItem(columnOrderStorageKey, JSON.stringify(state.column_order));
    }

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

    function clearFormErrors(formSelector) {
        var $form = $(formSelector);
        $form.find('.form-control').removeClass('error is-invalid');
        $form.find('.sw030-error').hide().text('');
    }

    function showFieldError($form, field, message) {
        var $field = $form.find('[name="' + field + '"]');
        if ($field.length) {
            $field.addClass('error is-invalid');
        }
        var $error = $form.find('.sw030-error[data-field="' + field + '"]');
        if ($error.length) {
            $error.text(message || 'Niepoprawna wartość.').show();
        }
    }

    function setSortIndicators() {
        $('#sw030-table thead .th-sort .sw030-sort').text('');
        var mark = state.direction === 'asc' ? '↑' : '↓';
        $('#sw030-table thead .th-sort[data-sort="' + state.sort + '"] .sw030-sort').text(mark);
    }

    function my_SetActiveRecord(idRow, scrollToTop, persistInSession) {
        var rowId = String(idRow || '');
        if (!rowId) {
            return;
        }

        state.active_row_id = rowId;
        $('#sw030-table-body tr.active_row').removeClass('active_row');

        var $row = $('#tr_id_' + rowId);
        if (!$row.length) {
            return;
        }

        $row.addClass('active_row');

        if (scrollToTop !== false) {
            var thead = document.querySelector('#sw030-table > thead');
            var theadHeight = thead ? thead.offsetHeight : 0;
            $row.get(0).style.scrollMargin = theadHeight + 'px';
            $row.get(0).scrollIntoView({ behavior: 'smooth', block: 'start' });
        }

        if (persistInSession === true) {
            $.ajax({
                url: "{{ url('/set_session') }}",
                type: "GET",
                data: {
                    active_record: rowId
                }
            });
            saveTableSettings(true);
        }
    }

    function renderRows(items, fromIndex) {
        var html = '';
        state.records = {};

        if (!items || !items.length) {
            $('#sw030-table-body').html('<tr class="tr_no_records"><td colspan="9" class="text-center"><div class="no_records">Brak rekordów spełniających wybrany warunek.</div></td></tr>');
            applyColumnLayout();
            return;
        }

        var lp = fromIndex || 1;
        items.forEach(function (item) {
            state.records[item.id] = item;

            var opis = item.zasob_opis || '';
            var opisShort = opis.length > 120 ? (opis.substring(0, 120) + '...') : opis;
            var rowClass = (String(state.active_row_id || '') === String(item.id)) ? ' class="active_row"' : '';

            html += '' +
                '<tr id="tr_id_' + item.id + '"' + rowClass + '>' +
                    '<td class="text-center">' + lp + '</td>' +
                    '<td class="text-center" data-col-key="id">' + escapeHtml(item.id) + '</td>' +
                    '<td data-col-key="rodzaj">' + escapeHtml(item.rodzaj_zasobu_label || '') + '</td>' +
                    '<td data-col-key="nazwa">' + escapeHtml(item.zasob_nazwa || '') + '</td>' +
                    '<td data-col-key="skrot">' + escapeHtml(item.zasob_nazwa_skrot || '') + '</td>' +
                    '<td data-col-key="opis" title="' + escapeHtml(opis) + '">' + escapeHtml(opisShort) + '</td>' +
                    '<td class="text-center text-nowrap" data-col-key="modyfikacja">' + escapeHtml(item.updated_at || '') + '</td>' +
                    '<td class="table_action text-center">' +
                        '<div class="ajax-crud-actions">' +
                        '<button type="button" class="btn new-btn-info sw030-btn-info btn_table new-btn-border-1" data-id="' + item.id + '" data-toggle="tooltip" title="Info"><i class="fas fa-info-circle"></i></button> ' +
                        '<button type="button" class="btn new-btn-primary sw030-btn-edit btn_table new-btn-border-1" data-id="' + item.id + '" data-toggle="tooltip" title="Edytuj"><i class="fa fa-edit"></i></button> ' +
                        '<button type="button" class="btn new-btn-danger sw030-btn-delete btn_table new-btn-border-1" data-id="' + item.id + '" data-toggle="tooltip" title="Usuń"><i class="far fa-trash-alt"></i></button>' +
                        '</div>' +
                    '</td>' +
                '</tr>';

            lp++;
        });

        $('#sw030-table-body').html(html);
        applyColumnLayout();
        if (state.active_row_id) {
            my_SetActiveRecord(state.active_row_id, state.active_row_scroll_pending === true, false);
            state.active_row_scroll_pending = false;
        }
        $('[data-toggle="tooltip"]').tooltip();
    }

    function renderPagination(pagination) {
        state.pagination = pagination;

        var total = pagination && pagination.total ? pagination.total : 0;
        var totalAll = pagination && pagination.total_all ? pagination.total_all : total;
        var from = pagination && pagination.from ? pagination.from : 0;
        var to = pagination && pagination.to ? pagination.to : 0;
        var current = pagination && pagination.current_page ? pagination.current_page : 1;
        var last = pagination && pagination.last_page ? pagination.last_page : 1;
        state.page = current;

        var filteredTotal = total;
        $('#sw030-count').text(filteredTotal + ' / ' + totalAll);
        $('#sw030-page-info').text('Wiersze: ' + from + '-' + to + ' | Strona: ' + current + '/' + last);

        $('#sw030-page-prev').prop('disabled', current <= 1);
        $('#sw030-page-next').prop('disabled', current >= last);
        renderPaginationButtons(current, last);
    }

    function buildPaginationModel(current, last) {
        if (last <= 7) {
            var all = [];
            for (var p = 1; p <= last; p++) {
                all.push(p);
            }
            return all;
        }

        if (current <= 3) {
            return [1, 2, 3, 'ellipsis', last];
        }

        if (current >= last - 2) {
            return [1, 'ellipsis', last - 2, last - 1, last];
        }

        return [1, 'ellipsis', current - 1, current, current + 1, 'ellipsis', last];
    }

    function renderPaginationButtons(current, last) {
        var $list = $('#sw030-page-list');
        if (!$list.length) {
            return;
        }

        var model = buildPaginationModel(current, last);
        var html = '';

        model.forEach(function (item, idx) {
            if (item === 'ellipsis') {
                html += '<span class="ajax-pagination-ellipsis" data-idx="' + idx + '">...</span>';
                return;
            }

            var isActive = Number(item) === Number(current);
            var activeClass = isActive ? ' is-active' : '';
            var ariaCurrent = isActive ? ' aria-current="page"' : '';

            html += '' +
                '<button type="button" class="btn btn-sm btn-outline-secondary ajax-pagination-page sw030-page-btn' + activeClass + '" data-page="' + item + '"' + ariaCurrent + '>' + item + '</button>';
        });

        $list.html(html);
    }

    function loadRows() {
        setSortIndicators();
        $('#sw030-table-body').html('<tr class="tr_no_records"><td colspan="9" class="text-center"><div class="no_records">Ładowanie...</div></td></tr>');
        var activeSearchColumns = getActiveSearchColumns();

        if (state.search && activeSearchColumns.length < 1) {
            notify('warning', 'Wybierz co najmniej jedną widoczną kolumnę do wyszukiwania.');
            $('#sw030-table-body').html('<tr class="tr_no_records"><td colspan="9" class="text-center"><div class="no_records">Brak aktywnych kolumn do wyszukiwania.</div></td></tr>');
            return;
        }

        $.ajax({
            url: routes.list,
            type: 'GET',
            dataType: 'json',
            data: {
                page: state.page,
                per_page: state.per_page,
                search: state.search,
                search_columns: activeSearchColumns.join(','),
                rodzaj_zasobu_id: state.rodzaj_zasobu_id,
                sort: state.sort,
                direction: state.direction
            }
        }).done(function (res) {
            if (!res || !res.ok) {
                notify('error', 'Nie udało się pobrać listy.');
                return;
            }

            renderRows(res.items || [], res.pagination ? res.pagination.from : 1);
            renderPagination(res.pagination || null);
            saveTableSettings(true);
        }).fail(function () {
            notify('error', 'Błąd podczas pobierania danych.');
            $('#sw030-table-body').html('<tr class="tr_no_records"><td colspan="9" class="text-center"><div class="no_records">Wystąpił błąd.</div></td></tr>');
        });
    }

    function getVisibleExportColumnsOrdered() {
        var ordered = [];

        state.column_order.forEach(function (key) {
            if (state.visible_columns[key]) {
                ordered.push(key);
            }
        });

        Object.keys(state.visible_columns).forEach(function (key) {
            if (state.visible_columns[key] && ordered.indexOf(key) === -1) {
                ordered.push(key);
            }
        });

        return ordered;
    }

    function buildExportUrl(format) {
        var exportFormat = String(format || '').toLowerCase();
        if (!exportFormat) {
            return '';
        }

        var baseUrl = routes.export.replace('__FORMAT__', encodeURIComponent(exportFormat));
        var params = {
            search: state.search || '',
            search_columns: getActiveSearchColumns().join(','),
            rodzaj_zasobu_id: state.rodzaj_zasobu_id || '',
            sort: state.sort || 'id',
            direction: state.direction || 'desc',
            visible_columns: getVisibleExportColumnsOrdered().join(',')
        };

        return baseUrl + '?' + $.param(params);
    }

    function openAddModal() {
        clearFormErrors('#sw030-form-add');

        var $modal = $('#ModalForm_sw030_add');
        $modal.find('#sw030_add_id').val('');
        $modal.find('#sw030-add-rodzaj').val('');
        $modal.find('#sw030-add-nazwa').val('');
        $modal.find('#sw030-add-skrot').val('');
        $modal.find('#sw030-add-opis').val('');
        $modal.modal('show');
    }

    function openEditModal(id) {
        var row = state.records[id];
        if (!row) {
            notify('warning', 'Nie znaleziono danych rekordu.');
            return;
        }

        clearFormErrors('#sw030-form-edit');

        var $modal = $('#ModalForm_sw030_edit');
        $modal.find('#sw030_edit_id').val(row.id);
        $modal.find('#edit_rekord_id').val(row.id);
        $modal.find('[data-role="edit-record-id-display"]').text(row.id);

        $modal.find('#sw030-edit-rodzaj').val(row.rodzaj_zasobu_id);
        $modal.find('#sw030-edit-nazwa').val(row.zasob_nazwa || '');
        $modal.find('#sw030-edit-skrot').val(row.zasob_nazwa_skrot || '');
        $modal.find('#sw030-edit-opis').val(row.zasob_opis || '');

        $modal.modal('show');
    }

    function openInfoModal(id) {
        var row = state.records[id];
        if (!row) {
            notify('warning', 'Nie znaleziono danych rekordu.');
            return;
        }

        var $modal = $('#ModalForm_sw030_info');
        $modal.find('#sw030_info_id').val(row.id || '');
        $modal.find('#sw030_info_rodzaj').val(row.rodzaj_zasobu_label || '');
        $modal.find('#sw030_info_nazwa').val(row.zasob_nazwa || '');
        $modal.find('#sw030_info_skrot').val(row.zasob_nazwa_skrot || '');
        $modal.find('#sw030_info_opis').val(row.zasob_opis || '');
        $modal.find('#sw030_info_modyfikacja').val(row.updated_at || '');
        $modal.modal('show');
    }

    function openDeleteModal(id) {
        var row = state.records[id];
        if (!row) {
            notify('warning', 'Nie znaleziono danych rekordu.');
            return;
        }

        var $modal = $('#ModalForm_sw030_delete');
        $modal.find('input[name="rekord_id"]').val(row.id);
        $modal.find('input[name="rekord_id_view"]').val(row.id);
        $modal.find('input[name="rekord_id_view"]').css('width', (String(row.id).length + 0.4) + 'rem');
        $modal.find('form#form_delete').attr('action', routes.del.replace('__ID__', row.id));
        $modal.modal('show');
    }

    function handleSaveFailure($form, xhr) {
        if (xhr.status === 422 && xhr.responseJSON) {
            var response = xhr.responseJSON;

            if (response.errors) {
                Object.keys(response.errors).forEach(function (field) {
                    var msg = response.errors[field] && response.errors[field][0] ? response.errors[field][0] : 'Niepoprawna wartość.';
                    showFieldError($form, field, msg);
                });
            }

            if (response.message && !response.errors) {
                notify('warning', response.message);
            }
            return;
        }

        notify('error', 'Błąd zapisu danych.');
    }

    function submitAddForm() {
        var $form = $('#sw030-form-add');
        clearFormErrors('#sw030-form-add');

        $.ajax({
            url: routes.store,
            type: 'POST',
            dataType: 'json',
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content'),
                'X-Requested-With': 'XMLHttpRequest',
                'Accept': 'application/json'
            },
            data: {
                rodzaj_zasobu_id: $form.find('#sw030-add-rodzaj').val(),
                zasob_nazwa: $form.find('#sw030-add-nazwa').val(),
                zasob_nazwa_skrot: $form.find('#sw030-add-skrot').val(),
                zasob_opis: $form.find('#sw030-add-opis').val()
            }
        }).done(function (res) {
            if (!res || !res.ok) {
                notify('error', (res && res.message) ? res.message : 'Nie udało się zapisać.');
                return;
            }

            $('#ModalForm_sw030_add').modal('hide');
            notify('success', res.message || 'Zapisano dane.');
            state.page = 1;
            loadRows();
        }).fail(function (xhr) {
            handleSaveFailure($form, xhr);
        });
    }

    function submitEditForm() {
        var $form = $('#sw030-form-edit');
        clearFormErrors('#sw030-form-edit');

        var id = $form.find('#sw030_edit_id').val();
        if (!id) {
            notify('warning', 'Brak identyfikatora rekordu.');
            return;
        }

        $.ajax({
            url: routes.update.replace('__ID__', id),
            type: 'POST',
            dataType: 'json',
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content'),
                'X-Requested-With': 'XMLHttpRequest',
                'Accept': 'application/json'
            },
            data: {
                rodzaj_zasobu_id: $form.find('#sw030-edit-rodzaj').val(),
                zasob_nazwa: $form.find('#sw030-edit-nazwa').val(),
                zasob_nazwa_skrot: $form.find('#sw030-edit-skrot').val(),
                zasob_opis: $form.find('#sw030-edit-opis').val()
            }
        }).done(function (res) {
            if (!res || !res.ok) {
                notify('error', (res && res.message) ? res.message : 'Nie udało się zapisać.');
                return;
            }

            $('#ModalForm_sw030_edit').modal('hide');
            notify('success', res.message || 'Zapisano dane.');
            loadRows();
        }).fail(function (xhr) {
            handleSaveFailure($form, xhr);
        });
    }

    function submitDelete() {
        var $modal = $('#ModalForm_sw030_delete');
        var id = $modal.find('input[name="rekord_id"]').val();
        if (!id) {
            notify('warning', 'Brak identyfikatora rekordu.');
            return;
        }

        $.ajax({
            url: routes.del.replace('__ID__', id),
            type: 'POST',
            dataType: 'json',
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content'),
                'X-Requested-With': 'XMLHttpRequest',
                'Accept': 'application/json'
            }
        }).done(function (res) {
            if (!res || !res.ok) {
                notify('error', (res && res.message) ? res.message : 'Nie udało się usunąć rekordu.');
                return;
            }

            $modal.modal('hide');
            notify('success', res.message || 'Usunięto rekord.');

            if (state.pagination && state.pagination.current_page > 1 && state.pagination.total === (state.pagination.from || 1)) {
                state.page = state.pagination.current_page - 1;
            }

            loadRows();
        }).fail(function (xhr) {
            var msg = 'Błąd podczas usuwania rekordu.';
            if (xhr.responseJSON && xhr.responseJSON.message) {
                msg = xhr.responseJSON.message;
            }
            notify('error', msg);
        });
    }

    function clearSingleFieldError($field) {
        if (!$field || !$field.length) {
            return;
        }

        var name = String($field.attr('name') || '');
        $field.removeClass('error is-invalid');

        if (!name) {
            return;
        }

        var $form = $field.closest('form');
        var $error = $form.find('.sw030-error[data-field="' + name + '"]');
        if ($error.length) {
            $error.hide().text('');
        }
    }

    var searchTimer = null;

    $(document).on('click', '#sw030-btn-add, .sw030-btn-add-trigger', function () {
        openAddModal();
    });

    $(document).on('click', '#sw030-export-toolbar .js-ajax-export-btn', function () {
        var format = String($(this).data('format') || '').toLowerCase();
        var url = buildExportUrl(format);

        if (!url) {
            notify('warning', 'Nie udało się przygotować eksportu.');
            return;
        }

        window.location.href = url;
    });

    $(document).on('click', '#sw030-search-btn', function () {
        state.search = $('#sw030-search').val() || '';
        state.page = 1;
        loadRows();
    });

    $(document).on('click', '#sw030-search-clear', function () {
        $('#sw030-search').val('');
        state.search = '';
        state.page = 1;
        loadRows();
    });

    $(document).on('input', '#sw030-search', function () {
        clearTimeout(searchTimer);
        searchTimer = setTimeout(function () {
            state.search = $('#sw030-search').val() || '';
            state.page = 1;
            loadRows();
        }, 300);
    });

    $(document).on('ajax-filters:changed', function (_event, payload) {
        if (!payload || payload.id !== 'sw030-filters') {
            return;
        }

        var values = payload.values || {};
        var nextRodzaj = values.rodzaj_zasobu_id || '';

        if (String(state.rodzaj_zasobu_id || '') === String(nextRodzaj)) {
            return;
        }

        state.rodzaj_zasobu_id = nextRodzaj;
        state.page = 1;
        loadRows();
    });

    $(document).on('change', '#sw030-per-page', function () {
        state.per_page = normalizePerPage($(this).val());
        savePerPagePreference(state.per_page);
        state.page = 1;
        loadRows();
    });

    $(document).on('change', '.sw030-columns-toggle', function () {
        var key = String($(this).data('column-key') || '');
        if (!key) {
            return;
        }

        var draft = $.extend({}, state.visible_columns);
        draft[key] = $(this).is(':checked');

        if (visibleColumnsCount(draft) < 1) {
            $(this).prop('checked', true);
            notify('warning', 'Co najmniej jedna kolumna musi pozostac widoczna.');
            return;
        }

        state.visible_columns = draft;
        saveColumnPreference();
        applyColumnLayout();
        syncSearchColumnToggles();
        saveSearchColumnPreference();

        if (state.search) {
            state.page = 1;
            loadRows();
        }
    });

    $(document).on('sw030-columns:orderChanged', function (_event, order) {
        state.column_order = normalizeColumnOrder(order);
        saveColumnPreference();
        syncColumnOrderUi();
        applyColumnLayout();
    });

    $(document).on('click', '.sw030-columns-reset', function () {
        state.visible_columns = normalizeColumns({});
        state.column_order = normalizeColumnOrder([]);
        syncColumnToggles();
        syncColumnOrderUi();
        saveColumnPreference();
        applyColumnLayout();
        syncSearchColumnToggles();
        saveSearchColumnPreference();

        if (state.search) {
            state.page = 1;
            loadRows();
        }
    });

    $(document).on('change', '.sw030-search-columns-toggle', function () {
        var key = String($(this).data('column-key') || '');
        if (!key || !Object.prototype.hasOwnProperty.call(searchColumnDbMap, key)) {
            return;
        }

        if (!state.visible_columns[key]) {
            $(this).prop('checked', false);
            return;
        }

        var draft = $.extend({}, state.search_columns);
        draft[key] = $(this).is(':checked');

        var hasAnyActive = Object.keys(searchColumnDbMap).some(function (checkKey) {
            return !!state.visible_columns[checkKey] && !!draft[checkKey];
        });

        if (!hasAnyActive) {
            $(this).prop('checked', true);
            notify('warning', 'Wybierz co najmniej jedną widoczną kolumnę do wyszukiwania.');
            return;
        }

        state.search_columns = draft;
        saveSearchColumnPreference();
        syncSearchColumnToggles();

        if (state.search) {
            state.page = 1;
            loadRows();
        }
    });

    $(document).on('click', '.sw030-search-columns-reset', function () {
        state.search_columns = normalizeSearchColumns({});
        syncSearchColumnToggles();
        saveSearchColumnPreference();

        if (state.search) {
            state.page = 1;
            loadRows();
        }
    });

    $(document).on('click', '#sw030-page-prev', function () {
        if (state.page > 1) {
            state.page--;
            saveTableSettings(true);
            loadRows();
        }
    });

    $(document).on('click', '#sw030-page-next', function () {
        if (state.pagination && state.page < state.pagination.last_page) {
            state.page++;
            saveTableSettings(true);
            loadRows();
        }
    });

    $(document).on('click', '.sw030-page-btn', function () {
        var page = parseInt($(this).data('page'), 10);
        if (!page || page === state.page) {
            return;
        }

        state.page = page;
        saveTableSettings(true);
        loadRows();
    });

    $(document).on('click', '#sw030-table .th-sort', function () {
        var sort = $(this).data('sort');
        if (!sort) return;

        if (state.sort === sort) {
            state.direction = state.direction === 'asc' ? 'desc' : 'asc';
        } else {
            state.sort = sort;
            state.direction = 'asc';
        }

        state.page = 1;
        loadRows();
    });

    $(document).on('click', '.sw030-btn-edit', function () {
        var id = $(this).data('id');
        my_SetActiveRecord(id, true, true);
        openEditModal(id);
    });

    $(document).on('click', '.sw030-btn-info', function () {
        var id = $(this).data('id');
        my_SetActiveRecord(id, true, true);
        openInfoModal(id);
    });

    $(document).on('click', '.sw030-btn-delete', function () {
        openDeleteModal($(this).data('id'));
    });

    $(document).on('submit', '#sw030-form-add', function (e) {
        e.preventDefault();
        submitAddForm();
    });

    $(document).on('submit', '#sw030-form-edit', function (e) {
        e.preventDefault();
        submitEditForm();
    });

    $(document).on('submit', '#ModalForm_sw030_delete form#form_delete', function (e) {
        e.preventDefault();
        submitDelete();
    });

    $(document).on('input change', '#sw030-form-add .form-control, #sw030-form-edit .form-control', function () {
        clearSingleFieldError($(this));
    });

    loadPerPagePreference();
    loadColumnPreference();
    loadSearchColumnPreference();
    state.rodzaj_zasobu_id = $('#sw030-filter-rodzaj').val() || '';
    state.active_row_id = $('#active_row').val() || '';
    state.active_row_scroll_pending = !!state.active_row_id && state.active_row_id !== '0';

    loadTableSettingsFromServer()
        .always(function () {
            applyStateToControls();
            tableSettingsLoaded = true;
            loadRows();
        });
})(jQuery);
</script>
@endsection

@section('navbar')
    @include('sites.admin._navbar_m_admin_site')
    <i class="fas fa-chevron-right separator"></i>
    <span class="navbar_navigate" title="Słowniki AJAX">Słowniki AJAX</span>
    <i class="fas fa-chevron-right separator"></i>
    <span class="navbar_navigate" title="T-sw030 Zasoby">T-sw030 Zasoby</span>
@endsection

@section('menu')
    @include('sites.admin.menu_admin')
@endsection

@section('modal_windows')
    @include('sites.admin.slowniki.sw030_zasoby.form_modal_add')
    @include('sites.admin.slowniki.sw030_zasoby.form_modal_edit')
    @include('sites.admin.slowniki.sw030_zasoby.form_modal_info')
    @include('sites.admin.slowniki.sw030_zasoby.form_modal_delete')
@endsection