{% extends "base.html" %}
{% load static %}
{% block titulo %}
  .::Recepción de Habilitación (Caja Material)
{% endblock titulo %}
{% block content1 %} 
<script type="text/javascript">
  $("#navCajaMaterial_dinero").attr('class','dropdown active');
  //$("#navRecepcionDineroM").attr('class','dropdown dropdown-submenu active');
  $("#navRecibirDineroM").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-material"> <strong>RECEPCIÓN DE DINERO (CAJA MATERIAL)</strong></div>
        <div class="panel-body">
           <div class="row" >
            <h4 class="bg-success" align="center" id="ExitoMensaje">
            </h4> 
          </div>
          <div class="row">
              <div class="col-md-2">
                <button type="button" class="btn btn-info btn-sm" id="btnRefrescar"><span class="fa fa-refresh"></span> Actualizar</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>Nro</th>
                            <th>Fecha</th>
                            <th>Origen</th>
                            <!--<th>Concepto</th>-->
                            <th>Monto</th>
                            <th>Egreso</th>
                            <th>Moneda</th>
                            <th>Observaciones</th>
                          </tr>
                        </thead>
                        <tbody id="listaC">
                            
                        </tbody>
                    </table>
                  </div>
              </div>
          </div>
          <br>
          <br>
        </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">Detalles</h4>
        </div>
        <div class="modal-body">
          <p>
            <div class="col-md-12 col-sm-12" >
                <div class="panel panel-success">
                  <div class="panel-heading" align="center"> <strong>Detalle de Saldo Recibido</strong></div>
                  <div class="panel-body">
                    <div class="row">
                        <div class="col-md-3 col-md-offset-1" > 
                          <label>Fecha</label> 
                        </div>
                        <div class="col-md-6">
                          <input type="text" class="form-control" id="txtFecha" disabled="disabled">         
                        </div> 
                    </div>
                    <p></p>
                    <div class="row">
                        <div class="col-md-3 col-md-offset-1" > 
                          <label>concepto</label> 
                        </div>
                        <div class="col-md-8">
                          <input type="text" class="form-control" id="txtcon" disabled="disabled">         
                        </div> 
                    </div>
                    <p></p>
                    <div class="row">
                        <div class="col-md-3 col-md-offset-1"> 
                          <label>Monto</label> 
                        </div>
                        <div class="col-md-6">
                          <input type="text" class="form-control" id="txtmonto" disabled="disabled">         
                        </div> 
                    </div>
                    <p></p>
                    <div class="row">
                        <div class="col-md-3 col-md-offset-1"> 
                          <label>Moneda</label> 
                        </div>
                        <div class="col-md-4">
                          <input type="text" class="form-control" id="txtmoneda" disabled="disabled">         
                        </div> 
                    </div>
                    {% ifequal OfCentral 'si' %}
                    <p></p>
                    <div class="row">
                        <div class="col-md-3 col-md-offset-1" > 
                          <label>Observaciones</label> 
                        </div>
                        <div class="col-md-8">
                          <input type="text" class="form-control" id="txtObs" disabled="disabled">         
                        </div> 
                    </div>
                    {% endifequal %}
                    <p></p>
                    <div class="row">
                        <div class="col-md-3 col-md-offset-1" > 
                          <label>Observaciones de Recepción</label> 
                        </div>
                        <div class="col-md-8">
                          <input type="text" class="form-control" id="txtObsRe">         
                        </div> 
                    </div>
                    <br>
                    <div class="row">
                      <div class="col-md-4 col-md-offset-4" align="center">
                        <button type="button" class="btn btn-success btn-sm"id="recibido"><b>Recibido?</b></button>
                      </div>
                    </div>
                  </div>
                </div>
            </div>
          </p>
        </div>
        <div class="modal-footer">
          <hr>
          <button type="button" class="btn btn-primary" data-dismiss="modal">Cerrar</button>
        </div>

      </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<div id="myModal1" 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">
          <p>
            <div class="col-md-12 col-sm-12" >
                <div class="panel panel-info">
                  <div class="panel-body">
                   
                    <div id ="plantilla" style="font-family:'Lucida Console', Monaco, monospace;font-size:13px;">
                        <h5 align="center"><b> RECEPCIÓN DE HABILITACIÓN</b></h5>
                        <table>
              <tr nowrap>=====================================</tr>
            </table>
                      <br>
                      <div>
                        <table>
                          <tr>
                            <th>{{ SITE_URL }}</th>
                          </tr>
                          <tr>
                            <th>Fecha:&nbsp;</th>
                            <td id="f" colspan=3 nowrap></td>
                          </tr>
                          <tr >
                            <th>Concepto:</th>
                            <td  colspan=3 >Recepcion de habilitacion</td>
                          </tr>
                          <th><b>De:&nbsp;</b></th>
                            <td id="Rori" colspan=3 nowrap></td>
                          <tr style=" border-bottom: 1px solid #000;border-bottom-style: dashed;">
                            <th >Monto:&nbsp;</th>
                            <td colspan=3 nowrap> <b><h4 id="mon"></h4></b></td>
                          </tr>
                        <tr>
                            <th colspan=2>Observaciones de envio:&nbsp; </th>
                            <td id="obenv" colspan=2></td>
                          </tr>
                            <tr>
                              <th >Observaciones: </th>
                              <td id="obsr"></td>
                            </tr>
                      </table>
                      </div>
                      <br>
                      <div>
                        <h5>____________________</h5>
                        <b>Recibi conforme: {{ nombre_usuario }}</b>
                      </div>
                       
                    </div>

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

      </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div>
