<div id="page-content-wrapper">
<div class="page-content inset">
<div class="row">
<div class="col-md-12 div-centrado">
<head>
  <!-- Manda a traer el javascript para validar el formulario -->
  <script type="text/javascript" src="<?php echo base_url()?>assets/dist/js/expediente.js"></script>
  <link rel="stylesheet" href="<?php echo base_url().'assets/dist/css/validacion.css'?>">

<!-- doble scroll en la datatable -->
<link rel="stylesheet" href="<?php echo base_url().'assets/dist/css/styles.css'?>">

   <script src="<?php echo base_url()?>assets/plugins/jQuery/jquery-1-10-2.min.js"></script>
  <script type="text/javascript" src="<?php echo base_url()?>assets/dist/js/site.js"></script>
<link rel="stylesheet" type="text/css" href='<?php echo base_url()?>assets/dist/css/styleTable.css' /> 
  <link rel="stylesheet" href="<?php echo base_url().'assets/plugins/datatable/dataTables.bootstrap4.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 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' />
<!-- doble scroll en la datatable -->
<script type="text/javascript" src="<?php echo base_url()?>assets/plugins/doubleScroll/jquery.doubleScroll.js"></script>
<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>
<style>
.dataTables_filter {
   float: left !important;
}
table.dataTable thead>tr>th{
  border-top: 0;
}
.btn-warning{
  background: #781F78 !important;
}
</style>
<div class="col-md-12">
<div class="col-md-2 col-sm-5 col-xs-12"> 
<a href="/SM/clientes/cosmetologo/clienteC/editar/<?=$clientes_IdClientes?>" ><button type="button" class="btn btn-danger col-sm-12 col-xs-12 "> <span class="glyphicon glyphicon-circle-arrow-left"> </span> Regresar</button></a>  
</div>
<div class="col-md-10 col-sm-7 col-xs-12">
  <input type="text" class="form-control" id="" name="" value=""  style="visibility: hidden;">
</div>
</div> 

<div class="col-md-12">
  <center><h1>Tratamiento E-Ligth</center>
  <center><h3 class="titulo"><?=$ReNombre?></h3></center>
</div>
<Center>
<div class="col-md-12">
 <ul class="breadcrumb menu">
    <!-- Menu que direcciona a los  Productos internos, adicionales y al Público-->
<li><a href="<?php echo base_url();?>expediente/cosmetologo/ExpedienteC/editarE/<?=$clientes_IdClientes?>"> Histórico General</a><span class="divider"></span></li>
<li><a href="<?php echo base_url();?>expediente/cosmetologo/ExpedienteC/Corporal/<?=$Idexpediente?>">Histórico Corporal</a> <span class="divider"></span></li>
<li><a href="<?php echo base_url();?>expediente/cosmetologo/ExpedienteC/EELigth/<?=$Idexpediente?>">Histórico E-Ligth</a> <span class="divider"></span></li>
<li><a href="<?php echo base_url();?>expediente/cosmetologo/ExpedienteC/EFacial/<?=$Idexpediente?>"> Histórico Facial</a><span class="divider"></span></li>
 <li><a href="<?php echo base_url();?>expediente/cosmetologo/ExpedienteC/EPestanas/<?=$Idexpediente?>"> Histórico E.Pestañas</a><span class="divider"></span></li>
<li><a href="<?php echo base_url();?>expediente/cosmetologo/ExpedienteC/Relajante/<?=$Idexpediente?>"> Histórico Relajante</a><span class="divider"></span></li>
<li><a href="<?php echo base_url();?>expediente/cosmetologo/ExpedienteC/Nutricional/<?=$Idexpediente?>"> Histórico Nutricional</a><span class="divider"></span></li>
</ul>
</div>
</Center>


<input type="text" class="form-control" id="txt_IdExpediente" name="txt_IdExpediente" value="<?=$Idexpediente?>"  style="display: none;">
<input type="text" class="form-control" id="nombreCliente" name="nombreCliente" value="<?=$ReNombre?>"  style="display: none;">

<div class="col-md-12" id="botones">
  
</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" />

