@php $activePage = isset($activePage) ? $activePage : ''; @endphp

<div class="ui segment bancos-toolbar">
    <a class="ui button {{ $activePage === 'dashboard' ? 'primary' : '' }}" href="{{ route('bancos.real.dashboard') }}">
        <i class="chart line icon"></i>Dashboard
    </a>
    <a class="ui button {{ $activePage === 'cuentas' ? 'primary' : '' }}" href="{{ route('bancos.real.cuentas.index') }}">
        <i class="university icon"></i>Cuentas
    </a>
    <a class="ui button {{ $activePage === 'programados' ? 'primary' : '' }}" href="{{ route('bancos.real.programados.index') }}">
        <i class="calendar alternate icon"></i>Pagos programados
    </a>
    <a class="ui button {{ $activePage === 'autorizaciones' ? 'primary' : '' }}" href="{{ route('bancos.real.autorizaciones.index') }}">
        <i class="check circle icon"></i>Autorizaciones
    </a>
    <a class="ui button {{ $activePage === 'reportes' ? 'primary' : '' }}" href="{{ route('bancos.real.reportes.index') }}">
        <i class="file alternate icon"></i>Reportes
    </a>
    <a class="ui button {{ $activePage === 'bitacora' ? 'primary' : '' }}" href="{{ route('bancos.real.bitacora.index') }}">
        <i class="clipboard list icon"></i>Bitácora
    </a>
</div>

<script>
    (function () {
        function normalizarBusquedaBancos(valor) {
            var texto = String(valor || '').toLowerCase();
            if (texto.normalize) {
                texto = texto.normalize('NFD').replace(/[\u0300-\u036f]/g, '');
            }

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

        function registrarFiltroBusquedaBancos() {
            if (!window.jQuery || !$.fn.dataTable || window.bancosFiltroBusquedaRegistrado) {
                return;
            }

            window.bancosFiltroBusquedaRegistrado = true;
            $.fn.dataTable.ext.search.push(function (settings, data, dataIndex) {
                var $table = $(settings.nTable);
                if (!$table.closest('.bancos-real').length) {
                    return true;
                }

                var termino = $table.data('bancos-search-term') || '';
                if (!termino) {
                    return true;
                }

                var node = settings.aoData && settings.aoData[dataIndex] ? settings.aoData[dataIndex].nTr : null;
                var textoFila = normalizarBusquedaBancos((data || []).join(' ') + ' ' + (node ? $(node).text() : ''));
                return termino.split(' ').every(function (parte) {
                    return !parte || textoFila.indexOf(parte) !== -1;
                });
            });
        }

        function configurarBusquedaBancos() {
            registrarFiltroBusquedaBancos();
            if (!$.fn.DataTable) {
                return;
            }

            $('.bancos-real table.dataTable').each(function () {
                if (!$.fn.DataTable.isDataTable(this)) {
                    return;
                }

                var table = $(this).DataTable();
                var $table = $(this);
                var $input = $(table.table().container()).find('.dataTables_filter input');
                if ($input.data('bancos-search-ready')) {
                    return;
                }

                $input.data('bancos-search-ready', true);
                $input.off('.DT').on('input.bancosSearch keyup.bancosSearch', function () {
                    $table.data('bancos-search-term', normalizarBusquedaBancos(this.value));
                    table.search('').draw();
                });
            });
        }

        $(function () {
            registrarFiltroBusquedaBancos();
            window.setTimeout(configurarBusquedaBancos, 600);
        });
    })();
</script>

@include('Bancos.Real.partials._confirmaciones')

<div class="ui segment security-strip">
    <div class="row align-items-center">
        <div class="col-md-5">
            <strong>Rol Bancos:</strong> {{ $rolBancos }}
            <!-- <div class="mini-note">Solo id_tipo_usuario 3 y 24 pueden operar este módulo.</div> -->
        </div>
        <div class="col-md-4">
            <strong>Acceso sensible</strong>
            <div class="mini-note">Acceso y exportaciones protegidas con código por correo.</div>
        </div>
        <div class="col-md-3 inactive-timer">
            <div class="alert alert-warning mb-0 py-2">
                <strong>Inactividad:</strong> <span id="bancos-real-countdown">05:00</span>
                <div class="mini-note">El acceso a Bancos se cerrará por inactividad.</div>
            </div>
        </div>
    </div>
</div>