{% extends 'tom_common/base.html' %}
{% load bootstrap4 observation_extras %}
{% block title %}Observations{% endblock %}
{% block content %}
<div class="row">
  <div class="col-md-10">
    <div class="row">
      <div class="col-md-6">
        {% bootstrap_pagination page_obj extra=request.GET.urlencode %}
      </div>
      <div class="col-md-6">
        <span class="float-right">
          {% update_status_button %}
        </span>
      </div>
    </div>
    {% observation_distribution filter.qs %}
    <form action="" method="GET">
    <div class="row">
      <div class="col">
        <button type="submit" name="action" value="add" class="btn btn-primary">Add</button>
        <button type="submit" name="action" value="remove" class="btn btn-danger">Remove </button>
        Selected observations from group
        {{ filter.form.observationgroup }}
      </div>
    </div>

    <table class="table">
      <thead>
        <tr>
          <th>Select</th>
          <th>View</th>
          <th>Target</th>
          <th>Facility</th>
          <th>Status</th>
          <th>Start</th>
          <th>End</th>
          <th>Groups</th>
          <th>Saved Data</th>
          <th>Download All</th>
        </tr>
      </thead>
      <tbody>
        {% for observation in filter.qs %}
        <tr>
          <td><input type="checkbox" name="selected" value="{{observation.id}}"></td>
          <td><a class="btn btn-success" href="{% url 'tom_observations:detail' observation.id %}">Details</a></td>
          <td><a href="{% url 'tom_targets:detail' observation.target.id %}" title="{{ observation.target.id }}">{{ observation.target.names|join:", " }}</a></td>
          <td>{{ observation.facility }}</td>
          <td>{{ observation.status }}</td>
          <td>{{ observation.scheduled_start }}</td>
          <td>{{ observation.scheduled_end }}</td>
          <td>{% for o in observation.observationgroup_set.all %}{{ o.name }} {% endfor %}</td>
          <td>{{ observation.dataproduct_set.count }}</td>
          <td>
            {% if observation.status == 'COMPLETED' %}
            <form method="POST" action="{% url 'tom_dataproducts:save' observation.id %}">
              {% csrf_token %}
              <input type="hidden" value="ALL" name="products">
              <input type="hidden" value="{{ observation.facility }}" name="facility">
              <input type="submit" value="Save" class="btn btn-primary">
            </form>
            {% endif %}
          </td>
        </tr>
        {% empty %}
        <tr>
          <td colspan="7">
            No observations yet. You might want to create an observation from one of
            <a href="{% url 'tom_targets:list' %}">your saved targets</a>.
          </td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
    </form>
    {% bootstrap_pagination page_obj extra=request.GET.urlencode %}
  </div>
  <div class="col-md-2">
    <form action="" method="get" class="form">
      {% bootstrap_form filter.form %}
      {% buttons %}
        <button type="submit" class="btn btn-primary">
          Filter
        </button>
        <a href="{% url 'tom_observations:list' %}" class="btn btn-secondary" title="Reset">Reset</a>
      {% endbuttons %}
    </form>
  </div>
</div>
{% endblock %}
