source: firmaeventos/eventos/templates/register.event.html @ a3deb5f

{% extends 'base.template.html' %}
{% load staticfiles %}
{% block title %}Registrar Evento{% endblock title %}
{% block extraJs %}
    <script src="{% static 'js/jquery/jquery-ui.js' %}"></script>
    <script src="{% static 'js/formset.js' %}"></script>
    <script src="{% static 'js/pdf.js' %}"></script>
    <script src="{% static 'js/pdf.worker.js' %}"></script>
    <script src="{% static 'js/draggable.js' %}"></script>
    <!-- Coordenadas PDF-->
    <script src="{% static 'js/DraggableSortable.js' %}"></script>
    <script src="{% static 'js/docsDraggable.js' %}"></script>
    <script type="text/javascript">
    $(function() {
        $('#id_orders_table tbody tr').formset({
            // For inline formsets, be sure to set the prefix, as the default prefix
            // ('form') isn't correct.
            // Django appears to generate the prefix from the lowercase plural
            // name of the related model, with camel-case converted to underscores.
            prefix: 'form',
            addText:'<i class="tiny material-icons prefix">add_circle_outline</i>Agregar Participante',
            deleteText:'<i class="material-icons">delete_forever</i>',
        })

          $('.datepicker').pickadate({
            selectMonths: true, // Creates a dropdown to control month
            selectYears: 15, // Creates a dropdown of 15 years to control year,
            today: 'Today',
            clear: 'Clear',
            close: 'Ok',
            closeOnSelect: false, // Close upon selecting a date,
            format: "dd/mm/yyyy",
            // The title label to use for the month nav buttons
            labelMonthNext: 'Mes siguiente',
            labelMonthPrev: 'Mes anterior',

            // The title label to use for the dropdown selectors
            labelMonthSelect: 'Selecciona un mes',
            labelYearSelect: 'Selecciona un año',

            // Months and weekdays
            monthsFull: [ 'Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre' ],
            monthsShort: [ 'Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun', 'Jul', 'Ago', 'Sep', 'Oct', 'Nov', 'Dic' ],
            weekdaysFull: [ 'Domingo', 'Lunes', 'Martes', 'Miércoles', 'Jueves', 'Viernes', 'Sábado' ],
            weekdaysShort: [ 'Dom', 'Lun', 'Mar', 'Mie', 'Jue', 'Vie', 'Sab' ],

            // Materialize modified
            weekdaysLetter: [ 'D', 'L', 'M', 'Mi', 'J', 'V', 'S' ],

            // Today and clear
            today: 'Hoy',
            clear: 'Limpiar',
            close: 'Ok',
          });
    })
    </script>
{%endblock%}

{% block content %}
    <div class="content">
        <h5 class="center">Datos del Evento</h5><hr/><br>
        <form id="form" method="post" enctype="multipart/form-data">
            {% csrf_token %}
            <div class="center">
                <div class="input-field {% if form.nombre_evento.errors %}invalid{% endif %}">
                    {{ form.nombre_evento }}
                    <label for="icon_prefix {{ form.nombre_evento.auto_id }}">Nombre</label>
                    {% include 'base.forms.errors.html' with form_errors=form.nombre_evento.errors col_title_error='col s2' col_msg_error='col s10' %}
                </div>
                
                <div class="input-field {% if form.fecha.errors %}invalid{% endif %}">
                    <i class="tiny material-icons prefix">perm_contact_calendar</i>
                    {{ form.fecha }}
                    <label for="icon_prefix {{ form.fecha.auto_id }}">Fecha</label>
                    {% include 'base.forms.errors.html' with form_errors=form.fecha.errors col_title_error='col s2' col_msg_error='col s10' %}
                </div>
    
                <div class="file-field input-field {% if form.archivo.errors %}invalid{% endif %}">
                    
                    <div class="btn">
                    <span for="icon_prefix {{ form.archivo.auto_id }}">Archivo</span>
                        <input type="file" name="file" id="file" accept="application/pdf">
                    </div>
                    <div class="file-path-wrapper">
                        {{ form.archivo }}
                    </div>
                    {% include 'base.forms.errors.html' with form_errors=form.archivo.errors col_title_error='col s2' col_msg_error='col s10' %}
                    
                </div>
                <h5 class="blue-text">Luego de cargar un documento debe colocar el código Qr en la ubicación y página de su preferencia.</h5>
            
            
            </div>
            <div class="col s8 m2 offset-s2">
            <div id="pdf-main-container" style="display:none;"><center><h5>Configurar Posicion de la Firma</h5></center> 
                  <div id="pdf-loader2">Cargando documento ...</div>
                  <div id="pdf-contents2">
                    <div id="pdf-meta2">
                      <div id="pdf-buttons2">
                        <a class="waves-effect waves-light btn" id="pdf-prev2"><i class="material-icons">keyboard_arrow_left</i></a>
                        <a class="waves-effect waves-light btn" id="pdf-next2"><i class="material-icons">keyboard_arrow_right</i></a>
                      </div>
                      <div id="page-count-container">Página <span id="pdf-current-page2"></span> de <span id="pdf-total-pages2"></span></div>
                    </div>
                    <img class="text" src="{% static 'img/QRCode.png' %}" id="texto"/>
                    <div class="overflow" >
                      <div id="container1" class=".cropper-hidden">
                        <!--<div class="ball blue">sdsa</div>-->
                      </div>
                      <br>
                      <br>
                    </div>          
                    </div>
                    <canvas id="pdf-canvas2" width="500"></canvas>
                    <div id="page-loader2">Cargando página ...</div>
              </div>
              {{ form.pos_x }}
              {{ form.pos_y }}
              {{ form.pag }}
            </div>
            <div class="center">
            <h5>Datos de los Participantes</h5><hr/><br>
            <table class="striped" id="id_orders_table">
                <thead>
                  <tr>
                      <th scope="col">Nombres</th>
                      <th scope="col">Apellidos</th>
                      <th scope="col">Pasaporte</th>
                      <th scope="col">Correo</th>
                      <th scope="col">Opcion</th>
                  </tr>
                </thead>
                <tbody>
                {{ form2.management_form }}
                {% for form in form2  %}
                <tr id="{{ form1.prefix }}-row">
                  <td>
                  {{form.nombres}}
                  </td>
                  <td>
                  {{form.apellidos}}
                  </td>
                  <td>
                  {{form.pasaporte}}
                  </td>
                  <td>
                  {{form.correo}}
                  </td>
                  <td></td>
                </tr>
                {% endfor %}
                </tbody>
            </table>
            </div>
            <div class="center">
                <button type="submit" class="btn waves-effect blue darken-1">Registrar</button>
            </div>
            </div>
        </form>
    </div>
{% endblock %}