<div class="col-md-12 col-xs-12">
  <a href="javascript:window.history.back()" ><button type="button" class="btn btn-danger pull-right col-md-2 col-sm-4 col-xs-12 "><span class="glyphicon glyphicon-circle-arrow-left"> </span> Regresar</button></a>
</div>
<div id="page-content-wrapper">
<div class="page-content inset">
<div class="row">
<br>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
  <script type="text/javascript" src="<?php echo base_url()?>assets/dist/js/site.js"></script>
  <link rel="stylesheet" href="<?php echo base_url().'assets/dist/css/validacion.css'?>">
  <link rel="stylesheet" href="<?php echo base_url().'assets/plugins/datatable/dataTables.bootstrap4.min.css'?>">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css" />
  <script src="<?php echo base_url().'assets/plugins/datatable/jquery.dataTables.min.js'?>" type="text/javascript"></script>
  <script src="<?php echo base_url().'assets/plugins/datatable/dataTables.bootstrap4.min.js'?>" type="text/javascript"></script>
  <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
  <link rel="stylesheet" type="text/css" href='<?php echo base_url()?>assets/dist/css/styleTable.css' /> 
   <link rel="stylesheet" type="text/css" href='<?php echo base_url()?>assets/dist/css/table.css' />
   <link rel="stylesheet" href="<?php echo base_url().'assets/plugins/select/bootstrap-select.min.css'?>">
		<!-- Latest compiled and minified JavaScript -->
		<script src="<?php echo base_url().'assets/plugins/select/bootstrap-select.min.js'?>"></script>

</head>

<div class="form-group">
 <!-- <button type="button" class="btn btn-info " style="visibility: hidden;"></button> 

<a href="javascript:window.history.back()"><button type="button" class="btn btn-info "><span class="glyphicon glyphicon-arrow-left"></span>  Regresar</button></a> 
 -->


</div>

<div class="titulo">
<h1>Histórico de citas</h1>
<h3><?php foreach ($ReNombre as $i => $Nombre) echo  $Nombre ?> </h3>
</div>


<div class="col-md-7 navbar-form navbar">

<label class="label-buscar">Buscar:</label>
<input type="text" class="form-control search"  id="query" name="query" />
</div>
</div>

<div class="table-responsive">
<table class="table table-striped jambo_table bulk_action" id="tablaHistoricoC" style="visibility: hidden;">
  <thead>
  <tr>

  <th>Cabina</th>
  <th>Categoria</th>
  <th>Servicio</th>
  <th>Fecha</th>
  <th>Hora Inicio</th>
  <th>Hora Fin</th>
  <th>Estado</th>
  <th>Observaciones</th>


  <tbody>
</tr>
  <?php 
          if ($consulta1 != FALSE){
            foreach ($consulta1 as $fila){
                echo "<tr>";
                echo "<td>".$fila->NombreCabina."</td>";
                echo "<td>".$fila->NombreCategoria."</td>";
               // echo "<td></td>";
                echo "<td class='nom'>".$fila->ServiciosFranquicias_IdServiciosFranquicias.$fila->Promociones_IdPromociones."</td>";
                echo "<td>".$fila->Fecha."</td>";
                echo "<td>".$fila->HoraInicio."</td>";
                echo "<td>".$fila->HoraFin."</td>";
                echo "<td>".$fila->NombreEstatusCita."</td>";
                echo "<td class='adeuP'>".$fila->Observaciones."</td>";
                echo "</tr>";
            } 
          } 
   ?>
     </tbody>
   </thead>
  </table>
  </div>
  </div>
</div>

<script type="text/javascript">
    $(document).ready(function(){
      var serfran = <?php echo json_encode($consulta2, JSON_PRETTY_PRINT);?>;
      var sergen = <?php echo json_encode($consulta3, JSON_PRETTY_PRINT);?>;
      var promo = <?php echo json_encode($consulta4, JSON_PRETTY_PRINT);?>;
      var arr1, arr2, arr3;
//console.log(promo);
       //console.log(serfran);
          $('.nom').each(function() { 
            var codigo1=$(this).text();
            // console.log(codigo1);
      for(arr1 = 0; arr1 < serfran.length; arr1++){
           // console.log(serfran[arr1].IdServiciosFranquicias);

            if(codigo1==serfran[arr1].IdServiciosFranquicias){
            console.log('Encuentra el servicio');
            $(this).text(serfran[arr1].NombreServicio);
            }
      }
      for(arr2 = 0; arr2 < sergen.length; arr2++){
            //console.log(sergen[arr2].IdServiciosFranquicias);

            if(codigo1==sergen[arr2].Codigo_Servicios){
            console.log('Encuentra el servicio general');
            $(this).text(sergen[arr2].NombreServicio);
            }
      }

      for(arr3 = 0; arr3 < promo.length; arr3++){
             // console.log(promo[arr3].FolioPromocion);

            if(codigo1==promo[arr3].FolioPromocion){
            console.log('Encuentra promocion');
            $(this).text(promo[arr3].NombrePromocion);
            }
      }

         });
     });

$(window).load(function() {

 $('#tablaHistoricoC').css('visibility', 'visible');
   $('#tablaHistoricoC').DataTable(
       {               

                        
                       dom:'lrtip',
                        responsive: true,
                       // columnDefs: visible,
                       // data: response,
                       // columns: columns,

                        ServerSide: true,
                         destroy: true,
                         filter:true,
                         footer: true,
                         processing: true,

                         "lengthChange": false,
                         "order": [[3, "desc" ]],
                         "pageLength": 20,

                         



                        language: {
                            "lengthMenu": "Mostrar _MENU_ registros por pagina",
                            "zeroRecords": "No se encontraron resultados en su busqueda",
                            "searchPlaceholder": "Buscar ventas registradas",
                            "info": "Mostrando registros de _START_ al _END_ de un total de  _TOTAL_ registros",
                            "infoEmpty": "No existen registros",
                            "infoFiltered": "(filtrado de un total de _MAX_ registros)",
                            "search": "Buscar:",
                            "paginate": {
                                "first": "Primero",
                                "last": "Último",
                                "next": "Siguiente",
                                "previous": "Anterior"
                            },

                        },


                    });

 

    var table = $('#tablaHistoricoC').DataTable();
    // Event listener to the two range filtering inputs to redraw on input
    $('#query').on('input', function() {

        table.search(this.value).draw();


    });

});
(function(){
            function removeAccents ( data ) {
                if ( data.normalize ) {
                    /* Use la API I18n si está disponible para dividir caracteres y acentos, luego elimine
                       los acentos al por mayor. Tenga en cuenta que utilizamos los datos originales, así como
                       lo nuevo para permitir la búsqueda de cualquiera de los formularios.*/
                    return data +' '+ data
                        .normalize('NFD')
                        .replace(/[\u0300-\u036f]/g, '');
                }
             
                return data;
            }
             
            var searchType = jQuery.fn.DataTable.ext.type.search; 
            searchType.string = function ( data ) {
                return ! data ?
                    '' :
                    typeof data === 'string' ?
                        removeAccents( data ) :
                        data;
            };
             
            searchType.html = function ( data ) {
                return ! data ?
                    '' :
                    typeof data === 'string' ?
                        removeAccents( data.replace( /<.*?>/g, '' ) ) :
                        data;
            };
        }());
</script>
