{% extends "base.html" %}
{% load static %}
{% load i18n %}
{% load bootstrap4 %}

{% block title %}
    {% translate "Past events" %}
{% endblock %}

{% block content %}
    <div class="page-header">
        <h1>{% translate "Past events" %}</h1>
    </div>
    <table id="event_table" class="table table-striped display datatable" data-order="[[ 3, &quot;desc&quot; ]]">
        <thead>
        <tr>
            <th data-priority="4">{% translate "Type" %}</th>
            <th data-priority="2">{% translate "Title" %}</th>
            <th data-priority="6">{% translate "Location" %}</th>
            <th data-priority="3">{% translate "Date" %}</th>
            <th data-priority="5">{% translate "until" %}</th>
            <th data-priority="1" data-orderable="false">{% translate "Action" %}</th>
        </tr>
        </thead>
        <tbody>
        {% for event in event_list %}
            <tr>
                <td>{{ event.type }}</td>
                <td>{{ event.title }}</td>
                <td>{{ event.location }}</td>
                <td>{{ event.start_time|date:"SHORT_DATE_FORMAT" }}</td>
                <td>{{ event.end_time|date:"SHORT_DATE_FORMAT" }}</td>
                <td><a class="btn btn-primary" href="{% url "event_management:event_detail" event.id %}"><span
                        class="fa fa-eye"></span> <span class="d-none d-md-inline">{% translate "Show" %}</span></a></td>
            </tr>
        {% endfor %}
        </tbody>
    </table>
{% endblock %}