{% extends 'base.html' %}

{% block title %}用户列表{% endblock %}

{% block content %}
    <h1>用户列表</h1>

    <table class="table table-bordered"> <!-- 使用 Bootstrap 的 table 类来美化表格 -->
        <thead>
            <tr>
                <th>ID</th>
                <th>用户名</th>
                <th>昵称</th>
                <th>邮箱</th>
                <th>手机号</th>
                <th>注册时间</th>
                <th>操作</th>
            </tr>
        </thead>
        <tbody>
        {% for user in data_list %}
            <tr>
                <td>{{ user.id }}</td>
                <td>{{ user.username }}</td>
                <td>{{ user.info.nickname|default:"无" }}</td> <!-- 使用 default 过滤器处理可能为空的昵称 -->
                <td>{{ user.email }}</td>
                <td>{{ user.info.phone_number|default:"无" }}</td> <!-- 使用 default 过滤器处理可能为空的手机号 -->
                <td>{{ user.info.created_at|date:"Y-m-d H:i" }}</td> <!-- 格式化日期 -->
                <td>
                    {% if user.info.is_banned %}
                        <form action="{% url 'management:unban_user' user.id %}" method="post" style="display:inline;">
                            {% csrf_token %}
                            <button type="submit" class="btn btn-success btn-sm">解封</button>
                        </form>
                    {% else %}
                        <form action="{% url 'management:ban_user' user.id %}" method="post" style="display:inline;">
                            {% csrf_token %}
                            <button type="submit" class="btn btn-danger btn-sm">封禁</button>
                        </form>
                    {% endif %}
                </td>
            </tr>
        {% endfor %}
        </tbody>
    </table>
{% endblock %}