{% extends 'autosrp/base.html' %}
{% load i18n humanize tz %}
{% block content %}
<div class="container-xxl py-3">
    <div class="d-flex flex-wrap align-items-center justify-content-between mb-3 gap-2">
        <h3 class="m-0">{% trans "Submissions" %}</h3>
    </div>

    <div class="card">
        <div class="card-body p-0">
            <div class="table-responsive">
                <table class="table table-sm align-middle mb-0">
                    <thead class="table-dark">
                    <tr>
                        <th style="width: 12%;">{% trans "Submission" %}</th>
                        <th style="width: 18%;">{% trans "Doctrine" %}</th>
                        <th style="width: 10%;">{% trans "Fit Mode" %}</th>
                        <th style="width: 14%;">{% trans "Window Start (UTC)" %}</th>
                        <th style="width: 10%;">{% trans "Duration (m)" %}</th>
                        <th style="width: 14%;">{% trans "Created" %}</th>
                        <th style="width: 16%;">{% trans "Systems" %}</th>
                        <th style="width: 6%;">{% trans "Status" %}</th>
                        <th style="width: 10%;">Actions</th>
                    </tr>
                    </thead>
                    <tbody>
                    {% for s in object_list %}
                    <tr>
                        <td>
                            <div class="fw-semibold">#{{ s.id }}</div>
                        </td>
                        <td>{{ s.doctrine_name|default:"—" }}</td>
                        <td>
                            {% if s.fit_mode_label %}
                                <span class="badge bg-info">{{ s.fit_mode_label }}</span>
                            {% else %}
                                <span class="badge bg-secondary">Strict</span>
                            {% endif %}
                        </td>
                        <td>{{ s.start_at|date:"Y-m-d H:i:s T" }}</td>
                        <td>{{ s.duration_minutes|default:"—" }}</td>
                        <td>{{ s.created|date:"Y-m-d H:i:s T" }}</td>
                        <td>
                            {% if s.system_names %}
                                <span title="{{ s.system_names|join:', ' }}">{{ s.system_names|join:", " }}</span>
                            {% else %}
                                —
                            {% endif %}
                        </td>
                        <td>
                            <span class="badge bg-secondary">{{ s.status|default:"unknown" }}</span>
                        </td>
                        <td class="text-end">
                          <div class="d-inline-flex gap-1">
                            <a href="{% url 'autosrp:review_detail' s.id %}" class="btn btn-outline-primary btn-sm">
                                {% trans "Open" %}
                            </a>
                            {% if perms.autosrp.manage %}
                            <form method="post"
                                  action="{% url 'autosrp:delete_submission' s.id %}"
                                  class="d-inline-block ms-1"
                                  onsubmit="return confirm('{% trans "Delete this submission and all its kills?" %}');">
                                {% csrf_token %}
                                <button type="submit" class="btn btn-sm btn-outline-danger">
                                    {% trans "Delete" %}
                                </button>
                            </form>
                            {% endif %}
                          </div>
                        </td>
                    </tr>
                    {% empty %}
                    <tr>
                        <td colspan="9" class="text-center text-muted py-4">
                            {% trans "No submissions yet." %}
                        </td>
                    </tr>
                    {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>

<style>
    .container-xxl { max-width: 90%; }
</style>
{% endblock %}