{% extends 'lms/base.html' %}
{% load lms_tags %}

{% block title %}Мои задания | ЕГЭ LMS{% endblock %}

{% block content %}
<div class="mb-8 flex justify-between items-end border-b pb-4">
    <div>
        <h1 class="text-3xl font-bold text-gray-900">Мои задания</h1>
        <p class="text-gray-500 mt-1">Список всех доступных заданий для выполнения.</p>
    </div>
</div>

{% if assignments %}
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
    {% for assignment in assignments %}
        {% get_submission submissions assignment.id as sub %}
        <div class="bg-white rounded-2xl shadow-sm hover:shadow-md border border-gray-100 transition-all duration-200 overflow-hidden flex flex-col">
            <div class="p-6 flex-1">
                <div class="flex justify-between items-start mb-4">
                    <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800">
                        {{ assignment.subject.name }}
                    </span>
                    
                    {% if sub %}
                        {% if sub.status == 'GRADED' %}
                            <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800">
                                <span class="material-icons text-[12px] mr-1">done_all</span> Проверено ({{ sub.grade|default:"-" }})
                            </span>
                        {% else %}
                            <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-yellow-100 text-yellow-800">
                                <span class="material-icons text-[12px] mr-1">schedule</span> Ожидает проверки
                            </span>
                        {% endif %}
                    {% else %}
                        <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-gray-100 text-gray-800">
                            Не сдано
                        </span>
                    {% endif %}
                </div>
                
                <h3 class="text-xl font-semibold text-gray-900 mb-2 line-clamp-2">
                    {{ assignment.title }}
                </h3>
                <p class="text-gray-500 text-sm line-clamp-3 mb-4">
                    {{ assignment.description|striptags|truncatewords:20 }}
                </p>
                
                <div class="text-xs text-gray-400 mt-auto flex flex-col gap-1">
                    <span class="flex items-center gap-1">
                        <span class="material-icons text-[14px]">event</span> 
                        Добавлено: {{ assignment.created_at|date:"d M Y" }}
                    </span>
                </div>
            </div>
            <div class="bg-gray-50 p-4 border-t border-gray-100">
                <a href="{% url 'lms:assignment_detail' assignment.pk %}" class="w-full inline-flex justify-center items-center px-4 py-2 border border-transparent text-sm font-medium rounded-lg text-white bg-blue-600 hover:bg-blue-700 shadow-sm transition-colors">
                    {% if sub %}Смотреть ответ{% else %}Выполнить задание{% endif %}
                </a>
            </div>
        </div>
    {% endfor %}
</div>
{% else %}
<div class="text-center py-20">
    <span class="material-icons text-gray-300 text-6xl mb-4">assignment_turned_in</span>
    <h3 class="text-xl font-medium text-gray-900 mb-1">Пока заданий нет</h3>
    <p class="text-gray-500">Учитель еще не добавил новые задания.</p>
</div>
{% endif %}

{% endblock %}