<a href="<?=base_url()?>expediente/cosmetologo/ExpedienteC/agregarEligth/<?=$Idexpediente?>">
<button type="button" class="btn btn-primary"><span class='glyphicon glyphicon-plus'></span></button></a>
        
</div>

<div class="col-md-12" id="cargando" style=" text-align: center;">
              <div class="lds-spinner"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
              <center class="cargando2"> Cargando...</center>
        </div>
        
<!-- <a href="<?=base_url()?>expediente/cosmetologo/ExpedienteC/agregarEligth/<?=$Idexpediente?>"> -->
<!-- <button type="button" class="btn btn-primary"><span class='glyphicon glyphicon-plus'></span></button></a></br></br> -->


<!--<a href="<?=base_url()?>leyendas/administrador/leyendaA/agregar"><button type="button" class="btn btn-primary"><span class='glyphicon glyphicon-plus'></span></button></a>-->
<div class="col-md-12">
        <table id="tablaEligth" class="table table-striped jambo_table bulk_action tablaEligth" style="width:100%">
        </table>
  </div>

</div>
</div>
</div>
</div>

<!-- Modal para subir pdf de consentimiento -->
<div id="divModalImagen">
  
</div>


<script>
  window.addEventListener( 'load', function( event )
{
// console.log("Js de Eligth");
listadoConsentimiento()
dataTableEligth()

});

  ////////////////////////////////////////////////////////////////////////////////////////////////////////////////

