{% extends "base.html" %}
{% load static %}
{% block titulo %}
crear Transferncia global
{% endblock titulo %}
{% block content1 %}
<script type="text/javascript">
    $("#navTrans").attr('class','dropdown active');
    $("#navST").attr('class','dropdown dropdown-submenu active');
    $("#navCrearTransGlobal").attr('class','active');
</script> 

<form  action="/CrearTransferenciaGlobal/" method="POST" data-toggle="validator" role="form" id="formulario">{% csrf_token %}
  <div class="row">
    <div class="col-md-12 col-sm-12" >
        <div class="panel panel-default">
          <div class="panel-heading"><strong>NUEVA TRANSFERENCIA GLOBAL</strong> </div>
          <div class="panel-body">
            <div class="row" id="Result">
            <div class="col-md-12">
              {% ifnotequal resultado '' %}
              {% ifequal resultado 'exito' %}
              <div class="alert alert-success" role="alert" align="center">
                <h4>OPERACION EXITOSA!!</h4>
              </div>
              {% else %}
              <div class="alert alert-danger" role="alert" align="center">
                <h4>FALLO OPERACION :( {{resultado}}</h4>
              </div>
              {% endifequal %}
              {% endifnotequal %}
            </div>
            </div>
            <!--
            <div class="row"> 
              <div class="col-md-12">
                <div class="" id="saldo_dis">
                  <h4 ><b id="s_tit"></b></h4>
                  <div class="table-responsive">
                    <table class="table">
                      <tr>
                        <th class="info"><h4 align="right">Saldo Soles:</h4></th>
                        <th id="s_sot"><h4 id="s_so"></h4></th>
                        <th class="info"><h4 align="right">Saldo Dolares:</h4></th>
                        <th  id="s_dot"><h4 id="s_do"></h4></th>
                        <th class="info"><h4 align="right">Monto Tope:</h4></th>
                        <th id="s_mtt"><h4 id="s_mt"></h4></th>
                      </tr>
                    </table>
                  </div>
                 
                </div>
              </div>
            </div>
          -->
            <div class="row">
              <div class="col-md-12">
                <div class="row">
                   <div class="col-md-12">
                      <div class="col-md-4">
                            <div class="panel panel-default" id="panel_beneficiario">
                            <div class="panel-heading" id="grupoB">  
                                <b>BENEFICIADO <span id="cabecera_bene"></span></b> 
                            </div>
                            <div class="panel-body" id="CampoBen">

                                  <input type="text" class="hidden" name="IdCliente" id="IdCliente">
                                  <input type="text" class="hidden" name="IdBeneficiado" id="IdBeneficiado">

                              <div class="row">
                                <div class="col-md-6">
                                  <div class="checkbox">
                                    <label>
                                      <input type="checkbox" value="si" name="menor"> Menor de Edad
                                    </label>
                                  </div>
                                </div>
                                <div class="col-md-6">
                                  <label style="margin-bottom: 0px;">
                                      <input type="radio" name="TipoPersonaB" id="rbNaturalB" value="Natural" required checked>
                                      Persona Natural
                                  </label>
                                  <label style="margin-bottom: 0px;">
                                      <input type="radio" name="TipoPersonaB" id="rbJuridicaB" value="Juridica" required>
                                      Persona Jurídica
                                  </label>
                                </div>
                              </div> 
                              
                              <div class="row">
                                <div class="col-md-6">
                                  <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-primary btn-block btn-xs" id="btn_limpiar_bene">Limpiar</button>
                                </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">
                                <div class="col-md-12">
                                  <div class="form-group">
                                    <div class="input-group">
                                      <div class="input-group-addon"><label id="nombreRazonB">Nombres: </label></div>
                                      <input type="text" class="form-control mayuscula" id="txtNombreB"  name="NombreBnf" data-provide="typeahead" autocomplete="off" required>
                                    </div>
                                    <div class="form-control-feedback" style="text-align:left;" ></div>
                                   <div class="help-block with-errors"></div>
                                  </div> 
                                </div>
                              </div>
                                <div class="row" id="campoApB">
                                  <div class="col-md-12">
                                    <div class="form-group">
                                      <div class="input-group">
                                        <div class="input-group-addon"><label>A. Paterno: </label></div>
                                        <input type="text" class="form-control mayuscula" id="txtAPB" name="PaternoBnf" data-provide="typeahead" autocomplete="off" required>
                                      </div>
                                      <div class="form-control-feedback" style="text-align:left;" ></div>

                                     <div class="help-block with-errors"></div>
                                    </div>  
                                  </div>
                                </div>
                                <div class="row" id="campoAmB">
                                  <div class="col-md-12">
                                    <div class="form-group">
                                      <div class="input-group">
                                        <div class="input-group-addon"><label>A. Materno:</label></div>
                                        <input type="text" class="form-control mayuscula" id="txtAMB" name="MaternoBnf" data-provide="typeahead" autocomplete="off" required>
                                      </div>
                                      <div class="form-control-feedback" style="text-align:left;" ></div>
                                     <div class="help-block with-errors"></div>
                                    </div>   
                                  </div>
                                </div>
                                <div class="row">
                                  <div class="col-md-8">
                                    <div class="form-group">
                                      <div class="input-group">
                                        <div class="input-group-addon"><label>Celular: </label></div>
                                        <input type="text" class="form-control mayuscula" id="txtcel" name="CelularBnf"  data-minlength="9" maxlength="9" style="font-size:16px;font-weight:bold;" pattern="[9][0-9]{2,9}$">
                                      </div>
                                      
                                      <div class="form-control-feedback" style="text-align:left;" ></div>
                                      <div class="help-block with-errors"></div>
                                    </div>      
                                  </div>
                                </div>

                              </div>
                            </div>  
                            </div>

                          <div class="col-md-4">
                          <div class="panel panel-default" id="panel_solicitante">
                          <div class="panel-heading" id="grupoS"> 
                            <b>SOLICITANTE <span id="cabecera_soli"></span></b> 
                          </div>
                          <div class="panel-body" id="CampoSol">
                          <div class="row">
                            
                            <div class="col-md-12">
                                  <label style="margin-bottom: 0px;">
                                      <input type="radio" name="TipoPersona" id="rbNatural" value="Natural" required checked>
                                      Persona Natural 
                                  </label>
                                  <label style="margin-bottom: 0px;">
                                      <input type="radio" name="TipoPersona" id="rbJuridica" value="Juridica" required>
                                      Persona Jurídica
                                  </label>
                            </div>                            
                          </div> 
                          <p></p>
                          <div class="row">
                            <div class="col-md-6">
                              <div class="form-group">
                                <div class="input-group">
                                  <div class="input-group-addon"><label id="dniRUC">DNI: </label></div>
                                  <input type="text" class="form-control" id="txtDNI" name="DniRucCln" 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>              
                               <p></p>
                            </div>
                            <div class="col-md-3">
                              <button class="btn btn-primary btn-block btn-xs" id="btn_limpiar_soli">Limpiar</button>
                            </div>
                            <!--<div class="col-md-3">
                              <button class="btn btn-warning btn-block btn-xs" id="btn_consultar_so">Consultar</button>
                            </div>-->
                          </div>
                          <div class="row">
                             <div class="col-md-12">
                              <div class="form-group">
                                <div class="input-group">
                                  <div class="input-group-addon"><label id="nombreRazon">Nombres: </label></div>
                                  <input type="text" class="form-control mayuscula" id="txtNombre" name="NombreCln" data-provide="typeahead" autocomplete="off" required>
                                </div>
                                <div class="form-control-feedback" style="text-align:left;" ></div>
                                <div class="help-block with-errors"></div>
                               </div>                             
                              <p></p>
                            </div>
                          </div>

                          <div class="row" id="campoAp">
                            <div class="col-md-12">
                              <div class="form-group">
                                <div class="input-group">
                                  <div class="input-group-addon"><label>A. Paterno:</label></div>
                                  <input type="text" class="form-control mayuscula" id="txtAP" name="PaternoCln" data-provide="typeahead" autocomplete="off" required>
                                </div>
                                <div class="form-control-feedback" style="text-align:left;" ></div>
                                <div class="help-block with-errors"></div>
                              </div>
                              <p></p>
                            </div>
                          </div>

                          <div class="row" id="campoAm">
                              <div class="col-md-12">
                                <div class="form-group">
                                  <div class="input-group">
                                    <div class="input-group-addon"><label>A. Materno:</label></div>
                                    <input type="text" class="form-control mayuscula" id="txtAM" name="MaternoCln" data-provide="typeahead" autocomplete="off">
                                  </div>
                                  <div class="form-control-feedback" style="text-align:left;" ></div>
                                  <div class="help-block with-errors"></div>
                                </div>                             
                                <p></p>
                              </div>
                          </div>
                           <div class="row">
                              <div class="col-md-12">
                                <div class="form-group">
                                  <div class="input-group">
                                    <div class="input-group-addon"><label>Celular:</label></div>
                                    <input type="text" class="form-control mayuscula" id="txtcelCli" name="CelularCli"  data-minlength="9" maxlength="9" style="font-size:16px;font-weight:bold;" pattern="[9][0-9]{2,9}$">
                                  </div>
                                  <div class="form-control-feedback" style="text-align:left;" ></div>
                                  <div class="help-block with-errors"></div>
                                </div>      
                              </div>
                            </div>
                           


                           
                            
                            </div>
                          </div>  
                        </div>


                 


              <div class="col-md-4">
                <div class="panel panel-default" >
                  <div class="panel-heading"  id="grupoC">TRANSFERENCIA</b></div>
                  <div class="panel-body">

                    <div class="row">
                      <div class="col-md-12">
                        <div class="form-group">
                          <div class="input-group">

                            <div class="input-group-addon">
                              <label>Oficina Origen:</label>
                            </div>
                            <div class="select" style="height: 34px;">
                              <select name="OficinaOri" id="ComboOficina1" placeholder="Oficina Origen">   
                              </select>  
                            </div>

                          </div>
                          <div class="form-control-feedback" style="text-align:left;" ></div>
                          <div class="help-block with-errors"></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>Caja Origen:</label>
                            </div>

                            <div class="" style="height: 28px;">
                              <select class="form-control" name="CajaOri" id="ComboCajaOrg">   
                              </select>  
                            </div>

                          </div>
                          <div class="form-control-feedback" style="text-align:left;" ></div>
                          <div class="help-block with-errors"></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>Destino:</label>
                            </div>
                            <div class="select" style="height: 34px;">
                              <select name="OficinaDst" id="ComboOficina" placeholder="Of. Destino">   
                              </select>  
                            </div>

                          </div>
                          <div class="form-control-feedback" style="text-align:left;" ></div>
                          <div class="help-block with-errors"></div>
                        </div>      
                      </div>
                    </div>

                    
                    <div class="row">
                      <div class="col-md-12">
                        <div class="col-sm-8" style="padding-right: 0px;padding-left: 0px;">
                          <div class="form-group">
                            <div class="input-group">
                              <div class="input-group-addon"><label>Monto:</label></div>
                              <input type="text" class="form-control t-monto" id="txtCantidad" name="Monto" autocomplete="off" required>
                            </div>
                            <div class="form-control-feedback" style="text-align:left;" ></div>
                            <div class="help-block with-errors"></div>
                          </div>                              
                          <p></p>
                        </div>
                        <div class="col-sm-4" style="padding-right: 0px;padding-left: 0px;">
                           <select class="form-control" name="moneda" id="Cmoneda">
                              <option value="soles">Soles</option>
                              <option value="dolares">Dolares</option>
                            </select>
                        </div>
                      </div>
                      <script type="text/javascript">
                        $(document).ready(function(){
                          $('#txtCantidad').numeric(".");
                          $('#txtcel').numeric();
                              //$('#decimal').numeric(",");
                        });
                      </script>
                     
                    </div> 
                    <div class="row">
                       <div class="col-md-9">
                          <div class="form-group">
                            <div class="input-group">
                              <div class="input-group-addon"><label>Comisión (DT):</label></div>
                              <input type="text" class="form-control t-monto" id="txtComicion" name="comicion" autocomplete="off" required>
                            </div>
                            <div class="form-control-feedback" style="text-align:left;" ></div>
                            <div class="help-block with-errors"></div>
                          </div>                              
                          <p></p>
                        </div>
                        <div class="col-md-3">
                          <!--<button type="button" class="btn btn-danger btn-block" id="solAutCo" >Editar</button>-->
                        </div>

                      <script type="text/javascript">
                        $(document).ready(function(){
                          $('#txtComicion').numeric(".");                          
                              //$('#decimal').numeric(","); 
                        });
                      </script>
                    </div>
                    <div class="row">
                      <div class="col-md-12">
                        <div class="form-check">
                          <input class="form-check-input" type="checkbox" value="" id="chb-banco">
                          <label class="form-check-label" for="chb-banco">
                            Banco
                          </label>
                        </div>
                      </div>
                    </div>
                    <div class="row  hidden" id="divBanco">
                      <div class="col-md-12">
                        <select class="form-control form-control-sm" id="txtBanco" name="banco">
                          <option value="" disabled selected>Seleccione un banco</option>
                          <option value ="BCP">BCP</option>
                          <option value ="Banco de la Nacion">Banco de la Nacion</option>
                          <option value ="Interbank">Interbank</option>
                          <option value ="Continental">Continental</option>
                          <option value ="Scotiabank">Scotiabank</option>
                          <option value ="Caja cusco">Caja cusco</option>
                          <option value ="Caja arequipa">Caja arequipa</option>
                          <option value ="Caja huancayo">Caja huancayo</option>
                          <option value ="Caja tacna">Caja tacna</option>
                          <option value ="Crediscotia">Crediscotia</option>
                          <option value ="Mi banco">Mi banco</option>
                          <option value ="Caja piura">Caja piura</option>
                          <option value ="Otros">Otros</option>
                        </select>
                      </div>
                    </div>
                    <p></p>
                    <!--
                    <div class="row">
                      <div class="col-md-6 col-md-offset-3">
                        <a href="#" class="btn btn-warning btn-block btn-xs" data-toggle="modal" data-target="#modalCtasBanco" id="btn-ctas-bancos">Seleccionar detalle bancos</a>
                      </div>
                      <p></p>
                    </div>
                    -->
                    
                     <div class="row hidden" id="divNroCta">
                      <div class="col-md-12">
                        <div class="form-group">
                          <div class="input-group">
                            <div class="input-group-addon"><label>N° Cuenta / DNI:</label></div>
                            <input type="text" class="form-control t-monto" id="txtNroCta" name="NroCta" data-minlength="4" autocomplete="off" required>
                          </div>
                          <div class="form-control-feedback" style="text-align:left;" ></div>
                          <div class="help-block with-errors"></div>
                        </div>                              
                        <p></p>
                      </div>
                      <script type="text/javascript">
                        $(document).ready(function(){
                          $('#txtNroCta').numeric();
                        });

                      </script>
                    </div> 
                    <div class="row hidden"id="divComiBanco">
                      <div class="col-md-12">
                        <div class="form-group">
                          <div class="input-group">
                            <div class="input-group-addon">
                              <label>Comisión Bancos:</label>
                            </div>
                            <input type="text" class="form-control t-monto" id="txtConcepto" name="MontoConcepto" autocomplete="off" required>
                          </div>
                          <div class="form-control-feedback" style="text-align:left;" ></div>
                          <div class="help-block with-errors"></div>
                        </div>                              
                        <p></p>
                      </div>
                    </div> 
                    <div class="row hidden"id="divCelReferencia">
                      <div class="col-md-12">
                        <div class="form-group">
                          <div class="input-group">
                            <div class="input-group-addon">
                              <label>Celular Referencia:</label>
                            </div>
                            <input type="text" class="form-control" id="txtCelRef" name="CelularRef" autocomplete="off" data-minlength="9" maxlength="9" style="font-size:16px;font-weight:bold;" pattern="[9][0-9]{2,9}$" required>
                          </div>
                          <div class="form-control-feedback" style="text-align:left;" ></div>
                          <div class="help-block with-errors"></div>
                        </div>                              
                        <p></p>
                      </div>
                    </div>
                    <div class="row hidden" id="divClave">
                      <div class="col-md-12">
                        <div class="form-group">
                          <div class="input-group">
                            <div class="input-group-addon">
                              <label>Clave:</label>
                            </div>
                            <input type="text" class="form-control" id="txtClave" name="clave" autocomplete="off"style="font-size:16px;font-weight:bold;">
                          </div>
                          <div class="form-control-feedback" style="text-align:left;" ></div>
                          <div class="help-block with-errors"></div>
                        </div>                              
                        <p></p>
                      </div>
                    </div> 
                    <div class="row">
                      <div class="col-md-5" align="right">
                        <label>Detalle Bancos/ Observaciones:</label> 
                      </div>
                      <div class="col-md-7">
                        <div class="form-group">
                           <textarea class="form-control" rows="3"  name="conceptoDet" id ="txtdetalle_obs"></textarea >
                          <div class="form-control-feedback" style="text-align:left;" ></div>
                           <div class="help-block with-errors"></div>
                        </div>                              
                        <p></p>
                      </div>
                    </div>
                    <!--
                    <div class="row">
                      <div class="col-md-4" align="right">
                        <h4><b style="font-size: 15px;">Observaciones:</b></h4>
                      </div>
                      <div class="col-md-7">
                        <div class="form-group">
                          <textarea class="form-control" rows="2" name="obs" ></textarea >
                          <div class="form-control-feedback" style="text-align:left;" ></div>
                         <div class="help-block with-errors"></div>
                        </div>
                        
                      </div>
                    </div>  
                    <p></p>
                    -->                                  
                  </div>
                </div>  
              </div>
            </div>
                  <br>
                </div>





                </div>
                <br>

            <div class="row" hidden>
                   <div class="col-md-1 col-xs-1 hidden" style="z-index: -10;">
                    <select class="form-control" name="transac">
                      <option value="{{transac}}"></option>
                    </select>
                  </div>
                  <div class="col-md-1 col-xs-1" style="z-index: -10;">
                    <input type="text" class="form-control" id="txtCodigoAu" name="CodigoAut">
                  </div>
                </div>
          
            <div class="row">
              
             

              <div class="col-md-12 m-b-10">
                  <div class="col-md-2 col-md-offset-5">
                    <button type="button" class="btn btn-success btn-block btn-sm" data-toggle="modal" data-target="#modalenvio" id="enviar_transferencia">Guardar</button>
                  </div>
              </div>
            </div>
            <div id="modalenvio" 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>
                              <label class="modal-title" id="myModalLabel">Detalle envío</label>
                            </div>
                            <div class="modal-body">

                              <div class="row">
                               <div class="col-md-6" align="center">
                                <label><h4>Origen: <span id="text_ori" style="color:#3c763d;"></span></h4></label>
                                <label style="margin-top:-20px;"><h5><span id="text_ca_ori" style="color:#3c763d;"></span></h5></label>
                               </div>
                               <div class="col-md-6" align="center">
                                <label><h4>Destino: <span id="text_des" style="color:#a94442;"></span></h4></label>
                               </div>
                              </div>

                              <div class="row">
                                <div class="col-md-2 col-md-offset-1" > 
                                  <h4>Cantidad:</h4> 
                                </div>
                                <div class="col-md-9">
                                    <h4 ><span id="mn"></span> <b id="canti_h4"></b></h4>
                                    <h4 ><span id="canti_h6" style="color: #a94442;" ></span> <span id="alerta_mone"></span></h4>
                                </div>
                              </div>
                              <p></p>
                              <div class="row">
                                <div class="col-md-2 col-md-offset-1" > 
                                  <h4>Comisión:</h4> 
                                </div>
                                <div class="col-md-9">
                                    <h4 ><span id="mn1"></span> <b id="comi_h4"></b></h4>
                                    <h4 ><span id="comi_h6" style="color: #a94442;" ></span> <span id="alerta_mone1"></span></h4>
                                </div>
                              </div>
                              <p></p>
                              <div class="row">
                                <div class="col-md-2 col-md-offset-1" > 
                                  <h4>Concepto Extra:</h4> 
                                </div>
                                <div class="col-md-9">
                                    <h4 ><span id="mn2"></span> <b id="otros_h4"></b></h4>
                                    <h4 ><span id="otros_h6" style="color: #a94442;" ></span> <span id="alerta_mone2"></span></h4>
                                </div>
                              </div>
                              <p></p>
                              <div class="row">
                                <div class="" role="alert" align="center" id="resp_en">
                                </div>
                              </div>
                              <div class="row">
                                <div class="col-md-4 col-md-offset-4">
                                  <div class="form-group">
                                    <button type="submit" class="btn btn-success btn-block" id="enviar_tr">Enviar</button>
                                  </div>
                                </div>
                              </div>
                            </div>

                          </div><!-- /.modal-content -->
                        </div><!-- /.modal-dialog -->
                    </div><!-- /.modal -->
               <div id="modalrecibo" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                          <div class="modal-dialog">
                            <div class="modal-content">
                              <div class="modal-body">
                                <div  id="platillaI" style="font-family:'arial', Monaco, monospace;font-size:18px;">
                                  <table>
                                     <tr style="text-align: center;">
                                      <td align="center"><img src="{% static 'img/golden-letras.png' %}" style="width: 400px; padding-bottom:20px;"></td>
                                    </tr>
                                  </table>
                                  <table>
                                     <tr style="border-top: 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"><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>Consultas y Reclamos:</td>
                                      <td  style="text-align: left;padding-left: 10px;">{{ ObsOficina }}</td>
                                      <!--<td>{{ ObsOficina }}</td>-->
                                    </tr>
                                  </table>      
                                </div>
                              </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="solCod">Solicitar Codigo</button>
                              </div>
                            </div>
                            <br>
                            <div class="row">
                              <div class="col-md-4" align="right"> 
                                <h5><b>CODIGO: </b></h5>
                              </div>
                              <div class="col-md-8">
                                <input type="text" class="form-control" placeholder="Ingrese el codigo de autorizacion" id="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="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>
        </div>
    </div>
  </div>
</form>
<!--<script type="text/javascript" src="https://consorcioimperial.com/socket-io/socket.io/socket.io.js"></script>-->
    <script type="text/javascript">
      //var socket = io.connect('https://consorcioimperial.com',{path:'/socket-io/socket.io'});
          var urlAutocompleteCliente='';
          {% ifequal OfCentral 'si' %}
            urlAutocompleteCliente='/clientes_autocompletado_user_ajax/';
          {% else %}
            urlAutocompleteCliente='/clientes_autocompletado_user_caja_ajax/';
          {% endifequal %}

          var Aux="";
          var filaI =0;
          var idB="";
          var idS="";
          //-- variables
          var bnd= false;
          var flagComision=0;
          var flagKeyUp=0;
          var indice_monto=0;

          $(document).ready(function () {

            {% ifnotequal resultado '' %}
            {% ifequal resultado 'exito' %}
                    var mr;
                  var fechaRecibo= '{{fechaRecibo}}'
                  var horaRecibo='{{horaRecibo}}'
                  //var nombreRecibo='{{nombreRecibo}}'
                  var montoRecibo='{{montoRecibo}}'
                  var monedaRecibo='{{monedaRecibo}}'
                  //var conceptoDetalleRecibo='{{conceptoDetalleRecibo}}'
                  var usuario='{{user.username}}'
                  //var dniRecibo='{{dniRecibo}}'
                  var oficinaRecibo='{{oficinaRecibo}}'
                  var ofiDestino='{{oficinadestino}}'
                  var ofiDesDir='{{direccionofi}}'
                  var numeror='{{nrorecibo}}'
                  var idST='{{idST}}'
                  var solicitante='{{soli}}'
                  var soliAp='{{soliAp}}'
                  var beneficiado='{{bene}}'
                  var beneAp='{{beneAp}}'
                  var comi='{{comisionRecibo}}'
                  var capi='{{capitalRecibo}}'
                  var otros='{{otrosRecibo}}'
                  var recibo_obs='{{recibo_obs}}'
                  var recibo_det='{{recibo_det}}'
                  //$("#recibi").text(nombreRecibo);
                  if(monedaRecibo=="soles")
                  {
                    mr="S/. "
                  }
                  else
                  {
                    mr="$/. "
                  }
                  //$("#pldet").html("Monto:"+mr+capi+"<br>Comision: "+mr+comi+"<br> Otros:"+mr+otros);
                  $("#monto_tr").text(mr+capi);
                  $("#comi_tr").text(mr+comi);
                  $("#otros_tr").text(mr+otros);
                  $("#oficinaRecibo").text(oficinaRecibo);
                  $("#fechaRecibo").text(fechaRecibo+" "+horaRecibo);
                  $("#importe").text(mr+montoRecibo);
                  //$("#concepto").text(conceptoDetalleRecibo);
                  $("#usuario").text(usuario);
                  $("#nror").text("NRO: "+numeror);
                  $("#idST").text("ST: "+idST);
                  $("#bene").text(beneficiado+"\n"+beneAp);
                  $("#soli").text(solicitante+"\n"+soliAp);
                  $("#oficinaDestino").text(ofiDestino);
                  $("#reciboObs").text(recibo_obs);
                  $("#reciboDet").text(recibo_det);
                  //$("#oficinaDir").text(ofiDesDir);
                  $("#soli1").text(solicitante+"\n"+soliAp);
                  $("#platillaI").printThis();
                  
          {% endifequal %}
          {% endifnotequal %}
            $('input').on('keypress', function(e){
              if(e.keyCode == 13)
              {
                      var inputs = $(this).parents("form").eq(0).find(":input.form-control");
                      var idx = inputs.index($(this));

                      if (idx == inputs.length - 1) {
                          inputs[0].select()
                      } else {
                          inputs[idx + 1].focus(); //  handles submit buttons
                         //inputs[idx + 1].select();
                      }
                      return false;
              }
          });
          

         

           

           $(".mayuscula").keyup(function(){
              var valor= $(this).val().toUpperCase();
              $(this).prop('value',valor);
            });
          
          $("input[name=TipoPersonaB]").change(function(){
              idB="";
              $("#IdBeneficiado").val("");
              $("#txtDNIB").prop("readonly",false);
              $("#txtAPB").prop("readonly",false);
              $("#txtAMB").prop("readonly",false);
              $("#txtNombreB").prop("readonly",false);
              $("#txtDNIB").val("");
              $("#txtAPB").val("");
              $("#txtAMB").val("");
              $("#txtNombreB").val("");
              if($(this).val()=="Natural"){
                  $("#dniRUCB").text("DNI");
                  $("#nombreRazonB").text("Nombres");
                  $("#campoApB").show();
                  $("#campoAmB").show();
                   document.getElementById("txtAPB").required = true;
                  document.getElementById("txtAMB").required = true;
              }
              else{
                  $("#dniRUCB").text("RUC");
                  $("#nombreRazonB").text("Razón Social");
                  $("#campoApB").hide();
                  $("#campoAmB").hide();
                  document.getElementById("txtAPB").required = false;
                  document.getElementById("txtAMB").required = false;
              }
          });

            $("input[name=TipoPersona]").change(function(){
              idS="";
              $("#IdCliente").val("");
              if($(this).val()=="Natural"){
                  $("#dniRUC").text("DNI");
                  $("#nombreRazon").text("Nombres");
                  $("#campoAp").show();
                  $("#campoAm").show();
              }
              else{
                  $("#dniRUC").text("RUC");
                  $("#nombreRazon").text("Razón Social");
                  $("#campoAp").hide();
                  $("#campoAm").hide();
              }
          });

          ajax_oficina();
          /*
          $("#ComboOficina").focus(function(){
            ajax_oficina();
          });*/
          //otra funcion
          function ajax_oficina(){
            $.ajax({
              //url:'/oficinas_des_glo_version2_ajax/',
              url:'/oficinas_version3_config_aja/',
              type:'GET',
              dataType:'json',
              success: function(data){
              var html ="";
                $("#ComboOficina").html('');
                for(var i=0;i<data.length;i++){
                    html += '<option value="'+data[i].pk+'">'+data[i].nombre_oficina+'</option>';
                }
                $('#ComboOficina').html(html);
                ajax_Comi_por_ofi_des();
                $('#ComboOficina').selectize();
              }
            });
          };
          //
          ajax_oficina_ori();
          function ajax_oficina_ori(){
            $.ajax({
              url:'/oficinas_tg_ori_ajax/',
              type:'GET',
              dataType:'json',
              success: function(data){
              var html ="";
                $("#ComboOficina1").html('');
                for(var i=0;i<data.length;i++){

                    html += '<option value="'+data[i].pk+'">'+data[i].nombre_oficina+'</option>';
          
                }
                $('#ComboOficina1').html(html);
                $('#ComboOficina1').selectize();
                ajax_cajaOrg($('#ComboOficina1').val());
              }
            });
          };
          //
           //
           $("#solAutCo").hide();
          $('#ComboOficina1').change(function(){
            $('#ComboCajaOrg').html('');
            $("#campoCajaGlo").hide();
            ajax_cajaOrg($(this).val());
           
          });
          $("#ComboCajaOrg").change(function(){
            ajax_saldo_caja_org( $('#ComboOficina1').val(),$('#ComboCajaOrg').val());
            ajax_Comi_por_ofi_des();
          })
          $("#ComboOficina").change(function(){
            ajax_Comi_por_ofi_des();
            bnd=false;
            $("#txtCantidad").prop('value',null);
            $("#txtComicion").prop('value',null);
            $("#txtComicion").prop('readonly',false);
            $("#solAutCo").hide();
          });
          //
          function ajax_cajaOrg(pko){
            if (pko.toString().substring(0,1)=='b'){
              $("#ComboCajaOrg").html('');
              //consulta saldo monto tope base externa
              ajax_saldo_caja_org(pko);
              ajax_Comi_por_ofi_des();
            }
            else{
              $.ajax({
                data:{'idO':pko},
                url:'/cajas_tg_ori_ajax/',
                type:'GET',
                dataType:'json',
                success: function(data){
                  var html ="";
                  $("#ComboCajaOrg").html('');
                  $("#campoCajaGlo").show();
                  for(var i=0;i<data.length;i++){
                      html += '<option value="'+data[i].pk+'">'+data[i].nombre+'</option>';
                  }
                  $('#ComboCajaOrg').html(html);
                  ajax_saldo_caja_org(pko,$('#ComboCajaOrg').val());
                   ajax_Comi_por_ofi_des();
                    bnd=false;
                    $("#txtCantidad").prop('value',null);
                    $("#txtComicion").prop('value',null);
                    $("#txtComicion").prop('readonly',false);
                    $("#solAutCo").hide();
                }
              });
            }
          }
          //----- saldos
          function ajax_saldo_caja_org(pko,pkc){
             $.ajax({
              data:{'idO':pko,'idC':pkc},
              url:'/saldo_disponible_global_ajax/',
              type:'GET',
              dataType:'json',
              success: function(data){
                //$("#saldo_dis").attr('class','alert alert-'+data.e);
                $("#s_tit").text(data.me);
                $("#s_so").text(data.ss);
                $("#s_sot").prop('class',data.e);
                $("#s_do").text(data.sd);
                $("#s_dot").prop('class',data.e);
                $("#s_mt").text(data.mt);
                $("#s_mtt").prop('class',data.e);
              }
            });
          }
          //
         
         // poner comas alos numeros
         function poner_coma(numero){
          var cadena= numero;
          n= cadena.length;
          var r='';
          var p=n;
          var up=0,p1='',p2='';
          while(p>3){
            p=p-3;
            p1=cadena.substring(0,p);
            p2=cadena.substring(p);
            r=','+p2+r;
            cadena=p1;
            console.log(p1);
            console.log(p2);
          }
          return(cadena+r);
         }
         //
         function normalizar(numero){
            var cadena=numero.toString();
            var parte='',num='',dec='00';
            if (cadena.indexOf('.')!=-1){
              parte=cadena.split('.');
              num=parte[0];
              dec=parte[1];
            }
            else{
              num=cadena;
            }
            var cade= poner_coma(num);
            return (cade+'.'+dec);
          }
          //
          function leer_3_cifreas(numero){
            var aux= "000"+numero.toString();
            var num=aux.substring(aux.length-3);
            if(num=='000'){
              return '';
            }
            else{
              var cen='';
              switch (num.charAt(0)) {
                  case '1':
                      if (num.charAt(1)!='0' || num.charAt()!='0'){
                        cen='Ciento ';
                      }
                      else{
                        cen='Cien';
                      }
                      break;
                  case '2':
                      cen='Docientos ';
                      break;
                  case '3':
                      cen='Trescientos ';
                      break;
                  case '4':
                      cen = "Cuatrocientos ";
                      break;
                  case '5':
                      cen = "Quinientos ";
                      break;
                  case  '6':
                      cen = "Seiscientos ";
                      break;
                  case '7':
                      cen = "Setecientos ";
                      break;
                  case '8':
                      cen = "Ochocientos ";
                      break;
                  case '9':
                      cen = "Novecientos ";
                      break;
              }//end switch
              var dec='';
              switch (num.charAt(1)) {
                  case '1':
                      switch (num.charAt(2)) {
                          case '0':
                              dec='Diez';
                              break;
                          case '1':
                              dec='Once';
                              break;
                          case '2':
                              dec='Doce';
                              break;
                          case '3':
                              dec = "Trece";
                              break;
                          case '4':
                              dec = "Catorce";
                              break;
                          case  '5':
                              dec = "Quince";
                              break;
                          default:
                              dec='Dieci';
                      }//end switch
                      break;
                  case '2':
                      if (num.charAt(2)=='0'){
                        dec='Veinte';
                      }
                      else{
                        dec='Veinti';
                      }
                      break;
                  case '3':
                      if (num.charAt(2)=='0'){
                        dec='Treinta';
                      }
                      else{
                        dec='Treinta y ';
                      }
                      break;
                  case '4':
                      if (num.charAt(2)=='0'){
                        dec='Cuarenta';
                      }
                      else{
                        dec='Cuarenta y ';
                      }
                      break;
                  case '5':
                      if (num.charAt(2)=='0'){
                        dec='Cincuenta';
                      }
                      else{
                        dec='Cincuenta y ';
                      }
                      break;
                  case  '6':
                      if (num.charAt(2)=='0'){
                        dec='Sesenta';
                      }
                      else{
                        dec='Sesenta y ';
                      }
                      break;
                  case '7':
                      if (num.charAt(2)=='0'){
                        dec='Setenta';
                      }
                      else{
                        dec='Setenta y ';
                      }
                      break;
                  case '8':
                      if (num.charAt(2)=='0'){
                        dec='Ochenta';
                      }
                      else{
                        dec='Ochenta y ';
                      }
                      break;
                  case '9':
                      if (num.charAt(2)=='0'){
                        dec='Noventa';
                      }
                      else{
                        dec='Noventa y ';
                      }
                      break;
              }//end switch
              var uni='';
              if (num.charAt(1)=='1' && (num.charAt(2)=='0' ||num.charAt(2)=='1' ||num.charAt(2)=='2' ||num.charAt(2)=='3' ||num.charAt(2)=='4' ||num.charAt(2)=='5')){
                uni=''
              }
              else{
                switch (num.charAt(2)) {
                    case '1':
                        uni='Uno'
                        break;
                    case '2':
                        uni='Dos';
                        break;
                    case '3':
                        uni='Tres';
                        break;
                    case '4':
                        uni = "Cuatro";
                        break;
                    case '5':
                        uni = "Cinco";
                        break;
                    case  '6':
                        uni = "Seis";
                        break;
                    case '7':
                        uni = "Siete";
                        break;
                    case '8':
                        uni = "Ocho";
                        break;
                    case '9':
                        uni = "Nueve";
                        break;
                }//end switch
              }
              return (cen+dec+uni);
            }//end else

          }

          function leer_complet(numero1){
            var numero=numero1.toString();
            var cadena='';
            if(numero.indexOf('.')!=-1){
              var aux= numero.split('.');
              numero= aux[0];
            }
            cadena= "000000000"+numero;
            var cen='';
            var mil='';
            var millon='';
            var p= cadena.length;
            if(cadena.substring(p-3)!="000"){
              cen=leer_3_cifreas(cadena.substring(p-3));
            }
            if (cadena.substring(p-6,p-3)!="000"){
                if (cadena.substring(p-6,p-3)=="001"){
                  mil=' Mil ';
                }
                else{
                  mil=leer_3_cifreas(cadena.substring(p-6,p-3))+' Mil ';
                }
                
              }
              if(cadena.charAt(p-7)!='0'){
                  millon=numero.substring(0,numero.length-6)+' Millon '
                }
            return (millon+mil+cen);
          }
       
         //
         $("#enviar_transferencia").click(function(){
          $("#resp_en").prop('class'," ");
          $("#resp_en").html(" ");
          $("#formulario").validator('validate');
          var mn='s/.'
          if ($("#Cmoneda option:selected").val()=='dolares'){
            mn='$'
          }
          $("#mn").text(mn);
          $("#mn1").text(mn);
          $("#mn2").text(mn);
          $("#canti_h4").text(normalizar($("#txtCantidad").val()));
          $("#comi_h4").text(normalizar($("#txtComicion").val()));
          $("#otros_h4").text(normalizar($("#txtConcepto").val()));
          $("#canti_h6").text(leer_complet($("#txtCantidad").val()));
          $("#comi_h6").text(leer_complet($("#txtComicion").val()));
          $("#otros_h6").text(leer_complet($("#txtConcepto").val()));
          $("#alerta_mone").text($("#Cmoneda option:selected").val());
          $("#alerta_mone1").text($("#Cmoneda option:selected").val());
          $("#alerta_mone2").text($("#Cmoneda option:selected").val());
          $("#text_ca_ori").text($('select[name=CajaOri] option:selected').text());
          $("#text_ori").text($('select[name=OficinaOri] option:selected').text());
          $("#text_des").text($('select[name=OficinaDst] option:selected').text());
         })
          $("#enviar_tr").click(function(e){
            e.preventDefault();
            $("#enviar_tr").prop('disabled',true);
            $("#resp_en").prop('class','alert alert-warning');
            $("#resp_en").html("<h4>ENVIANDO....</h4>");

            $("#formulario").submit();
          })
         //
         //************* comisiones *********************
         function ajax_Comi_por_ofi_des(){
          $.ajax({
            data:{'idOfi':$('#ComboOficina').val(),'idCOri':$("#ComboCajaOrg").val(),'idOfiOri':$('#ComboOficina1').val()},
            url:'/listaConfigCo_para_ofici_ajax/',
            //async:false,
            type:'GET',
            dataType:'json',
            success: function(data){
                AuxC = data;
            }
          });
         }
         /*
         $("#txtCantidad").keyup(function(){
          $("#rbnin").prop("checked",true);
          $("#divComiBanco").addClass("hidden");
          $("#divNroCta").addClass("hidden");
          $("#txtConcepto").val(0);
           flagComision=0;
           var bd=false;
           indice_monto =-1;
           var ind=0
           var mont= parseFloat($(this).val());
            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
                  indice_monto=i;
                  bd=true;
                  //flagComision=true;
                }
              }
            }
            if(!bnd){
              if(bd){
                $("#txtComicion").prop('readonly',true);
                $("#solAutCo").show();
                if(parseFloat(AuxC[ind].comision)<1){
                  $("#txtComicion").prop('value',Math.floor(parseFloat(AuxC[ind].comision)*parseFloat(parseFloat($("#txtCantidad").val()))));
                }
                else{
                  $("#txtComicion").prop('value',AuxC[ind].comision);
                }
                
                flagComision=parseFloat(AuxC[ind].comision);
              }
              else{
                $("#txtComicion").prop('readonly',false);
                $("#txtComicion").prop('value',null);
                $("#solAutCo").hide();
              }
            }
         });


         $("#txtComicion").keyup(function(){
            flagKeyUp=$(this).val();
         });

         $("#txtComicion").change(function(){
          if(!bnd){
            var comision=parseFloat($(this).val());
            if(flagComision<1){
               if (comision<Math.floor(flagComision*parseFloat($("#txtCantidad").val()))){
                $(this).val(Math.floor(flagComision*parseFloat($("#txtCantidad").val())));
                $("#modalCodAut").modal("show");
              }
            }
            else{
              if (comision<flagComision){
                $(this).val(flagComision);
                $("#modalCodAut").modal("show");
              }
            }
            
          }
         });

         $("#solAutCo").click(function(){
          $("#txtComicion").prop('readonly',false);
         });
          
         //
         $("#solCod").click(function(){
          ajax_solicitudAut();
         });

         function ajax_solicitudAut(){
            $.ajax({
              data:{'idO':$("#ComboOficina").val(),'idOOri':$("#ComboOficina1").val(),'idCOri':$("#ComboCajaOrg").val()},
              url:'/SolAutoComisionPersonalGlo_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'
                  });
                }
              }
            });
          };

         //
         $("#verificar").click(function(){
          ajax_verificarAut();
         })
         function ajax_verificarAut(){
            $.ajax({
              data:{'cod':$("#txtCodA").val(),'idO':$("#ComboOficina").val(),'idOOri':$("#ComboOficina1").val(),'idCOri':$("#ComboCajaOrg").val()},
              url:'/Verifi_CodAutoComiGlo_ajax/',
              //async:false,
              type:'GET',
              dataType:'text',
              success: function(data){
                if(data=='exito'){

                  bnd=true;
                   $("#modalCodAut").modal("hide");
                   $("#txtComicion").prop('value',null);
                   $("#txtComicion").prop('readonly',false);
                   $("#solAutCo").hide();
                   $("#txtCodigoAu").prop('value',$("#txtCodA").val());
                 }
                 else{
                  bootbox.alert({ 
                    message: "Error. "+data,
                    className: 'bb-alternate-modal'
                  });
                  bnd=false;
                }
              }
            });
          };
          */
         //
         //*************************** autocompletado **************************
      //***************************** 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);
      }
      function verificar_datos_bene(current,input_value){
        if (current.name == datos_beneficiario() || current.name == input_value) {
            //swal("Beneficario", datos_beneficiario(), "success");
            //$("#formulario").validator('validate');
            $("#panel_beneficiario").prop("class","panel panel-success")
            $("#cabecera_bene").text("")
            return true
          } 
          else {
            $("#IdBeneficiado").prop('value',null);
            $("#panel_beneficiario").prop("class","panel panel-warning")
            $("#cabecera_bene").text("(Nuevo Cliente)")
            //$("#txtNombreB").prop('value',null);
            //$("#txtAPB").prop('value',null);
            //$("#txtAMB").prop('value',null);
            //swal("Nuevo Cliente",datos_beneficiario(), "warning");
            //$("#formulario").validator('validate');
            //console.log($("#IdBeneficiado").val())
            //data_bene={id:-1}
            return false
          }
      }
      $("#txtDNIB").change(function() {
        var current = $("#txtDNIB").typeahead("getActive");
        if (current) {

          if(verificar_datos_bene(current,$("#txtDNIB").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);
          }
          
          
          //console.log("if 1");
        } else {
           //swal("Alerta", "Se creara un nuevo cliente,complete los campos DNI/RUC y Direccion", "warning");
           $("#IdBeneficiado").prop('value',null);
           $("#panel_beneficiario").prop("class","panel panel-warning")
            $("#cabecera_bene").text("(Nuevo Cliente)")
          console.log("else 1");
        }
        //console.log(cliente);
        
      }); 

      var autoBeneficiario_dni= $('#txtDNIB').typeahead({
        source:  function (query, process) {
          return $.get('/listaCliente_autocompletado_dni_ajax/', { query: query }, function (data) {
                return process(data);
            },'json');
        }
      });
      //*** 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);
            //swal("Beneficario", datos_beneficiario(), "success");
            //$("#formulario").validator('validate');
            $("#panel_beneficiario").prop("class","panel panel-success")
            $("#cabecera_bene").text("")
            //console.log($("#IdBeneficiado").val())
          } 
          else {
            $("#IdBeneficiado").prop('value',null);
            $("#panel_beneficiario").prop("class","panel panel-warning")
            $("#cabecera_bene").text("(Nuevo Cliente)")
          //$("#txtDNIB").prop('value',null);
            //swal("Nuevo Cliente",datos_beneficiario(), "warning");
            //$("#formulario").validator('validate');
            //console.log($("#IdBeneficiado").val())
            //data_bene={id:-1}
          }
        } else {
           //swal("Alerta", "Se creara un nuevo cliente,complete los campos DNI/RUC y Direccion", "warning");
           $("#IdBeneficiado").prop('value',null);
          //$("#txtDNIB").prop('value',null);
          //swal("Nuevo Cliente", datos_beneficiario(), "warning");
          //$("#formulario").validator('validate');
          //console.log($("#IdBeneficiado").val())
            $("#panel_beneficiario").prop("class","panel panel-warning")
            $("#cabecera_bene").text("(Nuevo Cliente)")
        }
        //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")
            $("#cabecera_bene").text("")
            //swal("Beneficario", datos_beneficiario(), "success");
            //$("#formulario").validator('validate');
            //console.log($("#IdBeneficiado").val())
          } 
          else {
            $("#IdBeneficiado").prop('value',null);
            $("#panel_beneficiario").prop("class","panel panel-warning")
            $("#cabecera_bene").text("Nuevo Cliente")
            //$("#txtDNIB").prop('value',null);
            //swal("Nuevo Cliente",datos_beneficiario(), "warning");
            //$("#formulario").validator('validate');
            //console.log($("#IdBeneficiado").val())
            //data_bene={id:-1}
          }
        } else {
           //swal("Alerta", "Se creara un nuevo cliente,complete los campos DNI/RUC y Direccion", "warning");
           $("#IdBeneficiado").prop('value',null);
           $("#panel_beneficiario").prop("class","panel panel-warning")
          $("#cabecera_bene").text("Nuevo Cliente")
           //$("#txtDNIB").prop('value',null);
          //swal("Nuevo Cliente", datos_beneficiario(), "warning");
          //$("#formulario").validator('validate');
          //console.log($("#IdBeneficiado").val())
        }
        //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")
            $("#cabecera_bene").text("")
            //swal("Beneficario", datos_beneficiario(), "success");
            //$("#formulario").validator('validate');
            //console.log($("#IdBeneficiado").val())
          } 
          else {
            $("#IdBeneficiado").prop('value',null);
            $("#panel_beneficiario").prop("class","panel panel-warning")
          $("#cabecera_bene").text("(Nuevo Cliente)")
            //$("#txtDNIB").prop('value',null);
            //swal("Nuevo Cliente",datos_beneficiario(), "warning");
            //$("#formulario").validator('validate');
            //console.log($("#IdBeneficiado").val())
            //data_bene={id:-1}
          }
        } else {
           //swal("Alerta", "Se creara un nuevo cliente,complete los campos DNI/RUC y Direccion", "warning");
           $("#IdBeneficiado").prop('value',null);
           //$("#txtDNIB").prop('value',null);
           $("#panel_beneficiario").prop("class","panel panel-warning")
          $("#cabecera_bene").text("(Nuevo Cliente)")
          //swal("Nuevo Cliente", datos_beneficiario(), "warning");
          //$("#formulario").validator('validate');
          //console.log($("#IdBeneficiado").val())
        }
        //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();
      })
      //***************************** solicitante **************************
      function datos_solicitante(){
        return $("#txtDNI").val()+' '+$("#txtNombre").val()+' '+$("#txtAP").val()+' '+$("#txtAM").val()
      }
      function limpiar_solicitante(){
        $("#IdCliente").prop('value',null);
        $("#txtDNI").prop('value',null);
        $("#txtNombre").prop('value',null);
        $("#txtAP").prop('value',null);
        $("#txtAM").prop('value',null);
      }
      
      $("#txtDNI").change(function() {
        var current = $("#txtDNI").typeahead("getActive");
        if (current) {
          // Some item from your model is active!
          if (current.name == datos_solicitante() || current.name == $("#txtDNI").val()) {
            data_soli= current;
            $("#IdCliente").prop('value',data_soli.id);
            $("#txtDNI").prop('value',data_soli.dni);
            $("#txtNombre").prop('value',data_soli.nombre);
            $("#txtAP").prop('value',data_soli.ap);
            $("#txtAM").prop('value',data_soli.am);
            $("#panel_solicitante").prop("class","panel panel-success")
            $("#cabecera_soli").text("")
            //swal("Solicitante", datos_solicitante(), "success");
            //$("#formulario").validator('validate');
            //console.log($("#IdBeneficiado").val())
          } 
          else {
            $("#IdCliente").prop('value',null);
            $("#panel_solicitante").prop("class","panel panel-warning")
            $("#cabecera_soli").text("(Nuevo Cliente)")
            //$("#txtNombre").prop('value',null);
            //$("#txtAP").prop('value',null);
            //$("#txtAM").prop('value',null);
            //swal("Nuevo Cliente",datos_solicitante(), "warning");
            //$("#formulario").validator('validate');
            //console.log($("#IdBeneficiado").val())
            //data_bene={id:-1}
          }
        } else {
           //swal("Alerta", "Se creara un nuevo cliente,complete los campos DNI/RUC y Direccion", "warning");
           $("#IdCliente").prop('value',null);
           $("#panel_solicitante").prop("class","panel panel-warning")
           $("#cabecera_soli").text("(Nuevo Cliente)")
            //$("#txtNombre").prop('value',null);
            //$("#txtAP").prop('value',null);
            //$("#txtAM").prop('value',null);
          //swal("Nuevo Cliente", datos_solicitante(), "warning");
          //$("#formulario").validator('validate');
          //console.log($("#IdBeneficiado").val())
        }
        //console.log(cliente);
        
      }); 

      var autoSolicitante_dni= $('#txtDNI').typeahead({
        source:  function (query, process) {
          return $.get('/listaCliente_autocompletado_dni_ajax/', { query: query }, function (data) {
                return process(data);
            },'json');
        }
      });
      //*** nombre
      $("#txtNombre").change(function() {
        var current = $("#txtNombre").typeahead("getActive");
        if (current) {
          // Some item from your model is active!
          if (current.name == datos_solicitante() || current.name == $("#txtNombre").val()) {
            data_soli= current;
            $("#IdCliente").prop('value',data_soli.id);
            $("#txtDNI").prop('value',data_soli.dni);
            $("#txtNombre").prop('value',data_soli.nombre);
            $("#txtAP").prop('value',data_soli.ap);
            $("#txtAM").prop('value',data_soli.am);
            $("#panel_solicitante").prop("class","panel panel-success")
            $("#cabecera_soli").text("")
            //swal("Solicitante", datos_solicitante(), "success");
            //$("#formulario").validator('validate');
            //console.log($("#IdBeneficiado").val())
          } 
          else {
            $("#IdCliente").prop('value',null);
            $("#panel_solicitante").prop("class","panel panel-warning")
            $("#cabecera_soli").text("(Nuevo Cliente)")
            //$("#txtDNI").prop('value',null);
            //swal("Nuevo Cliente",datos_solicitante(), "warning");
            //$("#formulario").validator('validate');
            //console.log($("#IdBeneficiado").val())
            //data_bene={id:-1}
          }
        } else {
           //swal("Alerta", "Se creara un nuevo cliente,complete los campos DNI/RUC y Direccion", "warning");
           $("#IdCliente").prop('value',null);
           $("#panel_solicitante").prop("class","panel panel-warning")
           $("#cabecera_soli").text("(Nuevo Cliente)")
           //$("#txtDNI").prop('value',null);
          //swal("Nuevo Cliente", datos_solicitante(), "warning");
          //$("#formulario").validator('validate');
          //console.log($("#IdBeneficiado").val())
        }
        //console.log(cliente);
        
      }); 

      var autoSolicitante_nombre= $('#txtNombre').typeahead({
        source:  function (query, process) {
          return $.get('/listaCliente_autocompletado_nombre_ajax/', { query: query,'ap':$("#txtAP").val(),'am':$("#txtAM").val()}, function (data) {
                return process(data);
            },'json');
        }
      });
      // paterno
      $("#txtAP").change(function() {
        var current = $("#txtAP").typeahead("getActive");
        if (current) {
          // Some item from your model is active!
          if (current.name == datos_solicitante() || current.name == $("#txtAP").val()) {
            data_soli= current;
            $("#IdCliente").prop('value',data_soli.id);
            $("#txtDNI").prop('value',data_soli.dni);
            $("#txtNombre").prop('value',data_soli.nombre);
            $("#txtAP").prop('value',data_soli.ap);
            $("#txtAM").prop('value',data_soli.am);
             $("#panel_solicitante").prop("class","panel panel-success")
            $("#cabecera_soli").text("")
            //swal("Solicitante", datos_solicitante(), "success");
            //$("#formulario").validator('validate');
            //console.log($("#IdBeneficiado").val())
          } 
          else {
            $("#IdCliente").prop('value',null);
            $("#panel_solicitante").prop("class","panel panel-warning")
            $("#cabecera_soli").text("(Nuevo Cliente)")
            //$("#txtDNI").prop('value',null);
            //swal("Nuevo Cliente",datos_solicitante(), "warning");
            //$("#formulario").validator('validate');
            //console.log($("#IdBeneficiado").val())
            //data_bene={id:-1}
          }
        } else {
           //swal("Alerta", "Se creara un nuevo cliente,complete los campos DNI/RUC y Direccion", "warning");
           $("#IdCliente").prop('value',null);
           $("#panel_solicitante").prop("class","panel panel-warning")
           $("#cabecera_soli").text("(Nuevo Cliente)")
           //$("#txtDNI").prop('value',null);
          //swal("Nuevo Cliente", datos_solicitante(), "warning");
          //$("#formulario").validator('validate');
          //console.log($("#IdBeneficiado").val())
        }
        //console.log(cliente);
        
      }); 

      var autoSolicitante_ap= $('#txtAP').typeahead({
        source:  function (query, process) {
          return $.get('/listaCliente_autocompletado_paterno_ajax/', { query: query,'no':$("#txtNombre").val(),'am':$("#txtAM").val()}, function (data) {
                return process(data);
            },'json');
        }
      });
      // materno
      $("#txtAM").change(function() {
        var current = $("#txtAM").typeahead("getActive");
        if (current) {
          // Some item from your model is active!
          if (current.name == datos_solicitante() || current.name == $("#txtAM").val()) {
            data_soli= current;
            $("#IdCliente").prop('value',data_soli.id);
            $("#txtDNI").prop('value',data_soli.dni);
            $("#txtNombre").prop('value',data_soli.nombre);
            $("#txtAP").prop('value',data_soli.ap);
            $("#txtAM").prop('value',data_soli.am);
            //swal("Solicitante", datos_solicitante(), "success");
            //$("#formulario").validator('validate');
            $("#panel_solicitante").prop("class","panel panel-success")
            $("#cabecera_soli").text("")
            //console.log($("#IdBeneficiado").val())
          } 
          else {
            $("#IdCliente").prop('value',null);
            $("#panel_solicitante").prop("class","panel panel-warning")
            $("#cabecera_soli").text("(Nuevo Cliente)")
            //$("#txtDNI").prop('value',null);
            //swal("Nuevo Cliente",datos_solicitante(), "warning");
            //$("#formulario").validator('validate');
            //console.log($("#IdBeneficiado").val())
            //data_bene={id:-1}
          }
        } else {
           //swal("Alerta", "Se creara un nuevo cliente,complete los campos DNI/RUC y Direccion", "warning");
           $("#IdCliente").prop('value',null);
           $("#panel_solicitante").prop("class","panel panel-warning")
           $("#cabecera_soli").text("(Nuevo Cliente)")
           //$("#txtDNI").prop('value',null);
          //swal("Nuevo Cliente", datos_solicitante(), "warning");
          //$("#formulario").validator('validate');
          //console.log($("#IdBeneficiado").val())
        }
        //console.log(cliente);
        
      }); 

      var autoSolicitante_ami= $('#txtAM').typeahead({
        source:  function (query, process) {
          return $.get('/listaCliente_autocompletado_materno_ajax/', { query: query,'ap':$("#txtAP").val(),'no':$("#txtNombre").val()}, function (data) {
                return process(data);
            },'json');
        }
      });
      $("#btn_limpiar_soli").click(function(e){
        e.preventDefault();
        limpiar_solicitante();
      })
      //********
      //--
      $("#chb-banco").change(function(){
        if(this.checked){
          $("#divBanco").removeClass("hidden"); 
          $("#divComiBanco").removeClass("hidden"); 
          $("#divNroCta").removeClass("hidden"); 
          $("#divCelReferencia").removeClass("hidden"); 
          $("#divClave").removeClass("hidden");
          $("#txtClave").prop('value',null)
        }
        else{
         $("#divComiBanco").addClass("hidden");
         $("#divBanco").addClass("hidden");
          $("#divNroCta").addClass("hidden"); 
          $("#divCelReferencia").addClass("hidden"); 
          $("#divClave").addClass("hidden");
          $("#txtClave").prop('value',null)
        }
      })
         //
         //***** SOCKET ****
      /*
      $("#btn_consultar").click(function(e){
        e.preventDefault();
        let data ={}
        data.dni = $("#txtDNIB").val();
        data.tipo="be"
        console.log(data);
        socket.emit('validar_nd',data);
        $('#panel_beneficiario').waitMe({effect : 'progressBar',text : 'Recuperando Datos'});
      })
      $("#btn_consultar_so").click(function(e){
        e.preventDefault();
        let data ={}
        data.dni = $("#txtDNI").val();
        data.tipo="so"
        console.log(data);
        socket.emit('validar_nd',data);
        $('#panel_solicitante').waitMe({effect : 'progressBar',text : 'Recuperando Datos'});
      })
      socket.on('validado',function(data){
        console.log(data);
        if(data.status==1){
          let str = data.razon;
          let res = str.trim().split(",");
          let res1 = res[0].trim().split(" ");
          let st_ma= ""
          for(let i=1;i<res1.length;i++){
            st_ma+=res1[i]+" ";
          }
          //*********************
          if(data.tipo=="be"){
            //ajax_cta_bancos_dni(data.dni);
            $("#txtNombreB").val(res[1]);
            $("#txtAPB").val(res1[0]);
            $("#txtAMB").val(st_ma.trim());
          }
          if(data.tipo=="so"){
            $("#txtNombre").val(res[1]);
            $("#txtAP").val(res1[0]);
            $("#txtAM").val(st_ma.trim());
          }
          
        }
        else{
          bootbox.alert({ 
            message: data.mensaje,
            className: 'bb-alternate-modal'
          }); 
        }

        $('#panel_beneficiario').waitMe('hide');
        $('#panel_solicitante').waitMe('hide');
      });
      */
      //****************
        });
    </script>
   
{% endblock content1 %}