{% extends "base.html" %}

{% block title %}User Management - Inspection Reporting{% endblock %}

{% block content %}
<div class="mb-6">
    <h1 class="text-2xl font-bold">User Management</h1>
    <a href="{{ url_for('admin.create_user') }}" class="btn btn-primary ml-4">Create New User</a>
</div>

{% if users.items %}
<table class="min-w-full divide-y divide-gray-200">
    <thead class="bg-gray-50">
        <tr>
            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Username</th>
            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Full Name</th>
            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Email</th>
            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Role</th>
            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Status</th>
            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Actions</th>
        </tr>
    </thead>
    <tbody class="bg-white divide-y divide-gray-200">
        {% for user in users.items %}
        <tr class="hover:bg-gray-50">
            <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">{{ user.username }}</td>
            <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-700">{{ user.full_name }}</td>
            <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-700">{{ user.email }}</td>
            <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-700">
                {% if user.is_admin %}<span class="badge badge-primary">Admin</span>{% else %}<span class="badge badge-secondary">User</span>{% endif %}
            </td>
            <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-700">
                {% if user.is_active %}<span class="badge badge-success">Active</span>{% else %}<span class="badge badge-error">Inactive</span>{% endif %}
            </td>
            <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
                <div class="flex space-x-2">
                    <a href="{{ url_for('admin.edit_user', id=user.id) }}" class="btn btn-xs btn-info">Edit</a>
                    {% if user.id != current_user.id %}
                    <form method="POST" action="{{ url_for('admin.toggle_active', id=user.id) }}" class="inline">
                        <button type="submit" class="btn btn-xs {% if user.is_active %}btn-error{% else %}btn-success{% endif %}">
                            {% if user.is_active %}Deactivate{% else %}Activate{% endif %}
                        </button>
                    </form>
                    {% endif %}
                </div>
            </td>
        </tr>
        {% endfor %}
    </tbody>
</table>

<div class="flex items-center justify-between mt-4">
    <p class="text-sm text-gray-500">
        Showing {{ users.start_idx }} to {{ users.end_idx }} of {{ users.total }} users
    </p>
    <nav aria-label="Page navigation">
        <ul class="inline-flex items-center spacing-x-1">
            {% if users.has_prev %}
            <li>
                <a href="{{ url_for('admin.users', page=users.prev_num) }}" class="btn btn-xs btn-outline">Previous</a>
            </li>
            {% endif %}
            {% for page_num in users.iter_pages() %}
            {% if page_num %}
                {% if page_num == users.page %}
                <li>
                    <a href="{{ url_for('admin.users', page=page_num) }}" class="btn btn-xs btn-primary">{{ page_num }}</a>
                </li>
                {% else %}
                <li>
                    <a href="{{ url_for('admin.users', page=page_num) }}" class="btn btn-xs btn-outline">{{ page_num }}</a>
                </li>
                {% endif %}
            {% else %}
                <li>
                    <span class="btn btn-xs btn-outline">…</span>
                </li>
            {% endif %}
            {% endfor %}
            {% if users.has_next %}
            <li>
                <a href="{{ url_for('admin.users', page=users.next_num) }}" class="btn btn-xs btn-outline">Next</a>
            </li>
            {% endif %}
        </ul>
    </nav>
</div>
{% else %}
<div class="text-center py-8">
    <p class="text-gray-500">No users found.</p>
    <a href="{{ url_for('admin.create_user') }}" class="btn btn-primary mt-4">Create First User</a>
</div>
{% endif %}
{% endblock %}