@extends('layouts.dashboard')

@section('dashboard')

    <ul class="breadcrumb m-0 p-0">
        <li><a href="/dashboard">Home</a></li>
        <li><strong>Informe Atributos Homologadas</strong></li>
    </ul>
    <h1 class="titulo-h1 mb-4">Informe Atributos Homologadas</h1>
    <div class="card">
        <div class="card-body">
            <div class="">
                <table class="table table-hover">
                    <thead>
                        <tr>
                            <th>Atributos MercadoLibre</th>
                            <th>Atributos CR</th>
                        </tr>
                    </thead>
                </table>
            </div>
        </div>
    </div>

@endsection

@section('scripts')

    @include('dashboard.inc.script-datatables')
    <script>
        $(document).ready(function() {
            $('table').DataTable({
                stateSave: false,
                processing: true,
                serverSide: true,
                ajax: '{{ route('ajax-datatables', ['url' => 'list-atributos-homologados']) }}',
                columns: [
                    {data: 'atributo-ml'},
                    {data: 'atributo-db'}
                ],
                language: {
                    //"lengthMenu": "Mostrar _MENU_ registros por página",
                    "lengthMenu": "",
                    "zeroRecords": "No hay atributos ingresadas",
                    "info": "Mostrando la página _PAGE_ de _PAGES_",
                    "infoEmpty": "No hay atributos disponibles",
                    "infoFiltered": "(Filtrado de _MAX_ registros totales)",
                    "search": "Buscar",
                    "processing": "Cargando atributos...",
                    "paginate": {
                        'previous': 'Anterior',
                        'next': 'Siguiente'
                    },
                },
                responsive: 'true',
                drawCallback: (settings) => {
                    // Aplicar select2 con las opciones deseadas
                    $('.select2').select2({
                        placeholder: '-- Seleccione --'
                    });
                }
            });
        });
    </script>

@endsection