{% extends "base.html" %}
{% block title %}Submissions — {{ assignment.title }}{% endblock %}
{% if user.is_teacher %}{% block nav_teacher_courses %}active{% endblock %}
{% else %}{% block nav_courses %}active{% endblock %}{% endif %}

{% block content %}
<div class="page-header">
    <div>
        <a href="{% url 'content:teacher_assignment_list' course_pk=course.pk %}" class="text-muted small d-block mb-1">
            <i class="fa-solid fa-arrow-left me-1"></i> {{ course.name }} — Assignments
        </a>
        <h2><i class="fa-solid fa-inbox me-2"></i>{{ assignment.title }}</h2>
        <p class="text-muted mb-0">
            {{ submissions.count }} submission{{ submissions.count|pluralize }}
            of {{ enrolled_count }} enrolled student{{ enrolled_count|pluralize }}
            {% if assignment.due_date %}
            &mdash; Due: {{ assignment.due_date|date:"d M Y, H:i" }}
            {% endif %}
        </p>
    </div>
</div>

{% if assignment.description %}
<div class="portal-card mb-4">
    <div class="portal-card-body">
        <p class="small text-muted mb-0">{{ assignment.description }}</p>
    </div>
</div>
{% endif %}

<form method="post">
    {% csrf_token %}
    <div class="portal-card">
        <div class="portal-card-header d-flex justify-content-between align-items-center">
            <h6 class="mb-0"><i class="fa-solid fa-users me-2"></i>Student Submissions</h6>
            <button type="submit" class="btn btn-success btn-sm">
                <i class="fa-solid fa-floppy-disk me-1"></i> Save Grades
            </button>
        </div>
        <div class="portal-card-body p-0">
            {% if submissions %}
            <div class="table-responsive">
                <table class="table table-hover mb-0 align-middle">
                    <thead class="table-light">
                        <tr>
                            <th>Student</th>
                            <th>Submitted</th>
                            <th>File</th>
                            <th>Notes</th>
                            <th style="width:140px;">Grade</th>
                            <th>Feedback</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for sub in submissions %}
                        <tr>
                            <td>
                                <div class="fw-semibold">{{ sub.student.get_full_name }}</div>
                                {% if sub.is_late %}
                                <span class="badge bg-warning text-dark small">Late</span>
                                {% endif %}
                            </td>
                            <td class="small text-nowrap">{{ sub.submitted_at|date:"d M Y, H:i" }}</td>
                            <td>
                                {% if sub.file %}
                                <a href="{{ sub.file.url }}" target="_blank" class="btn btn-xs btn-outline-primary">
                                    <i class="fa-solid fa-download me-1"></i>Download
                                </a>
                                {% else %}
                                <span class="text-muted small">No file</span>
                                {% endif %}
                            </td>
                            <td class="small text-muted" style="max-width:160px;">
                                {{ sub.notes|default:"—"|truncatechars:60 }}
                            </td>
                            <td>
                                <select name="grade_{{ sub.pk }}" class="form-select form-select-sm">
                                    <option value="">— No grade —</option>
                                    {% for val, label in sub.assignment.course.results.model.GRADE_CHOICES|default:"" %}{% endfor %}
                                    <option value="A" {% if sub.grade == 'A' %}selected{% endif %}>A — Distinction</option>
                                    <option value="B" {% if sub.grade == 'B' %}selected{% endif %}>B — Credit</option>
                                    <option value="C" {% if sub.grade == 'C' %}selected{% endif %}>C — Pass</option>
                                    <option value="D" {% if sub.grade == 'D' %}selected{% endif %}>D — Partial Pass</option>
                                    <option value="F" {% if sub.grade == 'F' %}selected{% endif %}>F — Fail</option>
                                </select>
                                {% if sub.grade %}
                                <div class="mt-1">
                                    <span class="badge bg-{{ sub.grade_color }}">{{ sub.grade }}</span>
                                    {% if sub.graded_at %}<span class="text-muted small ms-1">{{ sub.graded_at|date:"d M" }}</span>{% endif %}
                                </div>
                                {% endif %}
                            </td>
                            <td>
                                <input type="text" name="feedback_{{ sub.pk }}"
                                       class="form-control form-control-sm"
                                       placeholder="Optional feedback"
                                       value="{{ sub.feedback|default:'' }}">
                            </td>
                        </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
            <div class="p-3 d-flex justify-content-end">
                <button type="submit" class="btn btn-success">
                    <i class="fa-solid fa-floppy-disk me-1"></i> Save Grades
                </button>
            </div>
            {% else %}
            <div class="text-center py-5 text-muted">
                <i class="fa-solid fa-inbox fa-2x mb-3 d-block" style="opacity:0.3;"></i>
                <p class="mb-0">No submissions yet.</p>
            </div>
            {% endif %}
        </div>
    </div>
</form>
{% endblock %}