@include('header')
<link href="{{asset('css/slider.css')}}" rel="stylesheet">
@include('navigator_menu_principal')
@include('modals/modal_formulario_slider')

<div class="container">
    <div class="row">
        <div class="col-md-12">
            <h4 class="text-center titulo-fidelitas" style="padding:10px;">
                Sliders
            </h4>
        </div>
        <div class="col-md-12 text-right">
            <button name="btn_nuevo_slider" class="btn btn-success text-center btn_nuevo_slider"
                data-toggle="modal">Nuevo</button>
            <br /><br />
        </div>
        @if (!isset($sliders))
            <div class="col-md-12 text-center">- No se detectaron datos -</div>
        @else
            <div class="col-md-12">
                <table id="sliders_table" class="table table-bordered text-right table-hover">
                    <thead>
                        <tr>
                            <th>id</th>
                            <th>Ubicación</th>
                            <th>Descripción</th>
                            <th>Imagenes</th>
                            <th>Fecha Creación</th>
                            <th>Fecha Modificación</th>
                            <th>Status</th>
                            <th class="columna-acciones">Acciones</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($sliders as $slider)
                            <tr>
                                <td class="text-center">{{ $slider->id ?? '' }}</td>
                                <td class="text-center">{{ $slider->id_ubicacion == 1 ? 'HOME' : '-' }}</td>
                                <td class="text-center">{{ $slider->descripcion ?? '-' }}</td>
                                <td class="text-center">
                                    <div class="row">
                                        @php        $numero_visibles = 1 @endphp
                                        @foreach ($slider->imagenes as $key => $imagen)
                                                @if ($imagen->visible == 1)
                                                        <div class="col-md-3">
                                                            <img src="{{ ENV('RUTA_IMAGENES_FRONT_END') }}/{{ $imagen->src }}"
                                                                class="img-responsive" />
                                                            <br>
                                                            <div>{{$imagen->texto ?? ''}}</div>
                                                        </div>
                                                        @if (($numero_visibles) % 4 == 0)
                                                            </div>
                                                            <div class="row">
                                                        @endif
                                                        @php                $numero_visibles++ @endphp
                                                @endif
                                        @endforeach
                                        @if ($numero_visibles >= 4)
                                            </div>
                                        @endif
                                </td>
                                <td class="text-center">{{ $slider->created ?? '' }}</td>
                                <td class="text-center">{{ $slider->modified ?? '-' }}</td>
                                <td class="text-center">{{ $slider->visible == 1 ? 'Activo' : 'Inactivo' }}</td>
                                <td class="text-center" class="columna-acciones">
                                    <form name="form_acciones" id="form_acciones">
                                        <input type="hidden" name="_token" id="token_acciones" value="{{ csrf_token() }}">
                                        <button name="btn_editar_slider"
                                            class="btn btn-info btn-fidelitas text-center btn_editar_slider" data-toggle="modal"
                                            data-id="{{ $slider->id }}" data-ubicacion="{{ $slider->id_ubicacion }}"
                                            data-descripcion="{{ $slider->descripcion }}"
                                            data-visible="{{ $slider->visible }}">Editar</button>
                                        @if ($slider->visible == 1)
                                            <button name="btn_desactivar_slider"
                                                class="btn btn-warning text-center btn_desactivar_slider" data-toggle="modal"
                                                data-ubicacion="{{ $slider->id_ubicacion }}"
                                                data-id="{{ $slider->id }}">Desactivar</button>
                                        @else
                                            <button name="btn_activar_slider"
                                                class="btn btn-info btn-fidelitas text-center btn_activar_slider"
                                                data-toggle="modal" data-ubicacion="{{ $slider->id_ubicacion }}"
                                                data-id="{{ $slider->id }}">Activar</button>
                                        @endif
                                    </form>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        @endif
    </div>
</div>


<script type="text/javascript" src="{{ URL::asset('js/slider/slider_acciones.js') }}"> </script>

@include('footer')