<div id="page-content-wrapper">
<!-- Keep all page content within the page-content inset div! -->
<div class="page-content inset">
<div class="row">
<div class="col-md-12 div-centrado">
<head>
  <link rel="stylesheet" href="<?php echo base_url().'assets/dist/js/jquery/jquery-ui.css'?>">
  <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/dist/css/styles.css'?>">
  
	<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' />
  <script type="text/javascript">
    var base_url='<?php echo base_url()?>';
  </script>
    <!-- ///////////////////////////js y css necesarias para la firma digital -->
  <link rel="stylesheet" href="<?php echo base_url().'assets/plugins/signature_pad-master/docs/css/signature-pad.css'?>">
<!--[if IE]>
    <link rel="stylesheet" type="text/css" href="<?php echo base_url().'assets/plugins/signature_pad-master/docs/css/ie9.css'?>">
  <![endif]-->
<script type="text/javascript" async="" src="<?php echo base_url()?>assets/plugins/signature_pad-master/docs/js/google-analytics-ga.js"></script>
<!-- /////////////////////////// fin de los js y css necesarias para la firma digital -->
<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>
  .borderImage {
    /*border: 1px solid #CCCCCC;*/
    width: 100%;
    height: auto;
    margin-bottom: -15px;
}
#firmar{
    color: #fff;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    text-align: center;
    border-radius: 3px;
        border: 1px solid transparent;
  }
</style>
<center><h1>Modificar Tratamiento Relajante</h1></center>
<Center>
 <ul class="breadcrumb menu">
    <!-- Menu que direcciona a los  Productos internos, adicionales y al Público-->
<li><a href="<?php echo base_url();?>expediente/franquiciatario/ExpedienteF/editarE/<?= $this->uri->segment(5);?>"> Histórico General</a><span class="divider"></span></li>
<li><a href="<?php echo base_url();?>expediente/franquiciatario/ExpedienteF/Corporal/<?= $this->uri->segment(5);?>">Histórico Corporal</a> <span class="divider"></span></li>
<li><a href="<?php echo base_url();?>expediente/franquiciatario/ExpedienteF/EELigth/<?= $this->uri->segment(5);?>">Histórico E-Ligth</a> <span class="divider"></span></li>
<li><a href="<?php echo base_url();?>expediente/franquiciatario/ExpedienteF/EFacial/<?= $this->uri->segment(5);?>"> Histórico Facial</a><span class="divider"></span></li>
<li><a href="<?php echo base_url();?>expediente/franquiciatario/ExpedienteF/EPestanas/<?= $this->uri->segment(5);?>"> Histórico E.Pestañas</a><span class="divider"></span></li>
<li><a href="<?php echo base_url();?>expediente/franquiciatario/ExpedienteF/Relajante/<?= $this->uri->segment(5);?>"> Histórico Relajante</a><span class="divider"></span></li>
<li><a href="<?php echo base_url();?>expediente/franquiciatario/ExpedienteF/Nutricional/<?= $this->uri->segment(5)?>"> Histórico Nutricional</a><span class="divider"></span></li>
</ul>
</Center>

</div>
<div class="col-md-8 div-centrado">

  <form action="<?php echo base_url();?>expediente/franquiciatario/ExpedienteF/editarenlaceRelajante/<?=$IdRelajante?>/<?=$id?>"  method="POST" onSubmit="return false" id="frm_editarRelajante">
<div class="form-group">
  <input type="text" class="form-control" id="idCliente"  name="idCliente" placeholder="idCliente" value="<?=$idCliente?>" readonly="readonly" style="display: none;" >
<div class="col-md-6">
     <label for="name1">Sesión <i class="fas fa-exclamation-circle"></i></label>
    <input type="text" class="form-control"  name="Sesion" placeholder="Sesión" value="<?=$Sesion?>" readonly="readonly">
</div>
<div class="col-md-6">
    <label for="name1">Tratamiento <i class="fas fa-exclamation-circle"></i></label>
    <input type="text" class="form-control" id="Tratamiento" name="Tratamiento" placeholder="Tratamiento" value="<?=$Tratamiento?>"   required="">
