{% extends "base.html" %}
{% load static %}
{% load widget_tweaks %}

{% block contenido %}

<div class="container-fluid" style="font-size: .85em;">
    <div class="row">        
        <div class="col-4">
            <table class="table table-striped">
                <thead>
                    <tr >
                        <th scope="col" colspan="5" style="text-align: center;">Nº Matriculas Curso 2023-24</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td style="color: #99145A">Academia EGA en Toledo</td>
                        <td style="font-weight: bold;">{{ n_matriculas_toledo }}</td>
                        <td> | </td>
                        <td style="color:#BE221A">Academia EGA en Yepes</td>
                        <td style="font-weight: bold;">{{ n_matriculas_yepes }}</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>

<br>
<table id="lst_matriculas" class="table table-striped table-bordered" style="width:94%; margin:2em; font-size: .84em;">
    <thead>
        <tr>
            <th style="text-align: center;">ID</th> 
            <th style="text-align: center;">CURSO</th> 
            <th style="text-align: center;">APELLIDOS</th>
            <th style="text-align: center;">NOMBRE</th>
            <th style="text-align: center;">EMAIL</th>
            <th style="text-align: center;">TELÉFONO</th>
            <th style="text-align: center;">EDAD</th>
            <th style="text-align: center;">CENTRO</th>
            <th style="text-align: center;">EDITAR</th>
            <th style="text-align: center;">ENVIAR EMAIL</th>
            <th style="text-align: center;">BORRAR</th>
        </tr>
    </thead>

    <tbody>
    {% for matricula in matriculas  %}
    
        {% if matricula.id_matricula2.id and matricula.id_matricula.id %}
        <tr>           
            <th style="text-align: center;">{{ matricula.id }}</th>
            <td style="text-transform: uppercase;">
                {% if matricula.anio == '2024/2025' or matricula.anio == 'Intensivo 2022' %}
                <span style="color: #9D001B;">{{ matricula.anio }}</span>
                {% else %}
                <span>{{ matricula.anio }}</span>
                {% endif %}
            </td>
            <td style="text-transform: uppercase;">{{ matricula.id_matricula.apellidos }}</td>
            <td style="text-transform: uppercase;">{{ matricula.id_matricula.nombre }}</td>

            {% if matricula.id_matricula.email %}
                <td>{{ matricula.id_matricula.email }}</td>
            {% else %}
                <td>{{ matricula.id_matricula.tutor1_email }}</td>
            {% endif %}

            {% if matricula.id_matricula.telefono %}
                <td>{{ matricula.id_matricula.telefono }}</td>
            {% else %}
                <td>{{ matricula.id_matricula.tutor1_telefono }}</td>
            {% endif %}

            <td>{{ matricula.id_matricula.edad }}</td>

            {% if matricula.id_matricula.nombre_ampa %}
                <td>Academia EGA en Toledo</td>
            {% else %}
                <td>{{ matricula.id_matricula.nombre_centro }}</td>
            {% endif %}

            <td style="text-align: center;"><a class="btn btn-success btn-xs" href="/editar_matricula/{{ matricula.id }}">EDITAR</a></td>
            <td style="text-align: center;"><a class="btn btn-info btn-sm" href="/enviar_email/{{ matricula.id }}">ENVIAR EMAIL</a></td>
            <td style="text-align: center;"><a class="btn btn-danger btn-sm" onclick="borrar_matricula('{{matricula.id}}')">BORRAR</a></td>       
        </tr>
            
        {% endif %}
    {% endfor %}

    </tbody>
</table>

<script type="text/javascript">	   
	$(document).ready(function() {
    	$('#lst_matriculas').DataTable({
            "order":[[0,"desc"]]
        });
	} );
</script>

{% if mensaje == True  %}    

<div class="window-notice" id="window-notice">
    <div class="content">
        <div class="content-text">Mensaje enviado!!
            <br>
            <br>
        <button type="button" class="btn btn-info" onclick="cerrar_mensaje()">OK</button>
    </div>
</div>

{% endif %}

{% endblock contenido %}