{% extends 'base.html' %}

{% block page_title %}Continuous Assessment Tasks{% endblock page_title %}

{% block content %}
{% include 'secondary/_nav.html' %}

<div class="x_panel">
  <div class="x_title"><h2>Filter Tasks</h2><div class="clearfix"></div></div>
  <div class="x_content">
    <form method="get" class="form-inline">
      <label class="mr-2">Class</label>
      <select class="form-control mr-3" name="class_id">
        <option value="">All</option>
        {% for option in class_options %}
        <option value="{{ option.id }}" {% if selected_class_id == option.id|stringformat:'s' %}selected{% endif %}>{{ option }}</option>
        {% endfor %}
      </select>
      <label class="mr-2">Subject</label>
      <select class="form-control mr-3" name="subject_id">
        <option value="">All</option>
        {% for option in subject_options %}
        <option value="{{ option.id }}" {% if selected_subject_id == option.id|stringformat:'s' %}selected{% endif %}>{{ option }}</option>
        {% endfor %}
      </select>
      <label class="mr-2">Status</label>
      <select class="form-control mr-3" name="status">
        <option value="">All</option>
        {% for value, label in status_options %}
        <option value="{{ value }}" {% if selected_status == value %}selected{% endif %}>{{ label }}</option>
        {% endfor %}
      </select>
      <button type="submit" class="btn btn-default">Apply</button>
    </form>
  </div>
</div>

<div class="row">
  <div class="col-md-5">
    <div class="x_panel">
      <div class="x_title"><h2>Create Task</h2><div class="clearfix"></div></div>
      <div class="x_content">
        <form method="post">
          {% csrf_token %}
          {{ form.as_p }}
          <button type="submit" class="btn btn-primary">Create Task</button>
        </form>
      </div>
    </div>
  </div>

  <div class="col-md-7">
    <div class="x_panel">
      <div class="x_title"><h2>Tasks</h2><div class="clearfix"></div></div>
      <div class="x_content table-responsive">
        <table class="table table-striped table-bordered">
          <thead>
            <tr>
              <th>Task</th>
              <th>Class</th>
              <th>Subject</th>
              <th>Weight</th>
              <th>Status</th>
              <th>Action</th>
            </tr>
          </thead>
          <tbody>
            {% for task in tasks %}
            <tr>
              <td>{{ task.title }}</td>
              <td>{{ task.academic_class }}</td>
              <td>{{ task.subject }}</td>
              <td>{{ task.weight }}</td>
              <td>{{ task.get_status_display }}</td>
              <td><a class="btn btn-xs btn-info" href="{% url 'secondary:ca_task_records' task.id %}">Enter Records</a></td>
            </tr>
            {% empty %}
            <tr><td colspan="6" class="text-center">No tasks yet.</td></tr>
            {% endfor %}
          </tbody>
        </table>
      </div>
    </div>
  </div>
</div>
{% endblock content %}