{% extends "base.html" %}

{% block title %}Rôles et permissions — GMAO{% endblock %}

{% block content %}
<div class="container-fluid">
  <div class="d-flex justify-content-between align-items-center mb-4">
    <div>
      <h1 class="h3"><i class="bi bi-shield-check"></i> Rôles et permissions</h1>
      <p class="text-muted mb-0">La matrice est centralisée dans l'application. Attribuez ici un rôle à chaque compte.</p>
    </div>
    <a href="{{ url_for('admin.users') }}" class="btn btn-outline-primary"><i class="bi bi-people"></i> Utilisateurs</a>
  </div>

  <div class="alert alert-info">
    Les permissions ne sont pas modifiables case par case : cela évite les droits invisibles et les écarts entre écrans.
    Toute évolution de la matrice est versionnée et testée.
  </div>

  <div class="row g-3">
    {% for role_key, role_name in roles.items() %}
    <div class="col-xl-4 col-md-6">
      <div class="card h-100">
        <div class="card-header d-flex justify-content-between">
          <strong>{{ role_name }}</strong>
          <span class="badge bg-secondary">{{ users_by_role[role_key]|length }} compte(s)</span>
        </div>
        <div class="card-body">
          <h2 class="h6">Permissions</h2>
          {% if '*' in permissions_by_role[role_key] %}
          <span class="badge bg-danger">Accès complet</span>
          {% else %}
          <div class="d-flex flex-wrap gap-1 mb-3">
            {% for permission in permissions_by_role[role_key]|sort %}
            <span class="badge text-bg-light border">{{ permission }}</span>
            {% endfor %}
          </div>
          {% endif %}

          {% if users_by_role[role_key] %}
          <hr>
          {% for user in users_by_role[role_key] %}
          <form method="post" action="{{ url_for('admin.update_user_permissions', id=user.id) }}" class="row g-2 align-items-center mb-2">
            <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
            <div class="col"><span class="small">{{ user.full_name or user.username }}</span></div>
            <div class="col-auto">
              <select name="role" class="form-select form-select-sm" aria-label="Rôle de {{ user.username }}">
                {% for candidate, label in roles.items() %}
                <option value="{{ candidate }}" {% if candidate == role_key %}selected{% endif %}>{{ label }}</option>
                {% endfor %}
              </select>
            </div>
            <div class="col-auto"><button class="btn btn-sm btn-outline-primary" type="submit">Appliquer</button></div>
          </form>
          {% endfor %}
          {% endif %}
        </div>
      </div>
    </div>
    {% endfor %}
  </div>
</div>
{% endblock %}