{% extends "base.html" %}
{% load static %}
{% block titulo %}
  Habilitar Caja Material
{% endblock titulo %}
{% block content1 %} 
<script type="text/javascript">
  $("#navCajaMaterial").attr('class','dropdown active');
  $("#navEnvioMaterialCaja").attr('class','active');
</script>
<form id="formulario" action="/EnviarCajaMaterial/" 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"> <strong>HABILITAR CAJA MATERIAL</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-2 col-md-offset-1" align="right"> <label>Caja Destino</label></div>
                <div class="col-md-6">
                <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" id="enviar" 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 ><b id="oficinaRecibo"></b></h5>
            <table>
              <tr>
                <td id="fechaRecibo" nowrap></td>
                <td>&nbsp;</td>
                <td id="horaRecibo" nowrap></td>
              </tr>
            </table>
            <br>
            <b> A FAVOR DE:</b>
            <p id="recibi"></p>
            <b>IMPORTE:</b>
            <p id="importe"></p>
            <b>CONCEPTO:</b>
            <br>
            <p id="concepto"></p>
            <br>
            <br>
            <p>________________</p>
            <b>OP. {{ nombre_usuario }}</b>
          </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 monedaRecibo='{{monedaRecibo}}'
            var conceptoDetalleRecibo='{{conceptoDetalleRecibo}}'
            var usuario='{{user.username}}'
            //var dniRecibo='{{dniRecibo}}'
            var oficinaRecibo='{{oficinaRecibo}}'
            $("#recibi").text("Sr(a): "+nombreRecibo);
            if(monedaRecibo=="soles")
            {
              mr="S/. "
            }
            else
            {
              mr="$/. "
            }
            $("#oficinaRecibo").text(oficinaRecibo);
            $("#horaRecibo").text(horaRecibo);
            $("#fechaRecibo").text(fechaRecibo);
            $("#importe").text(mr+montoRecibo);
            $("#concepto").text(conceptoDetalleRecibo);
            $("#usuario").text(usuario);
           // $("#recibi1").text("Sr(a): "+nombreRecibo);
            $("#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;
      }
    });
   
    $('#txtMonto').numeric('.');
    ajax_caja();
    /*
    $("#ComboAfavor").focus(function(){
      ajax_personal_caja($("#ComboCaja").val());
    });*/
     function ajax_caja(){
      $.ajax({
        url:'/cajas_operador_material_ajax/',
        //async:false,
        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].oper+')'+'</option>';
          }
          $('#ComboCaja').html(html);
        }
      });
    };

  })
</script>
{% endblock content1 %}