{% extends 'base.html' %}

{% block content %}
    <div class='row'>
        <div class='col-xl-6'>
            <div class="card card-primary card-outline">
                <div class="card-header">
                    <h3 class="card-title">
                        Availabiliy for 
                        <a href="/router/details/?uuid={{ router.uuid }}" >
                            {{ router.name }}
                        </a>
                    </h3>
                </div>
                <div class="card-body row">
                    <div class="col-lg-12">
                        <table class="table table-hover datatables-no-export">
                            <thead>
                                <tr>
                                    <th>Start Time</th>
                                    <th>End Time</th>
                                    <th>Duration</th>
                                </tr>
                            </thead>
                            <tbody>
                                {% for downtime in downtime_list %}
                                    <tr>
                                        <td>{{ downtime.start_time }}</td>
                                        <td>{{ downtime.end_time }}</td>
                                        <td>{{ downtime.total_down_time }}</td>
                                    </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                        
                    </div>
                </div>
            </div>
        </div>

    </div>
{% endblock %}
