{% extends "base.html" %}
{% load static %}
{% block titulo %}
  .::Cierres Cajas Globales
{% endblock titulo %}
{% block content1 %}
      <script type="text/javascript">
        $("#navIE").attr('class','dropdown active');
        $("#navGlolCierre").attr('class','active');
      </script>
        <!--<div class="row"><br><br><br><br></div>-->
        <div class="row">
          <div class="col-md-12 col-sm-12" >
              <div class="card">
                <div class="card-head card-head-xs style-default"> <strong>CIERRE DE CAJAS GLOBALES</strong></div>
                <div class="card-body">
                  <div class="row" >
                    <h4 class="bg-success" align="center" id="ExitoCambiar">
                    </h4>
                  </div>
                  <div class="row">
                    <div class="col-md-2">
                      <button type="button" class="btn btn-warning btn-block" id="btnNuevoCi" data-toggle="modal" data-target="#ModalCerrarG">Nuevo Cierre</button>
                    </div>
                    <div class="col-md-2 col-md-offset-1">
                      <button type="button" class="btn btn-primary btn-block" id="btnRefrescar"><span class="fa fa-refresh"></span> Actualizar</button>
                    </div>
                  </div>
                  <div class="row">
                    <div class="col-md-12">
                      <p class="bg-success">
                        &nbsp;
                      </p>
                        <div class="table-responsive">
                          <table class="table table-bordered table-hover">
                              <thead>
                                <tr>
                                  <th>Nro</th>
                                  <th>Fecha de Cierre</th>
                                  <th>Oficina</th>
                                  <th>Caja</th>
                                  <th>Ingreso Soles</th>
                                  <th>Ingreso Dolares</th>
                                  <th>Egreso Soles</th>
                                  <th>Egreso Dolares</th>
                                  <th>Saldo Soles</th>
                                  <th>Saldo Dolares</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="ModalCerrarG" 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">CIERRE DE CAJAS GLOBALES</h4>
        </div>
        <div class="modal-body">
          <p>
            <div class="col-md-12 col-sm-12" >
                <div class="panel panel-info">
                  <div class="panel-heading" align="center"> <h4>Cierre de Caja</h4></div>
                  <form action="/cierreCajaGlobal_tem/" method="POST">{% csrf_token %}
                    <div class="panel-body">
                      <div class="row">
                        <div class="col-md-12">
                          <h4 class="bg-success" align="center">
                            &nbsp;
                          </h4>
                        </div>
                      </div>
                      <p></p>
                      <div class="row">
                        <div class="col-md-2 " align="right">
                          <h4><b style="font-size: 15px;">Oficina </b></h4>
                        </div>
                        <div class="col-md-8">
                           <div class="fg-line">
                              <div class="select">
                                <select class="form-control" name="OficinaOri" id="ComboOficina1" required>
                                      
                                </select> 
                              </div>
                            </div>
                          </div>
                      </div>
                      <div class="row" id="campoCajaGlo"  hidden >
                            <div class="col-md-2"  align="right">
                              <h4><b style="font-size: 15px;">Caja </b></h4> 
                            </div>
                            <div class="col-md-8">
                             <div class="fg-line">
                                <div class="select">
                                  <select class="form-control" name="CajaOri" id="ComboCajaOrg">
                                    <option value="0"></option>     
                                  </select> 
                                </div>
                              </div>
                            </div>
                          </div>
                      <p></p>
                      <div class="row">
                          <div class="col-md-6 col-md-offset-3">
                            <button class="btn btn-danger btn-block" type="submit">Cerrar Caja Global</button>
                          </div>
                      </div>
                    </div>
                  </form>
                </div>
            </div>
          </p>
        </div>

        <div class="modal-footer">
          <hr>
          <button type="button" class="btn btn-danger" data-dismiss="modal">Cerrar</button>

        </div>
      </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</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="/ver_cierre_global_caja/" method="POST">{% csrf_token %}
          <div class="row">
              <div class="col-md-12" >
                  <div class="panel panel-danger">
                      <div class="panel-body">
                      	<div class="row">
                      		<div class="col-md-1 col-md-offset-1">
                      			<label> Base: </label>
                      		</div>
                      		<div class="col-md-3">
                      			<label id="nombreBase"></label>
                      		</div>
                      		<div class="col-md-2">
                      			<input type="text" id="idCajaglo" name="pkC" class="form-control" readonly="readonly" style="border: 0px solid #6275B7;">
                      		</div>
                      		<div class="col-md-1">
                      			<label>Cierre:</label>
                      		</div>
                      		<div class="col-md-1">
                      			<input type="text" id="idcierreglo" name="pkCierre" class="form-control" readonly="readonly" style="border: 0px solid #6275B7;">
                      		</div>
                      	</div>
                      	<p></p>
                        <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>
                                </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>
                        </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);
      $("#txtobs").prop('value',Aux[filaI].obs);
      $("#idCajaglo").prop('value',Aux[filaI].pkCa);
      $("#idcierreglo").prop('value',Aux[filaI].pk);
      $("#nombreBase").html('<span  style="color:blue;">'+Aux[filaI].ofi +'</span> /'+Aux[filaI].caja);
      // $('#listaI').html("");
      // $('#listaE').html("");
      if(Aux[filaI].est=='cancelado'){
        $("#campoDetalle_recibidos").hide();
      }
    });
    //
    /*
    $("#mostrarD").click(function(){
      ajax_EgresoB();
      ajax_IngresoB();
    })*/
    //
    function ajax_Cierres(){
      $.ajax({
        url:'/listaCierresGlobalPersonal_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"><th scope="row">'+(i+1)+'</td><td>'+data[i].fd+'</td><td>'+data[i].ofi+'</td><td>'+data[i].caja+'</td><td>'+data[i].is+'</td><td>'+data[i].ide +'</td><td>'+data[i].es+'</td><td>'+data[i].ed+'</td><td>'+data[i].ss+'</td><td>'+data[i].sd+'</td><td>'+data[i].obs+'</td><td>'+data[i].fecha+'</td></tr>';
          }                        
          $('#listaC').html(html);
        }
      });
    };
    //---------------------- cierre global ----------------------
    ajax_oficina_ori();
    function ajax_oficina_ori(){
      $.ajax({
        url:'/oficinas_tg_cierre_ajax/',
        type:'GET',
        dataType:'json',
        success: function(data){
        var html ="";
          $("#ComboOficina1").html('');
          for(var i=0;i<data.length;i++){
              html += '<option value="'+data[i].pk+'">'+data[i].nombre_oficina+'</option>';
          }
          $('#ComboOficina1').html(html);
           ajax_cajaOrg($('#ComboOficina1').val());
        }
      });
    };
     //
      $('#ComboOficina1').change(function(){
        $("#campoCajaGlo").hide();
        ajax_cajaOrg($(this).val());
      });
      //
      function ajax_cajaOrg(pko){
         $.ajax({
          data:{'idO':pko},
          url:'/cajas_tg_ori_ajax/',
          type:'GET',
          dataType:'json',
          success: function(data){
            var html ="";
            $("#ComboCajaOrg").html('');
            $("#campoCajaGlo").show();
            for(var i=0;i<data.length;i++){
                html += '<option value="'+data[i].pk+'">'+data[i].nombre+'</option>';
            }
            $('#ComboCajaOrg').html(html);
          }
        });
      }
      //
    //
    /*
    function ajax_IngresoB(){
      $.ajax({
        data:{'filtro':'ef','F1':$('#txtfecha11').val(),'F2':$('#txtfecha21').val()},
        url:'/consultaIngreso_cierre/',
        type:'GET',
        dataType:'json',
        success: function(data){
          var html ="";
          for(var i=0;i<data.length-1;i++){
              html += '<tr id="'+i+'"><td>'+data[i].fecha+'</td><td>'+data[i].tipodoc+'</td><td>'+data[i].nroR+'</td><td>'+data[i].concepto+'</td><td>'+data[i].moneda +'</td><td>'+data[i].monto+'</td></tr>';
          }                        
          $('#listaI').html(html);
        }
      });
    }
    //
    function ajax_EgresoB(){
      $.ajax({
        data:{'filtro':'ef','F1':$('#txtfecha11').val(),'F2':$('#txtfecha21').val()},
        url:'/consultaEgreso_cierre/',
        type:'GET',
        dataType:'json',
        success: function(data){
          var html ="";
          for(var i=0;i<data.length-1;i++){
              html += '<tr id="'+i+'"><td>'+data[i].fecha+'</td><td>'+data[i].tipodoc+'</td><td>'+data[i].nroR+'</td><td>'+data[i].concepto+'</td><td>'+data[i].moneda +'</td><td>'+data[i].monto+'</td></tr>';
          }                        
          $('#listaE').html(html);
        }
      });
    }*/
    //
  });
</script>
{% endblock content1 %}