@extends('Sidebar.icssacvSidebar')

@section('title', 'Centros de acopio detalle')

{{-- @section('cabecera')
 <h4> <i class="fas fa-industry"></i> Centros de acopio detalle</h4>
@endsection --}}

@section('contenido')

<div class="container-fluid">
        <div class="row">   
            <div class="col-12 col-sm-12 col-md-12 col-lg-6" align="left">
                <h3 align="left">Unidad Operativa {{$nombre}}</h3>
            </div>
        </div>
    </div>

    <div class="table-responsive" style= "margin: 0 auto";>
        <center><table class="table table-striped" id="detail-table">
            <thead>
                <tr>
                    <th width="15%" style="text-align: center;" bgcolor="C3C3C3" scope="col">Unidad operativa</th>
                    <th width="15%" style="text-align: center;" bgcolor="C3C3C3" scope="col">Dirección</th>
                    <th width="15%" style="text-align: center;" bgcolor="C3C3C3" scope="col">Estado</th>
                    <th width="15%" style="text-align: center;" bgcolor="C3C3C3" scope="col">Disponibilidad</th>
                    <th width="15%" style="text-align: center;" bgcolor="C3C3C3" scope="col">Visita Estatus</th>
                </tr>
            </thead>
            <tbody>
                @foreach($Detalles as $detalle)
                    <tr>
                        <td width="15%" style="text-align: center;">{!! $detalle->nombre !!}</td>
                        <td width="15%" style="text-align: center;">{!! $detalle->direccion !!}</td>
                        <td width="15%" style="text-align: center;">{!! $detalle->estado !!}</td>
                        <td width="15%" style="text-align: center;">{!! $detalle->disponibilidad !!}</td>
                        <td width="15%" style="text-align: center;">Disponible</td>
                    </tr>
                @endforeach
            </tbody>
        </table></center>
    </div>

    @isset($nombres)
      <div class="container-fluid">
        <center><div id="carouselExampleControls" style="max-width: 70%;" class="carousel slide" data-ride="carousel">
            <div class="carousel-inner">
              @php
                $count = 0;    
              @endphp
              @foreach ($nombres as $nombre_imagen)
                @php
                    $count = $count + 1;
                @endphp
                <div class="carousel-item {{$count == 1 ? 'active' : ''}}">
                  <img class="d-block w-100" src = "{{asset($nombre_imagen)}}" alt="imagen">
                </div>
              @endforeach
            </div>
            <a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
              <span class="carousel-control-prev-icon" aria-hidden="true"></span>
              <span class="sr-only">Previous</span>
            </a>
            <a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
              <span class="carousel-control-next-icon" aria-hidden="true"></span>
              <span class="sr-only">Next</span>
            </a>
          </div>
        </center>  
      </div>  
    @endisset
    
@endsection

@section('titulo')
    <nav aria-label="breadcrumb">
    <ol class="breadcrumb"  style="font-size: 60%">
        <li class="breadcrumb-item"><a href="{{ route('CentroAcopio.index')}}" style="color: black"><i class="fas fa-industry"></i>  Unidad Operativa</a></li>
        <li class="breadcrumb-item"><a href="{{ route('Administra_Centro_Acopio.consulta')}}" style="color: black">Centros de acopio</a></li>
        <li class="breadcrumb-item active">Centros de acopio detalle</li>
    </ol>
    </nav>
@endsection

@section('scripts')
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
@if (Session::has('edit'))
<script>
    Swal.fire({
        title: 'Correcto',
        text: 'Centro de Acopio Actualizado',
        icon: 'success',
        confirmButtonColor: ' #008000',
    })
</script>
@endif

@endsection