{% extends "layout_report.html" %}
{% load static %}
{% load app_filters %}
{% load humanize %}
{% load tz %}
{% block content %}
{{ block.super }}
<div class="row align-items-center">
    <div class="col-9 text-left"></div>
    <div class="col-3 text-right">
        <div class="row pb-1 no-print" id="control">
            <div class="col-4 mt-1">
                Report:
            </div>
            <div class="col-8">
                <select name="sort_by" maxlength="8" tabindex="2" class="select form-control" id="id_sort_by">
                    <option value="detail">Detail</option>
                    <option value="group">By Group</option>
                    <option value="code">By Code</option>
                </select>
            </div>
        </div>
    </div>
</div>
<hr class="no-print" />
{% if qstr.sort_by == 'detail' %}
{% regroup downtime_list by line as line_list %}
    {% for line in line_list %}
    <div class="row mb-2">Line: {{ line.grouper }}</div>

    <div class="row justify-content-end border-dark border">
        <div class="col border-dark border-right"><span class="font-weight-bolder"><u>Date</u></span></div>
        <div class="col border-dark border-right"><span class="font-weight-bolder"><u>Job</u></span></div>
        <div class="col border-dark border-right"><span class="font-weight-bolder"><u>Code</u></span></div>
        <div class="col border-dark border-right"><span class="font-weight-bolder"><u>Group</u></span></div>
        <div class="col border-dark border-right"><span class="font-weight-bolder"><u>Subgroup</u></span></div>
        <div class="col-5"><span class="font-weight-bolder"><u>Description</u></span></div>
        <div class="col-1 text-right border-dark border-left"><span class="font-weight-bolder"><u>Hrs</u></span></div>
    </div>
    {% for code in line.list %}
    <div class="row border-dark border-left border-right{% if forloop.last %} border-bottom mb-4{% endif %}">
        <div class="col border-dark border-right">{{ code.date }}</div>
        <div class="col border-dark border-right">{{ code.job }}</div>
        <div class="col border-dark border-right">{{ code.code }}</div>
        <div class="col border-dark border-right">{{ code.group }}</div>
        <div class="col border-dark border-right">{{ code.subgroup }}</div>
        <div class="col-5 text-nowrap">{{code.description }}</div>
        <div class="col-1 border-dark border-left text-right">{{ code.hrs }}</div>
    </div>

{% endfor %}
{% endfor %}

{% elif qstr.sort_by == 'code' %}

{% regroup downtime_list by line as line_list %}
    {% for line in line_list %}
    <div class="row mb-2"><span class="font-weight-bolder">Line:</span> {{ line.grouper }}</div>

    <div class="row">
        <div class="col-1"></div>
        <div class="col-1"><span class="font-weight-bolder"><u>Code</u></span></div>
        <div class="col-1"><span class="font-weight-bolder"><u>Group</u></span></div>
        <div class="col-1"><span class="font-weight-bolder"><u>Subgroup</u></span></div>
        <div class="col-4"><span class="font-weight-bolder"><u>Description</u></span></div>
        <div class="col-1 text-right"><span class="font-weight-bolder"><u>NumOcc</u></span></div>
        <div class="col-1 text-right"><span class="font-weight-bolder"><u>Hrs</u></span></div>
    </div>
    {% for code in line.list %}
    <div class="row">
        <div class="col-1"></div>
        <div class="col-1">{{ code.code }}</div>
        <div class="col-1">{{ code.group }}</div>
        <div class="col-1">{{ code.subgroup }}</div>
        <div class="col-4 text-nowrap">{{code.description }}</div>
        <div class="col-1 text-right">{{code.cnt }}</div>
        <div class="col-1 text-right">{{code.hrs }}</div>
    </div>
{% endfor %}
{% endfor %}

{% else %}
{% regroup downtime_list by line as line_list %}
    {% for line in line_list %}
    <div class="row mb-2"><span class="font-weight-bolder">Line:</span> {{ line.grouper }}</div>

    <div class="row">
        <div class="col-1"></div>
        <div class="col-1"><span class="font-weight-bolder"><u>Group</u></span></div>
        <div class="col-3"><span class="font-weight-bolder"><u>Subgroup</u></span></div>
        <div class="col-1 text-right"><span class="font-weight-bolder"><u>Hrs</u></span></div>
    </div>
    {% for dt in line.list %}
    <div class="row">
        <div class="col-1"></div>
        <div class="col-1">{{ dt.group }}</div>
        <div class="col-3">{{ dt.subgroup }}</div>
        <div class="col-1 text-right">{{ dt.hrs }}</div>

    </div>
{% endfor %}
{% endfor %}

{% endif %}

{% endblock content %}
{% block body_scripts %}
{{ block.super }}
<script type="text/javascript" src="{% static 'informant_reports/js/filter_report.js' %}"></script>
{% endblock body_scripts %}