unb-mds/2023-2-Squad06

{% extends "base.html" %}

{% load crispy_forms_tags %}

{% block title %}Submissions{% endblock title %}

{% block head %}
  <style>
    table {
      border-collapse: collapse;
      width: 100%;
      margin: 20px 0;
    }

    th, td {
      border: 1px solid #dddddd;
      text-align: left;
      padding: 8px;
      text-align: center;
    }

    th {
      background-color: #f2f2f2;
    }

    .center-table {
      display: flex;
      justify-content: center;
    }

    .success {
      background-color: #47fc00b7;
    }

    .waiting {
      background-color: #ff88008c;
    }

    .wrong {
      background-color: #ff00006b;
    }
  </style>
{% endblock head %}

{% block content %}
  <h2>Submissions</h2>
  <table class="table table-striped">
    <thead>
      <tr>
        <th>Submission ID</th>
        <th>User</th>
        <th>Task</th>
        <th>Status</th>
        <th>Created at</th>
      </tr>
    </thead>
    <tbody>
      {% for submission in page_obj %}
      <tr
        class="
          {% if submission.status == 'AC' %}
            success
          {% elif submission.status == 'WJ' %}
            waiting
          {% else %}
            wrong
          {% endif %}
        ">
          <td>{{ submission.id }}</td>
          <td>
            <a href="{% url 'users:profile' submission.author.username %}">
              {{ submission.author.username }}
            </a>
          </td>
          <td>
            <a href="{% url 'tasks:detail' submission.task.id %}">
              {{ submission.task.title }}
            </a>
          </td>
          <td>{{ submission.status }}</td>
          <td>{{ submission.created_at }}</td>
        </tr>
      {% endfor %}
    </tbody>
  </table>

  <nav aria-label="Page navigation example">
    <ul class="pagination">
      {% if page_obj.has_previous %}
        <li class="page-item">
          <a class="page-link" href="?page=1" tabindex="-1">First</a>
        </li>
        <li class="page-item">
          <a class="page-link" href="?page={{ page_obj.previous_page_number }}">Previous</a>
        </li>
      {% else %}
        <li class="page-item disabled">
          <a class="page-link" href="#" tabindex="-1" aria-disabled="true">Previous</a>
        </li>
      {% endif %}

      {% for i in page_obj.paginator.page_range %}
        {% if page_obj.number == i %}
          <li class="page-item active">
            <a class="page-link" href="?page={{ i }}">{{ i }} </a>
          </li>
        {% else %}
          <li class="page-item">
            <a class="page-link" href="?page={{ i }}">{{ i }}</a>
          </li>
        {% endif %}
      {% endfor %}

      {% if page_obj.has_next %}
        <li class="page-item">
          <a class="page-link" href="?page={{ page_obj.next_page_number }}">Next</a>
        </li>
        <li class="page-item">
          <a class="page-link" href="?page={{ page_obj.paginator.num_pages }}">Last</a>
        </li>
      {% else %}
        <li class="page-item disabled">
          <a class="page-link" href="#" aria-disabled="true">Next</a>
        </li>
      {% endif %}
    </ul>
  </nav>
{% endblock content %}