function dataTableEligth(){
var id=$("#txt_IdExpediente").val();

      $.ajax({
            url:"/SM/expediente/cosmetologo/ExpedienteC/InfoEligth/",
            type:'POST',
            dataType: 'json',
            data:{idE : id},

            success:function(response){
                // console.log("tablaFacial");
                // console.log(response);

                var columns = [
                    { "title":"Fecha" },
                    { "title":"Sesión" },
                    { "title":"Tratamiento" },
                    { "title":"Potencia" },
                    { "title":"Zona Eligth" },
                    { "title":"Disparos" },
                    { "title":"Observaciones" },
                    { "title":"Diagnóstico" },
                    { "title":"Cosmetólog@" },
                    // { "title":"Acciones" }
                ];
                var hide = [
                        { targets: [0,1,2,3,4,5,6,7], visible: true},
                       /* { targets: [8], visible: false }*/
                    ];


                // $("#tablaEligth").append('<tfoot class="dataFooter"><tr><th></th><th></th><th></th><th></th><th></th><th></th><th></th></tr></tfoot>'); 


                $('#tablaEligth').DataTable( {
                  dom: 'lrtip',
                    responsive: true,
                    columnDefs: hide,
                    data: response,
                    columns: columns,
                    ServerSide: true,
                    destroy: true,
                    footer: true,
                    processing: true,
                    // bFilter:false,
                    // searching: true,
                         filter:true,
                         "lengthChange": false,
                         "order": [[ 0, "desc" ]],
                         "pageLength": 10,

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

                });

                $('#tablaEligth').wrap("<div id='scrollbar-tabla' class='scrollbar-tabla'></div>");
                    $('#scrollbar-tabla').doubleScroll({
                          resetOnWindowResize: true
                        });
                document.getElementById('cargando').classList.add('invisible');

// $("input[type=search]").attr('style','display: none');
var table = $('#tablaEligth').DataTable();
          $('#query').on('input',function(){
              table.search(this.value).draw();
          });




        },//end success ajax response
        error:function(){
        },

        });//end ajax

}


  function listadoConsentimiento(){
var id=$("#txt_IdExpediente").val();

   var fila = '';
      $.ajax({
            url:"/SM/expediente/cosmetologo/ExpedienteC/tratamientosConsentimientoE_ligth/",
            type:'POST',
            dataType: 'json',
            data:{idE : id},

            success:function(response){
                // console.log("prueba tratamientos");
                // console.log(response);

if(response != null){
  var cont= 1;
         for(var i=0; i<response.length; i++)
            {
          if(response[i] != ''){
              fila += '<div">';
              fila += '<form method="POST"  action="" onSubmit="return false">';
              fila += '<input type="text" class="form-control" id="tipoVenta'+cont+'" name="tipoVenta" value="'+response[i].servicio+'"  style="display: none;">';
              fila += '<input type="text" class="form-control consentimiento" id="consentimiento_'+cont+'" name="consentimiento" value="'+response[i].IdConsentimiento+'"  style="display: none;">';

              fila += '<input type="text" class="form-control VerificacionCertificado" id="VerificacionCertificado'+cont+'" name="VerificacionCertificado" value="'+response[i].VerificacionCertificado+'"  style="display: none;">';

              if(response[i].VerificacionCertificado == id){
                fila += '<button type="button" class="btn btn-primary" disabled><span class="glyphicon glyphicon-gift" style="color:orange; font-size: 18px;"></span>&nbsp;&nbsp;'+response[i].NombreServicio+'</button> '; 
              }else{
                fila += '<button type="button" class="btn btn-primary" disabled>'+response[i].NombreServicio+'</button> ';
              }


               
              
              fila += '<input type="text" class="form-control" id="nameServicio'+cont+'" name="nameServicio" value="'+response[i].NombreServicio+'"  style="display: none;">';

              // fila += '<input type="text" class="form-control" id="IdVentasServicios" name="IdVentasServicios" value="'+response[i].IdVentasServicios+'"  style="display: none;">';
              fila += '<button type="button" class="btn btn-warning" name="botonConsentimiento" id="botonConsentimiento_'+cont+'" value="'+response[i].NombreServicio+"///"+response[i].IdVentasServicios+'"></button> ';

              fila += '<input type="text" class="form-control SesionesDetalleVentas" id="SesionesDetalleVentas'+cont+'" name="SesionesDetalleVentas" value="'+response[i].SesionesDetalleVentas+'"  style="display: none;">';
              
                fila += '<input type="text" class="form-control SesionesGeneral" id="SesionesGeneral'+cont+'" name="SesionesGeneral" value="'+response[i].SesionesGeneral+'"  style="display: none;">';

              fila += '<input type="text" class="form-control ExistenciaImagen" id="ExistenciaImagen'+cont+'" name="ExistenciaImagen" value="'+response[i].ExistenciaImagen+'"  style="display: none;">';


              fila += '<input type="text" class="form-control IdServicio" id="IdServicio'+cont+'" name="IdServicio" value="'+response[i].IdVentasServicios+'"  style="display: none;">';
              fila += '<input type="text" class="form-control promociones_IdPromociones" id="promociones_IdPromociones'+cont+'" name="promociones_IdPromociones" value="'+response[i].promociones_IdPromociones+'"  style="display: none;">';

              fila += '<a id="botonImagen'+cont+'"></a>';

              fila += '<button type="submit" class="submit btn btn-danger" dir="<?=base_url()?>expediente/cosmetologo/ExpedienteC/agregarEligth/<?=$Idexpediente?>" id="boton_'+cont+'" name="boton"><span class="glyphicon glyphicon-plus"></span></button>';
              fila += '</form></div>';

              cont++;
            }
          }
            
            $("#botones").html(fila);

            var newX="";
            

            for(var x=1; x<cont; x++){
              
              var TipoServicio = $('#tipoVenta'+x).val();
              var IdPromosServicios = $('#promociones_IdPromociones'+x).val();
              var IdServicio_X = $('#IdServicio'+x).val();
              var Sesiones = $('#SesionesDetalleVentas'+x).val();
              var eligth = "eligth";
              var cosmetologo = "cosmetologo";
              var nombreServicio = $('#nameServicio'+x).val();

               if($("#consentimiento_"+x).val() == '1'){ 
                  $('#botonConsentimiento_'+x).html('CONSENTIMIENTO FIRMADO');                  
                  $('#botonConsentimiento_'+x).attr('disabled',true);                  
                  
                  if($("#ExistenciaImagen"+x).val() > 0){
                    
                    var numSesiones = buscarNumSesiones(IdPromosServicios,TipoServicio,cosmetologo)
                    numSesiones=numSesiones*Sesiones;

                    var numRows = validacionSesiones(TipoServicio, IdServicio_X, eligth, cosmetologo)
                    var arregloRows = numRows.split('///');

                    if(arregloRows[0]==numSesiones && arregloRows[1] != ''){
                      $('#boton_'+x).remove();  
                    //   // swal("Número de sesiones completadas", "", "success");
                    }else if(arregloRows[0]<numSesiones){
                    //   // $('#boton_'+x).attr('disabled',false);
                    }


                  }else{
                  // var nombreServicio = $('#nameServicio'+x).val();

                    $("#boton_"+x).attr('disabled',true);

                    $('#botonImagen'+x).html('<button type="button" id="subirImagen'+x+'" style="background : #2281C8; border : #2281C8;" class="btn btn-danger" data-toggle="tooltip" data-placement="bottom" title="Subir respaldo de consentimiento" value="'+IdServicio_X+"///"+nombreServicio+"///"+TipoServicio+'"><i class="glyphicon glyphicon-circle-arrow-up gi-3x"></i></button> ');
                    
                      $("#subirImagen"+x).click(function(){
                        // console.log('subirImagen = ' + $(this).val());
                        var valorBotonSubir=$(this).val();
                        var arreglo = valorBotonSubir.split('///');
                        var IdServicioX = arreglo[0];
                        var nombreServicioBtn = arreglo[1];
                        var varTipoServicio = arreglo[2];

                        var newTipoServicio = varTipoServicio+"///"+nombreServicioBtn;

                        var urlTratamiento = '/SM/expediente/cosmetologo/ExpedienteC/guardarEligth/'+id;
                       modalImagen(IdServicioX,id,newTipoServicio,eligth,cosmetologo,urlTratamiento)
                        $("#modal-imagenRespaldo").modal('show');
                        $(this).tooltip("hide");
                        ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
                      });                

                  }

                  }else{
                  // console.log(x);
                    $("#boton_"+x).attr("disabled",true);
                    $('#botonConsentimiento_'+x).html('FIRMAR CONSENTIMIENTO');  

                    $('#botonConsentimiento_'+x).click(function(){

                    var valorBoton = $(this).val();
                    var arreglo = valorBoton.split("///");
                    var nombreServicio = arreglo[0];
                    var idServicio = arreglo[1];

                     // console.log(nameServicio);
                     // console.log(valorBoton);

                      swal({
                          title: '¿FUE FIRMADO EL CONSENTIMIENTO DE ' + nombreServicio + "?",
                            text: "",
                            icon: "warning",
                            buttons: {
                              cancel: "NO",
                              catch: {
                                text: "SI",
                                value: "SI",
                              },
                              defeat: false,
                            },
                            closeOnClickOutside: false,

                        })
                      .then((value) => {
                              switch (value) {                              
                                   case "SI":

                                    guardarConsentimientoDetalleVentas(idServicio, id, x)
                                    // console.log('idServicio = '+ idServicio);
                                    swal("Consentimiento registrado ", "", "success");
                                    break;
                               
                                  default:
                                    swal("Tiene que estar firmado para poder agregar sesiones", "", "warning");
                                }
                              });


                    });///fin del click

                  }

            }
            
            $(".submit").click(function() {
              var accion = $(this).attr('dir');
              $(this.form).attr('action', accion);
              var eligth = "eligth";
              var cosmetologo = "cosmetologo";

              // var res = consultarFirmaPrincipal(id, eligth, cosmetologo);
              // console.log('resxx = ' + res);

              // if(res == '1'){
                $(this.form).removeAttr('onSubmit');
                $(this.form).submit();
            //   }else{
            //     if(res == 'actualizarExp'){           
            //       swal('Necesita actualizar el expediente general del cliente','','warning')
            //       .then((value) =>{
            //         location.href="/SM/expediente/cosmetologo/ExpedienteC/editarE/"+id;
            //       });
            //     }
            // }
            });

          }
        },//end success ajax response
        error:function(){
          console.log("error");
        },

        });//end ajax

}


function guardarConsentimientoDetalleVentas(idServicio, id, x){
        $.ajax({
            url:"/SM/expediente/cosmetologo/ExpedienteC/modificarCampoConsentimientoVentasE_ligth/",
            type:'POST',
            // dataType: 'json',
            data:{idCliente : id, idServicio : idServicio},

            success:function(response){
              // console.log("response = " + response);
              listadoConsentimiento();

            },//end success ajax response
        error:function(){
          console.log("error");
        },

        });//end ajax
}
(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>