{% extends "admin/components/datatable.html" %}
{% block title %} SKA Referee Test | Manage Users {% endblock %}
{% block content %}
    <h1>Manage Users</h1>
    <table id="user-table" class="table table-striped" style="width:100%">
        <thead>
            <tr>
                <th>
                    
                </th>
                <th data-priority="1">
                    Username
                </th>
                <th>
                    Email Address
                </th>
                <th data-priority="1">
                    Actions
                </th>
            </tr>
        </thead>
        <tbody>
            {% for user in users %}
                <tr class="table-row">
                    <td>
                        {% if user == current_user %}
                            <div class="text-success" title="Current User">
                                <svg  xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="bi success bi-caret-right-fill" viewBox="0 0 16 16">
                                    <path d="m12.14 8.753-5.482 4.796c-.646.566-1.658.106-1.658-.753V3.204a1 1 0 0 1 1.659-.753l5.48 4.796a1 1 0 0 1 0 1.506z"/>
                                </svg>
                            </div>
                        {% endif %}
                    </td>
                    <td>
                        {{ user.get_username() }}
                    </td>
                    <td>
                        {{ user.get_email() }}
                    </td>
                    <td class="row-actions">
                        <a
                            href="
                            {% if not user == current_user %}
                                {{ url_for('admin._update_user', id = user.id ) }}
                            {% else %}
                                {{ url_for('admin._update_user', id=current_user.id) }}
                            {% endif %}
                            "
                            class="btn btn-primary"
                            title="Update User"
                        >
                            <i class="bi bi-person-lines-fill button-icon"></i>
                        </a>
                        <a
                            href="
                            {% if not user == current_user %}
                                {{ url_for('admin._delete_user', id = user.id ) }}
                            {% else %}
                                #
                            {% endif %}
                            "
                            class="btn btn-danger {% if user == current_user  %} disabled {% endif %}"
                            title="Delete User"
                            {% if user == current_user  %} onclick="return false" {% endif %}
                        >
                            <i class="bi bi-person-x-fill button-icon"></i>
                        </button>
                    </td>
                </tr>
            {% endfor %}
        </tbody>
    </table>
    <div class="form-container">
        <form name="form-create-user" class="form-display form-post" action="{{ url_for(request.endpoint, **request.view_args) }}" data-rel-success="">
            <h2 class="form-heading">Create User</h2>
            {{ form.hidden_tag() }}
            <div class="form-label-group">
                {{ form.username(class_="form-control", placeholder="Enter Username") }}
                {{ form.username.label }}
            </div>
            <div class="form-label-group">
                {{ form.email(class_="form-control", placeholder="Enter Email") }}
                {{ form.email.label }}
            </div>
            <div class="form-label-group">
                If you do not enter a password, a random one will be generated.
            </div>
            <div class="form-label-group">
                {{ form.password(class_="form-control", placeholder="Enter Password") }}
                {{ form.password.label }}
            </div>
            {% include "admin/components/client-alerts.html" %}
            <div class="container form-submission-button">
                <div class="row">
                    <div class="col text-center">
                        <button title="Create User" class="btn btn-md btn-success btn-block" type="submit">
                            <i class="bi bi-person-plus-fill button-icon"></i>
                            Create User
                        </button>
                    </div>
                </div>
            </div>
        </form>
    </div>
{% endblock %}
{% block custom_data_script %}
    <script>
        $(document).ready(function() {
            $('#user-table').DataTable({
                'columnDefs': [
                    {'sortable': false, 'targets': [0,3]}
                ],
                'order': [[1, 'asc'], [2, 'asc']],
                'buttons': [
                    'copy', 'excel', 'pdf'
                ],
                'responsive': 'true',
                'colReorder': 'true',
                'fixedHeader': 'true'
            });
        } );
        $('#user-table').show();
        $(window).trigger('resize');
    </script>
{% endblock %}