{% extends 'base.html' %}

{% load arrowfilter %}

{% block content %}
    <div class="row header">
        <div class="col-xs-8 col-md-10"><h2>Event log</h2></div>
        <div class="col-xs-4 col-md-2 button">
            <div class="btn-group">
                <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                    Services
                    <span class="caret"></span>
                </button>
                <ul class="dropdown-menu dropdown-menu-right">
                    <li><a href="{% url 'openduty.event_log.list' %}">All</a></li>
                     <li role="presentation" class="divider"></li>
                    {% for item in services %}
                    <li><a href="{% url 'openduty.event_log.get' item.id %}">{{ item.name }}</a></li>
                     {% endfor %}
                </ul>
            </div>
        </div>
    </div>

    {% if messages %}
    <div class="alert alert-danger">
        {% for message in messages %}
            <p{% if message.tags %} class="{{ message.tags }}"{% endif %}>{{ message }}</p>
        {% endfor %}
    </div>
    {% endif %}

    <table class="table table-striped">
        <thead>
            <tr>
                <th>Time</th>
                <th>User</th>
                <th>Service name</th>
                <th>Event data</th>
            </tr>
        </thead>
        <tbody>
            {% for item in events %}
                <tr class="{{ item.color }}">
                    <td>
                        <div data-toggle="tooltip" data-placement="top" title="{{ item.occurred_at }}">
                        {{ item.occurred_at|arrowfilter }}
                        </div>
                    </td>
                    <td>{{ item.user|default:"system" }}</td>
                    <td>{{ item.service_key.name }}</td>
                    <td>{{ item.data }}</td>
                </tr>
            {% endfor %}
        </tbody>
    </table>
    <div class="pagination">
    <span class="step-links">
        {% if events.has_previous %}
            <a href="?page={{ events.previous_page_number }}">previous</a>
        {% endif %}

        <span class="current">
            Page {{ events.number }} of {{ events.paginator.num_pages }}.
        </span>

        {% if events.has_next %}
            <a href="?page={{ events.next_page_number }}">next</a>
        {% endif %}
    </span>
    </div>
{% endblock %}