{% extends "base.html" %}

{% block title %}{{ title }} - Gestion Scolaire{% endblock %}

{% block content %}
<div class="max-w-2xl mx-auto">
    <div class="mb-6">
        <a href="{{ url_for('exercises.detail', assessment_id=assessment.id, id=exercise.id) }}" class="text-blue-600 hover:text-blue-800 text-sm font-medium">
            ← Retour à l'exercice "{{ exercise.title }}"
        </a>
    </div>
    
    <div class="bg-white shadow rounded-lg">
        <div class="px-6 py-4 border-b border-gray-200">
            <h1 class="text-xl font-semibold text-gray-900">{{ title }}</h1>
            <p class="text-sm text-gray-600 mt-1">{{ assessment.title }} > {{ exercise.title }}</p>
        </div>
        
        <form method="POST" class="px-6 py-4 space-y-6">
            {{ form.hidden_tag() }}
            
            <div>
                <label for="{{ form.label.id }}" class="block text-sm font-medium text-gray-700 mb-1">
                    {{ form.label.label.text }}
                </label>
                {{ form.label(class="block w-full border border-gray-300 rounded-md px-3 py-2 focus:ring-blue-500 focus:border-blue-500") }}
                {% if form.label.errors %}
                    <div class="mt-1 text-sm text-red-600">
                        {% for error in form.label.errors %}
                            <p>{{ error }}</p>
                        {% endfor %}
                    </div>
                {% endif %}
                <p class="mt-1 text-xs text-gray-500">Ex: "Calcul de base", "Méthode", "Présentation"</p>
            </div>
            
            <div>
                <label for="{{ form.description.id }}" class="block text-sm font-medium text-gray-700 mb-1">
                    {{ form.description.label.text }}
                </label>
                {{ form.description(class="block w-full border border-gray-300 rounded-md px-3 py-2 focus:ring-blue-500 focus:border-blue-500", rows="3") }}
                {% if form.description.errors %}
                    <div class="mt-1 text-sm text-red-600">
                        {% for error in form.description.errors %}
                            <p>{{ error }}</p>
                        {% endfor %}
                    </div>
                {% endif %}
            </div>
            
            <div>
                <label for="{{ form.skill.id }}" class="block text-sm font-medium text-gray-700 mb-1">
                    {{ form.skill.label.text }}
                </label>
                {{ form.skill(class="block w-full border border-gray-300 rounded-md px-3 py-2 focus:ring-blue-500 focus:border-blue-500") }}
                {% if form.skill.errors %}
                    <div class="mt-1 text-sm text-red-600">
                        {% for error in form.skill.errors %}
                            <p>{{ error }}</p>
                        {% endfor %}
                    </div>
                {% endif %}
                <p class="mt-1 text-xs text-gray-500">Ex: "Calculer", "Raisonner", "Communiquer"</p>
            </div>
            
            <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                <div>
                    <label for="{{ form.max_points.id }}" class="block text-sm font-medium text-gray-700 mb-1">
                        {{ form.max_points.label.text }}
                    </label>
                    {{ form.max_points(class="block w-full border border-gray-300 rounded-md px-3 py-2 focus:ring-blue-500 focus:border-blue-500", step="0.1") }}
                    {% if form.max_points.errors %}
                        <div class="mt-1 text-sm text-red-600">
                            {% for error in form.max_points.errors %}
                                <p>{{ error }}</p>
                            {% endfor %}
                        </div>
                    {% endif %}
                </div>
                
                <div>
                    <label for="{{ form.grading_type.id }}" class="block text-sm font-medium text-gray-700 mb-1">
                        {{ form.grading_type.label.text }}
                    </label>
                    {{ form.grading_type(class="block w-full border border-gray-300 rounded-md px-3 py-2 focus:ring-blue-500 focus:border-blue-500") }}
                    {% if form.grading_type.errors %}
                        <div class="mt-1 text-sm text-red-600">
                            {% for error in form.grading_type.errors %}
                                <p>{{ error }}</p>
                            {% endfor %}
                        </div>
                    {% endif %}
                </div>
            </div>
            
            <!-- Aide sur les types de notation -->
            <div class="bg-blue-50 border border-blue-200 rounded-md p-4">
                <h4 class="text-sm font-medium text-blue-900 mb-2">Types de notation</h4>
                <div class="text-xs text-blue-800 space-y-1">
                    <p><strong>Points :</strong> Notation classique (ex: 2.5/4 points)</p>
                    <p><strong>Score :</strong> Évaluation par niveaux (0=non acquis, 1=en cours, 2=acquis, 3=expert, .=non évalué)</p>
                </div>
            </div>
            
            <div class="flex justify-end space-x-3 pt-4 border-t border-gray-200">
                <a href="{{ url_for('exercises.detail', assessment_id=assessment.id, id=exercise.id) }}" class="px-4 py-2 border border-gray-300 rounded-md text-sm font-medium text-gray-700 hover:bg-gray-50 transition-colors">
                    Annuler
                </a>
                {{ form.submit(class="px-4 py-2 bg-blue-600 text-white rounded-md text-sm font-medium hover:bg-blue-700 transition-colors") }}
            </div>
        </form>
    </div>
</div>
{% endblock %}