</div>
<div class="col-md-6">
    <label for="name1">Productos</label>
    <input type="text" class="form-control"  name="Productos" placeholder="Productos" value="<?=$Productos?>">
</div>
<div class="col-md-6">
    <label for="name1">Observaciones <i class="fas fa-exclamation-circle"></i></label>
      <textarea class="form-control" rows="2"  name="ObservacionesRelajante" placeholder="Descripción" required=""><?php echo $ObservacionesRelajante?></textarea>
</div>

<div class="col-md-6">
        <label for="name1">Diagnóstico <i class="fas fa-exclamation-circle"></i></label>
          <textarea class="form-control" rows="2"  name="Diagnostico" placeholder="Descripción" required=""><?php echo $Diagnostico?></textarea>
      </div>
      
  <div class="col-md-6">
      <label for="name1" >Cosmetóloga(o) <i class="fas fa-exclamation-circle"></i> </label>
      <select class="form-control" name="usuario" id="usuario" required="">
       <option value="">--- Selecciona la opción ---</option>
      <?php foreach ($ReUsuarioC as $ReUsuarioC => $Usuario)    
      echo '<option value="',$ReUsuarioC,'">',$Usuario,'</option>'; ?> </select>
      <br>
    </div>


<?php
if($RutaFirmaDigital != null || $RutaFirmaDigital != ''){
?>
<div class="col-md-12">
    <br>
    <div class="col-md-12">
      <label for="name1">Firma del cliente</label>
  </div>
    <div class="col-md-4">
          <center><img id='mostrarFirma' class='col-md-12 col-sm-12 col-xs-12' name='mostrarFirma' src='<?php echo base_url().$RutaFirmaDigital?>' style="width: 100%"></center>
          <input class="form-control" id="imagen" name="imagen" value="1" style="display: none;">
          <input type="text" name="firmaDig" id="firmaDig" value="<?=$RutaFirmaDigital?>" style="display: none;" >
          <textarea name="base64" id="base64" value="<?=$RutaFirmaDigital?>" style="display: none;"></textarea>
      </div>
  </div>
<?php
}else{
?>
<div class="col-md-6">
      <br>
      <button type="button" id="firmar" name="firmar" class="btn btn-primary">INGRESAR FIRMA ELECTRÓNICA</button>
    </div>

    <div class="col-md-6">
      <br>
        <textarea name="" id="" class="form-control" style="visibility: hidden;"></textarea>
    </div>

    <div class="col-md-12">
      <div class="col-md-4">
         <center><img id='mostrarFirma' class='col-md-12 col-sm-12 col-xs-12' name='mostrarFirma' style="width: 100%"></center>
        <input class="form-control" id="imagen" name="imagen" value="" style="display: none;">
        <textarea name="base64" id="base64" style="display: none;"></textarea>
      </div>
    </div>
<?php
}
?>
  
      
</div>
<input type="text" class="form-control oculto">
  <div class="form-group col-md-12"> 
      <button type="submit" id="guardar" class="btn btn-primary col-md-4 col-xs-5 pull-right"> <span class="glyphicon glyphicon-floppy-disk"> </span> Guardar</button>
      <a href="javascript:window.history.back()" ><button type="button" class="btn btn-danger col-md-4 col-xs-5 pull-left"> <span class="glyphicon glyphicon-circle-arrow-left"> </span> Regresar</button></a>  
  </div>

    <input type="text" class="form-control" id="name1" name="txt_idEx" placeholder="Productos" value="<?=$this->uri->segment(5)?>" readonly style="visibility:hidden;">
</form>

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

