191 lines
		
	
	
		
			7.8 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			191 lines
		
	
	
		
			7.8 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
{% extends "base.html" %}
 | 
						|
 | 
						|
{% block title %}用户管理 - 图书管理系统{% endblock %}
 | 
						|
 | 
						|
{% block head %}
 | 
						|
<link rel="stylesheet" href="{{ url_for('static', filename='css/user-list.css') }}">
 | 
						|
{% endblock %}
 | 
						|
 | 
						|
{% block content %}
 | 
						|
<div class="user-list-container">
 | 
						|
    <!-- 页面标题 -->
 | 
						|
    <div class="page-header">
 | 
						|
        <h1>用户管理</h1>
 | 
						|
        <div class="actions">
 | 
						|
            <a href="{{ url_for('user.register') }}" class="btn btn-primary">
 | 
						|
                <i class="fas fa-user-plus"></i> 添加用户
 | 
						|
            </a>
 | 
						|
        </div>
 | 
						|
    </div>
 | 
						|
 | 
						|
    <!-- 搜索和过滤区域 -->
 | 
						|
    <div class="search-filter-container">
 | 
						|
        <form method="GET" action="{{ url_for('user.user_list') }}" class="search-filter-form">
 | 
						|
            <div class="form-row">
 | 
						|
                <div class="search-box">
 | 
						|
                    <input type="text" name="search" value="{{ search }}" placeholder="搜索用户名/邮箱/昵称/手机" class="form-control">
 | 
						|
                    <button type="submit" class="btn btn-search">
 | 
						|
                        <i class="fas fa-search"></i>
 | 
						|
                    </button>
 | 
						|
                </div>
 | 
						|
 | 
						|
                <div class="filter-box">
 | 
						|
                    <select name="status" class="form-control">
 | 
						|
                        <option value="">所有状态</option>
 | 
						|
                        <option value="1" {% if status == 1 %}selected{% endif %}>正常</option>
 | 
						|
                        <option value="0" {% if status == 0 %}selected{% endif %}>禁用</option>
 | 
						|
                    </select>
 | 
						|
 | 
						|
                    <select name="role_id" class="form-control">
 | 
						|
                        <option value="">所有角色</option>
 | 
						|
                        {% for role in roles %}
 | 
						|
                        <option value="{{ role.id }}" {% if role_id == role.id %}selected{% endif %}>{{ role.role_name }}</option>
 | 
						|
                        {% endfor %}
 | 
						|
                    </select>
 | 
						|
 | 
						|
                    <button type="submit" class="btn btn-filter">筛选</button>
 | 
						|
                    <a href="{{ url_for('user.user_list') }}" class="btn btn-reset">重置</a>
 | 
						|
                </div>
 | 
						|
            </div>
 | 
						|
        </form>
 | 
						|
    </div>
 | 
						|
 | 
						|
    <!-- 用户列表表格 -->
 | 
						|
    <div class="table-responsive">
 | 
						|
        <table class="table">
 | 
						|
            <thead>
 | 
						|
                <tr>
 | 
						|
                    <th>ID</th>
 | 
						|
                    <th>用户名</th>
 | 
						|
                    <th>昵称</th>
 | 
						|
                    <th>邮箱</th>
 | 
						|
                    <th>手机号</th>
 | 
						|
                    <th>角色</th>
 | 
						|
                    <th>状态</th>
 | 
						|
                    <th>注册时间</th>
 | 
						|
                    <th>操作</th>
 | 
						|
                </tr>
 | 
						|
            </thead>
 | 
						|
            <tbody>
 | 
						|
                {% for user in pagination.items %}
 | 
						|
                <tr>
 | 
						|
                    <td>{{ user.id }}</td>
 | 
						|
                    <td>{{ user.username }}</td>
 | 
						|
                    <td>{{ user.nickname or '-' }}</td>
 | 
						|
                    <td>{{ user.email or '-' }}</td>
 | 
						|
                    <td>{{ user.phone or '-' }}</td>
 | 
						|
                    <td>
 | 
						|
                        {% for role in roles %}
 | 
						|
                            {% if role.id == user.role_id %}
 | 
						|
                                {{ role.role_name }}
 | 
						|
                            {% endif %}
 | 
						|
                        {% endfor %}
 | 
						|
                    </td>
 | 
						|
                    <td>
 | 
						|
                        <span class="status-badge {% if user.status == 1 %}active{% else %}inactive{% endif %}">
 | 
						|
                            {{ '正常' if user.status == 1 else '禁用' }}
 | 
						|
                        </span>
 | 
						|
                    </td>
 | 
						|
                    <td>{{ user.created_at }}</td>
 | 
						|
                    <td class="actions">
 | 
						|
                        <a href="{{ url_for('user.user_edit', user_id=user.id) }}" class="btn btn-sm btn-info" title="编辑">
 | 
						|
                            <i class="fas fa-edit"></i>
 | 
						|
                        </a>
 | 
						|
 | 
						|
                        {% if user.id != session.get('user_id') %}
 | 
						|
                            {% if user.status == 1 %}
 | 
						|
                            <button class="btn btn-sm btn-warning toggle-status" data-id="{{ user.id }}" data-status="0" title="禁用">
 | 
						|
                                <i class="fas fa-ban"></i>
 | 
						|
                            </button>
 | 
						|
                            {% else %}
 | 
						|
                            <button class="btn btn-sm btn-success toggle-status" data-id="{{ user.id }}" data-status="1" title="启用">
 | 
						|
                                <i class="fas fa-check"></i>
 | 
						|
                            </button>
 | 
						|
                            {% endif %}
 | 
						|
 | 
						|
                            <button class="btn btn-sm btn-danger delete-user" data-id="{{ user.id }}" title="删除">
 | 
						|
                                <i class="fas fa-trash"></i>
 | 
						|
                            </button>
 | 
						|
                        {% else %}
 | 
						|
                            <span class="text-muted">(当前用户)</span>
 | 
						|
                        {% endif %}
 | 
						|
                    </td>
 | 
						|
                </tr>
 | 
						|
                {% else %}
 | 
						|
                <tr>
 | 
						|
                    <td colspan="9" class="text-center">暂无用户数据</td>
 | 
						|
                </tr>
 | 
						|
                {% endfor %}
 | 
						|
            </tbody>
 | 
						|
        </table>
 | 
						|
    </div>
 | 
						|
 | 
						|
    <!-- 分页控件 -->
 | 
						|
    {% if pagination.pages > 1 %}
 | 
						|
    <div class="pagination-container">
 | 
						|
        <ul class="pagination">
 | 
						|
            {% if pagination.has_prev %}
 | 
						|
            <li class="page-item">
 | 
						|
                <a class="page-link" href="{{ url_for('user.user_list', page=pagination.prev_num, search=search, status=status, role_id=role_id) }}">
 | 
						|
                    <i class="fas fa-chevron-left"></i>
 | 
						|
                </a>
 | 
						|
            </li>
 | 
						|
            {% endif %}
 | 
						|
 | 
						|
            {% for page in pagination.iter_pages(left_edge=2, left_current=2, right_current=3, right_edge=2) %}
 | 
						|
                {% if page %}
 | 
						|
                    {% if page == pagination.page %}
 | 
						|
                    <li class="page-item active">
 | 
						|
                        <span class="page-link">{{ page }}</span>
 | 
						|
                    </li>
 | 
						|
                    {% else %}
 | 
						|
                    <li class="page-item">
 | 
						|
                        <a class="page-link" href="{{ url_for('user.user_list', page=page, search=search, status=status, role_id=role_id) }}">{{ page }}</a>
 | 
						|
                    </li>
 | 
						|
                    {% endif %}
 | 
						|
                {% else %}
 | 
						|
                    <li class="page-item disabled">
 | 
						|
                        <span class="page-link">...</span>
 | 
						|
                    </li>
 | 
						|
                {% endif %}
 | 
						|
            {% endfor %}
 | 
						|
 | 
						|
            {% if pagination.has_next %}
 | 
						|
            <li class="page-item">
 | 
						|
                <a class="page-link" href="{{ url_for('user.user_list', page=pagination.next_num, search=search, status=status, role_id=role_id) }}">
 | 
						|
                    <i class="fas fa-chevron-right"></i>
 | 
						|
                </a>
 | 
						|
            </li>
 | 
						|
            {% endif %}
 | 
						|
        </ul>
 | 
						|
    </div>
 | 
						|
    {% endif %}
 | 
						|
</div>
 | 
						|
 | 
						|
<!-- 确认删除模态框 -->
 | 
						|
<div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="deleteModalLabel" aria-hidden="true">
 | 
						|
    <div class="modal-dialog" role="document">
 | 
						|
        <div class="modal-content">
 | 
						|
            <div class="modal-header">
 | 
						|
                <h5 class="modal-title" id="deleteModalLabel">确认删除</h5>
 | 
						|
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
 | 
						|
                    <span aria-hidden="true">×</span>
 | 
						|
                </button>
 | 
						|
            </div>
 | 
						|
            <div class="modal-body">
 | 
						|
                您确定要删除这个用户吗?此操作不可逆。
 | 
						|
            </div>
 | 
						|
            <div class="modal-footer">
 | 
						|
                <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
 | 
						|
                <button type="button" class="btn btn-danger" id="confirmDelete">确认删除</button>
 | 
						|
            </div>
 | 
						|
        </div>
 | 
						|
    </div>
 | 
						|
</div>
 | 
						|
{% endblock %}
 | 
						|
 | 
						|
{% block scripts %}
 | 
						|
<script src="{{ url_for('static', filename='js/user-list.js') }}"></script>
 | 
						|
{% endblock %}
 | 
						|
 |