59 lines
3 KiB
HTML
59 lines
3 KiB
HTML
{% extends "base.html" %}
|
||
{% block title %}Permissions — {{ role.name }}{% endblock %}
|
||
{% block content %}
|
||
<div class="container-fluid">
|
||
<h1>Permissions du rôle « {{ role.name }} »</h1>
|
||
<p class="text-muted">Les sections sont repliées par défaut. Utilisez « Tout sélectionner » pour appliquer toutes les permissions d’un module.</p>
|
||
<form method="post">
|
||
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
|
||
{% for module, permissions in permissions_list|groupby('module') %}
|
||
{% set section_id = 'permissions-' ~ (module|slugify) %}
|
||
<details class="card mb-3 permission-section">
|
||
<summary class="card-header d-flex align-items-center gap-2" style="cursor:pointer;list-style:none">
|
||
<span class="me-auto"><i class="bi bi-chevron-right section-chevron"></i> <strong>{{ permission_labels.get(module, module|replace('_', ' ')|title) }}</strong> <small class="text-muted">({{ permissions|length }})</small></span>
|
||
<label class="small mb-0" onclick="event.stopPropagation()">
|
||
<input type="checkbox" class="section-toggle me-1" data-section="section-{{ section_id }}"> Tout sélectionner
|
||
</label>
|
||
</summary>
|
||
<div class="card-body row g-2">
|
||
{% for permission in permissions %}
|
||
<div class="col-xl-3 col-md-4">
|
||
<label class="border rounded p-2 d-block h-100">
|
||
<input type="checkbox" class="permission-check section-{{ section_id }}" name="permission_ids" value="{{ permission.id }}" {% if permission.id in selected %}checked{% endif %}>
|
||
<strong>{{ permission.action }}</strong><br>
|
||
<small class="text-muted">{{ permission.name }}</small>
|
||
</label>
|
||
</div>
|
||
{% endfor %}
|
||
</div>
|
||
</details>
|
||
{% else %}
|
||
<p class="text-muted">Aucune permission. Exécutez la migration RBAC.</p>
|
||
{% endfor %}
|
||
<button class="btn btn-primary">Enregistrer les permissions</button>
|
||
<a class="btn btn-outline-secondary ms-2" href="{{ url_for('admin.roles') }}">Annuler</a>
|
||
</form>
|
||
</div>
|
||
<style>
|
||
.permission-section[open] .section-chevron { transform: rotate(90deg); }
|
||
.section-chevron { display:inline-block; transition:transform .15s ease; }
|
||
.permission-section > summary::-webkit-details-marker { display:none; }
|
||
</style>
|
||
<script>
|
||
document.querySelectorAll('.section-toggle').forEach(function(toggle) {
|
||
var checks = document.querySelectorAll('.' + toggle.dataset.section);
|
||
var sync = function() {
|
||
var values = Array.from(checks);
|
||
toggle.checked = values.length > 0 && values.every(function(check) { return check.checked; });
|
||
toggle.indeterminate = values.some(function(check) { return check.checked; }) && !toggle.checked;
|
||
};
|
||
toggle.addEventListener('change', function(event) {
|
||
event.stopPropagation();
|
||
checks.forEach(function(check) { check.checked = toggle.checked; });
|
||
toggle.indeterminate = false;
|
||
});
|
||
checks.forEach(function(check) { check.addEventListener('change', sync); });
|
||
sync();
|
||
});
|
||
</script>
|
||
{% endblock %}
|