Aiirondev_dev
bc61e87ab0
- Updated background colors across various templates to use CSS variables for better theming support. - Replaced hardcoded colors with variables like `var(--ui-surface)` and `var(--ui-surface-soft)` for backgrounds. - Adjusted text colors to use `var(--ui-text)` for improved readability and consistency. - Enhanced the theme toggle functionality in the base template to dynamically change theme colors based on user preference. - Ensured that all relevant templates reflect the new theming approach for a cohesive user experience.
458 lines
20 KiB
HTML
Executable File
458 lines
20 KiB
HTML
Executable File
<!--
|
|
Copyright 2025-2026 AIIrondev
|
|
|
|
Licensed under the Inventarsystem EULA (Endbenutzer-Lizenzvertrag).
|
|
See Legal/LICENSE for the full license text.
|
|
Unauthorized commercial use, SaaS hosting, or removal of branding is prohibited.
|
|
For commercial licensing inquiries: https://github.com/AIIrondev
|
|
-->
|
|
{% extends "base.html" %}
|
|
|
|
{% block title %}Benutzer verwalten{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="container">
|
|
<h1>Benutzer verwalten</h1>
|
|
|
|
<div class="user-management-container">
|
|
<h2>Benutzer</h2>
|
|
|
|
<form method="POST" action="{{ url_for('admin_anonymize_names') }}" class="mb-3">
|
|
<button
|
|
type="submit"
|
|
class="btn btn-outline-danger"
|
|
onclick="return confirm('Sollen alle gespeicherten Klarnamen dauerhaft in Synonym-Kuerzel umgewandelt werden?')"
|
|
>
|
|
Gespeicherte Namen anonymisieren
|
|
</button>
|
|
</form>
|
|
|
|
<div class="filter-bar mb-3">
|
|
<div class="row g-2 align-items-end">
|
|
<div class="col-md-3">
|
|
<label for="filter-search" class="form-label">Suche</label>
|
|
<input type="text" class="form-control" id="filter-search" placeholder="Benutzername, Vor- oder Nachname...">
|
|
</div>
|
|
<div class="col-md-2">
|
|
<label for="filter-admin" class="form-label">Rolle</label>
|
|
<select class="form-select" id="filter-admin">
|
|
<option value="">Alle</option>
|
|
<option value="ja">Administrator</option>
|
|
<option value="nein">Standardbenutzer</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<label for="filter-column" class="form-label">Sortieren nach</label>
|
|
<select class="form-select" id="filter-column">
|
|
<option value="0">Benutzername</option>
|
|
<option value="1">Vorname</option>
|
|
<option value="2">Nachname</option>
|
|
<option value="3">Rolle</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<label for="filter-direction" class="form-label">Reihenfolge</label>
|
|
<select class="form-select" id="filter-direction">
|
|
<option value="asc">Aufsteigend</option>
|
|
<option value="desc">Absteigend</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<button class="btn btn-secondary w-100" onclick="resetFilters()">Filter zurücksetzen</button>
|
|
</div>
|
|
</div>
|
|
<div class="mt-2 text-muted small" id="filter-count"></div>
|
|
</div>
|
|
|
|
<div class="table-responsive">
|
|
<table class="table table-striped table-hover" id="user-table">
|
|
<thead class="thead-dark">
|
|
<tr>
|
|
<th>Benutzername</th>
|
|
<th>Vorname</th>
|
|
<th>Nachname</th>
|
|
<th>Administrator</th>
|
|
<th>Rechte-Preset</th>
|
|
<th>Aktionen</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for user in users %}
|
|
<tr>
|
|
<td>{{ user.username }}</td>
|
|
<td>{{ user.name if user.name else user.username }}</td>
|
|
<td>{{ user.last_name if user.last_name else '' }}</td>
|
|
<td>{{ "Ja" if user.admin else "Nein" }}</td>
|
|
<td>{{ permission_presets.get(user.permission_preset, {}).get('label', user.permission_preset) }}</td>
|
|
<td class="actions">
|
|
<form method="POST" action="{{ url_for('delete_user') }}" class="d-inline">
|
|
<input type="hidden" name="username" value="{{ user.username }}">
|
|
<button type="submit" class="btn btn-danger btn-sm" onclick="return confirm('Sind Sie sicher, dass Sie den Benutzer {{ user.username }} löschen möchten?')">
|
|
Löschen
|
|
</button>
|
|
</form>
|
|
<button type="button" class="btn btn-primary btn-sm"
|
|
data-username="{{ user.username }}"
|
|
data-firstname="{{ user.name if user.name else '' }}"
|
|
data-lastname="{{ user.last_name if user.last_name else '' }}"
|
|
onclick="openEditUserModal(this)">
|
|
Bearbeiten
|
|
</button>
|
|
<button type="button" class="btn btn-warning btn-sm"
|
|
onclick="openResetPasswordModal('{{ user.username }}')">
|
|
Passwort zurücksetzen
|
|
</button>
|
|
<button type="button" class="btn btn-info btn-sm"
|
|
data-username="{{ user.username }}"
|
|
data-preset="{{ user.permission_preset }}"
|
|
data-action-permissions='{{ user.action_permissions | tojson }}'
|
|
data-page-permissions='{{ user.page_permissions | tojson }}'
|
|
onclick="openPermissionsModal(this)">
|
|
Berechtigungen
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Permission Modal -->
|
|
<div class="modal fade" id="permissionsModal" tabindex="-1" aria-labelledby="permissionsModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog modal-lg">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" id="permissionsModalLabel">Berechtigungen bearbeiten</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<form method="POST" action="{{ url_for('admin_update_user_permissions') }}">
|
|
<div class="modal-body permissions-modal-body">
|
|
<input type="hidden" id="perm-username" name="username">
|
|
<div class="mb-3">
|
|
<label for="perm-username-display" class="form-label">Benutzer</label>
|
|
<input type="text" class="form-control" id="perm-username-display" disabled>
|
|
</div>
|
|
|
|
<div class="mb-3">
|
|
<label for="permission-preset" class="form-label">Preset</label>
|
|
<select class="form-select" id="permission-preset" name="permission_preset">
|
|
{% for preset_key, preset_value in permission_presets.items() %}
|
|
<option value="{{ preset_key }}">{{ preset_value.label }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
|
|
<div class="permissions-grid">
|
|
<div class="permissions-group">
|
|
<h6>Aktionsrechte</h6>
|
|
{% for action_key, action_label in permission_action_options %}
|
|
<div class="form-check">
|
|
<input class="form-check-input permission-action-checkbox" type="checkbox" id="action-{{ action_key }}" name="action_{{ action_key }}">
|
|
<label class="form-check-label" for="action-{{ action_key }}">{{ action_label }}</label>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
|
|
<div class="permissions-group">
|
|
<h6>Seitenrechte</h6>
|
|
{% for endpoint_name, endpoint_label in permission_page_options %}
|
|
<div class="form-check">
|
|
<input class="form-check-input permission-page-checkbox" type="checkbox" id="page-{{ endpoint_name }}" name="page_{{ endpoint_name }}">
|
|
<label class="form-check-label" for="page-{{ endpoint_name }}">{{ endpoint_label }}</label>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Abbrechen</button>
|
|
<button type="submit" class="btn btn-primary">Berechtigungen speichern</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Edit User Modal -->
|
|
<div class="modal fade" id="editUserModal" tabindex="-1" aria-labelledby="editUserModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" id="editUserModalLabel">Benutzer bearbeiten</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<form method="POST" action="{{ url_for('admin_update_user_name') }}">
|
|
<div class="modal-body">
|
|
<input type="hidden" id="edit-username" name="username">
|
|
<div class="mb-3">
|
|
<label for="edit-username-display" class="form-label">Benutzer:</label>
|
|
<input type="text" class="form-control" id="edit-username-display" disabled>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="edit-name" class="form-label">Vorname:</label>
|
|
<input type="text" class="form-control" id="edit-name" name="name">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="edit-last-name" class="form-label">Nachname:</label>
|
|
<input type="text" class="form-control" id="edit-last-name" name="last_name">
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Abbrechen</button>
|
|
<button type="submit" class="btn btn-primary">Speichern</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Reset Password Modal -->
|
|
<div class="modal fade" id="resetPasswordModal" tabindex="-1" aria-labelledby="resetPasswordModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" id="resetPasswordModalLabel">Passwort zurücksetzen</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<form method="POST" action="{{ url_for('admin_reset_user_password') }}">
|
|
<div class="modal-body">
|
|
<input type="hidden" id="reset-username" name="username">
|
|
<div class="mb-3">
|
|
<label for="username-display" class="form-label">Benutzer:</label>
|
|
<input type="text" class="form-control" id="username-display" disabled>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="new-password" class="form-label">Neues Passwort:</label>
|
|
<input type="password" class="form-control" id="new-password" name="new_password" required>
|
|
<div class="password-requirements small text-muted mt-1">
|
|
<p>Das Passwort muss mindestens 6 Zeichen lang sein.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Abbrechen</button>
|
|
<button type="submit" class="btn btn-primary">Passwort zurücksetzen</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
var permissionPresets = {{ permission_presets | tojson }};
|
|
|
|
function applyPresetToPermissionForm(presetKey) {
|
|
var preset = permissionPresets[presetKey] || {};
|
|
var actionDefaults = preset.actions || {};
|
|
var pageDefaults = preset.pages || {};
|
|
|
|
document.querySelectorAll('.permission-action-checkbox').forEach(function (checkbox) {
|
|
var key = checkbox.name.replace('action_', '');
|
|
checkbox.checked = !!actionDefaults[key];
|
|
});
|
|
|
|
document.querySelectorAll('.permission-page-checkbox').forEach(function (checkbox) {
|
|
var key = checkbox.name.replace('page_', '');
|
|
checkbox.checked = !!pageDefaults[key];
|
|
});
|
|
}
|
|
|
|
function applyFilters() {
|
|
var search = document.getElementById('filter-search').value.toLowerCase();
|
|
var adminFilter = document.getElementById('filter-admin').value.toLowerCase();
|
|
var colIndex = parseInt(document.getElementById('filter-column').value);
|
|
var direction = document.getElementById('filter-direction').value;
|
|
|
|
var table = document.getElementById('user-table');
|
|
var tbody = table.querySelector('tbody');
|
|
var rows = Array.from(tbody.querySelectorAll('tr'));
|
|
|
|
var visible = rows.filter(function(row) {
|
|
var cells = row.querySelectorAll('td');
|
|
var username = cells[0] ? cells[0].textContent.toLowerCase() : '';
|
|
var firstname = cells[1] ? cells[1].textContent.toLowerCase() : '';
|
|
var lastname = cells[2] ? cells[2].textContent.toLowerCase() : '';
|
|
var admin = cells[3] ? cells[3].textContent.toLowerCase().trim() : '';
|
|
|
|
var matchesSearch = !search ||
|
|
username.includes(search) ||
|
|
firstname.includes(search) ||
|
|
lastname.includes(search);
|
|
|
|
var matchesAdmin = !adminFilter || admin === adminFilter;
|
|
|
|
return matchesSearch && matchesAdmin;
|
|
});
|
|
|
|
var hidden = rows.filter(function(row) { return visible.indexOf(row) === -1; });
|
|
|
|
hidden.forEach(function(row) { row.style.display = 'none'; });
|
|
|
|
visible.sort(function(a, b) {
|
|
var cellA = a.querySelectorAll('td')[colIndex];
|
|
var cellB = b.querySelectorAll('td')[colIndex];
|
|
var valA = cellA ? cellA.textContent.trim().toLowerCase() : '';
|
|
var valB = cellB ? cellB.textContent.trim().toLowerCase() : '';
|
|
if (valA < valB) return direction === 'asc' ? -1 : 1;
|
|
if (valA > valB) return direction === 'asc' ? 1 : -1;
|
|
return 0;
|
|
});
|
|
|
|
visible.forEach(function(row) {
|
|
row.style.display = '';
|
|
tbody.appendChild(row);
|
|
});
|
|
|
|
var countEl = document.getElementById('filter-count');
|
|
countEl.textContent = visible.length + ' von ' + rows.length + ' Benutzer angezeigt';
|
|
}
|
|
|
|
function resetFilters() {
|
|
document.getElementById('filter-search').value = '';
|
|
document.getElementById('filter-admin').value = '';
|
|
document.getElementById('filter-column').value = '0';
|
|
document.getElementById('filter-direction').value = 'asc';
|
|
applyFilters();
|
|
}
|
|
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
applyFilters();
|
|
document.getElementById('filter-search').addEventListener('input', applyFilters);
|
|
document.getElementById('filter-admin').addEventListener('change', applyFilters);
|
|
document.getElementById('filter-column').addEventListener('change', applyFilters);
|
|
document.getElementById('filter-direction').addEventListener('change', applyFilters);
|
|
|
|
var presetSelect = document.getElementById('permission-preset');
|
|
if (presetSelect) {
|
|
presetSelect.addEventListener('change', function () {
|
|
applyPresetToPermissionForm(this.value);
|
|
});
|
|
}
|
|
});
|
|
|
|
function openEditUserModal(button) {
|
|
var username = button.getAttribute('data-username');
|
|
var name = button.getAttribute('data-firstname');
|
|
var lastName = button.getAttribute('data-lastname');
|
|
|
|
document.getElementById('edit-username').value = username;
|
|
document.getElementById('edit-username-display').value = username;
|
|
document.getElementById('edit-name').value = name;
|
|
document.getElementById('edit-last-name').value = lastName;
|
|
|
|
var modal = new bootstrap.Modal(document.getElementById('editUserModal'));
|
|
modal.show();
|
|
}
|
|
|
|
function openResetPasswordModal(username) {
|
|
document.getElementById('reset-username').value = username;
|
|
document.getElementById('username-display').value = username;
|
|
|
|
// Open modal using Bootstrap
|
|
var modal = new bootstrap.Modal(document.getElementById('resetPasswordModal'));
|
|
modal.show();
|
|
}
|
|
|
|
function openPermissionsModal(button) {
|
|
var username = button.getAttribute('data-username') || '';
|
|
var preset = button.getAttribute('data-preset') || 'standard_user';
|
|
var actionPermissions = {};
|
|
var pagePermissions = {};
|
|
|
|
try {
|
|
actionPermissions = JSON.parse(button.getAttribute('data-action-permissions') || '{}');
|
|
} catch (err) {
|
|
actionPermissions = {};
|
|
}
|
|
|
|
try {
|
|
pagePermissions = JSON.parse(button.getAttribute('data-page-permissions') || '{}');
|
|
} catch (err) {
|
|
pagePermissions = {};
|
|
}
|
|
|
|
document.getElementById('perm-username').value = username;
|
|
document.getElementById('perm-username-display').value = username;
|
|
document.getElementById('permission-preset').value = preset;
|
|
|
|
document.querySelectorAll('.permission-action-checkbox').forEach(function (checkbox) {
|
|
var key = checkbox.name.replace('action_', '');
|
|
checkbox.checked = !!actionPermissions[key];
|
|
});
|
|
|
|
document.querySelectorAll('.permission-page-checkbox').forEach(function (checkbox) {
|
|
var key = checkbox.name.replace('page_', '');
|
|
checkbox.checked = !!pagePermissions[key];
|
|
});
|
|
|
|
var modal = new bootstrap.Modal(document.getElementById('permissionsModal'));
|
|
modal.show();
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.user-management-container {
|
|
margin-top: 20px;
|
|
}
|
|
|
|
.actions {
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.actions form {
|
|
display: inline-block;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
.filter-bar {
|
|
background-color: var(--ui-surface-soft);
|
|
padding: 15px;
|
|
border-radius: 6px;
|
|
border: 1px solid #dee2e6;
|
|
}
|
|
|
|
.password-requirements {
|
|
background-color: var(--ui-surface-soft);
|
|
padding: 10px;
|
|
border-radius: 4px;
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.password-requirements p {
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
.permissions-modal-body {
|
|
max-height: 70vh;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
.permissions-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
|
|
gap: 18px;
|
|
}
|
|
|
|
.permissions-group {
|
|
border: 1px solid #dee2e6;
|
|
border-radius: 8px;
|
|
padding: 12px;
|
|
background: var(--ui-surface-soft);
|
|
}
|
|
|
|
.permissions-group h6 {
|
|
font-weight: 700;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.modal-backdrop {
|
|
z-index: 1998 !important;
|
|
}
|
|
|
|
.modal {
|
|
z-index: 1999 !important;
|
|
}
|
|
</style>
|
|
{% endblock %} |