{% extends "base.html" %}
{% load i18n static requirements_extras %}

{% block title %}{% trans "Requirements" %}{% endblock %}

{% block contents %}
<div class="container-fluid" id="requirements-list">
  <div class="page-header requirements-toolbar">
    <h1>
      {% trans "Requirements" %}
      <small>{{ paginator.count|default:requirements|length }} {% trans "total" %}</small>
    </h1>
    <div class="btn-toolbar pull-right requirements-toolbar-actions">
      <div class="btn-group">
        <a href="{% url 'requirement-new' %}" class="btn btn-primary">
          <i class="fa fa-plus"></i> {% trans "New" %}
        </a>
      </div>
      <div class="btn-group">
        <a href="{% url 'requirement-dashboard' %}" class="btn btn-default">
          <i class="fa fa-bar-chart"></i> {% trans "Dashboard" %}
        </a>
        <a href="{% url 'requirement-traceability' %}" class="btn btn-default">
          <i class="fa fa-sitemap"></i> {% trans "Traceability" %}
        </a>
      </div>
      <div class="btn-group">
        <a href="{% url 'requirement-import' %}" class="btn btn-default">
          <i class="fa fa-upload"></i> {% trans "Import" %}
        </a>
        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"
                aria-haspopup="true" aria-expanded="false">
          <i class="fa fa-download"></i> {% trans "Export" %} <span class="caret"></span>
        </button>
        <ul class="dropdown-menu">
          <li><a href="{% url 'requirement-export-hub' %}">{% trans "Export hub" %}</a></li>
          <li role="separator" class="divider"></li>
          <li><a href="{% url 'requirement-export' 'csv' %}{% if request.GET.urlencode %}?{{ request.GET.urlencode }}{% endif %}">CSV</a></li>
          <li><a href="{% url 'requirement-export' 'jira-csv' %}{% if request.GET.urlencode %}?{{ request.GET.urlencode }}{% endif %}">JIRA CSV</a></li>
          <li><a href="{% url 'requirement-export' 'json' %}{% if request.GET.urlencode %}?{{ request.GET.urlencode }}{% endif %}">JSON</a></li>
          <li role="separator" class="divider"></li>
          <li><a href="{% url 'requirement-export' 'docx' %}{% if request.GET.urlencode %}?{{ request.GET.urlencode }}{% endif %}">DOCX</a></li>
          <li><a href="{% url 'requirement-export' 'pdf' %}{% if request.GET.urlencode %}?{{ request.GET.urlencode }}{% endif %}">PDF</a></li>
        </ul>
      </div>
    </div>
    <div style="clear:both;"></div>
  </div>

  <form method="get" class="form-inline requirements-filters">
    {% for field in filter_form %}
      <div class="form-group" style="margin-right:8px;">
        <label for="id_{{ field.name }}">{{ field.label }}</label>
        {{ field }}
      </div>
    {% endfor %}
    <button type="submit" class="btn btn-default">{% trans "Filter" %}</button>
    <a href="{% url 'requirement-list' %}" class="btn btn-link">{% trans "Reset" %}</a>
  </form>

  {% if requirements %}
  <table class="table table-striped table-condensed requirements-table">
    <thead>
      <tr>
        <th>{% trans "Identifier" %}</th>
        <th>{% trans "Title" %}</th>
        <th>{% trans "Level" %}</th>
        <th>{% trans "Category" %}</th>
        <th>{% trans "Status" %}</th>
        <th>{% trans "Priority" %}</th>
        <th>{% trans "Cases" %}</th>
        <th>{% trans "JIRA" %}</th>
        <th>{% trans "Updated" %}</th>
      </tr>
    </thead>
    <tbody>
      {% for r in requirements %}
      <tr>
        <td><a href="{% url 'requirement-get' r.pk %}">{{ r.identifier }}</a></td>
        <td>{{ r.title }}</td>
        <td>{{ r.level.name|default:"—" }}</td>
        <td>{{ r.category.name|default:"—" }}</td>
        <td>{% status_badge r.status %}</td>
        <td>{% priority_badge r.priority %}</td>
        <td>{{ r.case_links.all|length }}</td>
        <td>{% if r.jira_issue_key %}<code>{{ r.jira_issue_key }}</code>{% else %}—{% endif %}</td>
        <td><small>{{ r.updated_at|date:"Y-m-d H:i" }}</small></td>
      </tr>
      {% endfor %}
    </tbody>
  </table>

  {% if is_paginated %}
  <nav>
    <ul class="pagination">
      {% if page_obj.has_previous %}
      <li><a href="?page={{ page_obj.previous_page_number }}">«</a></li>
      {% endif %}
      <li class="active"><a>{{ page_obj.number }} / {{ page_obj.paginator.num_pages }}</a></li>
      {% if page_obj.has_next %}
      <li><a href="?page={{ page_obj.next_page_number }}">»</a></li>
      {% endif %}
    </ul>
  </nav>
  {% endif %}

  {% else %}
  <div class="requirements-blank-slate">
    <i class="pficon pficon-folder-close"></i>
    <h3>{% trans "No requirements yet" %}</h3>
    <p>{% trans "Create your first requirement or import a CSV to get started." %}</p>
    <a href="{% url 'requirement-new' %}" class="btn btn-primary">
      <i class="fa fa-plus"></i> {% trans "New requirement" %}
    </a>
    <a href="{% url 'requirement-import' %}" class="btn btn-default">
      <i class="fa fa-upload"></i> {% trans "Import CSV" %}
    </a>
  </div>
  {% endif %}
</div>

<link rel="stylesheet" href="{% static 'tcms_requirements/css/requirements.css' %}">
{% endblock %}