{% extends "base.html" %}
{% load event_tags %}

{% block content %}

    <h2> {{ name }}</h2>
    <form class="simple_metrics" action="{% url 'simple_metrics' %}" method="post">{% csrf_token %}
        {{ form.as_p }}
        <input class="btn btn-primary" type="submit" value="Generate Metrics For Selected Month/Year"/>
    </form>
    <hr/>

    {% for key, value in findings.items %}

        <h3 class="inline-block">{{ key.name }}</h3> [
        <a href="{% url 'product_type_metrics' key.id %}" class="inline-block">View Details</a>]
        <div class="panel panel-default table-responsive">
            <table class="table table-bordered table-condensed table-striped">
                <thead>
                <tr>
                    <th>
                        Total
                    </th>
                    <th>
                        S0
                    </th>
                    <th>
                        S1
                    </th>
                    <th>
                        S2
                    </th>
                    <th>
                        S3
                    </th>
                    <th>
                        Opened This Month
                    </th>
                    <th>
                        Closed This Month
                    </th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>
                        {{ value.Total|length }}
                    </td>
                    <td>
                        {{ value.S0|length }}
                    </td>
                    <td>
                        {{ value.S1|length }}
                    </td>
                    <td>
                        {{ value.S2|length }}
                    </td>
                    <td>
                        {{ value.S3|length }}
                    </td>
                    <td>
                        {{ value.Opened|length }}
                    </td>
                    <td>
                        {{ value.Closed|length }}
                    </td>

                </tr>
                </tbody>
            </table>
        </div>
    {% endfor %}

{% endblock %}