{% extends 'mobile/mobile_base.html' %}
{% load static %}
{% load i18n %}

{% block title %}{% translate "Nouvel inventaire" %}{% endblock title %}

{% block upleft %}
<a href="{% url 'mobile:stock_inventories_mobile' %}" class="nav-link" style="color: white;">
    <i class="bi bi-arrow-left fs-3"></i>
</a>
{% endblock upleft %}

{% block content %}
<form method="post" id="new-inventory-form">
    {% csrf_token %}

    {% if error %}
    <div class="alert alert-danger">{{ error }}</div>
    {% endif %}

    <!-- Emplacement -->
    <div class="mb-3">
        <label class="form-label fw-semibold small" for="id_warehouse_location">
            <i class="bi bi-geo-alt me-1"></i>{% translate "Emplacement" %} <span class="text-danger">*</span>
        </label>
        <select name="warehouse_location" id="id_warehouse_location" class="form-select" required>
            <option value="">-- {% translate "Sélectionner un emplacement" %} --</option>
            {% for group in grouped_locations %}
            <optgroup label="{{ group.warehouse.name }}">
                {% for loc in group.locations %}
                <option value="{{ loc.pk }}"
                    {% if location_id == loc.pk|stringformat:"s" %}selected{% endif %}>
                    {{ loc.name }}
                </option>
                {% endfor %}
            </optgroup>
            {% endfor %}
        </select>
    </div>

    <!-- Réalisé par -->
    <div class="mb-3">
        <label class="form-label fw-semibold small" for="id_performed_by">
            <i class="bi bi-person me-1"></i>{% translate "Réalisé par" %}
        </label>
        <input type="text" name="performed_by" id="id_performed_by"
               class="form-control"
               value="{{ performed_by }}"
               placeholder="{% translate 'Nom de la personne (optionnel)' %}">
    </div>

    <div class="d-flex gap-2 mt-4">
        <a href="{% url 'mobile:stock_inventories_mobile' %}" class="btn btn-secondary flex-fill">
            {% translate "Annuler" %}
        </a>
        <button type="submit" class="btn btn-primary flex-fill">
            <i class="bi bi-check-circle me-1"></i>{% translate "Créer" %}
        </button>
    </div>
</form>
{% endblock content %}