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

{% block content %}

<div class="page-head">
    <h1>Users & IP Restriction</h1>
</div>

<div class="panel">
    <p class="muted">Passwords are securely hashed and cannot be viewed. Set a new password below when access must be reset. The final active super administrator cannot be deactivated or changed to another role.</p>
    <div class="table-wrap">
        <table class="modern-table">
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Email</th>
                    <th>Role</th>
                    <th>Status</th>
                    <th>Locked Superadmin IP</th>
                    <th>External Access</th>
                    <th>Sales Approver</th>
                    <th>Chat Access</th>
                    <th>Theme</th>
                    <th>Last Login</th>
                    <th>Failed</th>
                    <th>Action</th>
                </tr>
            </thead>
            <tbody>
                {% for u in users %}
                <tr>
                    <td>{{ u.name }}</td>
                    <td>{{ u.email }}</td>
                    <td><span class="badge">{{ u.role }}</span></td>
                    <td><span class="badge">{{ u.status }}</span></td>
                    <td>
                        {% if trusted_ip %}
                        <span class="badge badge-warning">{{ trusted_ip }}</span>
                        {% else %}
                        <span class="muted">Not locked</span>
                        {% endif %}
                    </td>
                    <td>
                        <span class="badge {{ 'badge-danger' if u.ip_restricted else 'badge-success' }}">
                            {{ 'No - locked IP only' if u.ip_restricted else 'Yes - any IP' }}
                        </span>
                    </td>
                    <td>
                        <form method="post" action="{{ url_for('admin.update_user_privileges', user_id=u.id) }}">
                            <label class="check"><input type="checkbox" name="can_approve_sales" {% if u.can_approve_sales %}checked{% endif %}> Approve</label>
                            <label class="check"><input type="checkbox" name="can_initiate_chat" {% if u.can_initiate_chat %}checked{% endif %}> Chat</label>
                            <select name="ui_theme">
                                <option value="default" {% if u.ui_theme == 'default' %}selected{% endif %}>Default</option>
                                <option value="dark" {% if u.ui_theme == 'dark' %}selected{% endif %}>Dark Brown</option>
                                <option value="midnight" {% if u.ui_theme == 'midnight' %}selected{% endif %}>Midnight Blue</option>
                                <option value="light" {% if u.ui_theme == 'light' %}selected{% endif %}>Light</option>
                                <option value="forest" {% if u.ui_theme == 'forest' %}selected{% endif %}>Forest</option>
                                <option value="graphite" {% if u.ui_theme == 'graphite' %}selected{% endif %}>Graphite</option>
                                <option value="sunrise" {% if u.ui_theme == 'sunrise' %}selected{% endif %}>Sunrise</option>
                                <option value="red" {% if u.ui_theme == 'red' %}selected{% endif %}>Red</option>
                                <option value="bold" {% if u.ui_theme == 'bold' %}selected{% endif %}>Bold Font</option>
                                <option value="red-bold" {% if u.ui_theme == 'red-bold' %}selected{% endif %}>Red + Bold</option>
                                <option value="ocean" {% if u.ui_theme == 'ocean' %}selected{% endif %}>Ocean</option>
                                <option value="plum" {% if u.ui_theme == 'plum' %}selected{% endif %}>Plum</option>
                                <option value="rose" {% if u.ui_theme == 'rose' %}selected{% endif %}>Rose</option>
                                <option value="slate" {% if u.ui_theme == 'slate' %}selected{% endif %}>Slate</option>
                                <option value="aqua" {% if u.ui_theme == 'aqua' %}selected{% endif %}>Aqua</option>
                                <option value="teal" {% if u.ui_theme == 'teal' %}selected{% endif %}>Teal</option>
                            </select>
                            <button class="btn btn-sm" type="submit">Save</button>
                        </form>
                    </td>
                    <td>
                        <span class="badge {{ 'badge-success' if u.can_initiate_chat else '' }}">
                            {{ 'Enabled' if u.can_initiate_chat else 'Disabled' }}
                        </span>
                    </td>
                    <td>{{ u.ui_theme or 'default' }}</td>
                    <td>
                        {{ u.last_login_at or '-' }}
                        {% if u.last_login_ip %}<br><small>{{ u.last_login_ip }}</small>{% endif %}
                    </td>
                    <td>{{ u.failed_login_count }}</td>
                    <td>
                        {% if u.employee_id %}
                        <a class="btn btn-sm" href="{{ url_for('employees.edit', emp_id=u.employee_id) }}">Edit Employee</a>
                        {% else %}
                        <a class="btn btn-sm" href="{{ url_for('employees.create', user_id=u.id) }}">Create Employee Profile</a>
                        {% endif %}
                        <a class="btn btn-sm {{ 'danger' if u.status == 'active' else '' }}"
                            href="{{ url_for('admin.toggle_user', user_id=u.id) }}">
                            {{ 'Deactivate' if u.status == 'active' else 'Activate' }}
                        </a>
                        <form method="post" action="{{ url_for('admin.reset_user_password', user_id=u.id) }}" class="inline-reset-form">
                            <input type="password" name="new_password" minlength="8" required
                                   placeholder="New password" autocomplete="new-password" aria-label="New password for {{ u.name }}">
                            <button class="btn btn-sm" type="submit">Reset Password</button>
                        </form>
                    </td>
                </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
</div>

{% endblock %}