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.add_user') }}" 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 %}
|
|
|