{% extends "base.html" %}
{% load static %}
{% block titulo %}
  Listado de Cierres Dolares
{% endblock titulo %}
{% block content1 %}
<script type="text/javascript">
  $("#navCajaDolar").attr('class','dropdown active');
  $("#cieres_dolar").attr('class','active');
</script>
<div class="row">
  <div class="col-md-12 col-sm-12" >
      <div class="panel panel-default">
        <div class="panel-heading panel-dolar"> <strong>LISTADO DE CIERRES - CAJA DOLAR</strong></div>
        <div class="panel-body">
          <div class="row">
            <div class="col-md-2">
              <button type="button" class="btn btn-warning btn-sm" id="btnRefrescar"><span class="fa fa-refresh"></span> <b>Actualizar</b></button>
            </div>
          </div>
          <p></p>
          <div class="row">
              <div class="col-md-12">
                  <div class="table-responsive">
                    <table class="table table-bordered">
                        <thead>
                          <tr>
                            <th>Fecha de Cierre</th>
                            <th class="info">Saldo Inicial Soles</th>
                            <th class="info">Ingreso Soles</th>
                            <th class="info">Egreso Soles</th>
                            <th class="info">Saldo Soles</th>
                            <th class="success">Saldo Inicial $</th>
                            <th class="success">Ingreso $</th>
                            <th class="success">Egreso $</th>
                            <th class="success">Saldo $</th>
                            <th>Observaciones</th>
                            <th>Momento del cierre</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 modal-lg">
      <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>
          <h5 class="modal-title" id="myModalLabel">Detalles de Cliente</h5>
        </div>
        <div class="modal-body">
          <form action="/reimprimir_cierre_dolares/" method="POST">{% csrf_token %}
          <div class="row">
              <div class="col-md-12" >
                  <div class="panel panel-default">
                      <div class="panel-heading panel-dolar">DETALLE DE CIERRE</div>
                      <div class="panel-body">
                        <div class="row">
                          <div class="col-md-10 col-md-offset-1">
                            <div class="table-responsive">
                              <table class="table">
                                <thead>
                                  <tr>
                                    <th>&nbsp;</th>
                                    <th>Soles</th>
                                    <th>Dolares</th>
                                  </tr>
                                </thead>
                                <tbody>
                                  <tr>
                                    <th>Saldo Inicial</th>
                                    <td ><input type="text" id="SIS" name="SIS" class="form-control" readonly="readonly" style="border: 0px solid #6275B7;"></td>
                                    <td ><input type="text" id="SID" name="SID" class="form-control" readonly="readonly" style="border: 0px solid #6275B7;"></td>
                                  </tr>
                                  <tr>
                                    <th>Total Ingreso</th>
                                    <td ><input type="text" id="IS" name="IS" class="form-control" readonly="readonly" style="border: 0px solid #6275B7;"></td>
                                    <td ><input type="text" id="ID" name="ID" class="form-control" readonly="readonly" style="border: 0px solid #6275B7;"></td>
                                  </tr>
                                  <tr>
                                    <th>Total Egreso</th>
                                    <td ><input type="text" id="ES" name="ES" class="form-control" readonly="readonly" style="border: 0px solid #6275B7;"></td>
                                    <td ><input type="text" id="ED" name="ED" class="form-control" readonly="readonly" style="border: 0px solid #6275B7;"></td>
                                  </tr>
                                  <tr>
                                    <th>Saldo</th>
                                    <th ><input type="text" id="SS" name="SS" class="form-control" readonly="readonly" style="border: 0px solid #6275B7;"></th>
                                    <th ><input type="text" id="SD" name="SD" class="form-control" readonly="readonly" style="border: 0px solid #6275B7;"></th>
                                  </tr>
                                  <!--
                                  <tr class="warning">
                                    <th>Saldo Sistema</th>
                                    <th ><input type="text" id="SisS" name="SisS" class="form-control" readonly="readonly" style="border: 0px solid #6275B7;"></th>
                                    <th ><input type="text" id="SisD" name="SisD" class="form-control" readonly="readonly" style="border: 0px solid #6275B7;"></th>
                                  </tr>
                                  -->
                                </tbody>
                              </table>
                            </div>
                            
                          </div>
                        </div>
                        <p></p>
                        <div class="row">
                          <div class="col-md-1 col-md-offset-1">
                            <h5>Desde</h5>
                          </div>
                          <div class="col-md-3">
                             <input type="text" class="form-control date" id="txtfecha11" name="F1" readonly="readonly" style="border: 0px solid #6275B7;">
                          </div>
                           <div class="col-md-1">
                            <h5>Hasta</h5>
                          </div>
                          <div class="col-md-3">
                            <input type="text" class="form-control date" id="txtfecha21" name="F2" readonly="readonly" style="border: 0px solid #6275B7;">
                          </div>
                        </div>
                        <p></p>
                        <div class="row">
                          <div class="col-md-2 col-md-offset-1">
                            <h5>Observaciones</h5>
                          </div>
                          <div class="col-md-4">
                             <input type="text" class="form-control date" id="txtobs" name="obs" readonly="readonly" style="border: 0px solid #6275B7;">
                          </div>
                        </div>
                        <p></p>
                        <div class="row" id="campoDetalle_recibidos">
                          <div class="col-md-4 col-md-offset-4">
                            <button class="btn btn-warning btn-block" type="submit">Reimprimir Detalles de Cierre</button>
                        </div>
                        <p></p>
                      </div>
                  </div>
              </div>
          </div>
          </form>
        </div>
        
      
        <div class="modal-footer">
          <button type="button" data-dismiss="modal" class=" btn btn-danger">Cerrar</button>
        </div>
      </div>
    </div>
