@extends('../padre.padre')

@section('styles')
<link rel="stylesheet" href="https://cdn.datatables.net/1.13.7/css/dataTables.bootstrap4.min.css">
<style>
    /* Estilos para que el buscador y paginador se vean bien en modo oscuro si está activo */
    [data-theme='dark'] .dataTables_wrapper {
        color: var(--text-dark);
    }
    [data-theme='dark'] .dataTables_length select,
    [data-theme='dark'] .dataTables_filter input {
        background-color: var(--card-bg) !important;
        color: var(--text-dark) !important;
        border-color: var(--border-color) !important;
    }
    [data-theme='dark'] .page-link {
        background-color: var(--card-bg) !important;
        border-color: var(--border-color) !important;
        color: var(--text-dark) !important;
    }
    .dataTables_wrapper {
        margin-top: 20px;
        padding: 15px;
        background: var(--card-bg);
        border-radius: 8px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    }
</style>
@endsection

@section('contenido') 
<div class="d-flex justify-content-center">

  <h1>ROTACION DE PRODUCTOS</h1>
  @include('menu.botonRegresar')
</div>

<form action="verrotacionPro" method="GET">

  <div class="col-md-10">
    <label for="">Fecha Inicial<input required  type="date" name="fi"  id="fecI" value="{{$fi}}" class="form-control"></label>
    <label for="">Fecha Final<input required  type="date" name="ff"  id="fecff" value="{{$ff}}" class="form-control"></label>
     @include('../menu.bodegas')

    <label for="" class="col-md-2" >Marca
              <select class="form-control"   name="marca"  id="" >
       
                <option value="Todos" >Todos</option>
                @foreach ($marcas as $item)
                @if ($marca==$item->codmarca)
                <option value="{{$item->codmarca}}" selected > {{$item->nommarca}} </option>
                @else
                <option value="{{$item->codmarca}}"  > {{$item->nommarca}} </option>
              
          @endif
         
              
          @endforeach
          
          
         </select>
        </label>


        <label for="" class="col-md-2" >Categoria
      <select class="form-control "  name="categoria"  id="categorias" >
        <option value="Todos" >Todos</option>
        @foreach ($categorias as $item)

           @if ($categoria==$item->codcategoria)
            <option value="{{$item->codcategoria}}"  selected> {{$item->nomcategoria}} </option>
           @else

           <option value="{{$item->codcategoria}}"  > {{$item->nomcategoria}} </option> 
          
           @endif
        
            
        @endforeach
        
        
       </select>
      </label>
      
      <label for="" class="col-md-2">Rotación
        <select class="form-control" name="rotacion">
          <option value="Todos" {{ $rotacion == 'Todos' ? 'selected' : '' }}>Todos</option>
          <option value="Con Rotación" {{ $rotacion == 'Con Rotación' ? 'selected' : '' }}>Solo con Rotación</option>
        </select>
      </label>

    <button  type="submit" id="botonf" class="btn btn-warning">Consultar</button>
    <button  type="submit" name="exportar" class="btn btn-success" value="1">Exportar</button>
    
  </div>
</form>

@include('../menu/exportar.exportarRotacionProd')
 

@endsection

@section('pie')
<script src="https://cdn.datatables.net/1.13.7/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.13.7/js/dataTables.bootstrap4.min.js"></script>
<script>
    $(document).ready(function() {
        if ($('#tablaRotacion').length) {
            $('#tablaRotacion').DataTable({
                "language": {
                    "url": "//cdn.datatables.net/plug-ins/1.10.20/i18n/Spanish.json"
                },
                "pageLength": 25,
                "responsive": true,
                "order": [[ 1, "asc" ]], // Ordenar por nombre por defecto
                "dom": '<"row"<"col-sm-12 col-md-6"l><"col-sm-12 col-md-6"f>>' +
                       '<"row"<"col-sm-12"tr>>' +
                       '<"row"<"col-sm-12 col-md-5"i><"col-sm-12 col-md-7"p>>',
            });
        }
    });
</script>
@endsection