{% extends "base.html" %}
{% load static %}
{% block titulo %}
  .::Transferencias - Creadas
{% endblock titulo %}
{% block content1 %} 
<script type="text/javascript">
  $("#navTrans").attr('class','dropdown active');
  $("#navTransCreadas").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>SOLICITUDES DE TRANSFERENCIAS</strong>
                  <div class="toolbar">
                    <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 item-toolbar" id="imprimir_trans_bu"><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 myb-4">
                    <div class="col-md-2">
                        <div class="select">
                          <select class="form-control form-control-sm" id="comboFiltroF">
                            <option value="h">Hoy</option>
                            <option value="f">Fecha</option>
                            <option value="ef">Entre Fechas</option>
                          </select>
                        </div>
                      </div>
                      <div class="col-md-2" id="div-f1">
                        <input type='text' class=" form-control" id="txtfecha1" autocomplete="off">
                      </div>
                      <div class="col-md-2" id="div-f2">
                        <input type='text' class="form-control" id="txtfecha2" autocomplete="off">
                      </div>
                      <div class="col-md-1" align="center">
                        <button type="button" class=" btn btn-sm btn-danger" id="buscarF"> FILTRAR</button>
                      </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">
                          <label class="">
                            <input id="ts4" type="checkbox" value="success-inverse1"> Solo activos
                          </label>
                      </div> 
                     </div> 

                  </div>
                  <div class="row">
                      <div class="col-md-12">

                          <div id="myModalB" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                            <div class="modal-dialog">
                              <div class="modal-content" id="modal-content-bene">
                                <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">Beneficiado</h4>
                                </div>
                                <div class="modal-body"> 
                                      <div class="row">
                                        <div class="col-md-12">
                                          <div class="alert alert-info" role="alert">
                                            <b>* Corregir Beneficiario: </b>Solo corrige algún dato del beneficiario y esta corrección afectara a transferencias pasadas. (Ejemplo, alguna letra o carácter del nombre).<br>
                                            <b>* Cambiar Beneficiario: </b>Cambiara o reemplazara por completo el beneficiario.
                                          </div>
                                        </div>
                                      </div>
                                      <div class="row">
                                        <div class="col-md-5 col-md-offset-3">
                                          <div class="form-group">
                                            <div class="input-group">
                                              <div class="input-group-addon" ><label id="dniRUCB">DNI:</label></div>
                                              <input type="text" class="form-control" id="txtDNIB" name="DniRucB" data-minlength="8" data-maxlength="11"  data-provide="typeahead" autocomplete="off">
                                            </div>
                                            <div class="form-control-feedback" style="text-align:left;" ></div>
                                            <div class="help-block with-errors"></div>
                                          </div>              
                                        </div>
                                        <div class="col-md-3">
                                          <!--<button class="btn btn-warning btn-block btn-xs" id="btn_consultar">Consultar</button>-->
                                        </div>
                                      </div>
                                      <div class="row">
                                        <input type="text" class="hidden" name="IdBeneficiado" id="IdBeneficiado">
                                        <div class="col-md-3 col-md-offset-1" align="right">
                                          <label>Nombre : </label>
                                        </div>
                                        <div class="col-md-4">
                                          <input type="text" class="form-control" id="txtNombreB" data-provide="typeahead" autocomplete="off">
                                        </div>
                                        <div class="col-md-4">
                                          <button class="btn btn-primary btn-block btn-xs" id="btn_limpiar_bene">Limpiar</button>
                                        </div>
                                      </div>
                                      <p></p>
                                      <div class="row">
                                        <div class="col-md-3 col-md-offset-1" align="right">
                                          <label>Apellido Paterno: </label>
                                        </div>
                                        <div class="col-md-4">
                                          <input type="text" class="form-control" id="txtAPB" data-provide="typeahead" autocomplete="off">
                                          <p></p>
                                        </div>
                                      </div>
                                      <p></p>
                                      <div class="row">
                                        <div class="col-md-3 col-md-offset-1" align="right">
                                          <label>Apellido Materno: </label>
                                        </div>
                                        <div class="col-md-4">
                                          <input type="text" class="form-control" id="txtAMB" data-provide="typeahead" autocomplete="off">
                                          <p></p>
                                        </div>
                                      </div>
                                      <p></p>
                                       <div class="row">
                                      <input type="hidden" id="valorCHB" name="valorCHB">
                                        <div class="col-md-8 col-md-offset-4"> 
                                            <div class="chbOfDNIMenor checkbox">
                                              <label>
                                                <input type="checkbox" id="chb" class="chbo"> Habilitar DNI Menor
                                              </label>
                                            </div>  
                                        </div>
                                      </div>
                                      <div class="row">
                                        <div class="col-md-4">
                                          <button type="button" class="btn btn-sm btn-default btn-block" id="ActualizarBen" data-loading-text="Modificando..."> <i class="fa fa-check" data-toggle="tooltip" data-placement="bottom" title="Click para guardar modificación"></i> Corregir Nombre</button>
                                        </div> 
                                        <div class="col-md-4 col-md-offset-4">
                                          <button  class="btn btn-xs btn-default btn-block" id="CambiarBen">Cambiar Beneficiario</button>
                                        </div> 
                                      </div>
                                </div>
                              </div><!-- /.modal-content -->
                            </div><!-- /.modal-dialog -->
                          </div>

      <div id="myModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
          <div class="modal-dialog modal-lg">
            <div class="modal-content">
               <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                   <label class="modal-title" id="myModalLabel">SOLICITUD DE TRANSFERENCIA</label>
                </div>
              <div class="modal-body">
                <div class="row">
                  <div class="col-md-6" >
                      <div class="panel panel-default">
                        <div class="panel-heading" align="center"> <strong>SOLICITANTE</strong></div>
                        <div class="panel-body">
                          <div class="row myb-4">
                            <!--
                              <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">
                              </div> 
                            -->
                            <div class="col-md-8">
                              <div class="form-group">
                                <div class="input-group">
                                  <div class="input-group-addon" ><label>DNI/RUC:</label></div>
                                  <input type="text" class="form-control" id="txtDNI">
                                </div>
                              </div>
                            </div>
                            
                          </div>
                          <div class="row">
                            <div class="col-md-12">
                              <div class="form-group">
                                <div class="input-group">
                                  <div class="input-group-addon" ><label>Nombres</label></div>
                                  <input type="text" class="form-control" id="txtNombres_Soli">
                                </div>
                              </div>
                            </div>
                          </div>
                          <br>
                          <div class="row">
                            <div class="panel panel-default">
                              <div class="panel-heading" align="center"> <strong>BENEFICIADO</strong></div>
                            </div>
                          </div>
                         
                          <div class="row">
                              <div class="col-md-12"> 
                                  <span>Nombres</span>
                               <label class="pull-left1" id="lbNB"></label> 
                              
                               <label class="pull-left1" id="lbAPB"></label> 
                               <label class="pull-left1" id="lbAMB"></label> 
                              </div>
                            
                              <div class="col-md-offset-4">
                                <div class="btn-group" role="group">
                                   <strong><a class="text-info" href="#" data-toggle="modal" data-target="#myModalB" id="btnMB">Cambiar Nombre</a></strong>
                                 </div>
                               </div>
                                <div class="row">
                                <div class="col-md-12">
                                  <div class="alert alert-danger hidden" id="alertMessage" role="alert" style="color: #313534;">
                                    <strong id="txtMessage"></strong>
                                  </div>
                                </div>
                              </div>
                              <!--<div class="col-md-6">
                                <input type="text" class="form-control" id="txtNombres_Bene" disabled="disabled">         
                              </div>--> 
                          </div>

                          <div class="row">
                            <div class="col-md-8">
                              <div class="form-group">
                                <div class="input-group">
                                  <div class="input-group-addon" ><label>DNI</label></div>
                                  <input type="text" class="form-control" id="txtN">
                                </div>
                              </div>
                            </div>
                          </div>
                          
    
                        </div>
                      </div>
                      <div class="panel panel-default" id="divDetBanco">
                        <div class="panel-heading">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">
                              </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">
                              </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 class="row">
                            <div class="col-md-12" align="center">
                              <div class="btn-group" role="group">
                                 <strong><a class="text-info" href="#" id="btn_actualizar_bancos">Actualizar Datos de Bancos</a></strong>
                               </div>
                            </div>
                          </div>

                        </div>
                      </div>
                  </div>
                  <div class="col-md-6">
                    <div class="panel panel-success">
                      <div class="panel-heading panel-toolbar"> 
                        <strong>TRANSFERENCIA</strong>
                        <button type="button" class="btn btn-success btn-sm" id="rimprimir">Re-imprimir</button>
                      </div>
                      <div class="panel-body">
                        
                        <div class="row myb-4">
                            <div class="col-md-8">
                              <div class="form-group">
                                <div class="input-group">
                                  <div class="input-group-addon" ><label>ID</label></div>
                                  <input type="text" class="form-control" id="txtIDtrans" disabled="disabled">   
                                </div>
                              </div>
                            </div>
                        </div>
                        <div class="row myb-4">
                            <div class="col-md-8">
                              <div class="form-group">
                                <div class="input-group">
                                  <div class="input-group-addon" ><label>Estado</label></div>
                                  <input type="text" class="form-control" id="txtEstadoTrans" disabled="disabled">
                                </div>
                              </div>
                            </div>
                            <div class="col-md-2">
                              <button type="button" class="btn btn-danger btn-sm"id="extornarT">Extornar</button>
                            </div>
                        </div>
                          <div class="row">
                            <div class="col-md-12"> 
                              <h4 >Nro Recibo: <b id="txtnr"></b></h4> 
                            </div>
                          </div>
                          <div class="row myb-4">
                            <div class="col-md-8">
                              <div class="form-group">
                                <div class="input-group">
                                  <div class="input-group-addon" ><label>Fecha</label></div>
                                  <input type="text" class="form-control" id="txtFecha" disabled="disabled">   
                                </div>
                              </div>
                            </div>
                          </div>
                          <div class="row myb-4">
                            <div class="col-md-12">
                              <div class="form-group">
                                <div class="input-group">
                                  <div class="input-group-addon" ><label>Emisor</label></div>
                                  <input type="text" class="form-control" id="txtPersonalE" disabled="disabled">   
                                </div>
                              </div>
                            </div>
                          </div>
                          <!--
                           <div class="row">
                              <div class="col-md-4 col-md-offset-1" align="right"> 
                                <label>Usuario Global</label> 
                              </div>
                              <div class="col-md-7">
                                <input type="text" class="form-control" id="txtPerDig" disabled="disabled">         
                              </div> 
                          </div>-->
                          <div class="row myb-4">
                            <div class="col-md-9">
                              <div class="form-group">
                                <div class="input-group">
                                  <div class="input-group-addon" ><label>Destino</label></div>
                                  <input type="text" class="form-control" id="txtOficinaDest" disabled="disabled">   
                                </div>
                              </div>
                            </div>
                            <div class="col-md-3">
                                <button type="button" class="btn btn-block btn-warning btn-xs" data-toggle="modal" data-target="#modalCambiar" id="btnModalCmbioOD">
                                  Cambiar</button>
                            </div>
                          </div>

                          <div class="row myb-4">
                            <div class="col-md-8">
                              <div class="form-group">
                                <div class="input-group">
                                  <div class="input-group-addon" ><label>Cantidad</label></div>
                                  <input type="text" class="form-control t-monto" id="txtMonto" disabled="disabled">   
                                </div>
                              </div>
                            </div>
                          </div>

                          <div class="row myb-4">
                            <div class="col-md-8">
                              <div class="form-group">
                                <div class="input-group">
                                  <div class="input-group-addon" ><label>Comisión</label></div>
                                  <input type="text" class="form-control t-monto" id="txtComicion" disabled="disabled">   
                                </div>
                              </div>
                            </div>
                          </div>

                         
                 
                          <div class="row">
                              <div class="col-md-12">
                                <label>Observaciones / Detalle</label> 
                              </div>
                              <div class="col-md-12">
                                <!--
                                <input type="text" class="form-control" id="txtObs" disabled="disabled">-->
                                <textarea class="form-control" rows="3" id="txtotros_con" disabled="disabled" ></textarea >         
                              </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">
                                <textarea class="form-control" rows="3"  id="txtObspe"></textarea >         
                              </div> 
                          </div>
                          -->
                      </div>
                    </div>
                  </div>
                </div>
                  
              </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:'Lucida Console', Monaco, monospace;font-size:13px;">
                                      <label align="center"><b>PAGO DE TRANSFERENCIAS</b></label>
                                      <table>
                                        <tr nowrap>=============================</tr>
                                      </table>
                                      <h6 id="plTitulo"></h6>
                                      <b>Destino:</b>
                                      <p id="plOri"></p>
                                      <b>Beneficiado:</b>
                                      <p id="plB" style="word-wrap: break-word;"></p>
                                      <b>Remitente:</b>
                                      <p id="plR" style="word-wrap: break-word;"></p>
                                      <b>Observaciones:</b>
                                      <p id="plObs" style="word-wrap: break-word;"></p>
                                      <b>Fecha de operación:</b>
                                      <p id="fepa"></p>
                                      <b>Monto:</b>
                                      <h4 id="plM"></h4>
                                      <p id="caextTo"><b>Comision / Bancos: </b> <span id="extCo"></span></p>
                                      <br>
                                      <table>
                                        <tr>
                                          <td nowrap>__________&nbsp;</td>
                                          <td>&nbsp;</td>
                                          <td nowrap>&nbsp;____________</td>
                                        </tr>
                                        <tr>
                                          <td nowrap><h6>Recibí conforme</h6></td>
                                          <td>&nbsp;</td>
                                          <td nowrap>&nbsp;&nbsp; Op. {{ nombre_usuario }}</td>
                                        </tr>
                                      </table>
                                      <p><b>DNI:</b>&nbsp;<b id="idn"></b></p>
                                      <p id ="hopa"></p>
                                    </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 -->
                         <div id="modal2" 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="platillaI2" style="font-family:'arial', Monaco, monospace;font-size:18px;">
                                     <table>
                                      <tr style="text-align: center;">
                                      <td align="center" colspan="3"><img src="{% static 'img/golden-letras.png' %}" style="width: 400px; padding-bottom:20px;"></td></tr>
                                         <tr style="border: 1px solid #000">
                                          <td width="15%"></td>
                                          <td><h4>SOLICITUD TRANSFERENCIA</h4></td>
                                          <td nowrap width="14%"></td>
                                        </tr>
                                      </table>  
                                      <table>
                                         <tr>
                                          <td nowrap style="text-align: left;"><h4 id="nror"></h4> </td>
                                          <td nowrap style="padding-left: 150px"><h4 id="idST"></h4> </td>
                                          <td nowrap style="padding-right:10px"></td>
                                        </tr>
                                        <tr>
                                          <td nowrap>FECHA:  </td>
                                          <td nowrap style="padding-left: 20px"><span id="fechaRecibo"></span></td>
                                          <td nowrap></td>
                                        </tr>
                                        
                                       
                                      </table>
                                      
                                      <table>
                                        <tr>
                                          <td nowrap>PROCEDENCIA:</td>
                                          <td style="padding-left: 20px"> <h4 id="oficinaRecibo">{{ SITE_URL }}<h4></td>
                                          <td nowrap></td>
                                        </tr>
                                      </table>

                                      <table>
                                        <tr>
                                          <td nowrap>DESTINO:</td>
                                          <td style="padding-left: 15px"><h4 id="oficinaDestino"><h4></td>
                                          <td nowrap></td>
                                        </tr>
                                         <tr>
                                          <td nowrap style="padding-bottom: 18px;">SOLICITANTE:</td>
                                          <td nowrap style="padding-left: 15px;white-space: pre;"><span id="soli"></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="bene"></span></td>
                                          <td nowrap></td>
                                        </tr>
                                      </table>

                                       <table>
                                        <tr>
                                          <td nowrap><h3><b>IMPORTE:</b></h3></td>
                                          <td nowrap></td>
                                          <td nowrap></td>
                                        </tr>
                                         <tr>
                                          <td nowrap style="padding-left: 5px">MONTO:</td>
                                          <td nowrap style="padding-left: 20px"></td>
                                          <td nowrap><h4 id="monto_tr"></h4></td>
                                        </tr>
                                         <tr>
                                          <td nowrap style="padding-left: 5px">COMISIÓN:</td>
                                          <td nowrap style="padding-left: 20px"></td>
                                          <td nowrap><h4 id="comi_tr"></h4></td>
                                        </tr>
                                         <tr>
                                          <td nowrap style="padding-left: 5px">OTROS:</td>
                                          <td nowrap style="padding-left: 20px"></td>
                                          <td nowrap><h4 id="otros_tr"></h4></td>
                                        </tr>
                                         <tr>
                                          <td nowrap><h3><b>IMPORTE TOTAL:</b></h3></td>
                                          <td nowrap></td>
                                          <td nowrap><h3><b id="importe"></b></h3></td>
                                        </tr>
                                      </table>
                                      <table>
                                        <tr>
                                          <td nowrap>OBSERVACIONES:</td>
                                          <td style="padding-left: 20px" id="reciboObs"></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 id="soli1"></td>
                                        </tr> 
                                       
                                      </table>
                                       <br></br>
                                      <table>
                                        <tr>
                                          <td width="20%">Contáctenos :</td>
                                          <td width="80%" style="text-align: left;padding-left: 10px;">{{ ObsOficina }}</td>
                                          <!--<td>{{ ObsOficina }}</td>-->
                                        </tr>
                                      </table>      
                                    </div>
                                  </div>
                                  <!--<div class="modal-body">
                                    <div  id="platillaI2"  style="font-family:'Lucida Console', Monaco, monospace;font-size:13px;">
                                      <label align="center"><b>SOLICITUD DE TRANSFERENCIA</b></label>
                                      <table>
                                        <tr nowrap>===================================</tr>
                                      </table>
                                     
                                      <table>
                                        <tr>
                                          <td nowrap> <label id="fechaRecibo"></label></td>
                                        </tr>
                                      </table>
                                      <table>
                                        <tr>
                                          <td id="oficinaRecibo" style="width:100px;">{{ SITE_URL }}</td>
                                          <td style="padding-top:-10px;"><div style="width:40px;"> </div></td>
                                          <td style="width:60px; text-align:right;">Nº<span id="nror"></span></td>
                                        </tr>
                                      </table>
                                     
                                      <table>
                                        <tr>
                                          <td  valign="top" style="padding-top:10px;"><b>Of. Destino:</b></td>
                                          <td style="padding-top:10px;"><div style="width:20px;height:20px;"> </div></td>
                                          <td id="oficinaDestino" style="padding-top:10px;" ></td>
                                        </tr>
                                        <tr >
                                          <td  valign="top" style="padding-top:10px;"><b>Beneficiado:</b></td>
                                          <td style="padding-top:10px;"><div style="width:20px;"> </div></td>
                                          <td id="bene" style="padding-top:10px;word-wrap: break-word;"></td>
                                        </tr>
                                        <tr>
                                          <td  valign="top" style="padding-top:10px;"><b>Solicitante:</b></td> 
                                          <td style="padding-top:10px;"><div style="width:20px;height:15px;"> </div></td>
                                          <td id="soli" style="padding-top:10px;word-wrap: break-word;"></td>
                                        </tr>
                                      </table>
                                      
                                      <b>IMPORTE:</b>
                                      <table>
                                        <tr>
                                          <td>Monto:</td>
                                          <td ><div style="width:40px;"> </div></td>
                                          <td ><h4 id="monto_tr" style="text-align:right;"></h4></td>
                                        </tr>
                                        <tr>
                                          <td>Comisión</td>
                                          <td ><div style="width:40px;"> </div></td>
                                          <td id="comi_tr" style="text-align:right;"></td>
                                        </tr>
                                        <tr>
                                          <td>Otros:</td>
                                          <td ><div style="width:40px;"> </div></td>
                                          <td id="otros_tr" style="text-align:right;"></td>
                                        </tr>
                                      </table> 
                                      <br>
                                      <b>IMPORTE TOTAL:</b>
                                      <h4 id="importe"></h4>
                                      <table>
                                        <tr>
                                          <td><b>Observaciones:</b></td>
                                        </tr>
                                        <tr>
                                          <td id="reciboObs"></td>
                                        </tr>
                                        <tr>
                                          <td><b>Otros detalle:</b>
                                          </td>
                                        </tr>
                                        <tr>
                                          <td id="reciboDet"></td>
                                        </tr>
                                      </table>
                                      
                                      <table>
                                        <tr>
                                          <td><div style="height:30px;"> </div></td>
                                        </tr>
                                        <tr>
                                          <td>____________________</td>
                                        </tr>
                                        <tr>
                                          <td nowrap><label><b>OP. {{ nombre_usuario }}</b></label></td>
                                        </tr>
                                        <tr>
                                          <td><div style="height:35px;"> </div></td>
                                        </tr>
                                        <tr>
                                          <td>____________________</td>
                                        </tr>
                                        <tr>
                                          <td nowrap><b><span id="soli1"></span></b></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 -->
                          <div id="modalreciboComision" 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="platillaComision"  style="font-family:'Lucida Console', Monaco, monospace;font-size:13px;">
                                      <label align="center"><b>RECIBO DE EGRESO</b></label>
                                      <table>
                                        <tr nowrap>==============================</tr>
                                      </table>
                                      <label>{{ SITE_URL }}</label>
                                      <b> OFICINA DESTINO:</b>
                                      <p id="recibi">CUSCO</p>
                                      <br>
                                      <b>IMPORTE:</b>
                                      <table>
                                        <tr>
                                          <td>&nbsp;</td>
                                          <td>Soles</td>
                                          <td>&nbsp;</td>
                                          <td>Dolares</td>
                                        </tr>
                                        <tr>
                                          <td nowrap>Comisión: S/</td>
                                          <td nowrap><h4 id="MScomi"></h4></td>
                                          <td>&nbsp;</td>
                                          <td nowrap><h4 id="MDcomi"></h4></td>
                                        </tr>
                                        <tr>
                                          <td nowrap>Capital:</td>
                                          <td nowrap><h4 id="MScapi"></h4></td>
                                          <td>&nbsp;</td>
                                          <td nowrap><h4 id="MDcapi"></h4></td>
                                        </tr>
                                        <tr>
                                          <td>Pagos Transferencia:</td>
                                          <td nowrap><h4 id="MSPT"></h4></td>
                                          <td>&nbsp;</td>
                                          <td nowrap><h4 id="MDPT"></h4></td>
                                        </tr>
                                        <tr>
                                          <td>Egreso:</td>
                                          <td nowrap><h4 id="MegresoS"></h4></td>
                                          <td>&nbsp;</td>
                                          <td nowrap><h4 id="MegresoD"></h4></td>
                                        </tr>
                                        <tr>
                                          <td>Total:</td>
                                          <td nowrap><h4 id="MStotal"></h4></td>
                                          <td>&nbsp;</td>
                                          <td nowrap><h4 id="MDtotal"></h4></td>
                                        </tr>
                                      </table>
                                      <b>CONCEPTO:</b>
                                      <p >Envío de dinero </p>
                                      <br>
                                      <br>
                                      <p>________________</p>
                                      <b>OP. {{ nombre_usuario }}</b>
                                      <table>
                                        <tr>
                                          <td><label id="fechaCo"></label></td>
                                          <td>&nbsp;</td>
                                          <td><label id="horaCo"></label></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 -->
                              <!--<input type="button" class="btn btn-default btn-block" data-toggle="modal" data-target="#myModal" value="Clientes">-->
                          <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 >EXTORNAR TRANFERENCIA ?</h3>
                                        </div>
                                        <div class="row grp_alr" align="center">
                                          <h4 id="extorno_total"></h4>
                                        </div>
                                        <div class="row grp_alr" align ="center">
                                          <label>Esta accion sera irreversible!</label>
                                        </div>

                                        <div class="row grp_dni_cod">
                                          <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">
                                            </div>
                                          </div>
                                        </div>
                                        <p></p>
                                        <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">EXTORNAR</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-4">
              <div class="checkboxFA">
                  <label class="">
                    <input id="ts4FA" type="checkbox"> Solo activos
                  </label>
              </div> 
            </div>
            <div class="col-md-3 ">
              <div class="checkboxSAFA">
                  <label class="">
                    <input id="ts4FASA" type="checkbox" checked> Solo de esta Caja
                  </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 DESTINO
            </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-inverse btn-block" 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-->