<!-- Modal para ingresar la firma digital -->
<div class="modal fade" id="modal-firma" data-backdrop="static" data-keyboard="false">
  <div class="modal-dialog ">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span></button>
      </div>

       <div id="signature-pad" class="modal-body signature-pad" style="height: 80vh; width: 100%;">
          <div class="signature-pad--body">
          <canvas></canvas>
          </div>
          <div class="signature-pad--footer">
            <div class="description">Ingrese su firma</div>
            <div class="signature-pad--actions">
            <div>
            <button type="button" class="button clear btn btn-danger" data-action="clear">LIMPIAR</button>
            <!-- <button type="button" class="button" data-action="change-color">Change color</button> -->
            <!-- <button type="button" class="button" data-action="undo">Undo</button> -->
            </div>
            <div>
            <button type="button" class="button save btn btn-primary" data-action="save-png">GUARDAR</button>
            <!-- <button type="button" class="button save" data-action="save-jpg">Save as JPG</button> -->
            <!-- <button type="button" class="button save" data-action="save-svg">Save as SVG</button> -->
            </div>
            </div>
          </div>
        </div> 

        

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

<script>
window.addEventListener( 'load', function( event )
 {  
  $("#Tratamiento").autocomplete({
            source: base_url+"expediente/franquiciatario/ExpedienteF/servicios/?",
   
            select: function (event, ui) {                    
                       $('[name="Tratamiento"]').val(ui.item.label);
                     }
               });

var id="<?=$this->uri->segment(5)?>";
  $('#frm_editarRelajante').submit(function(event){ 
     event.preventDefault();
var valorImagen = $('#imagen').val();

if(valorImagen == ""){
  swal({
      title: "¡No ha ingresado la firma electrónica!",
      text:"¿Desea continuar?",
      icon: "warning",
      buttons: ["Cancelar", "Aceptar"],
      confirm: true,
    })
    .then((confirm) => {
      if(confirm){
        $.ajax({                        
              type: "POST",                                   
              url: $(this).attr('action'),
              data: $(this).serialize(),
              success: function(result){
              // console.log("result= " + result);
              if(result == '1'){
                swal("Datos guardados correctamente", "", "success")
                .then((value) => {
                  location.href="/SM/expediente/franquiciatario/ExpedienteF/Relajante/"+id
                  });
              }else if(result == '-1'){
                swal("Los datos no pudieron ser guardados correctamente", "", "warning")
                .then((value) => {
                  location.href="/SM/expediente/franquiciatario/ExpedienteF/Relajante/"+id
                  });
              }else{
                swal("No se hizo ningun cambio", "", "warning")
                .then((value) => {
                  location.href="/SM/expediente/franquiciatario/ExpedienteF/Relajante/"+id
                  });
              }
              },error:function(jqXHR, textStatus, errorThrown){
                console.log('error::' + errorThrown);
              }
          });
      }
    });
  }else{
    $.ajax({                        
          type: "POST",                                   
          url: $(this).attr('action'),
          data: $(this).serialize(),
          success: function(result){
          // console.log("result= " + result);
          if(result == '1'){
            swal("Datos guardados correctamente", "", "success")
            .then((value) => {
              location.href="/SM/expediente/franquiciatario/ExpedienteF/Relajante/"+id
              });
          }else if(result == '-1'){
            swal("Los datos no pudieron ser guardados correctamente", "", "warning")
            .then((value) => {
              location.href="/SM/expediente/franquiciatario/ExpedienteF/Relajante/"+id
              });
          }else{
            swal("No se hizo ningun cambio", "", "warning")
            .then((value) => {
              location.href="/SM/expediente/franquiciatario/ExpedienteF/Relajante/"+id
              });
          }
          },error:function(jqXHR, textStatus, errorThrown){
            console.log('error::' + errorThrown);
          }
      });
      }
  });

$('#firmar').click(function(){
  $("#modal-firma").on("shown.bs.modal", function () { 
  resizeCanvas();
      }).modal('show');
});

 });
</script>
<!-- ////////////////////////// js necesarios para la firma digital////////////////////////// -->
  <script src="<?php echo base_url()?>assets/plugins/signature_pad-master/docs/js/signature_pad.umd.js"></script>
  <script src="<?php echo base_url()?>assets/plugins/signature_pad-master/docs/js/app.js"></script>
  <!-- ////////////////////////// fin de los js necesarios para la firma digital////////////////////////// -->