{% extends "principal.html" %}
{% load staticfiles %}
{% load url from future %}



{% block breadcrumbs %}
    <li class="{{ principal }}"><a href="/inicio/index"><i class="icon-home"></i> Inicio</a></li>
   <li class="active">Actualizar</li>
                 
{% endblock %}


{% block contenido %}
<div id="dgtic-content-area">
<div class="row-fluid">
    <div class="span12">
        <div class="dgtic-panel collapsible">
            <div class="dgtic-panel-header">
                <form action="." method="GET">
                  <label for="q">Busqueda por Fecha*  </label>
                  <input id="date" type="text"  name="q" value="{{ query|escape }}">
                  <input type="submit" value="Buscar">
                </form>
            </div>
            <div class="dgtic-panel-content dgtic-table-container">
              <table id="dgtic-ex-datatable-numberpaging" class="dgtic-table">
            
                <thead>
                  <tr>
                   <th>No</th>
                   <th>FECHA</th>
                   <th>DESAYUNO</th>
                   <TH>CENA</th>
                   <th>COLACIONES</th>
                   <th>
                        <i class="icol-pencil" rel="tooltip" data-original-title="Editar"
                        data-placement="top" ></i>
                   </th>
                   <th>
                        <i class="icol-cross" rel="tooltip" data-original-title="Borrar" data-placemente ="top"></i>
                   </th>

                  </tr>

                 </thead>
                   
                 <tbody>
                  {% for persona in results %}  
                   <td>{{ persona.idRacionComida }}</td>
                   <td>{{ persona.fecha }}</td>
                   <td>{{ persona.desayunos }}</td>
                   <td>{{ persona.cenas }}</td>
                   <td>{{ persona.colaciones }}</td>
                   <td>
                        <a 
                        href ="/alimento/update/{{persona.idRacionComida}}/">
                            <i class="icol-pencil" rel="tooltip" data-original-title="Editar"></i>
                        </a>
                   </td>
                   <td>
                      <a  class="eliminar_d" 
                            href ="javascript:void(0)">
                                <i class="icol-cross" onclick="confirmar({{persona.idRacionComida}})"></i>
                            </a>
                    </td>

                  </tr>
                  {% empty %}
                  <tr><td colspan="9">No hay personas registradas</td></tr>

                 {% endfor %}
                  
                 </tbody>
                 
              </table>
            
          </div>      
      </div>
    </div>
</div>
</div>

<div id="dialog-message" style="display:none;" title="¡Atenci&oacute;n!" >
    <p>
    <span class="ui-icon ui-icon-circle-check" style="float: left; margin: 0 7px 50px 0;"></span>
    ¿ Esta seguro que desea eliminar el registro?
    </p>

</div>
<script type="text/javascript">
    $.datepicker.regional['es'] = {
        closeText: 'Cerrar',
        prevText: '<Ant',
        nextText: 'Sig>',
        currentText: 'Hoy',
        monthNames: ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio',
        'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre'],
        monthNamesShort: ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun',
        'Jul', 'Ago', 'Sep', 'Oct', 'Nov', 'Dic'],
        dayNames: ['Domingo', 'Lunes', 'Martes', 'Miércoles', 'Jueves', 'Viernes', 'Sábado'],
        dayNamesShort: ['Dom', 'Lun', 'Mar', 'Mié;', 'Juv', 'Vie', 'Sáb'],
        dayNamesMin: ['Do', 'Lu', 'Ma', 'Mi', 'Ju', 'Vi', 'Sá'],
        weekHeader: 'Sm',
        dateFormat: 'dd/mm/yy',
        firstDay: 1,
        isRTL: false,
        showMonthAfterYear: false,
        yearSuffix: ''
    };
    $.datepicker.setDefaults($.datepicker.regional['es']);
    $( "#date" ).datepicker();
    $( "#date" ).datepicker( "option", "dateFormat", "yy-mm-dd" );

</script>
<script>
  function confirmar(persona){
   var persona = persona;
      $( "#dialog-message" ).dialog({
          resizable: false,
          height:210,
          width:420,
          modal: true,
          buttons: {
          "Eliminar": function() {
          window.location.href="/alimento/"+persona+"/borrar";

          },
          "Cancelar": function() {
          $( this ).dialog( "close" );
          }
          }
      });
  }
</script>

<!-- JS Libs -->

    <script src="{% static "assets/js/libs/jquery-1.8.3.min.js" %}"></script>
    <script src="{% static "assets/js/libs/jquery.placeholder.min.js" %}"></script>
    <script src="{% static "assets/js/libs/jquery.mousewheel.min.js" %}"></script>

    <!-- JS Bootstrap -->
    <script src="{% static "bootstrap/js/bootstrap.min.js" %}"></script>
    
    <!-- jQuery-UI JavaScript Files -->
    <script src="{% static "assets/jui/js/jquery-ui-1.9.2.min.js" %}"></script>
    <script src="{% static "assets/jui/jquery.ui.timepicker.min.js" %}"></script>
    <script src="{% static "assets/jui/jquery.ui.touch-punch.min.js" %}"></script>
    <link rel="stylesheet" type="text/css" href="{% static "assets/jui/css/jquery.ui.all.css" %}" media="screen">
    <link rel="stylesheet" href="{% static "plugins/elrte/css/elrte.css" %}" media="screen">
    <link rel="stylesheet" href="{% static "plugins/elfinder/css/elfinder.css" %}" media="screen">

    <!-- JS Plugins -->

    <!-- Validation Plugin -->
    <script src="{% static "plugins/validate/jquery.validate.min.js" %}"></script>

    <!-- jGrowl Plugin -->
    <script src="{% static "plugins/jgrowl/jquery.jgrowl.min.js" %}"></script>
    <link rel="stylesheet" href="{% static "plugins/jgrowl/jquery.jgrowl.css" %}" media="screen">

    <!-- JS Demo -->
    <script src="{% static "assets/js/demo/demo.ui.js" %}"></script>

    <!-- JS Template -->
    <script src="{% static "assets/js/core/dandelion.core.js" %}"></script>

    <!-- JS Customizer -->
    <script src="{% static "assets/js/core/dandelion.customizer.js" %}"></script>


    <link rel="stylesheet" type="text/css" href="{%static "assets/jui/css/jquery.ui.all.css" %}">
    <link rel="stylesheet" type="text/css" href="{% static "plugins/select2/select2.css" %}">
    <script type="text/javascript" src="{%static "assets/jui/js/jquery-ui-1.9.2.min.js"%}"></script>
    <script src="{%static "plugins/select2/select2.min.js" %}"></script>
    <script src="{% static "plugins/datatables/jquery.dataTables.js" %}"></script>


{% endblock %}