{% extends 'base/base.html' %}

{% load static %}

{% block title %}{{ pagename }}{% endblock %}

{% block heading %} Страницы просмотра статистики{% endblock %}

{% block content%}
<div class="mt-5">
  <div class="container-fluid" style="font-size:2rem">
    <form method="post">
      {% csrf_token %}
      <div class="row g-3">
        <div class="col-auto">
          {{ form.email.label }}
        </div>
        <div class="col-auto mt-4">
          {{ form.email }}
        </div>
      </div>
      <div class="row g-3 mt-4">
        <div class="col-auto">
          {{ form.interval.label }}
        </div>
        <div class="col-auto">
          {% for radio in form.interval%}
          {{ radio.tag }}
          <label class="btn btn-outline-secondary" for="{{ radio.id_for_label }}">
            {{ radio.choice_label }}
          </label>
          {% endfor %}
        </div>
      </div>
      <div class="row g-3 mt-4">
        <div class="col-auto">
          {{ form.display_format.label }}
        </div>
        <div class="col-auto">
          {% for radio in form.display_format%}
          {{ radio.tag }}
          <label class="btn btn-outline-secondary" for="{{ radio.id_for_label }}">
            {{ radio.choice_label }}
          </label>
          {% endfor %}
        </div>
      </div>
      <div class="row g-3 mt-4">
        <div class="col-auto">
          {{ form.range_start.label}}
        </div>
        <div class="col-auto">
          <div class='col-sm-7'>
            {{ form.range_start}}
          </div>
        </div>
      </div>
      <div class="row g-3 mt-4">
        <div class="col-auto">
          {{ form.range_end.label}}
        </div>
        <div class="col-auto">
          <div class='col-sm-7'>
            {{ form.range_end}}
          </div>
        </div>
      </div>
      <div class="form-row text-center">
        <div class="col-12">
          <button type="submit" class="btn btn-outline-primary">Посмотреть статистику</button>
        </div>
      </div>
    </form>
  </div>
  <ul>
    {% for error in errors %}
      <li><span class="badge bg-danger">{{error}}</span></li>
    {% endfor %}
    </ul>
    <ul>
      {% for warning in warnings %}
        <li><span class="badge bg-warning">{{warning}}</span></li>
      {% endfor %}
    </ul>
  <div class="container-fluid">
    <table class="table table-bordered text-center text-secondary mt-5" style="background-color:#f2f2f2;">
      <thead>
      <tr>
        <td scope="col">&nbsp;</td>
        {% for date in log_stats.keys %}
        {% if interval == 'days' %}
          <td scope="col">{{ date | date:'d.m' }}</td>
        {% else %}
        <td scope="col">{{ date.1 | date:'F'  }}</td>
        {% endif %}
        {% endfor %}
      </tr>
      </thead>
      <tbody>
      <tr>
        <td>{{ form.email.value }}</td>
        {% for time in log_stats.values %}
          <td>{{ time | floatformat:2 }}</td>
        {% endfor %}
      </tr>
      </tbody>
    </table>
  </div>
</div>
{% endblock %}