<!-- cambio de oficina destino-->
<div id="modalreciboCambio" 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="ReciboCambio" style="font-family:'Lucida Console', Monaco, monospace;font-size:13px;">
          <table>
            <tr style="text-align: center;">
                <td align="center"><img src="{% static 'img/golden-letras.png' %}" style="width: 300px; padding-bottom:20px;"></td>
            </tr>
          </table>
          <hr/>
          <label>{{ SITE_URL }}</label>
          <table>
            <tr>
              <td>N° R/I: </td>
              <td id="cd_nrore" style="padding-left: 10px;"></td>
            </tr>
            <tr>
              <td>Fecha: </td>
              <td id="cd_fecha" style="padding-left: 10px;" nowrap></td>
            </tr>
          </table>
          <b>IMPORTE:</b>
          <p id="cd_monto"></p>
          <b>CONCEPTO:</b>
          <p id="cd_concepto"></p>
          <br>
          <table>
            <tr>
              <td>______________________</td>
            </tr>
            <tr>
              <td nowrap><h6>OP. {{ nombre_usuario }}</h6> </td>
            </tr>
          </table>
        </div>
      </div>

    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!--/cambio de oficina destino-->

                          <div class="table-responsive" >
                            <table class="table table-hover table-striped" id="tableST">
                                <thead>
                                  <tr >
                                    <th>Beneficiado</th>
                                    <th>Monto</th>
                                    <th>Remitente</th>
                                    <th>Fecha</th>
                                    <th>Destino</th>
                                    <th>S/T</th>
                                    <th>Comision</th>
                                    <th>Banco</th>
                                    <th>Otros</th>
                                    <th>Moneda</th>
                                    <th>Obs.</th>
                                    <th>Estado</th>
                                    <th>Fecha de Pago</th>
                                  </tr>
                                </thead>
                                <tbody id="listaTransf">
                                </tbody>
                            </table>
                          </div>
                      </div>
                  </div>
                  <br>
                </div>
              </div>
          </div>
        </div>

