{% extends "base.html" %}
{% load static %}
{% block titulo %}
Envio de material
{% endblock titulo %}
{% block content1 %} 
<script type="text/javascript">
  $("#navCajaMaterial").attr('class','dropdown active');
  $("#navEnvioMaterialOficina").attr('class','active');
</script>
      <form action="/EnvioOficinaMaterial/" method="POST" data-toggle="validator" role="form"> {% csrf_token %}
        <div class="row">
          <div class="col-md-10 col-md-offset-1" >
              <div class="panel panel-default">
                <div class="panel-heading panel-material" id="grupoC"> <strong>ENVIO DE MATERIAL OTRA A OFICINA</strong>
                </div>
                <div class="panel-body">
                  <div class="row" id="Result">
                    {% 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 class="row">
                    <div class="col-md-2 col-md-offset-1" align="right"> <label>OFICINA DESTINO:</label></div>
                    <div class="col-md-3">
                      <div class="fg-line">
                        <div class="">
                             <select class="form-control" id="ComboOficina" name="oficina" placeholder="Destino">
                              </select>
                        </div>
                      </div>
                      <p></p>
                    </div>
                    <div class="col-md-1 " align="right"> <label>CAJA :</label></div>
                    <div class="col-md-4 " >
                      <div class="fg-line">
                        <div class="select">
                             <select class="form-control" id="ComboCaja" name="caja">
                                <option value="0"></option>
                              </select>
                        </div>
                      </div>
                      <p></p>
                    </div>
                  </div>

                  <div class="row">
                    <div class="col-md-2 col-md-offset-1" align="right"><label>Cantidad de Material</label></div>
                    <div class="col-md-3">
                        <div class="form-group">
                          <div class="input-group">
                            <input type="text" class="form-control" id="txtMonto" placeholder="0.00" name="monto" required>
                            <span class="input-group-addon">Gramos</span>
                          </div>
                          <div class="form-control-feedback" style="text-align:left;" ></div>
                        </div>                               
                        <p></p>
                    </div>
                  </div>
                  <div class="row">
                    <div class="col-md-2 col-md-offset-1" align="right">
                      <label>Observaciones</label>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                        <div class="fg-line">
                          <textarea class="form-control" rows="2" placeholder="Observaciones" name="observacion"></textarea >
                          <div class="form-control-feedback" style="text-align:left;" ></div>
                        </div>
                        </div>                                 
                        <p></p>
                    </div>
                  </div>
                  <div class="row">
                    <div class="col-md-2 col-md-offset-5">
                      <button class="btn btn-primary btn-block btn-sm" type="submit"><strong>ENVIAR</strong></button>
                    </div>
                  </div>
                </div>
              </div>
          </div>
        </div>
      </form> 
<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-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;">
            <h5 align ="center"><b>RECIBO DE EGRESO</b></h5>
            <table>
              <tr nowrap>=====================================</tr>
            </table>
            <h5 id="oficinaRecibo"></h5>
            <h5 id="fechaRecibo"></h5>
            <h5 id="horaRecibo"></h5>
            <b> OFICINA DESTINO:</b>
            <p id="recibi"></p>
            <b>IMPORTE:</b>
            <p id="importe"></p>
            <b>CONCEPTO:</b>
            <p id="concepto"></p>
            <br>
            <p>________________</p>
            <b>OP. {{ nombre_usuario }}</b>
            <br>
          </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 -->
<script type="text/javascript">
      $(document).ready(function(){
        {% ifnotequal resultado '' %}
            {% ifequal resultado 'exito' %}
                  var mr;
                  var fechaRecibo= '{{fechaRecibo}}'
                  var horaRecibo='{{horaRecibo}}'
                  var nombreRecibo='{{nombreRecibo}}'
                  var montoRecibo='{{montoRecibo}}'
                  var conceptoDetalleRecibo='{{conceptoDetalleRecibo}}'
                  var usuario='{{user.username}}'
                  //var dniRecibo='{{dniRecibo}}'
                  var oficinaRecibo='{{oficinaRecibo}}'
                  $("#recibi").text(nombreRecibo);
                  mr="gr. ";
                  $("#oficinaRecibo").text(oficinaRecibo);
                  $("#horaRecibo").text("Hora: "+horaRecibo);
                  $("#fechaRecibo").text("Fecha: "+fechaRecibo);
                  $("#importe").text(mr+montoRecibo);
                  $("#concepto").text(conceptoDetalleRecibo);
                  $("#usuario").text(usuario);
                  $("#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;
            }
          });


        $('#ComboOficina').change(function(){

          ajax_caja();
      });
        

        $('#txtMonto').numeric('.');
        ajax_oficina();
        //otra funcion
        function ajax_oficina(){
          $.ajax({
            url:'/oficinas_ajax/',
            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);
              $('#ComboOficina').selectize();
              ajax_caja();  
            }
          });
        };
        //otra funcion
        
      function ajax_caja(){
        $('#ComboCaja').html('');
        $.ajax({
          url:'/CajasPersonalMaterial_ajax/',
          data:{'idOfi':$("#ComboOficina").val()},
          type:'GET',
          dataType:'json',
          success: function(data){
            var html ="";
            $("#ComboCaja").html('');
            for(var i=0;i<data.length;i++){
              html += '<option value="'+data[i].pk+'">'+data[i].nombre+' - '+data[i].op+'</option>';
            }
            $('#ComboCaja').html(html);
          }
        });
      };
      //otra funcion
      })
</script>
{% endblock content1 %}