{% extends "base.html" %}
{% load static %}
{% block titulo %}
Transferencias - Recibidas
{% endblock titulo %}
{% block content1 %} 
<script type="text/javascript">
  $("#navTrans").attr('class','dropdown active');
  $("#navTransRecibidas").attr('class','active');
</script>
<style type="text/css">
  .input-group-addon {
    padding: 0px 6px;
}
.fila-corto{
  margin-bottom: 5px;
}
</style>
        <div class="row">
          <div class="col-md-12 col-sm-12" >
              <div class="panel panel-default ">
                <div class="panel-heading panel-toolbar"> 
                  <strong>TRANSFERENCIAS RECIBIDAS</strong>
                  <div>
                    <button type="button" class="btn btn-default btn-sm" id="RefrescarLista"><span class="fa fa-refresh"></span> Actualizar</button>
                    <button type="button" class="btn btn-default btn-sm" id="btnImprimir"><i class="fa fa-print"></i> Imprimir</button>
                  </div>
                  
                </div>
                <div class="panel-body">
                  <div class="row" >
                   <div class="col-md-12">
                      <h4 class="bg-success" align="center" id="ExitoMensaje">
                      </h4>
                    </div>
                  </div>
                  <div class="row">

                       
                      <div class="col-md-4">
                         <div class="fg-line">
                          <input type="text" class="form-control" placeholder="Nombre o Apellidos (Beneficiado o Solicitante)" id="filtro">
                          </div>
                          <p></p>
                        </div>
                        <div class="col-md-1" >
                          <button type="button" class="btn btn-primary btn-block btn-sm" id="buscar"><i class="fa fa-search"></i> Buscar</button>
                          <p></p>
                        </div>
                        <div class="col-md-2">
                        <div class="checkbox">
                            <!--<input id="ts4" type="checkbox" hidden="hidden">
                            <label for="ts4" class="ts-helper"></label>
                             <label for="ts4" class="ts-label"><strong>Solo activos</strong></label>-->
                            
                            <label class="">
                              <input id="ts4" type="checkbox" value="success-inverse1"> <b>Solo activos</b>
                            </label>
                        </div> 
                       </div>  
                  </div>

                      <div class="row">
                        
                        <!--
                        <div class="col-md-2" >
                          <button type="button" class="btn btn-primary btn-block btn-sm" id="filtroX" data-toggle="modal" data-target="#modalFiltroAvanzado"><span class="glyphicon glyphicon-cog"></span> Filtro Avanzado</button>
                          <p></p>
                        </div>
                        -->
                      </div>
                  </div>
                  <div class="row">
                      <div class="col-md-12">
                          <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>
                                       <h4 class="modal-title" id="myModalLabel">Detalles</h4>
                                    </div>
                                  <form action="/PagoTrans_post/" method="POST" data-toggle="validator" role="form" id="formulario">{% csrf_token %}
                                    <div class="modal-body" id="myModalBody">
                                      <div class="row">
                                        <div class="col-md-6" >
                                            <div class="panel panel-info" id="divPago">
                                              <div class="panel-heading"> <strong>DETALLES GENERALES</strong></div>
                                              <div class="panel-body">
                                                <div class="row">
                                                  <input type="hidden" id="txtDniMenor">
                                                  <div class="col-md-5 " align="right">
                                                    <label> Estado de Transferencia </label>
                                                  </div>
                                                  <div class="col-md-3">
                                                    <input type="text" class="form-control" id="txtEstadoTrans" disabled="disabled">
                                                    <p></p>
                                                  </div>
                                                </div>
                                                <br>
                                                <div class="row hidden" id="divNroCtaST"> 
                                                   
                                                  <div class="col-md-5 " align="right">
                                                    <label> Nro de Cta </label>
                                                  </div>
                                                  <div class="col-md-7">
                                                    <input type="text" class="form-control" id="txtNroCtaBanco" disabled="disabled">
                                                    <p></p>
                                                  </div>
                                                </div>
                                                <br>
                                                <div class="row">
                                                  <div class="col-md-12">
                                                    <p class="bg-success" align="center">
                                                      <!--&nbsp;-->
                                                      <b>SOLICITANTE</b>
                                                    </p>
                                                  </div>
                                                </div>
                                                <p></p>
                                                <div class="row">
                                                    <div class="col-md-4 col-md-offset-1" align="right"> 
                                                      <label>DNI/RUC</label> 
                                                    </div>
                                                    <div class="col-md-6">
                                                      <input type="text" class="form-control" id="txtDNI" disabled="disabled">         
                                                    </div> 
                                                </div>
                                                <p></p>
                                                <div class="row">
                                                    <div class="col-md-4 col-md-offset-1" align="right"> 
                                                      <label>Nombres y Apellidos</label> 
                                                    </div>
                                                    <div class="col-md-7">
                                                      <!--
                                                      <input type="text" class="form-control" id="txtNombres_Soli" disabled="disabled">-->  
                                                      <label ><b id="txtNombres_Soli"></b></label>
                                                    </div> 
                                                </div>
                                                <p></p>
                                                 
                                                <br>
                                                <div class="row">
                                                  <div class="col-md-12">
                                                    <p class="bg-success" align="center">
                                                      <!--&nbsp;-->
                                                      <b>BENEFICIADO</b>
                                                    </p>
                                                  </div>
                                                </div>
                                                <p></p>
                                                <div class="row">
                                                    <div class="col-md-4 col-md-offset-1" align="right"> 
                                                      <label>Nombres y Apellidos</label> 
                                                    </div>
                                                    <div class="col-md-7">
                                                      <!--
                                                      <input type="text" class="form-control" id="txtNombres_Bene" disabled="disabled"> -->  
                                                      <label ><b id="txtNombres_Bene"></b></label>
                                                    </div> 
                                                </div>
                                                <p></p>
                                                 <div class="row hidden" style="color:#ff1205" id="divReniec">
                                                    <div class="col-md-4 col-md-offset-1" align="right"> 
                                                      <label id="txtNARBD">Nombres y Apellidos </label> 
                                                    </div>
                                                    <div class="col-md-7">
                                                      <!--
                                                      <input type="text" class="form-control" id="txtNombres_Bene" disabled="disabled"> -->  
                                                      <label ><b id="txtNombres_BeneReniec"></b></label>
                                                    </div> 
                                                </div>
                                                <p></p>
                                                <div class="row" id="divDNI">
                                                    <div class="col-md-4 col-md-offset-1" align="right"> 
                                                      <label>DNI</label> 
                                                    </div>
                                                    <div class="col-md-6">
                                                      <div class="form-group">
                                                        <input type="text" class="form-control" id="txtN" name="dni" data-minlength="8" maxlength="11" autocomplete="off" required>
                                                        <div class="form-control-feedback" style="text-align:left;" ></div>
                                                        <div class="help-block with-errors"></div>
                                                      </div>
                                                    </div> 
                                                </div>
                                                <p></p>
                                                 <div class="row hidden" id="divNroCta">
                                                    <div class="col-md-4 col-md-offset-1" align="right"> 
                                                      <label>Nro Cta</label> 
                                                    </div>
                                                    <div class="col-md-6">
                                                      <input type="text" class="form-control" id="txtNroCta" autocomplete="off" placeholder="Ingrese Nro Cta">         
                                                    </div>
                                                    <div class="col-md-12 hidden" id="txtDivMsje">
                                                       <label style="color:red"><b id="txtMsjNroCta"></b></label>  
                                                    </div>
                                                     
                                                </div>

                                                
                                              </div>
                                            </div>
                                            <div class="panel panel-default" id="divDetBanco">
                                              <div class="panel-heading panel-transferencia">DETALLE BANCO</div>
                                              <div class="panel-body">
                                                <div class="row fila-corto">
                                                  <div class="col-md-10 col-md-offset-1">
                                                    <div class="input-group">
                                                      <div class="input-group-addon"><label>BANCO</label></div>
                                                      <input type="text" class="form-control" id="txtdetb-banco" name="detb-banco" autocomplete="off" disabled>
                                                    </div>
                                                  </div>
                                                </div>

                                                <div class="row fila-corto">
                                                  <div class="col-md-10 col-md-offset-1">
                                                    <div class="input-group">
                                                      <div class="input-group-addon"><label>N° Cuenta / DNI:</label></div>
                                                      <input type="text" class="form-control" id="txtdetb-nrocta" name="detb-nrocta" autocomplete="off" disabled>
                                                    </div>
                                                  </div>
                                                </div>
                                                <div class="row fila-corto">
                                                  <div class="col-md-10 col-md-offset-1">
                                                    <div class="input-group">
                                                      <div class="input-group-addon"><label>Cel Referencia:</label></div>
                                                      <input type="text" class="form-control" id="txtdetb-celref" name="detb-celref" autocomplete="off" disabled>
                                                    </div>
                                                  </div>
                                                </div>
                                                <div class="row fila-corto">
                                                  <div class="col-md-10 col-md-offset-1">
                                                    <div class="input-group">
                                                      <div class="input-group-addon"><label>Nro Operacion:</label></div>
                                                      <input type="text" class="form-control" id="txtdetb-nroope" name="detb-nroope" autocomplete="off">
                                                    </div>
                                                  </div>
                                                </div>
                                                <div class="row fila-corto">
                                                  <div class="col-md-10 col-md-offset-1">
                                                    <div class="input-group">
                                                      <div class="input-group-addon"><label>Nro Giro:</label></div>
                                                      <input type="text" class="form-control" id="txtdetb-nrogiro" name="detb-nrogiro" autocomplete="off">
                                                    </div>
                                                  </div>
                                                </div>
                                                <div class="row">
                                                  <div class="col-md-10 col-md-offset-1">
                                                    <div class="input-group">
                                                      <div class="input-group-addon"><label>Clave de cobro:</label></div>
                                                      <input type="text" class="form-control" id="txtdetb-clave" name="detb-clave" autocomplete="off">
                                                    </div>
                                                  </div>
                                                </div>

                                              </div>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                          <div class="panel panel-success">
                                            <div class="panel-heading"> <strong>PAGO DE TRANSFERENCIA</strong></div>
                                            <div class="panel-body">
                                              <div class="row">
                                                    <div class="col-md-4 col-md-offset-1" align="right"> 
                                                      <label>ID</label> 
                                                    </div>
                                                    <div class="col-md-5">
                                                      <input type="text" class="form-control" id="txtIDtrans" name="idT"  readonly>         
                                                    </div> 
                                                </div>
                                                
                                                <div class="row">
                                                    <div class="col-md-4 col-md-offset-1" align="right"> 
                                                      <label>Nro Recibo:</label> 
                                                    </div>
                                                    <div class="col-md-6">
                                                      <!--
                                                      <input type="text" class="form-control" id="txtnr" disabled="disabled">-->
                                                      <h4 ><b id="txtnr"></b></h4> 
                                                    </div> 
                                                </div>
                                                
                                                <div class="row">
                                                    <div class="col-md-4 col-md-offset-1" align="right"> 
                                                      <label>Fecha</label> 
                                                    </div>
                                                    <div class="col-md-6">
                                                      <input type="text" class="form-control" id="txtFecha" disabled="disabled">         
                                                    </div> 
                                                </div>
                                                
                                                <div class="row">
                                                    <div class="col-md-5" align="right"> 
                                                      <label>Personal Emisor</label> 
                                                    </div>
                                                    <div class="col-md-7">
                                                      <input type="text" class="form-control" id="txtPersonalE" disabled="disabled">         
                                                    </div> 
                                                </div>
                                                
                                                <div class="row">
                                                    <div class="col-md-4 col-md-offset-1" align="right"> 
                                                      <label>Oficina Origen</label> 
                                                    </div>
                                                    <div class="col-md-4">
                                                      <input type="text" class="form-control" id="txtOficinaOri" disabled="disabled">         
                                                    </div> 
                                                </div>
                                              
                                                <div class="row">
                                                    <div class="col-md-4 col-md-offset-1" align="right"> 
                                                      <label>Cantidad</label> 
                                                    </div>
                                                    <div class="col-md-5">
                                                      <!--
                                                      <input type="text" class="form-control" id="txtMonto" disabled="disabled">--> 
                                                      <h3 ><b id="txtMonto"></b></h3>        
                                                    </div> 
                                                </div>
                                              
                                                <div class="row">
                                                    <div class="col-md-4 col-md-offset-1" align="right"> 
                                                      <label>Comisión</label> 
                                                    </div>
                                                    <div class="col-md-3">
                                                      <!--
                                                      <input type="text" class="form-control" id="txtComicion" disabled="disabled"> -->     
                                                      <h4 id="txtComicion"></h4>
                                                    </div> 
                                                </div>
                                                
                                                <div class="row">
                                                    <div class="col-md-4 col-md-offset-1" align="right"> 
                                                      <label>Observaciones</label> 
                                                    </div>
                                                    <div class="col-md-7">
                                                      <!--
                                                      <input type="text" class="form-control" id="txtObs" disabled="disabled">-->
                                                      <textarea class="form-control" rows="2" id="txtObs" disabled="disabled" ></textarea >         
                                                    </div> 
                                                </div>
                                                
                                                <div class="row">
                                                    <div class="col-md-4 col-md-offset-1" align="right"> 
                                                      <label>Detalle Otros Conceptos</label> 
                                                    </div>
                                                    <div class="col-md-7">
                                                      <!--
                                                      <input type="text" class="form-control" id="txtObs" disabled="disabled">-->
                                                      <textarea class="form-control" rows="2" id="txtotros_con" disabled="disabled" ></textarea >         
                                                    </div> 
                                                </div>

                                                {% ifequal Egreso_pt 'si' %}
                                                <div class="row">
                                                    <div class="col-md-4 col-md-offset-1" align="right"> 
                                                      <label>Egreso</label> 
                                                    </div>
                                                    <div class="col-md-6">
                                                      <div class="form-group">
                                                        <input type="text" class="form-control" id="txtEgreso" name="egreso" autocomplete="off">
                                                        <div class="form-control-feedback" style="text-align:left;" ></div>
                                                        <div class="help-block with-errors"></div>
                                                      </div>
                                                      
                                                    </div> 
                                                </div>
                                                
                                                {% endifequal %}
                                                <div class="row">
                                                    <div class="col-md-4 col-md-offset-1" align="right"> 
                                                      <label>Ingreso</label> 
                                                    </div>
                                                    <div class="col-md-6">
                                                      <div class="form-group">
                                                        <input type="text" class="form-control" id="txtIngreso" name="ingreso" placeholder="0.00" autocomplete="off">
                                                        <div class="form-control-feedback" style="text-align:left;" ></div>
                                                        <div class="help-block with-errors"></div>
                                                      </div>
                                                      
                                                    </div> 
                                                </div>
                                                <div class="row" id="campo_cel">
                                                  
                                                  <div class="col-md-5" align="right">
                                                    <h4><b style="font-size: 15px;">Celular Benficiado:</b>
                                                  </div>
                                                  <div class="col-md-7">
                                                    <div class="form-group">
                                                      <input type="text" class="form-control" id="txtcel_bene" name="celular"  style="font-size:16px;font-weight:bold;" maxlength="9" placeholder=" Celular del beneficiado" autocomplete="off">    
                                                      <div class="form-control-feedback" style="text-align:left;" ></div>
                                                      <div class="help-block with-errors"></div>
                                                    </div>
                                                  </div>
                                                </div>
                                                <div class="row" id="campo_sdni" hidden>
                                                  <div class="col-md-6">
                                                    <div class="form-group">
                                                      <input type="text" class="form-control"  name="ptsnvd" value="{{ pt_sin_dni }}" >    
                                                     
                                                    </div>
                                                  </div>
                                                </div>
                                                <div class="row" id="areap">
                                                    <div class="col-md-4 col-md-offset-1" align="right"> 
                                                      <label>Observaciones de pago</label> 
                                                    </div>
                                                    <div class="col-md-6">
                                                      <div class="form-group">
                                                        <!--
                                                        <input type="text" class="form-control" id="txtObspe">-->
                                                        <textarea class="form-control" rows="3"  id="txtObspa" name="obs" autocomplete="off"></textarea >
                                                        <div class="form-control-feedback" style="text-align:left;" ></div>
                                                        <div class="help-block with-errors"></div>
                                                      </div>
                                                               
                                                    </div> 
                                                </div>
                                                <p></p>
                                                <div class="row alert alert-warning" id="area_transfExpi">
                                                  <div class="row">
                                                    <div class="col-md-12">
                                                      <p>Esta transferencia tiene <b id="nrodias"></b> dia(s) de retraso. 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" name="cod_aut" autocomplete="off">
                                                    </div>
                                                  </div>
                                                  
                                                </div>

                                            
                                                
                                                <div class="row">
                                                  <div class="col-md-4 col-md-offset-4">
                                                    <button type="button" class="btn btn-success btn-block btn-sm" id="pagoT">Pagar</button>
                                                  </div>
                                                </div>
                                            </div>
                                          </div>
                                        </div>
                                      </div>
                                    </div>
                                  </form>
                                  <div class="modal-footer">
                                    
                                   <button type="button" class="btn btn-danger btn-sm" data-dismiss="modal">Cerrar</button>
                                  </div>

                                </div><!-- /.modal-content -->
                              </div><!-- /.modal-dialog -->
                          </div><!-- /.modal -->
                           <div id="modal1" 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:'arial', Monaco, monospace;font-size:18px;">
                                      <table>
                                        
                                         <tr style="border: 1px solid #000">
                                          <td width="31%"></td>
                                          <td><h4>PAGO DE ST</h4></td>
                                          <td nowrap width="32%"></td>
                                        </tr>
                                      </table>
                                      <table>   
                                        <tr>
                                          <td nowrap style="text-align: left;"><h4 id="nror"></h4> </td>
                                          <td nowrap style="padding-left: 50px"><h4 id="idST"></h4> </td>
                                          <td nowrap style="padding-right:10px"></td>
                                        </tr>
                                        <tr>
                                          <td nowrap>FECHA ENVÍO:  </td>
                                          <td nowrap style="padding-left: 20px"><span id="fechaCreacion"></span></td>
                                          <td nowrap></td>
                                        </tr>
                                      </table> 
                                      <p></p>
                                       <table>
                                        <tr>
                                          <td nowrap>FECHA PAGO: </td>
                                          <td style="padding-left: 20px"> <span id="fepa"><span> </td>
                                          <td nowrap>| <span id="hopa"><span></td>
                                        </tr>
                                      </table>

                                       <table>
                                         <tr>
                                          <td nowrap><h3><b>MONTO:</b></h3></td>
                                          <td nowrap></td>
                                          <td nowrap><h3><b id="plM"></b></h3></td>
                                        </tr>
                                      </table>

                                      <table>
                                        <tr>
                                          <td nowrap>PROCEDENCIA:</td>
                                          <td style="padding-left: 20px"> <h4 id="plOri"><h4></td>
                                          <td nowrap></td>
                                        </tr>
                                      </table>

                                      <table>
                                         <tr>
                                          <td nowrap style="padding-bottom: 18px;">REMITENTE:</td>
                                          <td nowrap style="padding-left: 15px;white-space: pre;"><span id="plR"></span></td>
                                          <td nowrap></td>
                                        </tr>
                                         <tr>
                                          <td nowrap style="padding-bottom: 18px;">BENEFICIADO:</td>
                                          <td nowrap style="padding-left: 15px;white-space: pre;"><span id="plB"></span></td>
                                          <td nowrap></td>
                                        </tr>
                                      </table>
 
                                      <table>
                                        <tr>
                                          <td nowrap>OBSERVACIONES:</td>
                                          <td style="padding-left: 20px" id="plObs"></td>
                                          <td nowrap></td>
                                        </tr> 
                                      </table>
                                      <br></br>
                                       <table>
                                        
                                        <tr>
                                          <td nowrap>____________________</td>
                                          <td style="padding-left: 20px"></td>
                                          <td nowrap></td>
                                        </tr>
                                        <tr>
                                           <td nowrap>OP. {{ nombre_usuario }}</td>
                                          <td style="padding-left: 20px"></td> 
                                          <td nowrap><div style="margin-top:-40px;width:75px;height:85px;border:1px solid #000;"> </div></td>
                                        </tr>
                                        <p></p>
                                        <p></p>
                                        <tr>
                                          <td nowrap>____________________</td>
                                          <td style="padding-left: 20px"></td>
                                          <td nowrap></td>
                                        </tr>
                                        <tr>
                                           <td nowrap><b id="idn"></b></td>
                                          <td style="padding-left: 20px"></td>
                                          <td nowrap></td>
                                        </tr>
                                       
                                      </table>
                                         
                                    </div>
                                  </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 -->
                          <!--   recibos de egreso e ingreso   -->
                          <div id="modalrecibo1212" 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>
                              
                            </div>
                                  <div class="modal-body">
                                    <div  id="platillaIngreso" style="font-family:'Lucida Console', Monaco, monospace;font-size:13px;">
                                      <label align="center"><b>RECIBO DE INGRESO</b></label>
                                      <table>
                                        <tr nowrap>=====================================</tr>
                                      </table>
                                      <table>
                                        <tr>
                                          <td><label id="oficinaReciboin"></label></td>
                                          <td><b>N°: </b><spanid="nroin"></span> </td>
                                        </tr>
                                      </table>
                                      
                                      <table>
                                        <tr>
                                          <td id="fechaReciboin" nowrap></td>
                                          
                                        </tr>
                                      </table>
                                      <br>
                                     
                                      <b>Monto:</b>
                                      <p id="importein"></p>
                                      <b>CONCEPTO:</b>
                                      <p >Ingreso extra por pago de transferencia PT-<span id="ptin"></span></p>
                                      <br>
                                      <table>
                                        <tr>
                                          <td>_________________</td>
                                          
                                        </tr>
                                        <tr>
                                          <td nowrap><h6>OP. {{ nombre_usuario }}</h6> </td>
                      
                                        </tr>
                                      </table>
                                      <p id="horaReciboin"></p>
                                    </div>
                                  </div>
                              
                                </div><!-- /.modal-content -->
                              </div><!-- /.modal-dialog -->
                          </div><!-- /.modal -->
                          <div id="modalrecibo2221" 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>
                              
                            </div>
                                  <div class="modal-body">
                                    <div  id="platillaEgreso" style="font-family:'Lucida Console', Monaco, monospace;font-size:13px;">
                                      <label align="center"><b>RECIBO DE EGRESO</b></label>
                                      <table>
                                        <tr nowrap>=====================================</tr>
                                      </table>
                                      <table>
                                        <tr>
                                          <td><label id="oficinaReciboeg"></label></td>
                                          <td><b>N°: </b><spanid="nroeg"></span> </td>
                                        </tr>
                                      </table>
                                      
                                      <table>
                                        <tr>
                                          <td id="fechaReciboeg" nowrap></td>
                                          
                                        </tr>
                                      </table>
                                      <br>
                                     
                                      <b>Monto:</b>
                                      <p id="importeeg"></p>
                                      <b>CONCEPTO:</b>
                                      <p >Egreso extra por pago de transferencia PT-<span id="pteg"></span></p>
                                      <br>
                                      <table>
                                        <tr>
                                          <td>_________________</td>
                                          
                                        </tr>
                                        <tr>
                                          <td nowrap><h6>OP. {{ nombre_usuario }}</h6> </td>
                      
                                        </tr>
                                      </table>
                                      <p id="horaReciboeg" nowrap></p>
                                    </div>
                                  </div>
                              
                                </div><!-- /.modal-content -->
                              </div><!-- /.modal-dialog -->
                          </div><!-- /.modal -->
                          <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>PAGAR TRANSFERENCIA ?</h3>
                                        </div>
                                        <div class="row grp_alr" align ="center">
                                          <label>Esta acción sera irreversible!</label>
                                        </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">PAGAR?</button>
                                          </div>
                                        </div>
                                      </div>
                                    </div>
                                  </div>
                                </div><!-- /.modal-content -->
                              </div><!-- /.modal-dialog -->
                          </div><!-- /.modal -->

                           <div id="modal_confirmacion_reniec" 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" align="center">
                                          <h4><strong>LOS DATOS DEL BENEFICIADO NO CONCUERDAN CON LOS DE LA RENIEC</strong></h4>
                                        </div>
                                        <div class="row" align ="center">
                                          <label><strong id="txtDatosC"></strong> </label>
                                        </div>
                                         <div class="row" align ="center">
                                          <label><strong id="txtDatosR"></strong></label>
                                        </div>
                                         <div class="row" align ="center">
                                          <label><strong id="txtMensaje"></strong></label>
                                        </div>
                                       
                                        <div class="row">
                                           
                                          <div class="col-md-offset-4 col-md-4">
                                            <button type="button" class="btn btn-danger btn-block" data-dismiss="modal">Aceptar</button>
                                          </div>
                                        </div>
                                      </div>
                                    </div>
                                  </div>
                                </div><!-- /.modal-content -->
                              </div><!-- /.modal-dialog -->
                          </div><!-- /.modal -->


