{% extends "base.html" %}
{% load i18n %}
{% load static %}
{% load font_awesome %}
{% block title %}{% trans "Users" %}{% endblock %}
{% block content %}
<div class="row">
    <div class="col-lg-12">
        <a href="{% url 'admin:group_create' %}" class="btn btn-success btn-header float-right">
            {% icon 'plus' %}
        </a>
        <div class="float-right search">
            <input id="filter" class="form-control" type="text" placeholder="{% trans "Search" %}">
        </div>
        <h1 class="page-header">{% trans "Groups" %}</h1>
    </div>
</div>
{% include 'errors_block.html' %}
<div class="row">
    {% if not groups %}
        <div class="col-lg-12">
            <div class="alert alert-warning alert-dismissable">
                <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
                {% icon 'exclamation-triangle '%} <strong>{% trans "Warning" %}:</strong> {% trans "You don't have any groups" %}
            </div>
        </div>
    {% else %}
        <div class="col-lg-12">
            <table class="table table-striped table-hover">
                <thead>
                    <tr>
                        <th span="col">{% trans "Group Name" %}</th>
                        <th span="col">{% trans "Actions" %}</th>
                    </tr>
                </thead>
                <tbody class="searchable">
                {% for group in groups %}
                    <tr>
                        <td>
                            <a href=""><strong>{{ group.name }}</strong></a>
                        </td>
                        <td>
                            <div class="float-right btn-group">
                                <a class="btn btn-primary" href="{% url 'admin:group_update' group.id %}" title="{%trans "Edit" %}">
                                    {% icon 'pencil' %}
                                </a>
                                <a class="btn btn-danger" href="{% url 'admin:group_delete' group.id %}" title="{%trans "Delete" %}">
                                    {% icon 'times' %}
                                </a>
                            </div>
                        </td>
                    </tr>
                {% endfor %}
                </tbody>
            </table>
        </div>
    {% endif %}
</div>
{% endblock content %}

{% block script %}
<script src="{% static "js/filter-table.js" %}"></script>
{% endblock script %}