<!--                      cambio de oficina de destino                   -->
<div id="modalCambiar" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog" id="campo_modal_cambio">
      <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>
          <label class="modal-title" id="myModalLabel">CAMBIO DE DESTINO</label>
        </div>
        <div class="modal-body">
          <div class="row">
            <div class="col-md-2">
              <input type="text" class="form-control" id="CambioOD_txtpkst" disabled>
            </div>
          </div>
          <p></p>
          <div class="row">
            <div class="col-md-12">
              <div class="panel panel-default">
                <div class="panel-body">
                  <div class="row">
                    <div class="col-sm-2" align="left">
                      <label>Para:</label>
                    </div>
                    <div class="col-sm-8" align="left">
                      <label id="CambioOD_lblbene"></label>
                    </div>
                  </div>
                  <div class="row">
                    <div class="col-sm-2" align="left">
                      <label>Monto:</label>
                    </div>
                    <div class="col-sm-3" align="left">
                      <label id="CambioOD_lblmonto"></label>
                    </div>
                    <div class="col-sm-2 col-sm-offset-2" align="left">
                      <label>Comision:</label>
                    </div>
                    <div class="col-sm-3" align="left">
                      <label id="CambioOD_lblcomision"></label>
                    </div>
                  </div>
                  <div class="row">
                    <div class="col-sm-2" align="left">
                      <label>Destino:</label>
                    </div>
                    <div class="col-sm-6" align="left">
                      <label style="color:orange;" id="CambioOD_lblofides"></label>
                    </div>
                    
                  </div>


                </div>
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-md-3 col-md-offset-2">
              <label style="color: blue;">Nuevo Destino:</label>
            </div>
            <div class="col-md-5">
              <div class="select">
                <select id="ComboOficinaDes" placeholder="Seleccione Oficina"></select>
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-md-12">
              <div class="panel panel-default">
                <div class="panel-body">
                  <div class="row">
                    <div class="col-sm-2" align="left">
                      <label>Destino:</label>
                    </div>
                    <div class="col-sm-8" align="left">
                      <label style="color: green;" id="CambioOD_lblofidesnuevo"></label>
                    </div>
                  </div>
                  <div class="row">
                    <div class="col-sm-2" align="left">
                      <label>Monto:</label>
                    </div>
                    <div class="col-sm-3" align="left">
                      <label id="CambioOD_lblmontonuevo"></label>
                    </div>
                    <div class="col-sm-2 col-sm-offset-2" align="left">
                      <label>Comision:</label>
                    </div>
                    <div class="col-sm-3" align="left">
                      <input type="text" class="form-control" id="CambioOD_txtcomisionuevo">
                    </div>
                    <div class="col-md-12">
                      <span id="sp-texto-comi">La comisión es menor a la establecida</span>
                    </div>
                  </div>
                  <div class="row" hidden>
                    <div class="col-sm-3" align="left">
                      <input type="text" class="form-control" id="codigoComiCambioDestino">
                    </div>
                  </div>


                </div>
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-md-12">
              <div class="panel panel-default">
                <div class="panel-body">
                  <div class="row">
                    <div class="col-sm-5" align="left">
                      <label>Reembolso de Comision:</label>
                    </div>
                    <div class="col-sm-5" align="left">
                      <label id="lblreembolsoComision"></label>
                    </div>
                  </div>
                  <div class="row">
                    <div class="col-sm-5" align="left">
                      <label>Cambio de Destino:</label>
                    </div>
                    <div class="col-sm-4" align="left">
                      <label id="lblDerechoCDestino">{{DCambioOfi}}</label>
                    </div>
                  </div>
                  <div class="row">
                    <div class="col-sm-5" align="left">
                      <label>Importe Total:</label>
                    </div>
                    <div class="col-sm-4" align="left">
                      <label id="lblTotal"></label>
                    </div>
                  </div>

                </div>
                
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-md-3 col-md-offset-1" align="left">
              <label>Observaciones: </label>
            </div>
            <div class="col-md-7">
              <textarea class="form-control" rows="2" id="txtObsCambioDestino"></textarea >
            </div>
          </div>
          <p></p>
          <div class="row">
            <div class="col-md-6 col-md-offset-3">
              <button type="button" class="btn btn-danger btn-block btn-sm" id="btn-cambiar-destino">Procesar Cambio de Destino</button>
            </div>
          </div>
          <p></p>
        </div>
      </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<div id="modalCodAut" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-sm">
    <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">Codigo de Autorizacion</h4>
      </div>
      <div class="modal-body">
        <div class="row alert alert-warning" id="area_transfExpi">
          <div class="row">
            <div class="col-md-12" align="left">
              <p>Si desea editar la comision. Por favor ingrese el codigo de autorizacion, en caso que no tenga, haga click en la opcion <b>Solicitar Codigo</b></p>
            </div>
          </div>
          <p></p>
          <div class="row">
            <div class="col-md-6 col-md-offset-6">
              <button type="button" class="btn btn-success btn-block btn-xs"id="cambioO_solCod">Solicitar Codigo</button>
            </div>
          </div>
          <br>
          <div class="row">
            <div class="col-md-4" align="right"> 
              <label><b>CODIGO: </b></label>
            </div>
            <div class="col-md-8">
              <input type="text" class="form-control" placeholder="Ingrese el codigo de autorizacion" id="cambioO_txtCodA">
            </div>
          </div>
          <br>
          <div class="row">
            <div class="col-md-8 col-md-offset-2">
              <button type="button" class="btn btn-primary btn-block"id="cambioO_verificar">Verificar Codigo</button>
            </div>
          </div>

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

    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<div id="modal_confirmacion_bancos" 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">
        <div class="row">
          <div class="col-md-12">
            <div class="row" align="center">
              <h3 >MODIFICACION DE DATOS DE BANCO</h3>
            </div>
            <div class="row">
              <div class="col-md-12" align="center">
                <p>Se actualizarán el número de cuenta / DNI y el celular de referencia</p>
              </div>
              
            </div>
            <div class="row">
              <div class="col-md-12" align="center">
                <button type="button" class="btn btn-warning btn-sm" id="btn_confirmar_cambio">GUARDAR CAMBIOS</button>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!-- filtro bancos 11-06-2020 -->