<!-- modal de filtro avanzado -->
<div id="modalFiltroAvanzado" 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>
          <h4 class="modal-title" id="myModalLabel">FILTRO AVANZADO</h4>
        </div>
        <div class="modal-body">
          <div class="row">
            <div class="col-md-2 col-md-offset-5">
              <div class="checkboxFA">
                  <label class="">
                    <input id="ts4FA" type="checkbox"> Solo activos
                  </label>
              </div> 
             </div>
          </div>
          <div class="row">
            <p class="bg-success">
              FECHA DE ENVIO
            </p>
          </div>
          <div class="row">
            <div class="col-md-3 col-md-offset-1">
              <label for="comboFiltroF">Filtrar por:</label>
              <div class="fg-line">
                <div class="select">
                  <select class="form-control" id="comboFechasFA">
                    <option value="0">Cualquier Fecha</option>
                    <option value="h">hoy</option>
                    <option value="f">Fecha</option>
                    <option value="ef">Entre Fechas</option>
                  </select>
                </div>
              </div>
              <p></p>
            </div>
            <div class="col-md-2">
              <label for="txtfecha1">Del:</label>
              <input type="text" class="form-control" id="txtfechaFA1">
              <p></p>
            </div>
            <div class="col-md-2">
              <label for="txtfecha2">Hasta:</label>
              <input type="text" class="form-control" id="txtfechaFA2">
              <p></p>
            </div>
          </div>
          <div class="row">
            <p class="bg-success">
              OFICINA ORIGEN
            </p>
          </div>
          <div class="row">
            <div class="col-md-1 col-md-offset-1"  align="right">
              <h4><b style="font-size: 15px;">Oficina:</b></h4> 
            </div>
            <div class="col-md-5" >
              <div class="select">
                  <select id="ComboOficinaFA" placeholder="Seleccione Oficina">   
                  </select>
              </div>
            </div>
          </div>
          <div class="row">
            <p class="bg-success">
              NOMBRES Y APELLIDOS (benefiaciado o solicitante)
            </p>
          </div>
          <div class="row">
            <div class="col-md-3 col-md-offset-1">
             <input type="text" class="form-control" id="txtnombreFA" placeholder="NOMBRE">
              <p></p>
            </div>
            <div class="col-md-3">
             <input type="text" class="form-control" id="txtapFA" placeholder="A. PATERNO">
              <p></p>
            </div>
            <div class="col-md-3">
             <input type="text" class="form-control" id="txtamFA" placeholder="A. MATERNO">
              <p></p>
            </div>
          </div>
          <div class="row">
            <p class="bg-success">
              EXTRAS
            </p>
          </div>
          <div class="row">
            <div class="col-md-2 col-md-offset-1">
              <label>Nro por Pagina</label>
            </div>
            <div class="col-md-2">
             <input type="text" class="form-control" id="txtnropagFA" placeholder="20">
              <p></p>
            </div>
          </div>
          <div class="row">
            <div class="col-md-4 col-md-offset-4" >
              <button type="button" class="btn btn-success btn-block btn-sm" id="ProcesarFA"> <span class="glyphicon glyphicon-hourglass"></span> FILTRAR</button>
              <p></p>
            </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><!-- /.modal -->
