{% extends 'tom_common/base.html' %}
{% load bootstrap4 %}
{% block title %}Target Groups{% endblock %}
{% block content %}
<h1>Observation Groups</h1>
<div class="row">
  <div class="col-md-10">
      <p>
          <a href="{% url 'observations:group-create' %}" class="btn btn-primary">Create New Grouping</a>
      </p>
  </div>
</div>
{% bootstrap_pagination page_obj extra=request.GET.urlencode %}
<form action="{% url 'targets:list' %}" method="GET">
  <table class="table table-striped">
    <thead>
      <tr>
        <th>Name</th>
        <th>Total Observations</th>
        <th>Delete</th>
      </tr>
    </thead>
    <tbody>
      {% for group in object_list %}
      <tr>
        <td>
          <a href="{% url 'tom_observations:list' %}?observationgroup={{ group.id }}">
            {{ group.name }}
          </a>
        </td>
        <td>
            {{ group.observation_records.count }}
        </td>
        <td>
          <a href="{% url 'tom_observations:group-delete' pk=group.id %}" class="btn btn-danger">Delete</a>
        </td>
      </tr>
      {% empty %}
      <tr>
        <td>No groups yet</td>
        <td></td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
</form>
{% bootstrap_pagination page_obj extra=request.GET.urlencode %}
{% endblock %}