<div id="modalFiltroBanco" 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">
            <div class="row">
              <div class="col-md-12">
                <p class="bg-success">
                  <B>FECHA DE CREACION</B>
                </p>
              </div>
              
            </div>
            <div class="row">
              <div class="col-md-4">
                <label for="comboFechasFB">Filtrar por:</label>
                <div class="fg-line">
                  <div class="select">
                    <select class="form-control" id="comboFechasFB">
                      <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-4">
                <label for="txtfecha1B">Del:</label>
                <input type="text" class="form-control" id="txtfechaFA1B">
                <p></p>
              </div>
              <div class="col-md-4">
                <label for="txtfecha2B">Hasta:</label>
                <input type="text" class="form-control" id="txtfechaFA2B">
                <p></p>
              </div>
            </div>
            <div class="row">
              <div class="col-md-12">
                <p class="bg-info">
                  <B>BANCO</B>
                </p>
              </div>
              
            </div>
            <div class="row">
              <div class ="col-md-12">
                <div class="row">
                  <div class="col-md-12" align="center" style="background-color: #c5cae9;">
                    <label style="margin-bottom: 5px; margin-right: 10px;" align="center">
                        <input type="radio" name="banco" id="rbbn" value="bn" checked><br>
                        Banco Nacion 
                    </label>
                    <label style="margin-bottom: 5px;margin-right: 10px;" align="center">
                        <input type="radio" name="banco" id="rbcn" value="cn"><br>
                        Continental
                    </label>
                    <label style="margin-bottom: 5px;margin-right: 10px;" align="center">
                        <input type="radio" name="banco" id="rbbcp" value="bcp"><br>
                        BCP
                    </label>
                    <label style="margin-bottom: 5px;" align="center">
                        <input type="radio" name="banco" id="rbotro" value="otro"><br>
                        Otros
                    </label>
                  </div>
                </div>
              </div>
            </div>
            <p></p>
            <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="txtnropagFAB" placeholder="100">
                <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="ProcesarFAB"> <span class="glyphicon glyphicon-hourglass"></span> FILTRAR</button>
                <p></p>
              </div>

            </div>
        </div>
      </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<script type="text/JavaScript">
  var x_st_total='{{ x_st_to }}';
  var pagina=1;
  var soli_nom="";
  var soli_ap="";
  var soli_am="";
  var Aux="";
  var Aux2="";
  var Aux3="";
  var Aux5="";
  var Aux6="";
  var Aux7="";
  var filaI =0;
  var estad="";  
  var i1=0;
  var i2=0;        
  var p1=0;        
  var p2=0;
  var e1=0;
  var e2=0; 
  //extorno---
  var st_ex="no";
  //---------
  var nombreBAux="";
  var apBAux="";
  var amBAux="";
  var estadoAux="";
  var checkedTuto = JSON.parse(localStorage.getItem('chbTutorial'));
  $("#valorCHB").val("no");
  $("#chb").click(function(){ 
    if($(this).prop('checked')){
      $("#valorCHB").val("si");
      
    }else{
      $("#valorCHB").val("no");
     
    }
  });
  $("#myModal").on("shown.bs.modal", function () { 
    if(checkedTuto==true){
      if($("#txtEstadoTrans").val()=="activo"){
           WebTour.create({
          0: [{
        element: "#btnMB",
         description: "Para Modificar el nombre del 'BENEFICIADO' haga click sobre el enlace 'Cambiar Nombre'",
        position: "t",
        next: false,
        closeSign: false
      }]
      });
     
    WebTour.init();
      }
     
    }
  });
  

    $(document).ready(function(){
      //----
      $('#txtfecha1').datetimepicker({
        locale: 'es',
        format: 'YYYY-MM-DD'
      });
      $('#txtfecha2').datetimepicker({
        locale: 'es',
        format: 'YYYY-MM-DD'
      });
      //
      $("#div-f1").hide();
      $("#div-f2").hide();
      //
      $("#comboFiltroF").change(function(){
        if($("#comboFiltroF").val()=="ef"){
          $("#div-f1").show();
          $("#txtfecha1").prop("value","");
          $("#div-f2").show();
          $("#txtfecha2").prop("value","");
        }
        if($("#comboFiltroF").val()=="f"){
          $("#txtfecha1").prop("value","");
          $("#div-f1").show();
          $("#txtfecha2").prop("value","");
          $("#div-f2").hide();
        }
        if($("#comboFiltroF").val()=="h"){
          $("#txtfecha1").prop("value","");
          $("#div-f1").hide();
          $("#txtfecha2").prop("value","");
          $("#div-f2").hide();
        }
      });
      //
      $("#buscarF").click(function(){
        ajax_Transferencias();
      })
      //
      $("#ActualizarBen").click(function(){
        $(this).button('loading');
        $.ajax({
          data:{'idST':$("#txtIDtrans").prop("value"),'dniB':$("#txtDNIB").val(),'nombreB':$("#txtNombreB").val(),'apB':$("#txtAPB").val(),'amB':$("#txtAMB").val(),'dniMenor':$("#valorCHB").val()},
          url:'/modificarBeneficiado_ajax/',
          type:'GET',
          dataType:'json',
          success: function(data){
            console.log(data.error);
            if (data.exito=="1"){
              $("#ActualizarBen").button('reset');  
              $("#lbNB").text($("#txtNombreB").val());
              $("#lbAPB").text($("#txtAPB").val());
              $("#lbAMB").text($("#txtAMB").val());
              $("#myModalB").modal("hide");

              bootbox.alert("Modificación exitosa"); 

            }else{
              $("#ActualizarBen").button('reset');
              $("#myModalB").modal("hide");
              bootbox.alert("Error en la modificación. "+data.error);
              
            }
            $("#myModal").modal("hide");
            ajax_Transferencias();
          },  
          error: function(xhr, textStatus, errorThrown) {
            console.log(xhr.responseText);
          },
        }); 
      });
      $("#CambiarBen").click(function(){
        $.ajax({
          data:{'IdBeneficiado':$('#IdBeneficiado').val(),'dniB':$("#txtDNIB").val(),'cambio':'si','idST':$("#txtIDtrans").prop("value"),'nombreB':$("#txtNombreB").val(),'apB':$("#txtAPB").val(),'amB':$("#txtAMB").val(),'dniMenor':$("#valorCHB").val()},
          url:'/modificarBeneficiado_ajax/',
          type:'GET',
          dataType:'json',
          success: function(data){
            console.log(data.error);
            if (data.exito=="1"){ 
              $("#lbNB").text($("#txtNombreB").val());
              $("#lbAPB").text($("#txtAPB").val());
              $("#lbAMB").text($("#txtAMB").val());
              $("#myModalB").modal("hide");
              bootbox.alert("Se cambio de Beneficiario"); 
            }else{
              $("#ActualizarBen").button('reset');
              $("#myModalB").modal("hide");
              
              bootbox.alert("Error. "+data.error);
            }
            $("#myModal").modal("hide");
            ajax_Transferencias();
          },  
          error: function(xhr, textStatus, errorThrown) {
            console.log(xhr.responseText);
          },
        }); 
      });
      var slideHeight1 = 40; // px
      var slideHeight = 150; // px
      var defHeight = 0;
      var defHeight1 = 0; 
      $(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');
      });
      $('#txtN').numeric(); 
      $("#fd").hide();
      $("#extornarT").prop('disabled',false); 
      $("#extornarT").click(function(){
        $("#idn").text($("#txtDNI").val());
      });
      $("#rimprimir").click(function(){
        $("#idST").text("ST: "+$("#txtIDtrans").val());
        if (estad=="activo" || estad =="pagado"){
           $("#bene").text($('#lbNB').text()+"\n"+$('#lbAPB').text()+" "+$('#lbAMB').text());
           
          $('#platillaI2').printThis();
        }
        else{
          $("#idn").text($("#txtDNI").val());
          $('#platillaI').printThis();
        }
      });
      
      ajax_Transferencias();
      $("#RefrescarLista").click(function(){
        ajax_Transferencias();
      });

    
     
      $(document).on("click",".filaTrans",function(){
        //--
        $("#modal-content-bene").css("background-color","#ffffff");
        $("#ActualizarBen").show();
        //---
        $('#txtIDtrans').prop("value",null);
        limpiar_det_banco();
        $("#alertMessage").addClass("hidden");
        var num = $(this).attr('id');
        filaI = num;
        var fila= $(this).attr('class');
        $('#extornarT').show();
        $('#btn_actualizar_bancos').hide();
        $("#areap").show();
        //$("#rimprimir").show();
        $('#txtN').prop('disabled',false);
        //------------- autorizacion de extorno ---------------
        $("#txtCodA").prop("value","");
        st_ex="no"
        $("#nrodias").text("");
        $(".grp_dni_cod").hide();
        /*
        if(Aux[filaI].dias>1){
          $("#nrodias").text(Aux[filaI].dias);
          $(".grp_dni_cod").show();
          st_ex="si"
        }
        */
        ///----------------------------------------------------
        //--------------
        $('#txtnr').text(Aux[filaI].nroRecibo);
        $('#txtEstadoTrans').prop("value",Aux[filaI].estado);
        $('#txtDNI').prop("value","");

        $('#txtNombres_Soli').prop("value",Aux[filaI].nombre_rmt+" "+Aux[filaI].paterno_rmt +" "+ Aux[filaI].materno_rmt);
         
        $(".eliminarC").addClass("hidden");
        $(".editarC").addClass("hidden");

        $('#txtNombreB').prop("value",Aux[filaI].nombre_bnf);
        $('#txtAPB').prop("value",Aux[filaI].paterno_bnf);
        $('#txtAMB').prop("value",Aux[filaI].materno_bnf);
        $('#txtDNIB').prop("value",Aux[filaI].dni_bnf);

        $('#lbNB').text(Aux[filaI].nombre_bnf);
        $('#lbAPB').text(Aux[filaI].paterno_bnf);
        $('#lbAMB').text(Aux[filaI].materno_bnf);

        if(Aux[filaI].dniMenor=="no"){
          //$(".chbOfDNIMenor").removeClass("active");
          $("#chb").prop('checked',false);
          $("#valorCHB").val("no");
        }else{
          //$(".chbOfDNIMenor").addClass("active");
          $("#valorCHB").val("si");
          $("#chb").prop('checked',true);
        }

        nombreBAux=Aux[filaI].nombre_bnf;
        apBAux=Aux[filaI].paterno_bnf;
        amBAux=Aux[filaI].materno_bnf;
        estadoAux=Aux[filaI].estado;

        $("#txtN").prop('value',Aux[filaI].dni_bnf);
        $('#txtIDtrans').prop("value",Aux[filaI].id_trans);
        $('#txtFecha').prop("value",Aux[filaI].fecha);
        $('#txtPersonalE').prop("value",Aux[filaI].id_personal);
        $('#txtOficinaDest').prop("value",Aux[filaI].oficina_des);
        $('#txtMonto').prop("value",Aux[filaI].monto);
        $('#txtComicion').prop("value",Aux[filaI].comicion);
        $('#txtObs').prop("value",Aux[filaI].obs);
        $('#txtotros_con').prop("value",Aux[filaI].otros_conceptos);
        $("#reciboObs").text(Aux[filaI].obs);
        $("#reciboDet").text(Aux[filaI].otros_conceptos);
        $("#plB").text(Aux[filaI].nombre_bnf +" "+ Aux[filaI].paterno_bnf +" "+ Aux[filaI].materno_bnf);
        $("#plR").text(Aux[filaI].nombre_rmt+" "+Aux[filaI].paterno_rmt +" "+ Aux[filaI].materno_rmt);
        $("#plObs").text($("#txtObspe").val());
        estad=Aux[filaI].estado;
        var mr="";
        if(Aux[filaI].moneda=="soles")
          {
            mr="S/. "
          }
        else
          {
            mr="$/. "
        }
        if (Aux[filaI].AutEx=="todo"){
          $("#caextTo").show();
          $("#plM").text(mr +String(Aux[filaI].monto));
          $("#extCo").text(parseFloat(Aux[filaI].comicion)+parseFloat(Aux[filaI].monto_conceptos));
        }
        else{
          $("#plM").text(mr +String(Aux[filaI].monto));
          $("#extCo").text('');
          $("#caextTo").hide();
        }
        //
        if(x_st_total=='si'){
          $("#extorno_total").html("Se extornara: <b>CAPITAL + COMISION </b>");
        }
        else{
          $("#extorno_total").html("Se extornara: <b>SOLO EL CAPITAL</b>");
        }
        //

        //$("#plM").text(Aux[filaI].monto);
        $("#plOri").text(Aux[filaI].oficina_des);
        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);

        if(Aux[filaI].estado =="activo"){
            $("#btnMB").removeClass("hidden");
            $('#btn_actualizar_bancos').show();
        }

        if(Aux[filaI].estado !="activo"){
          //$('#extornarT').prop('disabled',true);
          //$('#ForzarpagoT').prop('disabled',true);
          $('#extornarT').hide();
          $('#txtN').prop('disabled',true);
          $("#areap").hide();
          $("#btnMB").addClass("hidden");
          //$("#rimprimir").hide()
        }
        if((Aux[filaI].estado=='activo') || (Aux[filaI].estado=='pagado'&&Aux[filaI].pago_forzado!='si')){
          var m='';
          if(Aux[filaI].moneda=="soles")
            {
              m="S/. "
            }
          else
            {
              m="$/. "
            }
          //$("#pldet").html("Monto:"+m+Aux[filaI].monto+"<br>Comision: "+m+Aux[filaI].comicion+"<br> Otros:"+m+Aux[filaI].monto_conceptos);
          $("#monto_tr").text(m+Aux[filaI].monto);
          $("#comi_tr").text(m+Aux[filaI].comicion);
          $("#otros_tr").text(m+Aux[filaI].monto_conceptos);
          var monto_capi=Aux[filaI].monto.toString().replace(",", "");
          var total= parseFloat(monto_capi)+parseFloat(Aux[filaI].comicion)+parseFloat(Aux[filaI].monto_conceptos);

         $("#fechaRecibo").text(Aux[filaI].fecha);
          $("#importe").text(m+String(total));
          //$("#usuario").text(usuario);
          $("#nror").text("NRO: "+Aux[filaI].nroRecibo);
          $("#bene").text(Aux[filaI].nombre_bnf +"\n"+ Aux[filaI].paterno_bnf +" "+ Aux[filaI].materno_bnf);
          $("#soli").text(Aux[filaI].nombre_rmt+"\n"+Aux[filaI].paterno_rmt +" "+ Aux[filaI].materno_rmt);
          $("#oficinaDestino").text(Aux[filaI].oficina_des);
          $("#soli1").text(Aux[filaI].nombre_rmt+"\n"+Aux[filaI].paterno_rmt +" "+ Aux[filaI].materno_rmt);                                      
        }
        if(Aux[filaI].estado=='extornado'){
          $("#plTitulo").text("transferencia extornado");
        }
        if(Aux[filaI].pago_forzado=='si'){
          $("#plTitulo").text("pago forzado");
          //$("#rimprimir").show();
          estad="pagoforzado";
        }
        $("#divDetBanco").hide();
        $("#txtdetb-banco").val(null);
        $("#txtdetb-nrocta").val(null);
        $("#txtdetb-celref").val(null);
        $("#txtdetb-nroope").val(null);
        $("#txtdetb-nrogiro").val(null);
        $("#txtdetb-clave").val(null);
        if(Aux[filaI].banco.length>2){
          $("#divDetBanco").show();
          $("#txtdetb-banco").val(Aux[filaI].banco);
          $("#txtdetb-nrocta").val(Aux[filaI].nroCta);
          $("#txtdetb-celref").val(Aux[filaI].cel_referencia);
          $("#txtdetb-nroope").val(Aux[filaI].nro_operacion);
          $("#txtdetb-nrogiro").val(Aux[filaI].nro_giro);
          $("#txtdetb-clave").val(Aux[filaI].clave);
          //consulta
          //ajax_detalle_banco();
        }
      });
      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);
            }
            else{
              $('#divDetBanco').hide();
            }
          }
        });
      };
      */
      //---
      function ajax_Transferencias(){
        $('.table-responsive').waitMe({effect : 'progressBar',text : 'Recuperando Datos'});
        $.ajax({
          data:{'pg':pagina,'filtro':$("#comboFiltroF").val(),'F1':$("#txtfecha1").val(),'F2':$("#txtfecha2").val()},
          url:'/listaTransfereciasTotal_ajax/',
          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_des+'</td><td>'+data[i].nroRecibo+'</td><td><b>'+data[i].comicion+'</b></td>><td>'+data[i].banco+'</td><td><b>'+data[i].monto_conceptos+'</b></td><td>'+data[i].moneda+'</td><td>'+data[i].otros_conceptos+'</td><td>'+data[i].estado+'</td><td>'+data[i].fp+'</td></tr>';
            }
            $('#listaTransf').html(html);
            $('.table-responsive').waitMe('hide');
          }
        });
      };

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

      $("#extornarT").click(function(){//boton q llama ala confirmacion
        $("#progress_reniec").hide();
        $("#lblSoliST").text("");
        $("#lblSoliRENIEC").text("");
        $("#lblResulComparacion").html("");
        if(st_ex=="si"){
          if($("#txtDNI").val()!=null && $("#txtDNI").val().length ==8){
            $('#modal_confirmacion').modal('show');
            $("#lblSoliST").text($("#txtNombres_Soli").val());
            //$("#progress_reniec").show();
            soli_nom="";
            soli_am="";
            soli_ap="";
            //consulta();
          }
          else{
            
            bootbox.alert({ 
              message: "Ingrese el DNI del Solicitante",
              className: 'bb-alternate-modal'
            }); 

          }
        }
        else{
          $('#modal_confirmacion').modal('show');
        }
      });
      $("#alert_aceptar").click(function(){
        if(st_ex=="si"){
          if($("#txtDNI").val()!=null && $("#txtDNI").val().length ==8){
            mostrar_progress();
            ajax_solicitudExtorno(Aux[filaI].id_trans,$("#txtCodA").val());
            ocultarmodal();
          }
          else{
            
            bootbox.alert({ 
              message: "Ingrese el DNI del Solicitante",
              className: 'bb-alternate-modal'
            }); 

          }
        }
        else{
          mostrar_progress();
          ajax_solicitudExtorno(Aux[filaI].id_trans,$("#txtCodA").val());
          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();
      };

      function ajax_TransferenciasTotal_filtro(){
        $('.table-responsive').waitMe({effect : 'progressBar',text : 'Recuperando Datos'});
        $.ajax({
          data:{'pg':pagina,'filtro':$("#filtro").val()},
          url:'/listaTransfereciasTotal_filtro_ajax/',
          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_des+'</td><td>'+data[i].nroRecibo+'</td><td><b>'+data[i].comicion+'</b></td><td>'+data[i].banco+'</td><td><b>'+data[i].monto_conceptos+'</b></td><td>'+data[i].moneda+'</td><td>'+data[i].otros_conceptos+'</td><td>'+data[i].estado+'</td><td>'+data[i].fp+'</td></tr>';
            }
            //html+='</tbody></table>';
            $('#listaTransf').html(html);
            $('.table-responsive').waitMe('hide');
            //$("#progreso_ajax").hide();
          }
        });
      };
      //-----
      function ajax_solicitudExtorno(idTransf,codA){
        $.ajax({
          data:{'idT':idTransf,'obs':$("#txtObspe").val(),'dni':$("#txtDNI").val(),'nombre':soli_nom,'ap':soli_ap,'am':soli_am,"codigo":codA},
          url:'/extornar_tranf_ajax/',
          //async:false,
          type:'GET',
          dataType:'text',
          success: function(data){
            if(data=='exito'){
              $("#ExitoMensaje").prop('class','bg-info');
              $("#ExitoMensaje").text("La transferencia se EXTORNO!");
              $("#plTitulo").text("transferencia extornado");
              if(x_st_total=='si'){
                $("#caextTo").show();
                $("#plM").text('S/.' +String(Aux[filaI].monto));
                $("#extCo").text(parseFloat(Aux[filaI].comicion)+parseFloat(Aux[filaI].monto_conceptos));
              }
              else{
                $("#plM").text('S/.' +String(Aux[filaI].monto));
                $("#extCo").text('');
                $("#caextTo").hide();
              }
              $('#platillaI').printThis();
              swal("Exito", "La transferencia se extorno", "success");
              /*
              bootbox.alert({ 
                message: "La transferencia se extorno",
                className: 'bb-alternate-modal'
              }); 
              */

              ocultar_progress();
              ajax_Transferencias();
              $('#txtN').prop("value",' ');
            }
            else{
              ocultar_progress();
              $("#ExitoMensaje").prop('class','bg-danger');
              $("#ExitoMensaje").text("la operacion fallo :(" + data);
              /*
              bootbox.alert({ 
                message: "La Operación falló",
                className: 'bb-alternate-modal'
              }); 
              */
              swal("Error", data, "error");
            }

          }
        });
      };
      function ocultarmodal(){
        $('#myModal').modal('hide')
      };
    
      $("#ts4").click(function(){
        if($("#ts4").prop("checked")){ 
          ajax_Transferencias_Activos();
        } else {
          ajax_Transferencias();
        }
      });
      //------ activos----------
      function ajax_Transferencias_Activos(){
        $('.table-responsive').waitMe({effect : 'progressBar',text : 'Recuperando Datos'});
        $.ajax({
          url:'/listaTrans_activos_ajax/',
          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_des+'</td><td>'+data[i].nroRecibo+'</td><td><b>'+data[i].comicion+'</b></td><td>'+data[i].banco+'</td><td><b>'+data[i].monto_conceptos+'</b></td><td>'+data[i].moneda+'</td><td>'+data[i].otros_conceptos+'</td><td>'+data[i].estado+'</td><td>'+data[i].fp+'</td></tr>';
            }
            $('#listaTransf').html(html);
            $('.table-responsive').waitMe('hide');
          },
          error: function(xhr, textStatus, errorThrown) {
               console.log(xhr.responseText);
           },
        });
      }
      //---end division
      $("#imprimir_trans_bu").click(function(){
         //var datos=$("#comboFiltro :selected").text().split("/");
          var d = new Date();
          var n = d.toLocaleString();

          var doc = new jsPDF('l', 'pt');
          var res = doc.autoTableHtmlToJson(document.getElementById("tableST"));
          doc.setFontSize(14);
          doc.text("Reporte Tranferencias Creadas", 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() + 120,
              margin: {horizontal: 10},
              styles: {overflow: 'linebreak'},
              bodyStyles: {valign: 'top'},
              columnStyles: {email: {columnWidth: 'wrap'}},
              theme: 'grid',
          });

          //doc.save('reporteST.pdf');
          var uri = doc.output('datauri');
          open_data_uri_window(uri);
         //$('#imprimir_trans').printThis();
      });
      function open_data_uri_window(url) {
        var html = '<html> <title>Consorcio Imperial</title>' +
          '<style>html, body { padding: 0; margin: 0; } iframe { width: 100%; height: 100%; border: 0;}  </style>' +
          '<body>' +
          '<iframe src="' + url + '"></iframe>' +
          '</body></html>';
        a = window.open()
        a.document.write(html)
      }

      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();
        ajax_Transferencias();
      })
      $("#ant").click(function(){
        var pag = $("#pg1").text();
        pag= parseInt(pag);
        if(pag>1){
          $("#pg1").text(pag-1);
          pag= $("#pg2").text();
          pagina = pag-1;
          ajax_Transferencias();
        }
      });
      $("#pos").click(function(){
        var pag = $("#pg1").text();
        pag= parseInt(pag);
        $("#pg1").text(pag+1);
        pagina = pag+1;
        ajax_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";
            }
            var scFA=null;
            if($("#ts4FASA").prop("checked")){
              scFA="sc";
            }
            ajax_TransferenciasFA(saFA,scFA);
          })
          //-------

          //--------
          function ajax_TransferenciasFA(sa,sc){
           $('.table-responsive').waitMe({effect : 'progressBar',text : 'Recuperando Datos'});
          $.ajax({
            data:{'pg':pagina,'filtroF':$("#comboFechasFA").val(),'fDesde':$("#txtfechaFA1").val(),'fHasta':$("#txtfechaFA2").val(),'sa':sa,'sc':sc,'oficina':$("#ComboOficinaFA").val(),'fNombre':$("#txtnombreFA").val(),'fAp':$("#txtapFA").val(),'fAm':$("#txtamFA").val(),'nroXpag':$("#txtnropagFA").val()},
            url:'/listaTransfereciasCreadas_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_des+'</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><td>'+data[i].fp+'</td></tr>';
              }
              $('#listaTransf').html(html);
              $("#modalFiltroAvanzado").modal("hide");
              $('.table-responsive').waitMe('hide');
            }
          });
        };
          //------
          //-
     //
     //---------------
     //--------------- extrno codigo ---------------
     $("#solCod").click(function(){
        ajax_solicitudAut();
      });
      
      function ajax_solicitudAut(){
        $.ajax({
          data:{'pk':$('#txtIDtrans').val()},
          url:'/solicitud_Aut_Extorno_ST_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'
              });
            }
          }
        });
      };
    //------------------------
    //------------------ cambio de destino --------------------
    $("#btnModalCmbioOD").click(function(){
      $("#CambioOD_txtcomisionuevo").val(null);
      $("#txtObsCambioDestino").val(null);
      ajax_verificacion_st_cambio();
    });
    function ajax_verificacion_st_cambio(){
        $('#campo_modal_cambio').waitMe({effect : 'progressBar',text : 'Recuperando Datos'});
        $.ajax({
          data:{'pk':$('#txtIDtrans').val()},
          url:'/verificar_st_para_cambio_destino_ajax/',
          //async:false,
          type:'GET',
          dataType:'json',
          success: function(data){
            if(data.exito=='exito'){
              $("#CambioOD_txtpkst").prop('value',data.pk);
              $("#CambioOD_lblbene").text(data.beneficiado);
              $("#CambioOD_lblcomision").text(data.comision);
              $("#CambioOD_lblmonto").text(data.monto);
              $("#CambioOD_lblofides").text(data.destino);
              $('#campo_modal_cambio').waitMe('hide');
              ajax_oficina();
             }
             else{
              $("#modalCambiar").modal('hide');
              bootbox.alert({ 
                message: "Error. "+data.exito,
                className: 'bb-alternate-modal'
              });
            }
          }
        });
      };
      var bnd=false;
      var AuxC="";
      function ajax_oficina(){
        $.ajax({
           url:'/oficinas_version2_ajax/',
          type:'GET',
          dataType:'json',
          success: function(data){
          var htmlo ="";
            $("#ComboOficinaDes").html('');
            for(var i=0;i<data.length;i++){
                htmlo += '<option value="'+data[i].pk+'">'+data[i].nombre_oficina+'</option>';
            }
            $('#ComboOficinaDes').html(htmlo);
            ajax_Comi_por_ofi_des();
            $('#ComboOficinaDes').selectize();
            $("#CambioOD_lblmontonuevo").text($("#CambioOD_lblmonto").text());
            $("#CambioOD_lblofidesnuevo").text($('#ComboOficinaDes').find(":selected").text());
            
            //calcular_comision();
          }
        });
      };
      $('#CambioOD_txtcomisionuevo').numeric(); 
      $("#ComboOficinaDes").change(function(){
        ajax_Comi_por_ofi_des();
        bnd=false;
        $("#CambioOD_txtcomisionuevo").prop('value',null);

        $("#CambioOD_lblofidesnuevo").text($('#ComboOficinaDes').find(":selected").text());
        $("#CambioOD_lblmontonuevo").text($("#CambioOD_lblmonto").text());

      });
      function ajax_Comi_por_ofi_des(){
        $('#campo_modal_cambio').waitMe({effect : 'progressBar',text : ' Recuperando comfig. comision'});
        $.ajax({
          data:{'idOfi':$('#ComboOficinaDes').val()},
          url:'/listaConfigCo_para_ofici_ajax/',
          //async:false,
          type:'GET',
          dataType:'json',
          success: function(data){
              AuxC = data;
              calcular_comision();
              $('#campo_modal_cambio').waitMe('hide');
          }
        });
       }
       var bd=false;
       var ind=0;
       var mont=0;
       var comi_od=0;
      function calcular_comision(){
        bd=false;
        ind=0
        mont= parseFloat($("#CambioOD_lblmonto").text());
        //$("#CambioOD_txtcomisionuevo").prop('readonly',true);
        //console.log(mont);
        if(AuxC!=""){
          for(var i=0;i<AuxC.length;i++){
            if(AuxC[i].montomin<=mont && AuxC[i].montomax >= mont){
              //$("#txtComicion").prop('value',AuxC[i].comision);
              ind=i
              bd=true;
              if(parseFloat(AuxC[ind].comision)<1){
                $("#CambioOD_txtcomisionuevo").prop('value',Math.floor(parseFloat(AuxC[ind].comision)*parseFloat(parseFloat($("#CambioOD_lblmonto").text()))));
              }
              else{
                $("#CambioOD_txtcomisionuevo").prop('value',AuxC[ind].comision);
              }
              comi_od=parseFloat($("#CambioOD_txtcomisionuevo").val());
              //flagComision=true;
            }
          }
        }
        if(!bd){
          //$("#CambioOD_txtcomisionuevo").prop('readonly',false);
          $("#CambioOD_txtcomisionuevo").prop('value',null);
          comi_od=0;

        }
        else{
          calcular_totalCAmbioOfi();
        }
        /*
        if(!bnd){
          if(bd){
            $("#CambioOD_txtcomisionuevo").prop('readonly',true);
            //$("#solAutCo").show();
            if(parseFloat(AuxC[ind].comision)<1){
              $("#CambioOD_txtcomisionuevo").prop('value',Math.floor(parseFloat(AuxC[ind].comision)*parseFloat(parseFloat($("#CambioOD_lblmonto").text()))));
            }
            else{
              $("#CambioOD_txtcomisionuevo").prop('value',AuxC[ind].comision);
            }
            
            //flagComision=parseFloat(AuxC[ind].comision);
          }
          else{
            $("#CambioOD_txtcomisionuevo").prop('readonly',false);
            $("#CambioOD_txtcomisionuevo").prop('value',null);
            //$("#solAutCo").hide();
          }
        }
        */
        //return true;
      }
      // autorizacion nde comision
      $("#sp-texto-comi").hide();
      $("#CambioOD_txtcomisionuevo").change(function(){
        if (!bnd){

          if(parseFloat($("#CambioOD_txtcomisionuevo").val()) < comi_od){
            //$("#modalCodAut").modal("show");
            $("#sp-texto-comi").show();
          }
          else{
            //$("#modalCodAut").modal("hide");
            $("#sp-texto-comi").hide();
          }

        }
        calcular_totalCAmbioOfi();
      });
      function calcular_totalCAmbioOfi(){
        if( $("#CambioOD_txtcomisionuevo").val() !=null && $("#CambioOD_txtcomisionuevo").val() !="" ){
          comiExtra= parseFloat($("#CambioOD_txtcomisionuevo").val());
          dtc= parseFloat("{{DCambioOfi}}");
          comiIni= parseFloat($("#CambioOD_lblcomision").text())
          auxdifcomi=0;
          if(comiExtra>comiIni){
            $("#lblreembolsoComision").text(comiExtra-comiIni);
            auxdifcomi=comiExtra-comiIni;
          }
          $("#lblreembolsoComision").text(auxdifcomi);
          $("#lblTotal").text(auxdifcomi+dtc);
        }
       
      }
 $("#cambioO_solCod").click(function(){
  ajax_solicitudAut_comi();
 });

 function ajax_solicitudAut_comi(){
    $.ajax({
      data:{'idO':$("#ComboOficinaDes").val()},
      url:'/SolAutoComisionPersonal_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'
          });
        }
      }
    });
  };
 //
 $("#cambioO_verificar").click(function(){
  ajax_verificarAut_comi();
 })
 function ajax_verificarAut_comi(){
    $.ajax({
      data:{'cod':$("#cambioO_txtCodA").val(),'idO':$("#ComboOficinaDes").val()},
      url:'/Verifi_CodAutoComi_ajax/',
      //async:false,
      type:'GET',
      dataType:'text',
      success: function(data){
        if(data=='exito'){
          /*
          bootbox.alert({ 
            message: "Autotrizado",
            className: 'bb-alternate-modal'
          });*/
          bnd=true;
           $("#modalCodAut").modal("hide");
           //$("#txtComicion").prop('value',null);
           //$("#txtComicion").prop('readonly',false);
           //$("#solAutCo").hide();
           $("#codigoComiCambioDestino").prop('value',$("#cambioO_txtCodA").val());
         }
         else{
          bootbox.alert({ 
            message: "Error. "+data,
            className: 'bb-alternate-modal'
          });
          bnd=false;
        }
      }
    });
  };
  //-------- completando cambio de destino -------------------
  $("#btn-cambiar-destino").click(function(){
  ajax_cambio_destino();
 })
 function ajax_cambio_destino(){
  $('#campo_modal_cambio').waitMe({effect : 'progressBar',text : 'Procesando cambio destino'});
    $.ajax({
      data:{'codigo':$("#codigoComiCambioDestino").val(),'idST':$("#CambioOD_txtpkst").val(),'ofiDes':$("#ComboOficinaDes").val(),'comi':$("#CambioOD_txtcomisionuevo").val(),'obs':$("#txtObsCambioDestino").val()},
      url:'/cambio_destino_ajax/',
      //async:false,
      type:'GET',
      dataType:'json',
      success: function(data){
        if(data.exito=='exito'){
          $("#cd_nrore").text(data.r_nrore);
          $("#cd_fecha").text(data.r_fecha);
          $("#cd_concepto").text(data.r_con);
          $("#cd_monto").text(data.r_monto);
          $('#campo_modal_cambio').waitMe('hide');
          $("#modalCambiar").modal('hide');
          $("#ReciboCambio").printThis();
          $("#myModal").modal('hide');
          ajax_Transferencias();

        }
        else{
          bootbox.alert({ 
            message: "Error. "+data.exito,
            className: 'bb-alternate-modal'
          });
          $('#campo_modal_cambio').waitMe('hide');
        }
      }
    });
  };
  //---------------------------------------------------------
  //***************************** beneficiario **************************
  function datos_beneficiario(){
    return $("#txtDNIB").val()+' '+$("#txtNombreB").val()+' '+$("#txtAPB").val()+' '+$("#txtAMB").val()
  }
  function limpiar_benericiario(){
    $("#IdBeneficiado").prop('value',null);
    $("#txtDNIB").prop('value',null);
    $("#txtNombreB").prop('value',null);
    $("#txtAPB").prop('value',null);
    $("#txtAMB").prop('value',null);
  }
  //*** nombre
  $("#txtNombreB").change(function() {
    var current = $("#txtNombreB").typeahead("getActive");
    if (current) {
      // Some item from your model is active!
      if (current.name == datos_beneficiario() || current.name == $("#txtNombreB").val()) {
        data_bene= current;
        $("#IdBeneficiado").prop('value',data_bene.id);
        $("#txtDNIB").prop('value',data_bene.dni);
        $("#txtNombreB").prop('value',data_bene.nombre);
        $("#txtAPB").prop('value',data_bene.ap);
        $("#txtAMB").prop('value',data_bene.am);
        $("#modal-content-bene").css("background-color","#02cd10");
        $("#ActualizarBen").hide();
      } 
      else {
        $("#IdBeneficiado").prop('value',null);
        $("#modal-content-bene").css("background-color","#ff9f73");
        $("#ActualizarBen").show();

      }
    } else {
        $("#IdBeneficiado").prop('value',null);
        $("#modal-content-bene").css("background-color","#ff9f73");
        $("#ActualizarBen").show();

    }
    //console.log(cliente);
    
  }); 

  var autoBeneficiario_nombre= $('#txtNombreB').typeahead({
    source:  function (query, process) {
      return $.get('/listaCliente_autocompletado_nombre_ajax/', { query: query,'ap':$("#txtAPB").val(),'am':$("#txtAMB").val()}, function (data) {
            return process(data);
        },'json');
    }
  });
  // paterno
  $("#txtAPB").change(function() {
    var current = $("#txtAPB").typeahead("getActive");
    if (current) {
      // Some item from your model is active!
      if (current.name == datos_beneficiario() || current.name == $("#txtAPB").val()) {
        data_bene= current;
        $("#IdBeneficiado").prop('value',data_bene.id);
        $("#txtDNIB").prop('value',data_bene.dni);
        $("#txtNombreB").prop('value',data_bene.nombre);
        $("#txtAPB").prop('value',data_bene.ap);
        $("#txtAMB").prop('value',data_bene.am);
        $("#panel_beneficiario").prop("class","panel panel-success")

      } 
      else {
        $("#IdBeneficiado").prop('value',null);
        $("#panel_beneficiario").prop("class","panel panel-warning")

      }
    } else {

       $("#IdBeneficiado").prop('value',null);
       $("#panel_beneficiario").prop("class","panel panel-warning")
    }
    //console.log(cliente);
    
  }); 

  var autoBeneficiario_ap= $('#txtAPB').typeahead({
    source:  function (query, process) {
      return $.get('/listaCliente_autocompletado_paterno_ajax/', { query: query,'no':$("#txtNombreB").val(),'am':$("#txtAMB").val()}, function (data) {
            return process(data);
        },'json');
    }
  });
  // materno
  $("#txtAMB").change(function() {
    var current = $("#txtAMB").typeahead("getActive");
    if (current) {
      // Some item from your model is active!
      if (current.name == datos_beneficiario() || current.name == $("#txtAMB").val()) {
        data_bene= current;
        $("#IdBeneficiado").prop('value',data_bene.id);
        $("#txtDNIB").prop('value',data_bene.dni);
        $("#txtNombreB").prop('value',data_bene.nombre);
        $("#txtAPB").prop('value',data_bene.ap);
        $("#txtAMB").prop('value',data_bene.am);
        //
        $("#panel_beneficiario").prop("class","panel panel-success")
      } 
      else {
        $("#IdBeneficiado").prop('value',null);
        $("#panel_beneficiario").prop("class","panel panel-warning")
      }
    } else {
       $("#IdBeneficiado").prop('value',null);
       $("#panel_beneficiario").prop("class","panel panel-warning")
    }
    //console.log(cliente);
    
  }); 

  var autoBeneficiario_am= $('#txtAMB').typeahead({
    source:  function (query, process) {
      return $.get('/listaCliente_autocompletado_materno_ajax/', { query: query,'ap':$("#txtAPB").val(),'no':$("#txtNombreB").val()}, function (data) {
            return process(data);
        },'json');
    }
  });
  $("#btn_limpiar_bene").click(function(e){
    e.preventDefault();
    limpiar_benericiario();
  })
  //----

  $("#btn_actualizar_bancos").click(function(){
    $("#modal_confirmacion_bancos").modal("show");
    
  })
  $("#btn_confirmar_cambio").click(function(){
    ajax_actualizar_detalle_banco();
  })
  //------ cambiar datos de cuenta
  function ajax_actualizar_detalle_banco(){
      $.ajax({
        data:{'idT':$('#txtIDtrans').val(),'nroCta':$('#txtdetb-nrocta').val(),'celRef':$('#txtdetb-celref').val(),'nroOpe': $("#txtdetb-nroope").val(),'nroGiro':$("#txtdetb-nrogiro").val(),'clave':$("#txtdetb-clave").val()},
        url:'/ModificarDetalleCuentas_ajax/',
        //async:false,
        type:'GET',
        dataType:'text',
        success: function(data){
          $("#modal_confirmacion_bancos").modal("hide");
          $("#myModal").modal("hide");
          ajax_Transferencias();
          if(data=='exito'){
            bootbox.alert({
              message: "Operación exitosa. Se Modificaron los detalles de bancos",
              className: 'bb-alternate-modal'
            });
           }
           else{
            bootbox.alert({ 
              message: "Error. "+data,
              className: 'bb-alternate-modal'
            });
          }
        }
      });
    };
  //--------------------------------------------------------------
  ///-------- filtro de bancos
    $('#txtnropagFAB').numeric(); 
    $('#txtfechaFA1B').datetimepicker({
      locale: 'es',
      format: 'YYYY-MM-DD'
    });
    $('#txtfechaFA2B').datetimepicker({
      locale: 'es',
      format: 'YYYY-MM-DD'
    });
    $("#txtfechaFA1B").hide();
    $("#txtfechaFA2B").hide();
    $("#comboFechasFB").change(function(){
      if($(this).val()=="0"||$(this).val()=="h"){
        $("#txtfechaFA1B").hide();
        $("#txtfechaFA2B").hide();
      }
      if($(this).val()=="f"){
        $("#txtfechaFA1B").show();
        $("#txtfechaFA2B").hide();
      }
      if($(this).val()=="ef"){
        $("#txtfechaFA1B").show();
        $("#txtfechaFA2B").show();
      }
    });
    $("#ProcesarFAB").click(function(){
      let banco_aux="ninguno";
      //banco de la nacion
      if($("#rbbn").prop('checked')){
        banco_aux = "Banco de la Nacion";
      }
      // continental
      if($("#rbcn").prop('checked')){
        banco_aux="Continental"
      }
      //bcp
      if($("#rbbcp").prop('checked')){
        banco_aux = "BCP"
      }
      //
       if($("#rbotro").prop('checked')){
        banco_aux ="Otros Bancos"
      }
        ajax_TransferenciasFAB(banco_aux);
        
    })

      //--------
      function ajax_TransferenciasFAB(bco){
      $('.table-responsive').waitMe({effect : 'progressBar',text : 'Recuperando Datos'});
      $.ajax({
        data:{'pg':pagina,'filtroF':$("#comboFechasFB").val(),'fDesde':$("#txtfechaFA1B").val(),'fHasta':$("#txtfechaFA2B").val(),'nroXpag':$("#txtnropagFAB").val(),'banco':bco},
        url:'/listaTransfereciasCreadas_bancos_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_des+'</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><td>'+data[i].fp+'</td></tr>';
          }
          $('#listaTransf').html(html);
          $("#modalFiltroBanco").modal("hide");
          $('.table-responsive').waitMe('hide');
        }
      });
    };
      //---
  });
</script>
{% endblock content1 %}