</div>
<script type="text/javascript">
  var Aux="";
  var filaI =0;
  $(document).ready(function () {
    ajax_Cierres();
    $("#btnRefrescar").click(function(){
      ajax_Cierres();
    });
    //
    /*
    $("#Impr").click(function(){
      $("#impresion").printThis();
    })*/
    //
    $(document).on("click",".filaC",function(){
      var fila= $(this).attr('class');
      var num = $(this).attr('id');
      filaI = num;
      //$("."+fila).attr('class','filaC');
      //$(this).attr('class','filaC info');
      $("#campoDetalle_recibidos").show();
      $("#txtfecha11").prop('value',Aux[filaI].fd);
      $("#txtfecha21").prop('value',Aux[filaI].fh);
      $("#SIS").prop('value',Aux[filaI].sis);
      $("#SID").prop('value',Aux[filaI].sid);
      $("#ID").prop('value',Aux[filaI].ide);
      $("#IS").prop('value',Aux[filaI].is);
      $("#ES").prop('value',Aux[filaI].es);
      $("#ED").prop('value',Aux[filaI].ed);
      $("#SS").prop('value',Aux[filaI].ss);
      $("#SD").prop('value',Aux[filaI].sd);
      $("#SisS").prop('value',Aux[filaI].sisS);
      $("#SisD").prop('value',Aux[filaI].sisD);
      $("#txtobs").prop('value',Aux[filaI].obs);
      // $('#listaI').html("");
      // $('#listaE').html("");
      if(Aux[filaI].est=='cancelado'){
        $("#campoDetalle_recibidos").hide();
      }
    });
    //
    /*
    $("#mostrarD").click(function(){
      ajax_EgresoB();
      ajax_IngresoB();
    })*/
    //
    function ajax_Cierres(){
      $('.table-responsive').waitMe({effect : 'progressBar',text : 'Recuperando Datos'});
      $.ajax({
        url:'/listaCierresDolares_ajax/',
        type:'GET',
        dataType:'json',
        success: function(data){
          var html ="";
          Aux = data;
          var estado ="";
          for(var i=0;i<data.length;i++){
            estado ="";
            if(data[i].est=="cancelado"){
                  estado="danger";
                  
            }
            if(data[i].est =="cerrado"){
                  estado = "success";
                  
            }
              html += '<tr class="filaC '+ estado+'" id="'+i+'" data-toggle="modal" data-target="#myModal"><td>'+data[i].fd+'</td><td style="color:green;">'+data[i].sis+'</td><td style="color:green;">'+data[i].is +'</td><td style="color:red;">'+data[i].es+'</td><td style="color:blue;">'+data[i].ss+'</td><td style="color:green;">'+data[i].sid+'</td><td style="color:green;">'+data[i].ide+'</td><td style="color:red;">'+data[i].ed+'</td><td style="color:blue;">'+data[i].sd+'</td><td>'+data[i].obs+'</td><td>'+data[i].fecha+'</td></tr>';
          }                        
          $('#listaC').html(html);
          $('.table-responsive').waitMe('hide');
        }
      });
    }
    //
    
    //
  });
</script>
{% endblock content1 %}