<div id="modal_confirmacion" 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>
          <br>
        </div>
        <div class="modal-body alert alert-warning"role="alert">
          <div class="row">
            <div class="col-md-12">
              <div class="row grp_alr" align="center">
                <h3>RECIBIR DINERO ?</h3>
              </div>
              <div class="row grp_alr" align ="center">
                <h5>Esta accion sera irreversible!</h5>
              </div>
              <div class="row grp_pgs" align="center" hidden>
                  <h3>PROCESANDO...</h3>
              </div>
              <div class="row grp_pgs" hidden>
                <div class="progress">
                  <div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: 100%">
                  </div>
                </div>
              </div>
              <div class="row grp_alr">
                <div class="col-md-4 col-md-offset-2">
                  <button type="button" class="btn btn-default btn-block" data-dismiss="modal">Cancelar</button>
                </div>
                <div class="col-md-4">
                  <button type="button" class="btn btn-danger btn-block" id="alert_aceptar">Recibir?</button>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
 <script type="text/JavaScript">
    var Aux="";
    var filaI =0;
    $(document).ready(function(){

      $(document).on("click",".filaC",function(){
        var num = $(this).prop('id');
        var fila= $(this).prop('class');
        $("."+fila).prop('class','filaC');
        $(this).prop('class','filaC info');
        filaI = num;
        //--------------
        $('#txtFecha').prop("value",Aux[filaI].fecha);
        $('#txtcon').prop("value",Aux[filaI].concepto);
        $('#txtmonto').prop("value",Aux[filaI].monto);
        $('#txtmoneda').prop("value",Aux[filaI].moneda);
        {% ifequal OfCentral 'si' %}
        $('#txtObs').prop("value",Aux[filaI].obs);
        {% endifequal %}
        $('#obenv').text(Aux[filaI].obs);
        $("#f").text(Aux[filaI].fecha);
        $("#Rori").html(Aux[filaI].ori);
        //$("#con").text(Aux[filaI].concepto);
        //$("#mon").text(Aux[filaI].monto);
        //$("#mone").text(Aux[filaI].moneda);
        $("#ob").text(Aux[filaI].obs);
        var mr='';
        if(Aux[filaI].moneda=="soles")
          {
            mr="S/. "
          }
        else
          {
            mr="$/. "
          }
        $("#mon").text(mr+Aux[filaI].monto);
      });
      ajax_SaldoRecibido();
      $("#btnRefrescar").click(function(){
        ajax_SaldoRecibido();
      });
      //
      function ajax_SaldoRecibido(){
        $.ajax({
          url:'/listaSaldoRecibidas_m_ajax/',
          type:'GET',
          dataType:'json',
          success: function(data){
            Aux= data;
            var html ="";
            for(var i=0;i<data.length;i++){
                html += '<tr class="filaC" data-toggle="modal" data-target="#myModal"' +' id="'+i+'"><th scope="row">'+(i+1)+'</td><td>'+data[i].fecha+'</td><td>'+data[i].ori+'</td><td>'+data[i].monto +'</td><td>'+data[i].comi +'</td><td>'+data[i].moneda+'</td><td>'+data[i].obs+'</td></tr>';
            }
            $('#listaC').html(html);
          }
        });
      }
      //otra funcion
      function ocultarmodal(){
        $('#myModal').modal('hide')
      };
      
      //otra funcion
      function ajax_DineroRecibido(idC){//falta
        $.ajax({
          data:{'idS':idC,'obs':$("#txtObsRe").val(),'tabla':Aux[filaI].tabla},
          url:'/DineroRecibido_m_ajax/',
          //async:false,
          type:'GET',
          dataType:'text',
          success: function(data){
            if(data=='exito'){
              $("#ExitoMensaje").prop('class','bg-info');
              $("#ExitoMensaje").text("Recibido conformemente!");
              $("#obsr").text($("#txtObsRe").val());
              $('#plantilla').printThis();
              ocultar_progress();
              bootbox.alert({ 
                message: "Operación exitosa. Dinero Recepcionado",
                className: 'bb-alternate-modal'
              });

              ajax_SaldoRecibido();
             }
           else{
              ocultar_progress();
              $("#ExitoMensaje").prop('class','bg-danger');
              $("#ExitoMensaje").text(" la operacion fallo: " + data);

               bootbox.alert({ 
                message: "La Operación falló",
                className: 'bb-alternate-modal'
              }); 
             }
            ocultarmodal();
          }
        });
      };
     
     //-------------------
     $(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');
      });

      $("#recibido").click(function(){//boton q llama ala confirmacion
        $('#modal_confirmacion').modal('show');
        //ajax_DineroRecibido(Aux[filaI].pk);
      });
      $("#alert_aceptar").click(function(){
        mostrar_progress();
        ajax_DineroRecibido(Aux[filaI].pk);
      });
      function mostrar_progress(){
        $(".grp_alr").hide();
        $(".grp_pgs").show();
      };
      function ocultar_progress(){//llamar desde la funcion
        $('#modal_confirmacion').modal('hide');
        $(".grp_alr").show();
        $(".grp_pgs").hide();
      };
     //--------------------
    });
</script>
{% endblock content1 %}