{% extends "layout.html" %}
{% block title %}Edit Role – {{ admin_title }}{% endblock %}
{% block content %}
<div class="mb-6">
<h1 class="text-xl font-semibold text-zinc-900">Edit Role: <span class="capitalize">{{ role_name }}</span></h1>
</div>
{% if error %}
<div class="mb-4 px-4 py-3 rounded-md bg-red-50 border border-red-200 text-red-700 text-sm">
{{ error }}
</div>
{% endif %}
<form method="post" action="/admin/roles/{{ role_name }}/" class="space-y-6 max-w-2xl">
<input type="hidden" name="csrf_token" value="{{ csrf_token }}" />
<div>
<h2 class="text-sm font-semibold text-zinc-700 mb-3">Permissions</h2>
<div class="bg-white border border-zinc-200 rounded-lg overflow-hidden">
<table class="w-full text-sm">
<thead class="bg-zinc-50 border-b border-zinc-200">
<tr>
<th class="text-left px-4 py-3 font-medium text-zinc-600 w-1/2">Entity</th>
<th class="text-center px-4 py-3 font-medium text-zinc-600">View</th>
<th class="text-center px-4 py-3 font-medium text-zinc-600">Create</th>
<th class="text-center px-4 py-3 font-medium text-zinc-600">Edit</th>
<th class="text-center px-4 py-3 font-medium text-zinc-600">Delete</th>
</tr>
</thead>
<tbody class="divide-y divide-zinc-100">
{% for p in perms %}
<tr class="hover:bg-zinc-50">
<td class="px-4 py-3 font-medium text-zinc-900">{{ p.entity_label }}</td>
<td class="px-4 py-3 text-center">
<input type="checkbox" name="perms" value="{{ p.entity_name }}.view"
{% if p.view %}checked{% endif %}
class="rounded border-zinc-300" />
</td>
<td class="px-4 py-3 text-center">
<input type="checkbox" name="perms" value="{{ p.entity_name }}.create"
{% if p.create %}checked{% endif %}
class="rounded border-zinc-300" />
</td>
<td class="px-4 py-3 text-center">
<input type="checkbox" name="perms" value="{{ p.entity_name }}.edit"
{% if p.edit %}checked{% endif %}
class="rounded border-zinc-300" />
</td>
<td class="px-4 py-3 text-center">
<input type="checkbox" name="perms" value="{{ p.entity_name }}.delete"
{% if p.delete %}checked{% endif %}
class="rounded border-zinc-300" />
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
<div class="flex items-center gap-3">
<button type="submit"
class="px-4 py-2 bg-zinc-900 text-white text-sm font-medium rounded-md hover:bg-zinc-700 transition-colors">
Save changes
</button>
<a href="/admin/roles/"
class="px-4 py-2 text-sm font-medium text-zinc-600 hover:text-zinc-900">Cancel</a>
</div>
</form>
{% endblock %}