{% extends "admin/admin-layout.html" %}

{% block app_content %}
<h1>Member List</h1> 
<div>
<a href="{{ url_for('admin.users_csv') }}" target="_blank">CSV for ACM</a>
</div>
<div class="mt-2">
<label for="search">Search</label>
<input type="text" id="search" class="form-control w-25"/>
</div>
<table class="table table-striped">
    <thead>
        <tr>
            <th>Email</th>
            <th>Name</th>
            <th>Created</th>
            <th>Last Login</th>
            <th>Officer?</th>
            <th>Options</th>
        </tr>
    </thead>
    <tbody id="searchable">
        {% for u in u_list %}
            <tr>
                <td>{{ u.email }}</td>
                <td>{{ u.first_name }} {{ u.last_name }}</td>
                <td>{{ u.created }}</td>
                <td>{{ u.last_login }}</td>
                <td>{{ u.is_admin }}</td>
                <td>
                    <div class="dropdown">
                       <a href="#" class="btn btn-primary dropdown-toggle"
                                   data-bs-toggle="dropdown"><span
                                   class="caret"></span></a>
                       <ul class="dropdown-menu">
                           {% if u.is_admin %}
                           <li class="dropdown-item"><a href="#" class="toggle-admin" data-id="{{
                                                                           u.id}}
                                                                           ">Demote
                                                                           Officer</a></li>
                           {% else %}
                           <li class="dropdown-item"> <a class="toggle-admin"
                                      href="#" data-id="{{ u.id}}">Promote Officer</a></li>
                           {% endif %}
                           <li class="dropdown-item"><a href="{{
                                                    url_for('admin.officer_positions',
                                                    user_id=u.id)}}">Manage Officer
                                                    Entries</a></li>
                           <li class="dropdown-item">View Event Checkins</li>
                           <li class="dropdown-item">Delete Member</li>
                       </ul>
                    </div>
                </td>
            </tr>
        {% endfor %}
    </tbody>    
</table>
<script src="{{ url_for('static', filename='js/jquery-3.6.3.min.js') }}" charset="utf-8"></script>
<script src="{{ url_for('static', filename='js/tableutils.js') }}"></script>
<script charset="utf-8">
    $(document).ready(() => {
        $('a.toggle-admin').click((e) => {
            e.preventDefault();
            let id = e.target.dataset.id
            console.log(`Toggling admin status of ${id}`)
            $.get(`/admin/users/toggle_admin/${id}`, (data) => {
                if (data.status === 'success') {
                    window.alert("Success!");
                    window.location.reload()
                } else {
                    window.alert(`Error :(\n${data.message}`)
                    window.location.reload()
                }
            });
        });
    });
</script>

{% endblock app_content %}
