{% extends "base.html" %}

{% block title %}Ajouter des éléments — GMAO{% endblock %}

{% block content %}
<div class="container-fluid">
    <div class="row mb-4">
        <div class="col">
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="{{ url_for('equipments.index') }}">Équipements</a></li>
                    <li class="breadcrumb-item"><a href="{{ url_for('equipments.detail', id=equipment.id) }}">{{ equipment.name }}</a></li>
                    <li class="breadcrumb-item active">Ajouter des éléments</li>
                </ol>
            </nav>
            <h1 class="h3">
                <i class="bi bi-plus-circle me-2"></i>
                Ajouter des éléments au groupe
            </h1>
        </div>
    </div>

    <div class="row">
        <div class="col-md-6">
            <div class="card">
                <div class="card-body">
                    <h5 class="card-title">{{ equipment.name }}</h5>
                    <p class="text-muted">
                        Code: {{ equipment.code or 'N/A' }}<br>
                        Éléments actuels: {{ equipment.children_count }}
                    </p>
                </div>
            </div>

            <form method="POST" action="{{ url_for('equipments.add_elements', id=equipment.id) }}">
                <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                
                <div class="mb-3 mt-4">
                    <label for="count" class="form-label">Nombre d'éléments à ajouter</label>
                    <input type="number" class="form-control" id="count" name="count" value="1" min="1" max="100" required>
                </div>
                
                <div class="d-flex gap-2">
                    <button type="submit" class="btn btn-primary">
                        <i class="bi bi-plus-lg me-1"></i> Ajouter
                    </button>
                    <a href="{{ url_for('equipments.detail', id=equipment.id) }}" class="btn btn-secondary">
                        <i class="bi bi-arrow-left me-1"></i> Annuler
                    </a>
                </div>
            </form>
        </div>
    </div>
</div>
{% endblock %}