{% extends 'panel/base.html' %}

{% block panel_title %}Role i uprawnienia{% endblock %}
{% block heading %}Role i uprawnienia{% endblock %}
{% block subheading %}<p class="text-sm text-slate-500 dark:text-slate-400">Zestawy sekcji panelu przypisywane kontom pracowników.</p>{% endblock %}
{% block actions %}<a class="btn-primary" href="{% url 'panel:roles:create' %}">Nowa rola</a>{% endblock %}

{% block content %}
<section class="card overflow-hidden">
  <div class="overflow-x-auto">
    <table class="table">
      <thead class="bg-slate-50 dark:bg-slate-900/60">
        <tr>
          <th class="th">Rola</th>
          <th class="th">Zakres</th>
          <th class="th">Konta</th>
          <th class="th text-right">Akcje</th>
        </tr>
      </thead>
      <tbody class="divide-y divide-slate-100 dark:divide-slate-800">
        {% for role in roles %}
          <tr class="hover:bg-slate-50 dark:hover:bg-slate-800/50">
            <td class="td">
              <span class="block font-medium">{{ role.name }}</span>
              {% if role.description %}<span class="text-xs text-slate-400">{{ role.description }}</span>{% endif %}
            </td>
            <td class="td">
              {% if role.is_admin %}
                <span class="badge bg-brand-100 text-brand-800 dark:bg-brand-950 dark:text-brand-200">cały panel</span>
              {% else %}
                <div class="flex flex-wrap gap-1">
                  {% for title in role.module_titles %}
                    <span class="badge bg-slate-100 text-slate-700 dark:bg-slate-800 dark:text-slate-200">{{ title }}</span>
                  {% empty %}
                    <span class="text-xs text-slate-400">brak sekcji</span>
                  {% endfor %}
                </div>
              {% endif %}
            </td>
            <td class="td whitespace-nowrap">{{ role.user_count }}</td>
            <td class="td">
              <div class="flex justify-end gap-2">
                {% if role.can_manage %}
                  <a class="btn-ghost !px-3 !py-1 text-xs" href="{% url 'panel:roles:edit' role.pk %}">Edytuj</a>
                  {% if not role.is_locked %}
                    <form method="post" action="{% url 'panel:roles:delete' role.pk %}"
                          data-confirm="Usunąć role {{ role.name }}?">
                      {% csrf_token %}
                      <button class="btn-danger !px-3 !py-1 text-xs" type="submit">Usuń</button>
                    </form>
                  {% endif %}
                {% else %}
                  <span class="text-xs text-slate-400">tylko administrator</span>
                {% endif %}
              </div>
            </td>
          </tr>
        {% empty %}
          <tr><td class="td py-10 text-center text-slate-500" colspan="4">Nie ma jeszcze żadnej roli.</td></tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
</section>
{% endblock %}