04/30 Web Checker web app ver. 1.0
This commit is contained in:
@@ -0,0 +1,145 @@
|
||||
{% extends "base.html" %}
|
||||
{% block title %}Users — Website Checker{% endblock %}
|
||||
{% block content %}
|
||||
<div class="page-header">
|
||||
<h1 class="page-title">User Management</h1>
|
||||
<button class="btn btn-primary" onclick="openModal('modal-create-user')">＋ Add User</button>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<table class="table table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>ID</th><th>Username</th><th>Full Name</th><th>Email</th>
|
||||
<th>Role</th><th>Active</th><th>Created</th><th>Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for u in users %}
|
||||
<tr>
|
||||
<td>{{ u.id }}</td>
|
||||
<td><strong>{{ u.username }}</strong></td>
|
||||
<td>{{ u.full_name or '—' }}</td>
|
||||
<td>{{ u.email or '—' }}</td>
|
||||
<td><span class="badge badge-{{ 'accent' if u.role == 'admin' else 'neutral' }}">{{ u.role }}</span></td>
|
||||
<td><span class="badge badge-{{ 'success' if u.is_active else 'danger' }}">{{ 'Yes' if u.is_active else 'No' }}</span></td>
|
||||
<td class="text-muted">{{ u.created_at.strftime('%Y-%m-%d') if u.created_at else '—' }}</td>
|
||||
<td class="actions">
|
||||
<button class="btn btn-ghost btn-sm"
|
||||
onclick='openEditUser({{ u|tojson }})'>✎ Edit</button>
|
||||
<form method="post" action="{{ url_for('admin_users.delete', user_id=u.id) }}"
|
||||
style="display:inline"
|
||||
onsubmit="return confirm('Delete user {{ u.username }}?')">
|
||||
<button class="btn btn-danger btn-sm" type="submit">✕</button>
|
||||
</form>
|
||||
</td>
|
||||
</tr>
|
||||
{% else %}
|
||||
<tr><td colspan="8" class="text-center text-muted">No users found.</td></tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- Create User Modal -->
|
||||
<div class="modal-overlay" id="modal-create-user">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-header">
|
||||
<h3>Add User</h3>
|
||||
<button class="modal-close" onclick="closeModal('modal-create-user')">✕</button>
|
||||
</div>
|
||||
<form method="post" action="{{ url_for('admin_users.create') }}">
|
||||
<div class="modal-body">
|
||||
<div class="form-group">
|
||||
<label class="form-label">Username *</label>
|
||||
<input class="form-control" name="username" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">Full Name</label>
|
||||
<input class="form-control" name="full_name">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">Email</label>
|
||||
<input class="form-control" type="email" name="email">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">Role</label>
|
||||
<select class="form-control" name="role">
|
||||
<option value="user">User</option>
|
||||
<option value="admin">Admin</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">Password *</label>
|
||||
<input class="form-control" type="password" name="password" required>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-ghost" onclick="closeModal('modal-create-user')">Cancel</button>
|
||||
<button type="submit" class="btn btn-primary">Create User</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Edit User Modal -->
|
||||
<div class="modal-overlay" id="modal-edit-user">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-header">
|
||||
<h3>Edit User</h3>
|
||||
<button class="modal-close" onclick="closeModal('modal-edit-user')">✕</button>
|
||||
</div>
|
||||
<form method="post" id="edit-user-form">
|
||||
<div class="modal-body">
|
||||
<div class="form-group">
|
||||
<label class="form-label">Username *</label>
|
||||
<input class="form-control" name="username" id="edit-username" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">Full Name</label>
|
||||
<input class="form-control" name="full_name" id="edit-full-name">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">Email</label>
|
||||
<input class="form-control" type="email" name="email" id="edit-email">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">Role</label>
|
||||
<select class="form-control" name="role" id="edit-role">
|
||||
<option value="user">User</option>
|
||||
<option value="admin">Admin</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">Active</label>
|
||||
<select class="form-control" name="is_active" id="edit-is-active">
|
||||
<option value="1">Yes</option>
|
||||
<option value="0">No</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">New Password (leave blank to keep current)</label>
|
||||
<input class="form-control" type="password" name="password">
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-ghost" onclick="closeModal('modal-edit-user')">Cancel</button>
|
||||
<button type="submit" class="btn btn-primary">Save Changes</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function openEditUser(u) {
|
||||
document.getElementById('edit-username').value = u.username;
|
||||
document.getElementById('edit-full-name').value = u.full_name || '';
|
||||
document.getElementById('edit-email').value = u.email || '';
|
||||
document.getElementById('edit-role').value = u.role;
|
||||
document.getElementById('edit-is-active').value = u.is_active ? '1' : '0';
|
||||
document.getElementById('edit-user-form').action =
|
||||
'/admin/users/' + u.id + '/edit';
|
||||
openModal('modal-edit-user');
|
||||
}
|
||||
</script>
|
||||
{% endblock %}
|
||||
Reference in New Issue
Block a user