<!-- end modal filtro avanzado-->            

<script type="text/JavaScript">
  {% ifnotequal exito '' %}
    {% ifequal exito 'exito' %}
        var mr="";
        if('{{moneda}}'=='soles'){
            mr="S/. "
        }
        else{
            mr="$/. "
        }
       $("#fechaCreacion").text('{{fecha_envio}}');
       $("#plB").text('{{bene}}'+"\n"+'{{bene_ap}}');
       $("#plOri").text('{{ori}}');
       $("#plR").text('{{soli}}'+"\n"+'{{soli_ap}}');
       $("#plObs").text('{{obsp}}');
       $("#fepa").text('{{fecha}}');
       $("#plM").text(mr+'{{monto}}');
       $("#idn").text('{{dnib}}');
       $("#nror").text("NRO: "+'{{nr}}');
       $("#idST").text("ST: "+'{{idST}}');
       $('#platillaI').printThis();
       {% ifnotequal nre '' %}
          $("#nroeg").text('{{nre}}');
          $("#fechaReciboeg").text('{{fecha}}');
          $("#importeeg").text(mr+'{{egreso}}');
          $("#pteg").text('{{nr}}');
          $('#platillaEgreso').printThis();
       {% endifnotequal %}
       {% ifnotequal nri '' %}
          $("#nroin").text('{{nri}}');
          $("#fechaReciboin").text('{{fecha}}');
          $("#importein").text(mr+'{{ingreso}}');
          $("#ptin").text('{{nr}}');
          $('#platillaIngreso').printThis();
       {% endifnotequal %}
       $("#ExitoMensaje").prop('class','bg-info');
       $("#ExitoMensaje").text("La transferencia se PAGO!");
    {% else %}
      $("#ExitoMensaje").prop('class','bg-danger');
      $("#ExitoMensaje").text(' la operacion fallo: '+ '{{exito}}');
    {% endifequal %}
  {% endifnotequal %}
    var mon_m='S/. '
    var Aux="";
    var filaI =0;
    var pagina=1;
    var nombreBeneficiado="";
    var apBeneficiado="";
    var amBeneficiado="";


    console.log("{{ pt_sin_dni }}");
    
   var regexpCel=new RegExp("[9][0-9]{8}$");

    $(document).ready(function(){

      $('#txtN').numeric(); 
      $('#txtEgreso').numeric(".");
      $('#txtIngreso').numeric(".");

      $("#txtcel_bene").numeric();

      $("#txtcel_bene").keyup(function(){
        if($(this).val()!=null && $(this).val().trim() !=''){
          if(regexpCel.test($(this).val())){
            $("#campo_cel").removeClass('alert-danger');
          }
          else{
            $("#campo_cel").addClass('alert-danger');
          }
        }
        else{
          $("#campo_cel").removeClass('alert-danger');
        }
      });

      $("#txtN").keyup(function(){
        if($("#txtDniMenor").val()=="no" && ($("#txtNroCtaBanco").val()=="-1" || $("#txtNroCtaBanco").val()==-1)){
          if($(this).val().trim()!=''){
             $("#pagoT").prop('disabled',false);
          }
          else{
            $("#pagoT").prop('disabled',true);
          }
        } 

      });

       $("#txtNroCta").keyup(function(){
         var val=$(this).val();
         if(val==$("#txtNroCtaBanco").val().trim()){
          $("#txtDivMsje").addClass("hidden");
          $("#pagoT").prop('disabled',false);
         }else{
          $("#txtDivMsje").removeClass("hidden")
          $("#txtMsjNroCta").text("El nro de cta no coincide con el creado");
          $("#pagoT").prop('disabled',true);
         }

      });


      $("#txtN").keyup(function(){
      if($(this).val().trim()!='' && $(this).val().trim().length>=8){
           $("#pagoT").prop('disabled',false);
        }
        else{
          $("#pagoT").prop('disabled',true);
        }
      });
      $("#pagoT").prop('disabled',true);
      /*
      $("#pagoT").click(function(){
        $("#idn").text($("#txtN").val());
      });
      */
      
      Transferencias();
      $("#RefrescarLista").click(function(){
        Transferencias();
      });

        $("#btnImprimir").click(function(){ 
         
          var doc = new jsPDF('l', 'pt');
          var res = doc.autoTableHtmlToJson(document.getElementById("tableSTR"));
          doc.setFontSize(14);
          doc.text("Reporte Transferencias Recibidas", 20, 30);
          doc.setFontSize(12);
          doc.text('Oficina : '+'{{SITE_URL}}',20,60);
          doc.text('Usuario : '+'{{nombre_usuario}}',20,80);
          doc.autoTable(res.columns, res.data, {
              margin: {horizontal: 20},
              startY: doc.autoTableEndPosY() + 60,
              margin: {horizontal: 10},
              styles: {overflow: 'linebreak'},
              bodyStyles: {valign: 'top'},
              columnStyles: {email: {columnWidth: 'wrap'}},
              theme: 'grid',
          });

          doc.save('reporteSTR.pdf');

    });

       function consulta(){
        var tecactusApi = new TecactusApi("eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiIsImp0aSI6ImMzZDhiZDI3MTI2NDIyNTkzODc4ZGEwOWZkZTQ1OGFlMDE4MzcxNDRkYjZlNzJlODU1ZTcwZWM5ODAyM2Q2MGQ5ZTcyODZjOTA1ODlkMzlmIn0.eyJhdWQiOiIxIiwianRpIjoiYzNkOGJkMjcxMjY0MjI1OTM4NzhkYTA5ZmRlNDU4YWUwMTgzNzE0NGRiNmU3MmU4NTVlNzBlYzk4MDIzZDYwZDllNzI4NmM5MDU4OWQzOWYiLCJpYXQiOjE0OTQyMTg0NjksIm5iZiI6MTQ5NDIxODQ2OSwiZXhwIjoxODA5NzUxMjY5LCJzdWIiOiIyNTYiLCJzY29wZXMiOlsidXNlLXJlbmllYyIsInVzZS1zdW5hdCJdfQ.iBb4lCGx-WKSYGvvNji7_Ys7umBux8KXjVFSPn7D05JB9-zNi1pXLNCASbKABs9zBKVEhddzN1RFW4UIjCtWne4r0ltrJUz_rSe5kmdt8vLzRReKvZiUFxFc9JcERTg4pp7Yi7Qx06CASPCKd4NgMqz35ucUuJOh9labelC8dup7XJttI0jX5BAbiuXMKwG7QH8zGxdx-7CEkxMhigsv-Wm7S1jOl-JLJT2iDLPOQ-VslrV0HoL-gt_k_rNPtaNPWU0tIjrG9Wr_2_-jgtV8OYJJqxvtvzi2uKyovpFRZjFJh_gxwKx-mnc6ioMmxS4MHtNKF1GhcHvLHwVSw2Lm2V7Q46v3hb5_ePGRSJ5FocJJ4RqPihULeGGFgrnPp1GLQXOoxYRVj_IjcXbFywQMR8p6xf8xkeGA8v0rCIJBaUXXD4prSHT-qfK5CI3uU1f294s5uz497975QZqVTegDl7sUcJKrEvLrOEm1dEaNIi-j90ZLaqHOYhgY3aciJU_JTwtQ7f5t_Zv-BomazKNwGxe180kmHyLrsCpz9phyZeh_PgPaEPNa0M3hWMDj8Mszo8uQ3ktvU1Zqnzwn_sgyfvqUFIeM4kfoX8_-IrkEjcD9Q7jal4UwLQV5idGxPoSxt8jFpnvwAdN6wbWe7XzRixAm-djmQqdVIn8HZUSBOTIx6k");

        tecactusApi.Reniec.getDni($("#txtN").val())
        .then(function (response) { 
          nombreBeneficiado=response.data.nombres;
          apBeneficiado=response.data.apellido_paterno;
          amBeneficiado=response.data.apellido_materno;
         
          console.log("consulta correcta!");

          var nCompleto=nombreBeneficiado+" "+apBeneficiado+" "+amBeneficiado;
          $("#txtDatosC").text("Datos Creados : "+$("#txtNombres_Bene").text());
          $("#txtDatosR").text("Datos RENIEC : "+nCompleto);
         
           var n=levDist($("#txtNombres_Bene").text().replace(/\s+/g, ''),nCompleto.replace(/\s+/g, ''));
          $("#pagoT").button('reset');
          if(n.length<=5){
            $('#modal_confirmacion').modal('show'); 
          }else{
            $('#modal_confirmacion_reniec').modal('show'); 
          }


        })
        .catch(function (response) { 
          //console.log("algo ocurrió")
          //console.log("código de error: " + response.code)
          //console.log("mensaje de respuesta: " + response.status)
          $("#pagoT").button('reset');
          bootbox.alert(response.data);
        })
              
      }

      $("#ts4").click(function(){
        pagina=1;
        Transferencias();
        PonerInicioPag();
      });
      $("#ts5").click(function(){
        
        pagina=1;
        Transferencias();
        PonerInicioPag();
      });

       $("#buscar").click(function(){
        $('#listaTransf').html('');
        pagina=1;
        PonerInicioPag();
        ajax_Transferencias_fil();
      });

      $("#fd").hide();
      
      $(document).on("click",".filaTrans",function(){
        //limpiar div detalle banco
        limpiar_det_banco()
        $("#txtN").val(null);
        $("#txtNroCta").val(null);
        //----
        $('#txtIDtrans').prop("value",null);
        
        var num = $(this).attr('id');
        filaI = num;
        var fila= $(this).attr('class');
        //$('#extornarT').show();
        //$('#ForzarpagoT').show();
        $('#txtIDtrans').prop("value",Aux[filaI].id_trans);
        nombreBeneficiado="";
        apBeneficiado="";
        amBeneficiado="";
        $('#divReniec').addClass("hidden");
        $("#txtNombres_BeneReniec").text("");
        $('#pagoT').show();
        $('#txtN').prop('disabled',false);
        $("#txtCodA").prop('value',"");
        $("#areap").show();
        $("#area_transfExpi").hide();
        //--------------
        $("#txtcel_bene").prop('value',null);
        $("#txtObspa").prop("value",null);
        $("#txtEgreso").prop("value",null);
        $("#txtIngreso").prop("value",null);
        $('#txtEstadoTrans').prop("value",Aux[filaI].estado);

        $("#txtDniMenor").val(Aux[filaI].dniMenor);
      
        $("#txtNroCtaBanco").val(Aux[filaI].nroCta.toString().trim());

        if($("#txtDniMenor").val()=="no"){ 
          $("#divPago").removeClass();
          $("#divPago").addClass("panel panel-info");
          if(Aux[filaI].nroCta==-1 || Aux[filaI].nroCta=="-1"){
           $("#divDNI").removeClass("hidden"); 
            $("#pagoT").prop('disabled',true);
          }else{ 
             $("#divDNI").addClass("hidden");
             $("#pagoT").prop('disabled',true);
          }
        }else{

          $("#divPago").removeClass();
          $("#divPago").addClass("panel panel-warning");

          if(Aux[filaI].nroCta==-1 || Aux[filaI].nroCta=="-1"){
             $("#divDNI").removeClass("hidden");
            $("#pagoT").prop('disabled',false);
          }else{
            $("#divDNI").addClass("hidden");
             $("#pagoT").prop('disabled',true);
          }

          //$("#pagoT").prop('disabled',false);
        }

        if(Aux[filaI].nroCta==-1 || Aux[filaI].nroCta=="-1"){
           $("#divDNI").removeClass("hidden");
           $("#divNroCtaST").addClass("hidden");
          $("#divNroCta").addClass("hidden");
        }else{
           $("#divDNI").addClass("hidden");
           $("#divNroCtaST").removeClass("hidden");
          $("#divNroCta").removeClass("hidden");
        }
        $('#txtDNI').prop("value",Aux[filaI].dni_rmt);
         //$("#plB").text(Aux[filaI].nombre_bnf +" "+ Aux[filaI].paterno_bnf +" "+ Aux[filaI].materno_bnf);
        //$('#txtNombres_Soli').prop("value",Aux[filaI].nombre_rmt+" "+Aux[filaI].paterno_rmt +" "+ Aux[filaI].materno_rmt);
        //$('#txtNombres_Bene').prop("value",Aux[filaI].nombre_bnf +" "+ Aux[filaI].paterno_bnf +" "+ Aux[filaI].materno_bnf);
        $('#txtNombres_Soli').text(Aux[filaI].nombre_rmt+" "+Aux[filaI].paterno_rmt +" "+ Aux[filaI].materno_rmt);
        $('#txtNombres_Bene').text(Aux[filaI].nombre_bnf +" "+ Aux[filaI].paterno_bnf +" "+ Aux[filaI].materno_bnf);
        
        //$("#txtN").prop('value',Aux[filaI].dni_bnf);
        $("#txtN").prop('value',null);
        $('#txtFecha').prop("value",Aux[filaI].fecha);
        $('#txtPersonalE').prop("value",Aux[filaI].op_emisor);
        $('#txtOficinaOri').prop("value",Aux[filaI].oficina_ori);
        //$('#txtMensaje').text("Comuníquese con la oficina de "+Aux[filaI].oficina_ori+" para que modifique los datos del beneficiado de acuerdo a la RENIEC.");
        $("#nrodias").text(Aux[filaI].dias);
        //$('#txtMonto').prop("value",Aux[filaI].monto);
        //$('#txtComicion').prop("value",Aux[filaI].comicion);

        $('#txtMonto').text(Aux[filaI].monto);
        $('#txtComicion').text(Aux[filaI].comicion);
        $('#txtnr').text(Aux[filaI].nroRecibo);
        $('#txtObs').prop("value",Aux[filaI].obs);
        $('#txtotros_con').prop("value",Aux[filaI].otros_conceptos);
         
        $("#plR").text(Aux[filaI].nombre_rmt+" "+Aux[filaI].paterno_rmt +" "+ Aux[filaI].materno_rmt);
        $("#plObs").text($("#txtObspa").val());
        var mr="";
        if(Aux[filaI].moneda=="soles")
          {
            mr="S/. "
            mon_m=mr;
          }
        else
          {
            mr="$/. "
            mon_m=mr;
        }
        $("#plM").text(mr +String(Aux[filaI].monto));
        $("#plOri").text(Aux[filaI].oficina_ori);
        var fecha = new Date();
        var mes = [
                "Enero",
                "Febrero",
                "Marzo",
                "Abril",
                "Mayo",
                "Junio",
                "Julio",
                "Agosto",
                "Septiembre",
                "Octubre",
                "Noviembre",
                "Diciembre"
                ];
        var textofecha= fecha.getDate() + " de " +mes[fecha.getMonth()] + " del " + fecha.getFullYear();
        var hora = new Date();
        var textohora = hora.getHours() + ":" + hora.getMinutes();
        $("#fepa").text(textofecha);
        $("#hopa").text(textohora);
        //
        $("#fechaReciboin").text(textofecha);
        $("#fechaReciboeg").text(textofecha);
        $("#horaReciboin").text(textohora);
        $("#horaReciboeg").text(textohora);
        if(Aux[filaI].estado !="activo"){
          $('#pagoT').hide();
          $("#areap").hide();
          $('#txtN').prop('disabled',true);
          $("#area_transfExpi").hide();
        }
        else{
          if(Aux[filaI].transEx=="si"){
            $("#area_transfExpi").show();
          }
        }
        // verificacion de banco
        $("#divDetBanco").hide();
        if(Aux[filaI].banco=='si'){
          //$("#txtN").prop('readonly',true);
          //$("#txtNroCta").prop('readonly',true);
          
          $("#divDetBanco").show();
          //consulta
          ajax_detalle_banco();
        }
        else{
          //$("#txtN").prop('readonly',false);
          //$("#txtNroCta").prop('readonly',false);
          $("#pagoT").prop('disabled',true);
        }
      });
      //otra funcion
      function ocultarmodal(){
        $('#myModal').modal('hide')
      };
      //---
      function limpiar_det_banco(){
        $("#txtdetb-banco").val(null);
        $("#txtdetb-celref").val(null);
        $("#txtdetb-nrocta").val(null);
        $("#txtdetb-nroope").val(null);
        $("#txtdetb-nrogiro").val(null);
        $("#txtdetb-clave").val(null);
      }
      function ajax_detalle_banco(){
        $('#divDetBanco').waitMe({effect : 'win8_linear',text : '[Consorcio Imperial] Recuperando Datos',color:'#3f3479',fontSize:'18px'});
        $.ajax({
          data:{'id_st':$('#txtIDtrans').val()},
          url:'/detalle_banco_st/',
          //async:false,
          type:'GET',
          dataType:'json',
          success: function(data){
            $('#divDetBanco').waitMe('hide');
            if(data.exito=="exito"){
              $("#txtdetb-banco").val(data.banco);
              $("#txtdetb-celref").val(data.celref);
              $("#txtdetb-nrocta").val(data.cta_dni);
              $("#txtdetb-nroope").val(data.nro_ope);
              $("#txtdetb-nrogiro").val(data.nro_giro);
              $("#txtdetb-clave").val(data.clave);
              //
              $("#txtN").val(data.cta_dni);
              $("#txtNroCta").val(data.cta_dni);
              $("#txtcel_bene").val(data.celref);
              $("#pagoT").prop('disabled',false);
            }
            else{
              $('#divDetBanco').hide();
            }
          }
        });
      };
      //---

        function ajax_Transferencias_fil(){
        $('.table-responsive').waitMe({effect : 'progressBar',text : 'Recuperando Datos'});
        $.ajax({
          data:{'pg':pagina,'filtro':$("#filtro").val()},
          url:'/listaTransfereciasRecibidas_alterna_ajax/',
          //async:false,
          type:'GET',
          dataType:'json',
          success: function(data){
            Aux = data;
            var html ="";
            for(var i=0;i<data.length;i++){
              var estado ="";
              if(data[i].estado=="pagado"){
                estado = "success";
              };
              if(data[i].pago_forzado=="si"){
                estado= "warning";
              };
              if(data[i].estado =="extornado"){
                estado="danger";
              };
              
              if(data[i].estado=="activo"){
                estado= '';
              };
              html += '<tr data-toggle="modal" data-target="#myModal" data-backdrop="static" class="filaTrans '+estado+'" id="'+i+'"><td>'+data[i].nombre_bnf+' '+data[i].paterno_bnf+' '+data[i].materno_bnf+'</td><td style="font-size:16px;font-weight:bold;">'+data[i].monto+'</td><td>'+data[i].nombre_rmt+' '+data[i].paterno_rmt+' '+data[i].materno_rmt+'</td><td>'+data[i].fecha+'</td><td style="color:#2e6da4;font-size:16px;font-weight:bold;">'+data[i].oficina_ori+'</td><td>'+data[i].nroRecibo+'</td><td><b>'+data[i].comicion+'</b></td><td><b>'+data[i].monto_conceptos+'</b></td><td>'+data[i].moneda+'</td><td>'+data[i].obs+'</td><td>'+data[i].otros_conceptos+'</td><td>'+data[i].estado+'</td></tr>';
            }
            $('#listaTransf').html(html);
            $('.table-responsive').waitMe('hide');
          }
        });
      };
      
      //otra funcion
      function ajax_Transferencias(){
        $('.table-responsive').waitMe({effect : 'progressBar',text : 'Recuperando Datos'});
        $.ajax({
          data:{'pg':pagina},
          url:'/listaTransfereciasRecibidas_ajax/',
          //async:false,
          type:'GET',
          dataType:'json',
          success: function(data){
            Aux = data;
            var html ="";
            for(var i=0;i<data.length;i++){
              var estado ="";
              if(data[i].estado=="pagado"){
                estado = "success";
              };
              if(data[i].pago_forzado=="si"){
                estado= "warning";
              };
              if(data[i].estado =="extornado"){
                estado="danger";
              };
              
              if(data[i].estado=="activo"){
                estado= '';
              };
              html += '<tr data-toggle="modal" data-target="#myModal" data-backdrop="static" class="filaTrans '+estado+'" id="'+i+'"><td>'+data[i].nombre_bnf+' '+data[i].paterno_bnf+' '+data[i].materno_bnf+'</td><td style="font-size:16px;font-weight:bold;">'+data[i].monto+'</td><td>'+data[i].nombre_rmt+' '+data[i].paterno_rmt+' '+data[i].materno_rmt+'</td><td>'+data[i].fecha+'</td><td style="color:#2e6da4;font-size:16px;font-weight:bold;">'+data[i].oficina_ori+'</td><td>'+data[i].nroRecibo+'</td><td><b>'+data[i].comicion+'</b></td><td><b>'+data[i].monto_conceptos+'</b></td><td>'+data[i].moneda+'</td><td>'+data[i].obs+'</td><td>'+data[i].otros_conceptos+'</td><td>'+data[i].estado+'</td></tr>';
            }
            $('#listaTransf').html(html);
            $('.table-responsive').waitMe('hide');
          }
        });
      };
      //otra function
      function ajax_TransferenciasActivas(){
        $('.table-responsive').waitMe({effect : 'progressBar',text : 'Recuperando Datos'});
        $.ajax({
          data:{'pg':pagina},
          url:'/listaTransfereciasActivas_ajax/',
          //async:false,
          type:'GET',
          dataType:'json',
          success: function(data){
            Aux = data;
            var html ="";
            for(var i=0;i<data.length;i++){
              var estado ="";
              if(data[i].estado=="pagado"){
                estado = "success";
              };
              if(data[i].pago_forzado=="si"){
                estado= "warning";
              };
              if(data[i].estado =="extornado"){
                estado="danger";
              };
              
              if(data[i].estado=="activo"){
                estado= '';
              };
              html += '<tr data-toggle="modal" data-target="#myModal" data-backdrop="static" class="filaTrans '+estado+'" id="'+i+'"><td>'+data[i].nombre_bnf+' '+data[i].paterno_bnf+' '+data[i].materno_bnf+'</td><td style="font-size:16px;font-weight:bold;">'+data[i].monto+'</td><td>'+data[i].nombre_rmt+' '+data[i].paterno_rmt+' '+data[i].materno_rmt+'</td><td>'+data[i].fecha+'</td><td style="color:#2e6da4;font-size:16px;font-weight:bold;">'+data[i].oficina_ori+'</td><td>'+data[i].nroRecibo+'</td><td><b>'+data[i].comicion+'</b></td><td><b>'+data[i].monto_conceptos+'</b></td><td>'+data[i].moneda+'</td><td>'+data[i].obs+'</td><td>'+data[i].otros_conceptos+'</td><td>'+data[i].estado+'</td></tr>';
            }
            $('#listaTransf').html(html);
            $('.table-responsive').waitMe('hide');
          }
        });
      };
      //otra fucnio
      function ajax_TransferenciasCBActivas(){
        $('.table-responsive').waitMe({effect : 'progressBar',text : 'Recuperando Datos'});
        $.ajax({
          data:{'pg':pagina},
          url:'/ListaTransRecibidasCBActiva_ajax/',
          //async:false,
          type:'GET',
          dataType:'json',
          success: function(data){
            Aux = data;
            var html ="";
            for(var i=0;i<data.length;i++){
              var estado ="";
              if(data[i].estado=="pagado"){
                estado = "success";
              };
              if(data[i].pago_forzado=="si"){
                estado= "warning";
              };
              if(data[i].estado =="extornado"){
                estado="danger";
              };
              
              if(data[i].estado=="activo"){
                estado= '';
              };
              html += '<tr data-toggle="modal" data-target="#myModal" data-backdrop="static" class="filaTrans '+estado+'" id="'+i+'"><td>'+data[i].nombre_bnf+' '+data[i].paterno_bnf+' '+data[i].materno_bnf+'</td><td style="font-size:16px;font-weight:bold;">'+data[i].monto+'</td><td>'+data[i].nombre_rmt+' '+data[i].paterno_rmt+' '+data[i].materno_rmt+'</td><td>'+data[i].fecha+'</td><td style="color:#2e6da4;font-size:16px;font-weight:bold;">'+data[i].oficina_ori+'</td><td>'+data[i].nroRecibo+'</td><td><b>'+data[i].comicion+'</b></td><td><b>'+data[i].monto_conceptos+'</b></td><td>'+data[i].moneda+'</td><td>'+data[i].obs+'</td><td>'+data[i].otros_conceptos+'</td><td>'+data[i].estado+'</td></tr>';
            }
            $('#listaTransf').html(html);
            $('.table-responsive').waitMe('hide');
          }
        });
      };
     //-------------
      //otra fucnio
      function ajax_TransferenciasCB(){
        $('.table-responsive').waitMe({effect : 'progressBar',text : 'Recuperando Datos'});
        $.ajax({
          data:{'pg':pagina},
          url:'/ListaTransRecibidasCB_ajax/',
          //async:false,
          type:'GET',
          dataType:'json',
          success: function(data){
            Aux = data;
            var html ="";
            for(var i=0;i<data.length;i++){
              var estado ="";
              if(data[i].estado=="pagado"){
                estado = "success";
              };
              if(data[i].pago_forzado=="si"){
                estado= "warning";
              };
              if(data[i].estado =="extornado"){
                estado="danger";
              };
              
              if(data[i].estado=="activo"){
                estado= '';
              };
              html += '<tr data-toggle="modal" data-target="#myModal" data-backdrop="static" class="filaTrans '+estado+'" id="'+i+'"><td>'+data[i].nombre_bnf+' '+data[i].paterno_bnf+' '+data[i].materno_bnf+'</td><td style="font-size:16px;font-weight:bold;">'+data[i].monto+'</td><td>'+data[i].nombre_rmt+' '+data[i].paterno_rmt+' '+data[i].materno_rmt+'</td><td>'+data[i].fecha+'</td><td style="color:#2e6da4;font-size:16px;font-weight:bold;">'+data[i].oficina_ori+'</td><td>'+data[i].nroRecibo+'</td><td><b>'+data[i].comicion+'</b></td><td><b>'+data[i].monto_conceptos+'</b></td><td>'+data[i].moneda+'</td><td>'+data[i].obs+'</td><td>'+data[i].otros_conceptos+'</td><td>'+data[i].estado+'</td></tr>';
            }
            $('#listaTransf').html(html);
            $('.table-responsive').waitMe('hide');
          }
        });
      };
         //-------------------
     $(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');
      });

        $("#pagoT").click(function(){
          if($("#txtcel_bene").val()!=null && $("#txtcel_bene").val().length ==9){
            {% ifnotequal pt_sin_dni 'si' %}
            /*
            if($("#txtDniMenor").val()=="no"){

              if($("#txtNroCtaBanco").val().trim()!="" && $("#txtNroCtaBanco").val().trim()!=-1 && $("#txtNroCtaBanco").val().trim()!="-1"){
                $('#modal_confirmacion').modal('show');
              }else{
                 $("#pagoT").button('loading');
                 if($("#txtN").val().length>=8){ 
                    $.ajax({
                      data:{'dni':$("#txtN").val()},
                      url:'/clientes_autocompletado_user_dni_ajax/',
                      //async:false,
                      type:'GET',
                      dataType:'json',
                      success: function(data){
                        //$('#modal_confirmacion').modal('show');
                        if(data=="fail1"){
                              bootbox.alert("Ocurrio un error. Vuelva a intentarlo");
                            }else{
                              //if(data=="fail"){
                                 consulta();
                              // begin comentario omar
                              }else{
                                nombreBeneficiado=data.nombre;
                                apBeneficiado=data.ap;
                                amBeneficiado=data.am;
                                var nCompleto=nombreBeneficiado+" "+apBeneficiado+" "+amBeneficiado;
                                $("#txtDatosC").text("Datos Creados : "+$("#txtNombres_Bene").text());
                                $("#txtDatosR").text("Datos RENIEC : "+nCompleto);
                                var n=levDist($("#txtNombres_Bene").text().trim(),nCompleto.trim());
                                //alert(n);
                                $("#pagoT").button('reset');
                                if(n<=5){
                                  $('#modal_confirmacion').modal('show'); 
                                }else{
                                  $('#modal_confirmacion_reniec').modal('show'); 
                                }
                              }
                              //end comentario omar
                            }
                            //begin comentario omar
                          if(data=="fail"){
                            consulta();
                          }else{ 
                            nombreBeneficiado=data.nombre;
                            apBeneficiado=data.ap;
                            amBeneficiado=data.am;
                            var nCompleto=nombreBeneficiado+" "+apBeneficiado+" "+amBeneficiado;
                            $("#txtDatosC").text("Datos Creados : "+$("#txtNombres_Bene").text());
                            $("#txtDatosR").text("Datos BD : "+nCompleto);
                            var n=levDist($("#txtNombres_Bene").text(),nCompleto);
                            $("#pagoT").button('reset');
                            //if(n<=10){
                              $('#modal_confirmacion').modal('show'); 
                            //}else{
                              $('#modal_confirmacion_reniec').modal('show'); 
                            //}
                          }
                        console.log(data);
                        //end comentario omar
                      },
                      error: function(xhr, textStatus, errorThrown) { 
                          $("#pagoT").button('reset');
                          console.log(xhr.responseText);
                      },
                    });
                  
                  }
                }
              
            }else{
                $('#modal_confirmacion').modal('show');
            }
            */
            $('#modal_confirmacion').modal('show');
            {% else %}
               $('#modal_confirmacion').modal('show');
            {% endifnotequal %}
          }
          else{
            bootbox.alert({ 
              message: "Complete el campo de Celular del beneficiado",
              className: 'bb-alternate-modal'
            }); 
          }
      });

      $("#solCod").click(function(){
        ajax_solicitudAut(Aux[filaI].id_trans);
      })
      $("#txtCodA").keyup(function(){
        if($(this).val().trim().length ==6){
           $("#pagoT").prop('disabled',false);
        }
        else{
          $("#pagoT").prop('disabled',true);
        }
      });

      $("#alert_aceptar").click(function(){
        mostrar_progress();
        /*
            $("#plObs").text($("#txtObspa").val());
            if($("#txtEgreso").val()==null || $("#txtEgreso").val().trim()==""){
              $("#importeeg").text(mon_m+"0.00");
            }
            else{
              $("#importeeg").text(mon_m+($("#txtEgreso").val()));
            }
            if($("#txtIngreso").val()==null || $("#txtIngreso").val().trim()==""){
              $("#importein").text(mon_m+"0.00");
            }
            else{
              $("#importein").text(mon_m+($("#txtIngreso").val()));
            }

        ajax_solicitudPago(Aux[filaI].id_trans);
        */
        $("#formulario").submit();
        ocultarmodal();
      });
      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();
      };
      //otra funcion
      /*
      function ajax_solicitudPago(idTransf){
        $.ajax({
          data:{'idT':idTransf,'obs':$("#txtObspa").val(),'dni':$("#txtN").val(),'egreso':$("#txtEgreso").val(),'ingreso':$("#txtIngreso").val(),'cod_aut':$("#txtCodA").val(),'nrocta':$("#txtNroCta").val(),"dniMenor":$("#txtDniMenor").val(),'celular':$("#txtcel_bene").val()},
          url:'/Pagar_tranf_ajax/',
          //async:false,
          type:'GET',
          dataType:'json',
          success: function(data){
            if(data.exito=='exito'){
              $("#nror").text(data.nr);
              $("#pteg").text(data.nr);
              $("#ptin").text(data.nr);
              $("#nroin").text(data.nri);
              $("#nroeg").text(data.nre);

              $("#ExitoMensaje").prop('class','bg-info');
              $("#ExitoMensaje").text("La transferencia se PAGO!");


              bootbox.alert({ 
                message: "La transferencia se pago",
                className: 'bb-alternate-modal'
              });

              if($.trim(nombreBeneficiado)!="")
                $("#plB").text(nombreBeneficiado +" "+ apBeneficiado +" "+ amBeneficiado);


              $('#platillaI').printThis();
              if(data.nri !=""){
                $('#platillaIngreso').printThis();
              }
              if(data.nre!=""){
                $('#platillaEgreso').printThis();
              }
              ocultar_progress();
              Transferencias();
               $('#txtN').prop("value",' ');
             }
           else{
              ocultar_progress();
              $("#ExitoMensaje").prop('class','bg-danger');
              $("#ExitoMensaje").text(" la operacion fallo :(" + data.exito);
              bootbox.alert({ 
                message: "La Operación falló",
                className: 'bb-alternate-modal'
              });
             }
          }
        });
      };
      */
      //-----------------
      function ajax_solicitudAut(idTransf){
        $.ajax({
          data:{'idTr':idTransf},
          url:'/solicitud_Autorizacion_retiro_trans_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'
              });
            }
          }
        });
      };
      

      function Transferencias(){
        if($("#ts4").prop("checked")) { 
          if ($("#ts5").prop("checked")){
            ajax_TransferenciasCBActivas();
          }
          else{
            ajax_TransferenciasActivas();
          }
          
        } else {
          if ($("#ts5").prop("checked")){
            ajax_TransferenciasCB();
          }
          else{
            ajax_Transferencias(); 
          }
           
        }
      };

      function PonerInicioPag(){
          $(".pag").attr('class','pag');
          $("#pag1").attr('class','active pag');
          $("#pg1").text(1);
      };
     
     //-------------------
     $(".pag").click(function(){
        $(".pag").attr('class','pag');
        $(this).attr('class','active pag');
        pagina = $(this).text();
        Transferencias();
      })
      $("#ant").click(function(){
        var pag = $("#pg1").text();
        pag= parseInt(pag);
        if(pag>1){
          $("#pg1").text(pag-1);
           pagina = pag-1;
           Transferencias();
        }
      });
      $("#pos").click(function(){
        var pag = $("#pg1").text();
        pag= parseInt(pag);
        $("#pg1").text(pag+1);
        pagina = pag+1;
        Transferencias();
      });
     //
     //--------- filtro avanzado
        $('#txtnropagFA').numeric(); 
        $('#txtfechaFA1').datetimepicker({
          locale: 'es',
          format: 'YYYY-MM-DD'
        });
        $('#txtfechaFA2').datetimepicker({
          locale: 'es',
          format: 'YYYY-MM-DD'
        });
        $("#txtfechaFA1").hide();
        $("#txtfechaFA2").hide();
        $("#comboFechasFA").change(function(){
          if($(this).val()=="0"||$(this).val()=="h"){
            $("#txtfechaFA1").hide();
            $("#txtfechaFA2").hide();
          }
          if($(this).val()=="f"){
            $("#txtfechaFA1").show();
            $("#txtfechaFA2").hide();
          }
          if($(this).val()=="ef"){
            $("#txtfechaFA1").show();
            $("#txtfechaFA2").show();
          }
        });
        ajax_oficinaOri();
         function ajax_oficinaOri(){
            $.ajax({
              {% ifequal OfCentral 'si' %}
              url:'/oficinas_version3_ajax/',
              {% else %}
               url:'/oficinas_version2_ajax/',
              {% endifequal %}
              type:'GET',
              dataType:'json',
              success: function(data){
              var html ='<option value="0">Todas las oficinas</option>';
                $("#ComboOficinaFA").html('');
                for(var i=0;i<data.length;i++){
                  if(data[i].bx == 'si'){
                    html += '<option value="'+data[i].pk+'" style="background-color: #FFA;color: #000;">'+data[i].nombre_oficina+'</option>';
                  }
                  else{
                    html += '<option value="'+data[i].pk+'">'+data[i].nombre_oficina+'</option>';
                  }
                }
                $('#ComboOficinaFA').html(html);
                $('#ComboOficinaFA').selectize();
              }
            });
          };
          //----
          $("#ProcesarFA").click(function(){
            var saFA=null;
            if($("#ts4FA").prop("checked")){
              saFA="sa";
            }
            ajax_TransferenciasFA(saFA);
          })
          //-------

          //--------
          function ajax_TransferenciasFA(sa){
          $('.table-responsive').waitMe({effect : 'progressBar',text : 'Recuperando Datos'});
          $.ajax({
            data:{'pg':pagina,'filtroF':$("#comboFechasFA").val(),'fDesde':$("#txtfechaFA1").val(),'fHasta':$("#txtfechaFA2").val(),'sa':sa,'oficina':$("#ComboOficinaFA").val(),'fNombre':$("#txtnombreFA").val(),'fAp':$("#txtapFA").val(),'fAm':$("#txtamFA").val(),'nroXpag':$("#txtnropagFA").val()},
            url:'/listaTransfereciasRecibidas_filtro_avanzado_ajax/',
            //async:false,
            type:'GET',
            dataType:'json',
            success: function(data){
              Aux = data;
              var html ="";
              for(var i=0;i<data.length;i++){
                var estado ="";
                if(data[i].estado=="pagado"){
                  estado = "success";
                };
                if(data[i].pago_forzado=="si"){
                  estado= "warning";
                };
                if(data[i].estado =="extornado"){
                  estado="danger";
                };
                
                if(data[i].estado=="activo"){
                  estado= '';
                };
                html += '<tr data-toggle="modal" data-target="#myModal" data-backdrop="static" class="filaTrans '+estado+'" id="'+i+'"><td>'+data[i].nombre_bnf+' '+data[i].paterno_bnf+' '+data[i].materno_bnf+'</td><td style="font-size:16px;font-weight:bold;">'+data[i].monto+'</td><td>'+data[i].nombre_rmt+' '+data[i].paterno_rmt+' '+data[i].materno_rmt+'</td><td>'+data[i].fecha+'</td><td style="color:#2e6da4;font-size:16px;font-weight:bold;">'+data[i].oficina_ori+'</td><td>'+data[i].nroRecibo+'</td><td><b>'+data[i].comicion+'</b></td><td><b>'+data[i].monto_conceptos+'</b></td><td>'+data[i].moneda+'</td><td>'+data[i].obs+'</td><td>'+data[i].otros_conceptos+'</td><td>'+data[i].estado+'</td></tr>';
              }
              $('#listaTransf').html(html);
               $("#modalFiltroAvanzado").modal("hide");
              $('.table-responsive').waitMe('hide');
            }
          });
        };
          //------
          //-
     //
     //---------------
     //
    });
    
    function levDist(str1,str2) {
          if (str1 == null) {
              return str2;
          }
          if (str2 == null) {
              return str1;
          }
          var at = indexOfDifference(str1, str2);
          if (at == -1) {
              return "";
          }
          return str2.substring(at);
      }

        function indexOfDifference(str1, str2) {
          if (str1 == str2) {
              return -1;
          }
          if (str1 == null || str2 == null) {
              return 0;
          }
          var i;
          for (i = 0; i < str1.length && i < str2.length; ++i) {
              if (str1.charAt(i) != str2.charAt(i)) {
                  break;
              }
          }
          if (i < str2.length || i < str1.length) {
              return i;
          }
          return -1;
      }

</script>
                          <div class="table-responsive">
                            <table class="table table-hover table-bordered" id="tableSTR">
                                <thead>
                                  <tr >
                                    <th>Beneficiado</th>
                                    <th>Monto</th>
                                    <th>Solicitante</th>
                                    <th>Fecha</th>
                                    <th>Oficina Origen</th>
                                    <th>S/T</th>
                                    <th>Comision</th>
                                    <th>Otros</th>
                                    <th>Moneda</th>
                                    <th>Obs</th>
                                    <th>Detalle</th>
                                    <th>Estado</th>
                                  </tr>
                                </thead>
                                <tbody id="listaTransf">
                                 
                                </tbody>
                            </table>
                          </div>
                      </div>
                  
                  </div>
                </div>
              </div>
          </div>
        </div>
{% endblock content1 %}