{% extends "base.html" %}
{% load static %}
{% block titulo %}
Compra de Dolar
{% endblock titulo %}
{% block content1 %} 
<script type="text/javascript">
  $("#navDolares").attr('class','dropdown active');
  $("#navCompraDolar").attr('class','active');
</script>
        <div class="row" id="Result">
        {% ifnotequal resultado '' %}
          {% ifequal resultado 'exito' %}
            <div class="alert alert-success" role="alert" align="center">
              <h4>OPERACION EXITOSA!!</h4>
            </div>
          {% else %}
            <div class="alert alert-danger" role="alert" align="center">
              <h4>FALLO OPERACION :( {{resultado}}</h4>
            </div>
          {% endifequal %}
        {% endifnotequal %}
        </div>
        <div class="row">
          <div class="col-md-12 col-sm-12" >
              <div class="panel panel-default">
                <div class="panel-heading"> <strong>LISTADO DE COMPRAS DE DOLAR</strong></div>
                <div class="panel-body">
                  <div class="row" >
                    <h4 class="bg-success" align="center" id="ExitoCambiar">
                    </h4>
                  </div>
                  <div class="row">
                    <div class="col-md-1">
                      <button type="button" class="btn btn-primary btn-sm" id="btnRefrescar"><span class="fa fa-refresh"></span> Actualizar</button>
                    </div>
                    <div class="col-md-2 ">
                      <button type="button" class="btn btn-block btn-success btn-sm" data-toggle="modal" data-target="#ModalComprar"><i class="fa fa-lg fa-money"></i> Comprar Dolar</button>
                    </div>
                    <!--
                    <div class="col-md-2 col-md-offset-5">
                      <button type="button" class="btn btn-block btn-danger btn-sm" id="cambio" data-toggle="modal" data-target="#modalSunat">Tipo de Cambio</button>
                    </div>
                    -->

                  </div>
                  <p></p>
                  <div class="row">

                      <div class="col-md-12">
                          <div class="table-responsive">
                            <table class="table table-hover">
                                <thead>
                                  <tr>
                                    <th>Fecha</th>
                                    <th>Cliente</th>
                                    <th>Tipo de cambio</th>
                                    <th>Dolar Comprado</th>
                                    <th>Soles Pagado</th>
                                    <th>Observaciones</th>
                                  </tr>
                                </thead>
                                <tbody id="listaC">
                                    
                                </tbody>
                            </table>
                          </div>
                      </div>
                  </div>
                </div>
              </div>
          </div>
        </div> 
<div id="myModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <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>
          <h4 class="modal-title" id="myModalLabel">Detalle de Compra de Dolar</h4>
        </div>
        <div class="modal-body">
          <div class="row">
            <div class="col-md-4 col-md-offset-1">
              <label>Fecha Operacion:</label>
            </div>
            <div class="col-md-5">
              <label id="fecha_m"></label>
            </div>
          </div>
          <div class="row">
            <div class="col-md-4 col-md-offset-1">
              <label>Cliente:</label>
            </div>
            <div class="col-md-5">
              <label id="cliente_m"></label>
            </div>
          </div>
          <div class="row">
            <div class="col-md-4 col-md-offset-1">
              <label>DNI/RUC:</label>
            </div>
            <div class="col-md-5">
              <label id="dniruc_m"></label>
            </div>
          </div>
          <div class="row">
            <div class="col-md-4 col-md-offset-1">
              <label>Monto Dolar:</label>
            </div>
            <div class="col-md-5">
              <label id="montoDolar_m"></label>
            </div>
          </div>
          <div class="row">
            <div class="col-md-4 col-md-offset-1">
              <label>Tipo de Cambio:</label>
            </div>
            <div class="col-md-5">
              <label id="tipoCambio_m"></label>
            </div>
          </div>
          <div class="row">
            <div class="col-md-4 col-md-offset-1">
              <label>Monto Soles Pagado:</label>
            </div>
            <div class="col-md-5">
              <label id="montoSoles_m"></label>
            </div>
          </div>
          <div class="row">
            <div class="col-md-4 col-md-offset-1">
              <label>Observaciones:</label>
            </div>
            <div class="col-md-5">
              <label id="obs_m"></label>
            </div>
          </div>
        
          <div class="row">
            <div class="col-md-3 col-md-offset-1">
              <button type="button" class="btn btn-inverse btn-block" id="reimprimir"><i class="fa fa-print"></i> Reimprimir</button>
            </div>
            <!--
            <div class="col-md-3">
              <button type="button" class="btn btn-block btn-warning" id="anular" data-toggle="modal" data-target="#modalAnulacion">Anular Compra</button>
            </div>
            <div class="col-md-4">
              <button type="button" class="btn btn-block btn-primary" id="ReimprmirAnu">Reimprimir Anulacion</button>
            </div>
            -->
          </div> 
        </div>
      </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
  </div>
<div id="ModalComprar" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg" id="modal_formulario">
    <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>
        <h4 class="modal-title" id="myModalLabel">Detalles</h4>
      </div>
      <div class="modal-body">
        <form action="/Comprar_dolar/" method="POST" data-toggle="validator" role="form" id="formulario">
          {% csrf_token %}
          <div class="row">
            <div class="col-md-6" id="panel-cliente">
              <div class="panel panel-default" id="panel_solicitante">
                  <div class="panel-heading"><strong>Datos del Cliente <span id="cabecera_soli"></span></strong></div>
                  <div class="panel-body">
                    <input type="text" class="hidden" name="IdCliente" id="IdCliente">
                    <div class="row">
                      <div class="col-md-10 col-md-offset-1">
                            <label style="margin-bottom: 0px;">
                                <input type="radio" name="TipoPersona" id="rbNatural" value="Natural" required checked>
                                Persona Natural 
                            </label>
                            <label style="margin-bottom: 0px;">
                                <input type="radio" name="TipoPersona" id="rbJuridica" value="Juridica" required>
                                Persona Jurídica
                            </label>
                      </div>
                    </div>
                    <div class="row">
                      <div class="col-md-6 col-md-offset-1">
                        <div class="form-group">
                          <label class="control-label" for="txtDNI" id="lbdni" style="font-size:18px;">DNI:</label>
                          <input type="text" class="form-control" id="txtDNI" name="DNIRUC" data-minlength="8" data-maxlength="11" data-provide="typeahead" autocomplete="off">
                          <div class="form-control-feedback" style="text-align:left; top: 25px;right: 5px;" ></div>
                          <div class="help-block with-errors"></div>
                        </div>
                      </div>
                      <div class="col-md-4">
                        <button class="btn btn-primary btn-block btn-xs" id="btn_limpiar_soli">Limpiar</button>
                      </div>
                    </div>
                    <div class="row">
                        <div class="col-md-6 col-md-offset-1">
                          <div class="form-group">
                            <label class="control-label" for="txtNombre" id="lbnombre" style="font-size:18px;">Nombres:</label>
                            <input type="text" class="form-control mayuscula" id="txtNombre" name="Nombre" data-provide="typeahead" autocomplete="off" required>
                            <div class="form-control-feedback" style="text-align:left; top: 25px;right: 5px;" ></div>
                            <div class="help-block with-errors"></div>
                          </div>
                        </div>
                    </div>
                    <div class="row nat">
                        <div class="col-md-8 col-md-offset-1">
                          <div class="form-group">
                            <label class="control-label" for="txtAP" style="font-size:18px;">Apellido Paterno:</label>
                            <input type="text" class="form-control mayuscula" id="txtAP" name="Paterno" data-provide="typeahead" autocomplete="off">
                            <div class="form-control-feedback" style="text-align:left; top: 25px;right: 5px;" ></div>
                            <div class="help-block with-errors"></div>
                          </div>
                        </div>
                    </div>
                    <div class="row nat">
                        <div class="col-md-8 col-md-offset-1">
                          <div class="form-group">
                            <label class="control-label" for="txtAM" style="font-size:18px;">Apellido Materno:</label>
                            <input type="text" class="form-control mayuscula" id="txtAM" name="Materno" data-provide="typeahead" autocomplete="off">
                            <div class="form-control-feedback" style="text-align:left; top: 25px;right: 5px;" ></div>
                            <div class="help-block with-errors"></div>
                          </div>
                        </div>
                    </div>
                  </div>
              </div>
            </div>
            <div class="col-md-6" id="panel-compra">
              <div class="panel panel-default">
                  <div class="panel-heading"><strong>Datos de la Compra</strong></div>
                  <div class="panel-body">
                      </div>
                      <div class="row">
                        <div class="col-md-8 col-md-offset-1">
                          <div class="form-group">
                            <label class="control-label" for="txtdolar" style="font-size:18px;">Monto dolar:</label>
                            <div class="input-group">
                              <span class="input-group-addon">$&nbsp;&nbsp;</span>
                              <input type="text" class="form-control t-monto" id="txtdolar" name="montodolar" required>
                            </div>
                            
                            <div class="form-control-feedback" style="text-align:left; top: 25px;right: 5px;" ></div>
                            <div class="help-block with-errors"></div>
                          </div>
                        </div>
                     </div>
                     <div class="row" id="fila_tc">
                        <div class="col-md-8 col-md-offset-1">
                          <div class="form-group">
                            <label class="control-label" for="txt_tpc" style="font-size:18px;">Tipo de cambio:</label>
                            <div class="input-group">
                              <span class="input-group-addon">S/.</span>
                               <input type="text" class="form-control" id="txt_tpc" name="tipoCambio" required>
                            </div>
                           
                            <div class="form-control-feedback" style="text-align:left; top: 25px;right: 5px;" ></div>
                            <div class="help-block with-errors"></div>
                          </div>
                        </div>
                     </div>
                     
                     <div class="row">
                        <div class="col-md-8 col-md-offset-1">
                          <div class="form-group">
                            <label class="control-label" for="txtsoles" style="font-size:18px;">Monto Soles a Pagar:</label>
                            <div class="input-group">
                              <span class="input-group-addon">S/.</span>
                              <input type="text" class="form-control t-monto" id="txtsoles" name="montosoles" readonly required>
                            </div>
                            
                            <div class="form-control-feedback" style="text-align:left; top: 25px;right: 5px;" ></div>
                            <div class="help-block with-errors"></div>
                          </div>
                        </div>
                     </div>
                     <div class="row">
                        <div class="col-md-10 col-md-offset-1">
                          <div class="form-group">
                            <label class="control-label" for="obs" style="font-size:18px;">Observaciones:</label>
                            <textarea class="form-control" rows="2" placeholder="OBSERVACIONES" name="obs" id="obs" style="font-size:16px;font-weight:bold;"></textarea >
                            <div class="form-control-feedback" style="text-align:left; top: 25px;right: 5px;" ></div>
                            <div class="help-block with-errors"></div>
                          </div>
                        </div>
                      </div>  
                  </div>
              </div>
            </div>
          <div class="row" hidden>
             <div class="col-md-1 col-xs-1 hidden" style="z-index: -10;">
              <select class="form-control" name="transac">
                <option value="{{transac}}"></option>
              </select>
            </div>
            
          </div>
          <div class="row">
            <div class="col-md-4 col-md-offset-2">

               <div id="chek_datos" class="checkbox">
                   
                    <label>
                      <input id="chkCliente" type="checkbox"  > Habilitar Datos
                    </label>
                </div> 

            </div>

            <div class="col-md-2">
              <button class="btn btn-success btn-sm" type="submit" id="btn_guardar">Guardar</button>
            </div>
          </div>
        </form>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div>
  <div id="modalrecibo" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <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>
          <h4 class="modal-title" id="myModalLabel">Detalles</h4>
        </div>
        <div class="modal-body">
          <div  id="platillaI" style="font-family:'Lucida Console', Monaco, monospace;font-size:13px;">
            <h5 align="center"><b id="titulo_recibo">COMPRA DE DOLAR</b></h5>
            <table>
              <tr nowrap>=====================================</tr>
            </table>
            <table>
              <tr>
                <td style="width:100px;">{{ SITE_URL }}</td>
              </tr>
            </table>
            <table>
              <tr >
                <td  valign="top" style="padding-top:10px;"><b>Cliente:</b></td>
                <td style="padding-top:10px;"><div style="width:20px;"> </div></td>
                <td id="cliente" style="padding-top:10px;"></td>
              </tr>
              <tr>
                <td  valign="top" style="padding-top:10px;"><b>DNI/RUC:</b></td> 
                <td style="padding-top:10px;"><div style="width:20px;height:15px;"> </div></td>
                <td id="dniruc" style="padding-top:10px;"></td>
              </tr>
            </table>
            <br>
            <!--<p id="pldet"></p>-->
            
            <b>DETALLE DE COMPRA:</b>
            <table>
              <tr>
                <td>Tipo de Cambio:</td>
                <td ><div style="width:40px;"> </div></td>
                <td id="tipo_cambio" style="text-align:right;"></td>
              </tr>
              <tr>
                <td>Monto Dolar</td>
                <td ><div style="width:40px;"> </div></td>
                <td id="monto_dolar" style="text-align:right;"></td>
              </tr>
              <tr>
                <td><b>Monto Pagado:</b></td>
                <td ><div style="width:40px;"> </div></td>
                <td id="monto_soles" style="text-align:right;"></td>
              </tr>
            </table> 
            <br>
            
            <table>
              <tr>
                <td><div style="height:30px;"> </div></td>
              </tr>
              <tr>
                <td>____________________</td>
              </tr>
              <tr>
                <td nowrap><h5><b>OP. </b>{{ nombre_usuario }}</h5></td>
              </tr>
              <tr>
                <td><div style="height:35px;"> </div></td>
              </tr>
              <tr>
                <td>____________________</td>
              </tr>
              <tr>
                <td nowrap><b><span id="cliente_"></span></b></td>
              </tr>
              
            </table>
            <table>
              <tr id="fila_fecha">
                <td nowrap> <h5 id="fechaRecibo"></h5></td>
                <td style="padding-top:10px;"><div style="width:30px;height:20px;"> </div></td>
                <td nowrap><h5 id="horaRecibo"></h5></td>
              </tr>
            </table>
          </div>
        </div>
        <div class="modal-footer">
        </div>

      </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
 <div id="modalSunat" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
      <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>
            <h4 class="modal-title" id="myModalLabel">Detalle:TIPO DE CAMBIO</h4>
          </div>
          <div class="modal-body">
            <div class="row">
              <p class="bg-warning" align="center"><b>MES ACTUAL</b></p>
            </div>
            <div class="row">
              <div class="col-md-12">
                <div class="table-responsive">
                  <table class="table table-hover table-striped">
                      <thead>
                        <tr>
                          <th>Fecha</th>
                          <th>Compra</th>
                          <th>Venta</th>
                        </tr>
                      </thead>
                      <tbody id="listaT">
                          
                      </tbody>
                  </table>
                </div>
              </div>
            </div>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-danger" data-dismiss="modal">Cerrar</button>
          </div>
        </div><!-- /.modal-content -->
      </div><!-- /.modal-dialog -->
    </div>
<!-- anulacion-->
<div id="modalAnulacion" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
      <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>
            <h4 class="modal-title" id="myModalLabel">ANULACION DE COMPRA</h4>
          </div>
          <div class="modal-body">
            <div class="row alert alert-warning" id="area_transfExpi">
              <div class="row">
                <div class="col-md-3">
                  <input type="text" class="form-control" id="txtPK">
                </div>
              </div>
              <div class="row">
                <div class="col-md-12">
                  <p>Por favor ingrese el codigo de autorización, en caso que no tenga ponga click en la opcion <b>Solicitar Codigo</b></p>
                </div>
              </div>
              <p></p>
              <div class="row">
                <div class="col-md-4 col-md-offset-7">
                  <button type="button" class="btn btn-success btn-block btn-xs"id="solCod">Solicitar Codigo</button>
                </div>
              </div>
              <p></p>
              <p></p>
              <div class="row">
                <div class="col-md-5" align="right"> 
                  <label>Codigo de Autorización: </label>
                </div>
                <div class="col-md-6">
                  <input type="text" class="form-control" placeholder="Ingrese el codigo de autorizacion" id="txtCodA">
                </div>
              </div>
              
            </div>
            <p></p>
            <div class="row">
              <div class="col-md-4 col-md-offset-4">
                <button type="button" class="btn btn-primary" id="btnAnular">Anular Compra</button>
              </div>
            </div>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-danger" data-dismiss="modal">Cerrar</button>
          </div>
        </div><!-- /.modal-content -->
      </div><!-- /.modal-dialog -->
  </div>
<div id="modalreciboAnu" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-body">
          <div  id="reciboAnu" style="font-family:'Lucida Console', Monaco, monospace;font-size:13px;">
            <h5 align="center"><b>ANULACION COMPRA DE DOLAR</b></h5>
            <table>
              <tr nowrap>=====================================</tr>
            </table>
            <table>
              <tr>
                <td style="width:100px;">{{ SITE_URL }}</td>
              </tr>
            </table>
            <table>
              <tr id="fila_fecha">
                <td nowrap> <h5 id="AfechaRecibo"></h5></td>
                <td style="padding-top:10px;"><div style="width:30px;height:20px;"> </div></td>
                <td nowrap><h5 id="AhoraRecibo"></h5></td>
              </tr>
            </table>
            <table>
              <tr >
                <td  valign="top" style="padding-top:10px;"><b>Cliente:</b></td>
                <td style="padding-top:10px;"><div style="width:20px;"> </div></td>
                <td id="Acliente" style="padding-top:10px;"></td>
              </tr>
              <tr>
                <td  valign="top" style="padding-top:10px;"><b>DNI/RUC:</b></td> 
                <td style="padding-top:10px;"><div style="width:20px;height:15px;"> </div></td>
                <td id="Adniruc" style="padding-top:10px;"></td>
              </tr>
            </table>
            <br>
            <!--<p id="pldet"></p>-->
            
            <b>DETALLE DE ANULACION:</b>
            <table>
              <tr>
                <td>Tipo de Cambio:</td>
                <td ><div style="width:40px;"> </div></td>
                <td id="Atipo_cambio" style="text-align:right;"></td>
              </tr>
              <tr>
                <td>Monto Dolar</td>
                <td ><div style="width:40px;"> </div></td>
                <td id="Amonto_dolar" style="text-align:right;"></td>
              </tr>
              <tr>
                <td><b>Monto Soles:</b></td>
                <td ><div style="width:40px;"> </div></td>
                <td id="Amonto_soles" style="text-align:right;"></td>
              </tr>
            </table> 
            <br>
            
            <table>
              <tr>
                <td><div style="height:30px;"> </div></td>
              </tr>
              <tr>
                <td>____________________</td>
              </tr>
              <tr>
                <td nowrap><h5><b>OP. </b>{{ nombre_usuario }}</h5></td>
              </tr>
              <tr>
                <td><div style="height:35px;"> </div></td>
              </tr>
              <tr>
                <td>____________________</td>
              </tr>
              <tr>
                <td nowrap><b><span id="Acliente_"></span></b></td>
              </tr>
              
            </table>
          </div>
        </div>
        <div class="modal-footer">
        </div>

      </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!-- anulacion-->
<script type="text/javascript">
  var Aux="";
  var filaI =0;
  var pagina=1;
  var aux_tipoCambio="";
  var tc_=0;
  var data_soli = {}
  $(document).ready(function () {
    var usuario='{{user.username}}'
    {% ifnotequal resultado '' %}
    {% ifequal resultado 'exito' %}
      var fechaRecibo= '{{fechaRecibo}}'
      var horaRecibo='{{horaRecibo}}'
      var montoDolares='{{monto_dolar}}'
      var montoSoles='{{monto_soles}}'
      var Cliente='{{r_cliente}}'
      var DR='{{r_dniruc}}'
      var tipoCambio='{{tipo_cambio}}'
      $("#monto_soles").text("S/. "+montoSoles);
      $("#monto_dolar").text("$ "+montoDolares);
      $("#tipo_cambio").text("S/. "+tipoCambio);
      $("#cliente_").text(Cliente);
      $("#cliente").text(Cliente);
      $("#horaRecibo").text("Hora: "+horaRecibo);
      $("#fechaRecibo").text("Fecha: "+fechaRecibo);
      $("#dniruc").text(DR);
      $("#usuario").text(usuario);
      $("#platillaI").printThis();                    
    {% endifequal %}
    {% endifnotequal %}
    $('input').on('keypress', function(e){
      if(e.keyCode == 13){
          var inputs = $(this).parents("form").eq(0).find(":input.form-control");
          var idx = inputs.index($(this));
          if (idx == inputs.length - 1) {
              inputs[0].select()
          } 
          else {
            inputs[idx + 1].focus(); //  handles submit buttons
            //inputs[idx + 1].select();
          }
        return false;
      }
    });
    $(".mayuscula").keyup(function(){
      var valor= $(this).val().toUpperCase();
      $(this).prop('value',valor);
    });
    $('#txtDNI').numeric();
    $('#txt_tpc').numeric(".");
    $('#txtsoles').numeric(".");
    $('#txtdolar').numeric(".");
    $("#rbNatural").prop('checked',true);
    $("#btn_guardar").click(function(){
      $(this).prop('disabled',true);
      $("#formulario").submit();
    });
    $("#txtdolar").keyup(function(){
      if($("#txt_tpc").val()==null || $("#txt_tpc").val().toString().trim()==''){
        $("#txtsoles").prop('value',0);
      }
      else{
        var ms= parseFloat($("#txt_tpc").val())* parseFloat($("#txtdolar").val());
        $("#txtsoles").prop('value',ms);
      }
    });
    $("#txt_tpc").keyup(function(){
      if($("#txtdolar").val()==null || $("#txtdolar").val().toString().trim()==''){
        $("#txtsoles").prop('value',0);
      }
      else{
        var ms= parseFloat($("#txt_tpc").val())* parseFloat($("#txtdolar").val());
        $("#txtsoles").prop('value',ms);
      }
    });
    $("#campocheck").click(function(){
      if($('#rbNatural').is(':checked')){
        $(".nat").show();
        $("#lbnombre").text("Nombres:");
        $("#lbdni").text("DNI:");
      }
      else{
        $(".nat").hide();
        $("#lbnombre").text("Razon Social:");
        $("#lbdni").text("RUC:");
      }
    });
    $("#modal_formulario").prop("class","modal-dialog");
    $("#panel-cliente").hide();
    $("#panel-compra").prop("class","col-md-10 col-md-offset-1");
    $("#chek_datos").click(function(){
      if($("#chkCliente").prop( "checked" )){
        $("#modal_formulario").prop("class","modal-dialog modal-lg");
        $("#panel-cliente").show();
        $("#panel-compra").prop("class","col-md-6");
      }
      else{
        $("#modal_formulario").prop("class","modal-dialog");
        $("#panel-cliente").hide();
        $("#panel-compra").prop("class","col-md-10 col-md-offset-1");
      }
    });

    
    $(document).on("click",".filaC",function(){
      var num = $(this).attr('id');
      filaI = num;
      //var fila= $(this).attr('class');
      //$("."+fila).attr('class','filaC');
      //$("#"+num).attr('class','filaC info');
      //-------------------------
      $("#txtCodA").prop('value',null);
      $("#txtPK").prop('value',null);
      $("#txtPK").prop('value',Aux[filaI].pk);
      $("#btnAnular").show();
      $("#anular").show();
      $("#ReimprmirAnu").hide();
      if (Aux[filaI].estado =="anulado"){
        $("#btnAnular").hide();
        $("#anular").hide();
        $("#ReimprmirAnu").show();
      }
      $("#Amonto_soles").text("S/. "+Aux[filaI].monto_soles);
      $("#Amonto_dolar").text("$ "+Aux[filaI].monto_dolar);
      $("#Atipo_cambio").text("S/. "+Aux[filaI].tipo_cambio);
      $("#Acliente_").text(Aux[filaI].cliente);
      $("#Acliente").text(Aux[filaI].cliente);
      $("#AhoraRecibo").text("_");
      $("#AfechaRecibo").text(Aux[filaI].fecha);
      $("#Adniruc").text(Aux[filaI].dniruc);
      //----------------------------------
      $("#fecha_m").text(Aux[filaI].fecha);
      $("#cliente_m").text(Aux[filaI].cliente)
      $("#dniruc_m").text(Aux[filaI].dniruc);
      $("#tipoCambio_m").text(Aux[filaI].tipo_cambio);
      $("#montoDolar_m").text(Aux[filaI].monto_dolar);
      $("#montoSoles_m").text(Aux[filaI].monto_soles);
      $("#obs_m").text(Aux[filaI].obs);
      $("#monto_soles").text("S/. "+Aux[filaI].monto_soles);
      $("#monto_dolar").text("$ "+Aux[filaI].monto_dolar);
      $("#tipo_cambio").text("S/. "+Aux[filaI].tipo_cambio);
      $("#cliente_").text(Aux[filaI].cliente);
      $("#cliente").text(Aux[filaI].cliente);
      $("#fechaRecibo").text(Aux[filaI].fecha);
      $("#horaRecibo").text("__");
      $("#dniruc").text(Aux[filaI].dniruc);
      $("#usuario").text(usuario);
    });
    $("#btnRefrescar").click(function(){
      ajax_Compras();
    });
    $("#reimprimir").click(function(){
      $("#titulo_recibo").text("COMPRA DE DOLAR (reimpresion)")
      $("#platillaI").printThis(); 
    })
   
    ajax_Compras();
    function ajax_Compras(){
      $('.table-responsive').waitMe({effect : 'progressBar',text : 'Recuperando Datos'});
      $.ajax({
        url:'/listaComprasDolar_ajax/',
        data:{'pg':pagina},
        type:'GET',
        dataType:'json',
        success: function(data){
          Aux = data;
          var html ="";
          var est='';
          for(var i=0;i<data.length;i++){
              est='';
              if(data[i].estado=="anulado"){
                est="danger"
              }
              html += '<tr data-toggle="modal" data-target="#myModal" class="filaC '+est+'" id="'+i+'"><td>'+data[i].fecha+'</td><td>'+data[i].cliente+'</td><td>'+data[i].tipo_cambio+'</td><td>'+data[i].monto_dolar +'</td><td>'+data[i].monto_soles+'</td><td>'+data[i].obs+'</td></tr>';
          }
          $('#listaC').html(html);
          $('.table-responsive').waitMe('hide');
        }
      });
    }
    // web services
    /*
    ajax_web_services();
    function ajax_web_services(){
      $("#alerta-sunat").html('');
      $("#alerta-sunat").html('<div class="alert alert-warning" role="alert" align="center" ><h4>....Cargando precio Dolar....</h4></div>');
      $.ajax({
        url:'/tipo_cambio_ajax/',
        type:'GET',
        dataType:'text',
        success: function(data){
          aux_tipoCambio = JSON.parse(data);
          //console.log(aux_tipoCambio);
          if(aux_tipoCambio != null){
            var html5 ="";
            for(var i=0;i<aux_tipoCambio.data.length;i++){
                html5 += '<tr><td>'+aux_tipoCambio.data[i].fecha+'</td><td>'+aux_tipoCambio.data[i].compra+'</td><td>'+aux_tipoCambio.data[i].venta+'</td></tr>';
            }
            $('#listaT').html(html5);
            $("#alerta-sunat").html('');
            $('#alerta-sunat').html('<div class="table-responsive"><table class="table"><tr><td class="info" align="center"><h4>'+aux_tipoCambio.data[aux_tipoCambio.data.length-1].fecha+'</h4></td><td class="success" align="right"><h4>Compra:</h4></td><td class="success"><h4><b>'+aux_tipoCambio.data[aux_tipoCambio.data.length-1].compra+'s/.</b></h4></td><td class="danger" align="right"><h4>Venta:</h4></td><td class="danger"><h4><b>'+aux_tipoCambio.data[aux_tipoCambio.data.length-1].venta+'s/.</b></h4></td></tr></table></div>');
          }
          else{
            $("#alerta-sunat").html('');
            $("#alerta-sunat").html('<h4>ERROR</h4>');
          }
        }
      });
    }
    */
    //
    ajax_tc();
    function ajax_tc(){
      $.ajax({
        data:{'tipo':'debe'},
        url:'/ultimo_tc_dolar_caja_ajax/',
        //async:false,
        type:'GET',
        dataType:'json',
        success: function(data){
          console.log(data);
          tc_ =parseFloat(data);
          console.log(tc_);
        },
        error: function(xhr, textStatus, errorThrown) {
              console.log(xhr.responseText);
          },
      });
    };
    $("#txt_tpc").change(function(){
      if(tc_>0){
        if(parseFloat($(this).val()) >(tc_+1)||parseFloat($(this).val()) <(tc_-1) ){
          $("#fila_tc").addClass('alert-danger');
          $(this).prop('value',null);
          $("#txtsoles").prop('value',null);
        }
        else{
          $("#fila_tc").removeClass('alert-danger');
        }
        $("#formulario").validator('validate');
      }
    })
    //------------------------------------------------
    //-----------------
    /*
    $("#solCod").click(function(){
      ajax_solicitudAut();
    });
    
    function ajax_solicitudAut(){
      $.ajax({
        data:{'pk':$("#txtPK").val(),"tabla":"compra"},
        url:'/solicitud_Autorizacion_anulacion_ajax/',
        //async:false,
        type:'GET',
        dataType:'text',
        success: function(data){
          if(data=='exito'){
            bootbox.alert({
              message: "Operación exitosa. Se solicito el codigo de autorización",
              className: 'bb-alternate-modal'
            });
           }
           else{
            bootbox.alert({ 
              message: "Error. "+data,
              className: 'bb-alternate-modal'
            });
          }
        }
      });
    };
    */
    //
    $("#btnAnular").click(function(){
      //ajax_anular();
    });
    //
    $("#ReimprmirAnu").click(function(){
      $("#reciboAnu").printThis() ;
    })
    //
    function ajax_anular(){
      $.ajax({
        data:{'pk':$("#txtPK").val(),"codigo":$("#txtCodA").val()},
        url:'/Anular_compra_dolar_ajax/',
        //async:false,
        type:'GET',
        dataType:'json',
        success: function(data){
          if(data.exito=='exito'){
            bootbox.alert({
              message: "Operación exitosa. Se anulo",
              className: 'bb-alternate-modal'
            });
            $("#reciboAnu").printThis();
            ajax_Compras();
           }
           else{
            bootbox.alert({ 
              message: "Error. "+data.exito,
              className: 'bb-alternate-modal'
            });
          }
        }
      });
    };
    //otra funcion
     $(document).on('show.bs.modal', '.modal', function () {
          var zIndex = 1040 + (10 * $('.modal:visible').length);
          $(this).css('z-index', zIndex);
          setTimeout(function() {
              $('.modal-backdrop').not('.modal-stack').css('z-index', zIndex - 1).addClass('modal-stack');
          }, 0);
      });
    $(document).on('hidden.bs.modal', '.modal', function () {
        $('.modal:visible').length && $(document.body).addClass('modal-open');
    });

    //--------------------------------------------------
    //
    function datos_solicitante(){
      return $("#txtDNI").val()+' '+$("#txtNombre").val()+' '+$("#txtAP").val()+' '+$("#txtAM").val()
    }
    function limpiar_solicitante(){
      $("#IdCliente").prop('value',null);
      $("#txtDNI").prop('value',null);
      $("#txtNombre").prop('value',null);
      $("#txtAP").prop('value',null);
      $("#txtAM").prop('value',null);
    }
    
    $("#txtDNI").change(function() {
      var current = $("#txtDNI").typeahead("getActive");
      if (current) {
        // Some item from your model is active!
        if (current.name == datos_solicitante() || current.name == $("#txtDNI").val()) {
          data_soli= current;
          $("#IdCliente").prop('value',data_soli.id);
          $("#txtDNI").prop('value',data_soli.dni);
          $("#txtNombre").prop('value',data_soli.nombre);
          $("#txtAP").prop('value',data_soli.ap);
          $("#txtAM").prop('value',data_soli.am);
          $("#panel_solicitante").prop("class","panel panel-success")
          $("#cabecera_soli").text("")
        } 
        else {
          $("#IdCliente").prop('value',null);
          $("#panel_solicitante").prop("class","panel panel-warning")
          $("#cabecera_soli").text("(Nuevo Cliente)")

        }
      } else {
         $("#IdCliente").prop('value',null);
         $("#panel_solicitante").prop("class","panel panel-warning")
         $("#cabecera_soli").text("(Nuevo Cliente)")

      }

      
    }); 

    var autoSolicitante_dni= $('#txtDNI').typeahead({
      source:  function (query, process) {
        return $.get('/listaCliente_autocompletado_dni_ajax/', { query: query }, function (data) {
              return process(data);
          },'json');
      }
    });
    //*** nombre
    $("#txtNombre").change(function() {
      var current = $("#txtNombre").typeahead("getActive");
      if (current) {
        // Some item from your model is active!
        if (current.name == datos_solicitante() || current.name == $("#txtNombre").val()) {
          data_soli= current;
          $("#IdCliente").prop('value',data_soli.id);
          $("#txtDNI").prop('value',data_soli.dni);
          $("#txtNombre").prop('value',data_soli.nombre);
          $("#txtAP").prop('value',data_soli.ap);
          $("#txtAM").prop('value',data_soli.am);
          $("#panel_solicitante").prop("class","panel panel-success")
          $("#cabecera_soli").text("")

        } 
        else {
          $("#IdCliente").prop('value',null);
          $("#panel_solicitante").prop("class","panel panel-warning")
          $("#cabecera_soli").text("(Nuevo Cliente)")
        }
      } else {
         $("#IdCliente").prop('value',null);
         $("#panel_solicitante").prop("class","panel panel-warning")
         $("#cabecera_soli").text("(Nuevo Cliente)")
      }

      
    }); 

    var autoSolicitante_nombre= $('#txtNombre').typeahead({
      source:  function (query, process) {
        return $.get('/listaCliente_autocompletado_nombre_ajax/', { query: query,'ap':$("#txtAP").val(),'am':$("#txtAM").val()}, function (data) {
              return process(data);
          },'json');
      }
    });
    // paterno
    $("#txtAP").change(function() {
      var current = $("#txtAP").typeahead("getActive");
      if (current) {
        // Some item from your model is active!
        if (current.name == datos_solicitante() || current.name == $("#txtAP").val()) {
          data_soli= current;
          $("#IdCliente").prop('value',data_soli.id);
          $("#txtDNI").prop('value',data_soli.dni);
          $("#txtNombre").prop('value',data_soli.nombre);
          $("#txtAP").prop('value',data_soli.ap);
          $("#txtAM").prop('value',data_soli.am);
           $("#panel_solicitante").prop("class","panel panel-success")
          $("#cabecera_soli").text("")
        } 
        else {
          $("#IdCliente").prop('value',null);
          $("#panel_solicitante").prop("class","panel panel-warning")
          $("#cabecera_soli").text("(Nuevo Cliente)")
        }
      } else {
         $("#IdCliente").prop('value',null);
         $("#panel_solicitante").prop("class","panel panel-warning")
         $("#cabecera_soli").text("(Nuevo Cliente)")
      }

      
    }); 

    var autoSolicitante_ap= $('#txtAP').typeahead({
      source:  function (query, process) {
        return $.get('/listaCliente_autocompletado_paterno_ajax/', { query: query,'no':$("#txtNombre").val(),'am':$("#txtAM").val()}, function (data) {
              return process(data);
          },'json');
      }
    });
    // materno
    $("#txtAM").change(function() {
      var current = $("#txtAM").typeahead("getActive");
      if (current) {
        // Some item from your model is active!
        if (current.name == datos_solicitante() || current.name == $("#txtAM").val()) {
          data_soli= current;
          $("#IdCliente").prop('value',data_soli.id);
          $("#txtDNI").prop('value',data_soli.dni);
          $("#txtNombre").prop('value',data_soli.nombre);
          $("#txtAP").prop('value',data_soli.ap);
          $("#txtAM").prop('value',data_soli.am);
          $("#panel_solicitante").prop("class","panel panel-success")
          $("#cabecera_soli").text("")

        } 
        else {
          $("#IdCliente").prop('value',null);
          $("#panel_solicitante").prop("class","panel panel-warning")
          $("#cabecera_soli").text("(Nuevo Cliente)")
        }
      } else {

         $("#IdCliente").prop('value',null);
         $("#panel_solicitante").prop("class","panel panel-warning")
         $("#cabecera_soli").text("(Nuevo Cliente)")

      }

      
    }); 

    var autoSolicitante_ami= $('#txtAM').typeahead({
      source:  function (query, process) {
        return $.get('/listaCliente_autocompletado_materno_ajax/', { query: query,'ap':$("#txtAP").val(),'no':$("#txtNombre").val()}, function (data) {
              return process(data);
          },'json');
      }
    });
    $("#btn_limpiar_soli").click(function(e){
      e.preventDefault();
      limpiar_solicitante();
    })
    //******************
  });
</script>
{% endblock content1 %}