{% extends "admin/_base.html" %}
{% block content %}
<div class="rio-form-shell">
<nav class="rio-crumbs"><a href="/admin">Home</a><span class="rio-crumb-sep">·</span><a href="/admin/groups">Groups</a><span class="rio-crumb-sep">·</span><span class="rio-crumb-current">{{ name }}</span></nav>
<div class="rio-masthead-top">
<div><h1>Edit group</h1><p class="rio-masthead-desc">Editing <strong>{{ name }}</strong> — change membership and attached permissions.</p></div>
</div>
{% if errors %}<div class="rio-alert rio-alert--danger" role="alert"><ul>{% for e in errors %}<li>{{ e }}</li>{% endfor %}</ul></div>{% endif %}
<form method="post" action="/admin/groups/{{ group_id }}/edit" class="rio-form">
<input type="hidden" name="_csrf" value="{{ csrf_token }}">
{% for section in sections %}
<fieldset class="rio-fieldset rio-board">
{% if section.title %}<legend class="rio-fieldset-legend">{{ section.title }}</legend>{% endif %}
<div class="rio-fieldset-grid">{% for field in section.fields %}{% include "admin/includes/_form_field.html" %}{% endfor %}</div>
</fieldset>
{% endfor %}
<fieldset class="rio-fieldset rio-board">
<legend class="rio-fieldset-legend">Permissions</legend>
{% if matrix.rows or matrix.extras %}
{% if matrix.rows %}
<div style="overflow:auto">
<table class="rio-perm-matrix">
<thead>
<tr>
<th class="rio-perm-matrix__model">Model</th>
{% for col in matrix.columns %}<th class="rio-perm-matrix__col">{{ col|capitalize }}</th>{% endfor %}
<th class="rio-perm-matrix__row-toggle" aria-label="Row toggle">All</th>
</tr>
</thead>
<tbody>
{% for row in matrix.rows %}
<tr data-rio-perm-row>
<th class="rio-perm-matrix__model">{{ row.label }}</th>
{% for cell in row.cells %}
<td class="rio-perm-matrix__cell">
{% if cell %}
<label class="rio-perm-cell" title="{{ cell.name }}"><input type="checkbox" name="perm_{{ cell.id }}" value="on" data-rio-perm-checkbox{% if cell.checked %} checked{% endif %}><span class="rio-perm-cell__sr">{{ cell.name }}</span></label>
{% else %}<span class="rio-perm-na" aria-hidden="true">—</span>{% endif %}
</td>
{% endfor %}
<td class="rio-perm-matrix__cell"><button type="button" class="rio-perm-row-all" data-rio-perm-row-all>All</button></td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% endif %}
{% if matrix.extras %}
<details class="rio-perm-extras">
<summary>Other permissions ({{ matrix.extras|length }})</summary>
<ul class="rio-checkbox-list">
{% for cell in matrix.extras %}
<li><label class="rio-checkbox"><input type="checkbox" name="perm_{{ cell.id }}" value="on"{% if cell.checked %} checked{% endif %}><code>{{ cell.name }}</code></label></li>
{% endfor %}
</ul>
</details>
{% endif %}
{% else %}
<p class="rio-meta">No permissions registered yet. Permissions are seeded automatically by <code>Admin::seed_permissions</code>.</p>
{% endif %}
</fieldset>
<script>
(function () {
document.querySelectorAll('[data-rio-perm-row-all]').forEach(function (btn) {
btn.addEventListener('click', function () {
var row = btn.closest('[data-rio-perm-row]');
if (!row) return;
var boxes = row.querySelectorAll('[data-rio-perm-checkbox]');
var allOn = Array.prototype.every.call(boxes, function (b) { return b.checked; });
boxes.forEach(function (b) { b.checked = !allOn; });
});
});
})();
</script>
<div class="rio-form-actions">
<button type="submit" class="rio-btn rio-btn--primary">Save changes</button>
<span class="rio-action-bar-end">
<a class="rio-action-link rio-action-link--danger" href="/admin/groups/{{ group_id }}/delete">{{ icon("trash") }} Delete group</a>
<a href="/admin/groups" class="rio-action-link">Back to groups</a>
</span>
</div>
</form>
</div>
{% endblock %}