Improvement

srv/poe_manager/app.py

@@ -1,8 +1,7 @@
-#!/usr/bin/env python3
+#u!/usr/bin/env python3
 from flask import Flask, render_template, request, redirect, url_for, flash
 from flask_login import LoginManager, login_user, login_required, logout_user, UserMixin, current_user
 from flask_bcrypt import Bcrypt
-from werkzeug.security import generate_password_hash
 from cryptography.fernet import Fernet
 import sqlite3
 import glob, os, re
@@ -343,43 +342,74 @@ def users():
         return redirect(url_for("index"))
 
     conn = sqlite3.connect("sqlite.db")
-    conn.row_factory = sqlite3.Row  # wichtig für Template
+    conn.row_factory = sqlite3.Row
     c = conn.cursor()
 
-    # Neues Benutzer hinzufügen
     if request.method == "POST":
-        if "add_user" in request.form:
-            username = request.form["username"]
-            password = generate_password_hash(request.form["password"])
-            is_admin = 1 if "is_admin" in request.form else 0
-            try:
-                c.execute("INSERT INTO users (username, password, is_admin) VALUES (?, ?, ?)",
-                          (username, password, is_admin))
-                conn.commit()
-                flash(f"Benutzer {username} hinzugefügt!")
-            except sqlite3.IntegrityError:
-                flash("Benutzername existiert bereits!")
 
-        if "delete_user" in request.form:
+        # Neuen Benutzer hinzufügen
+        if "add_user" in request.form:
+            username = request.form["username"].strip()
+            password = request.form["password"].strip()
+            is_admin = int(request.form.get("is_admin", 0))
+
+            if username and password:
+                pw_hash = bcrypt.generate_password_hash(password).decode("utf-8")
+                try:
+                    c.execute(
+                        "INSERT INTO users (username, password, is_admin) VALUES (?, ?, ?)",
+                        (username, pw_hash, is_admin)
+                    )
+                    conn.commit()
+                    flash(f"Benutzer '{username}' erfolgreich angelegt!")
+                except sqlite3.IntegrityError:
+                    flash("Benutzername existiert bereits!")
+            else:
+                flash("Username und Passwort dürfen nicht leer sein!")
+
+        # Rolle ändern
+        elif "change_role" in request.form:
+            user_id = request.form["user_id"]
+            username = request.form.get("username", "").strip()
+            is_admin = int(request.form.get("is_admin", 0))
+            if username:
+                c.execute(
+                    "UPDATE users SET username=?, is_admin=? WHERE id=?",
+                    (username, is_admin, user_id)
+                )
+                conn.commit()
+                flash("Rolle und Username geändert!")
+            else:
+                flash("Username darf nicht leer sein!")
+
+        # Passwort ändern
+        elif "change_password" in request.form:
+            user_id = request.form["user_id"]
+            new_password = request.form.get("new_password", "").strip()
+            if new_password:
+                pw_hash = bcrypt.generate_password_hash(new_password).decode("utf-8")
+                c.execute(
+                    "UPDATE users SET password=? WHERE id=?",
+                    (pw_hash, user_id)
+                )
+                conn.commit()
+                flash("Passwort erfolgreich geändert!")
+            else:
+                flash("Passwort darf nicht leer sein!")
+
+        # Benutzer löschen
+        elif "delete_user" in request.form:
             user_id = request.form["delete_user"]
             c.execute("DELETE FROM users WHERE id=?", (user_id,))
             conn.commit()
             flash("Benutzer gelöscht!")
 
-        if "edit_user" in request.form:
-            user_id = request.form["user_id"]
-            username = request.form["username"]
-            is_admin = 1 if "is_admin" in request.form else 0
-            c.execute("UPDATE users SET username=?, is_admin=? WHERE id=?",
-                      (username, is_admin, user_id))
-            conn.commit()
-            flash("Benutzer geändert!")
-
-    # Alle Benutzer laden
+    # Alle Benutzer laden (GET oder nach POST)
     c.execute("SELECT id, username, is_admin FROM users")
     users_list = c.fetchall()
     conn.close()
 
+    # Direkt rendern, Flash-Messages werden angezeigt
     return render_template("users.html", users=users_list)
 
 if __name__ == "__main__":

srv/poe_manager/static/css/style.css

@@ -1,5 +1,10 @@
 body {
     padding: 20px;
+    background: #3c4346;
+}
+
+h1, h2, h3, h4, h5, h6 {
+    color: #fff;
 }
 
 .table-dark {
@@ -46,3 +51,54 @@ pre {
     color: red;
     font-weight: bold;
 }
+
+.content-wrapper {
+    max-width: 1024px;
+    margin-left: auto;
+    margin-right: auto;
+}
+
+.navbar {
+    display: flex;
+    justify-content: flex-end;
+}
+
+.navbar-container {
+    display: flex;
+    justify-content: space-between; /* Logo links, Navbar rechts */
+    align-items: center;
+    margin-bottom: 1rem;
+}
+
+.navbar-buttons .btn {
+    margin-right: 0.25rem; /* kleine Lücke zwischen Buttons */
+}
+
+.navbar-logo img {
+    display: flex;
+    justify-content: flex-start;
+    height: 60px; /* Logo Höhe, kann angepasst werden */
+}
+
+#log-container {
+    position: relative;
+    height: calc(100vh - 150px); /* Füllt die Seite minus Header */
+}
+
+#log-box {
+    height: 97%;
+    overflow: auto;
+    white-space: pre-wrap;
+    font-family: monospace;
+    border: 1px solid #dee2e6; /* Bootstrap-like border */
+    padding: 1rem;
+    background-color: #f8f9fa;
+}
+
+#refresh-timer {
+    position: absolute;
+    bottom: 10px;
+    right: 10px;
+    font-size: 0.9em;
+    color: gray;
+}

srv/poe_manager/templates/base.html

@@ -7,26 +7,60 @@
 </head>
 <body class="p-4">
 
-<!-- Navbar -->
-<nav class="mb-4">
-    <div class="btn-group" role="group">
-        <a href="{{ url_for('index') }}" class="btn btn-secondary">Dashboard</a>
-        <a href="{{ url_for('devices') }}" class="btn btn-secondary">Devices</a>
-        {% if current_user.is_admin %}
-            <a href="{{ url_for('switches') }}" class="btn btn-secondary">Switches</a>
-            <a href="{{ url_for('users') }}" class="btn btn-secondary">Users</a>
-            <a href="{{ url_for('logs') }}" class="btn btn-secondary">Live-Log</a>
-            <a href="{{ url_for('settings') }}" class="btn btn-secondary">Settings</a>
-        {% endif %}
-        <a href="{{ url_for('logout') }}" class="btn btn-danger">Logout</a>
-    </div>
-</nav>
+<div class="content-wrapper">
+
+    <!-- Logo + Navbar -->
+    <div class="navbar-container">
+        <div class="navbar-logo">
+            <img src="{{ url_for('static', filename='images/logo.png') }}" alt="Logo">
+        </div>
+        <div class="navbar">
+            <div class="navbar-buttons btn-group" role="group">
+                <a href="{{ url_for('index') }}" class="btn btn-secondary">Dashboard</a>
+                <a href="{{ url_for('devices') }}" class="btn btn-secondary">Devices</a>
+                {% if current_user.is_admin %}
+                    <a href="{{ url_for('switches') }}" class="btn btn-secondary">Switches</a>
+                    <a href="{{ url_for('users') }}" class="btn btn-secondary">Users</a>
+                    <a href="{{ url_for('logs') }}" class="btn btn-secondary">Live-Log</a>
+                    <a href="{{ url_for('settings') }}" class="btn btn-secondary">Settings</a>
+                {% endif %}
+                <a href="{{ url_for('logout') }}" class="btn btn-danger">Logout</a>
+            </div>
+        </div>
+    </div>
+
+    <!-- Flash Messages -->
+    {% with messages = get_flashed_messages() %}
+      {% if messages %}
+        <div id="flash-messages" class="mt-2">
+          {% for message in messages %}
+            <div class="alert alert-info alert-dismissible fade show" role="alert">
+              {{ message }}
+              <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
+            </div>
+          {% endfor %}
+        </div>
+      {% endif %}
+    {% endwith %}
+
+    <!-- Content -->
+    <div>
+        {% block content %}{% endblock %}
+    </div>
 
-<!-- Content -->
-<div class="container-fluid">
-    {% block content %}{% endblock %}
 </div>
 
 <script src="{{ url_for('static', filename='js/bootstrap.bundle.min.js') }}"></script>
+<script>
+// Automatisch alle Alerts nach 5 Sekunden ausblenden
+document.addEventListener("DOMContentLoaded", function() {
+    setTimeout(() => {
+        const alerts = document.querySelectorAll('#flash-messages .alert');
+        alerts.forEach(alert => {
+            bootstrap.Alert.getOrCreateInstance(alert).close();
+        });
+    }, 5000);
+});
+</script>
 </body>
 </html>

srv/poe_manager/templates/devices.html

@@ -11,8 +11,6 @@
   {% endif %}
 {% endwith %}
 
-<p>Prüfintervall: <strong>{{ interval }} Minuten</strong></p>
-
 {% if current_user.is_admin %}
 <h4>Neues Gerät hinzufügen</h4>
 <form method="post" class="row g-2 mb-4">

srv/poe_manager/templates/logs.html

@@ -3,11 +3,18 @@
 
 <h2>Live Log</h2>
 
-<div id="log-box" class="border p-3 bg-light" style="height:500px; overflow:auto; white-space: pre-wrap; font-family: monospace;"></div>
+<div id="log-container">
+    <div id="log-box"></div>
+    <div id="refresh-timer">
+        Nächstes Update in <span id="timer"></span> Sekunden
+    </div>
+</div>
 
 <script>
 const intervalMinutes = {{ interval | int }};
 const intervalMilliseconds = intervalMinutes * 60 * 1000;
+let lastUpdateTime = Date.now();
+
 function fetchLog() {
     fetch("{{ url_for('get_log') }}")
         .then(response => response.text())
@@ -19,9 +26,19 @@ function fetchLog() {
                 .join("\n");
             box.innerText = filteredLines;
             box.scrollTop = box.scrollHeight;
+            lastUpdateTime = Date.now();
         })
         .catch(err => console.error("Fehler beim Laden der Logs:", err));
 }
+
+function updateTimer() {
+    const now = Date.now();
+    const remainingMs = intervalMilliseconds - (now - lastUpdateTime);
+    const remainingSec = Math.max(Math.ceil(remainingMs / 1000), 0);
+    document.getElementById("timer").innerText = remainingSec;
+}
+
+setInterval(updateTimer, 1000);
 fetchLog();
 setInterval(fetchLog, intervalMilliseconds);
 </script>

srv/poe_manager/templates/users.html

@@ -5,14 +5,14 @@
 
 {% if current_user.is_admin %}
 <!-- Button Neues User-Popup -->
-<button class="btn btn-success mb-3" data-bs-toggle="modal" data-bs-target="#userModal" onclick="openUserModal()">Neuer Benutzer</button>
+<button class="btn btn-success mb-3" data-bs-toggle="modal" data-bs-target="#userModal" onclick="openUserModal()">Neuen Benutzer</button>
 {% endif %}
 
 <table class="table table-bordered">
     <thead>
         <tr>
             <th>Username</th>
-            <th>Funktion</th>
+            <th>Rolle</th>
             {% if current_user.is_admin %}<th>Aktionen</th>{% endif %}
         </tr>
     </thead>
@@ -23,8 +23,21 @@
             <td>{% if u['is_admin'] %}Admin{% else %}User{% endif %}</td>
             {% if current_user.is_admin %}
             <td>
-                <button class="btn btn-primary btn-sm" data-bs-toggle="modal" data-bs-target="#userModal"
-                    onclick="openUserModal({{ u['id'] }}, '{{ u['username'] }}', {{ u['is_admin'] }})">Bearbeiten</button>
+                <!-- Rolle ändern -->
+                <button class="btn btn-primary btn-sm" data-bs-toggle="modal"
+                        data-bs-target="#roleModal"
+                        onclick="openRoleModal({{ u['id'] }}, '{{ u['username'] }}', {{ u['is_admin'] }})">
+                    Rolle ändern
+                </button>
+
+                <!-- Passwort ändern -->
+                <button class="btn btn-warning btn-sm" data-bs-toggle="modal"
+                        data-bs-target="#passwordModal"
+                        onclick="openPasswordModal({{ u['id'] }}, '{{ u['username'] }}')">
+                    Passwort ändern
+                </button>
+
+                <!-- Benutzer löschen -->
                 <form method="post" style="display:inline;">
                     <button name="delete_user" value="{{ u['id'] }}" class="btn btn-danger btn-sm"
                         onclick="return confirm('Willst du den Benutzer wirklich löschen?');">Löschen</button>
@@ -36,36 +49,95 @@
     </tbody>
 </table>
 
-<!-- Modal -->
+<!-- Modal für neuen Benutzer -->
 <div class="modal fade" id="userModal" tabindex="-1" aria-hidden="true">
   <div class="modal-dialog">
     <div class="modal-content">
       <form method="post" id="userForm">
         <div class="modal-header">
-          <h5 class="modal-title" id="userModalTitle">Benutzer</h5>
+          <h5 class="modal-title">Neuen Benutzer anlegen</h5>
           <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
         </div>
         <div class="modal-body">
-            <input type="hidden" name="user_id" id="user_id">
-            <input type="hidden" name="edit_user" id="edit_user">
             <div class="mb-3">
                 <label>Username</label>
-                <input type="text" name="username" id="modal_username" class="form-control" required>
+                <input type="text" name="username" class="form-control" required>
             </div>
             <div class="mb-3">
                 <label>Passwort</label>
-                <input type="password" name="password" id="modal_password" class="form-control" placeholder="Nur eintragen, wenn Passwort geändert werden soll">
+                <input type="password" name="password" class="form-control" required>
             </div>
             <div class="mb-3">
                 <label>Rolle</label>
-                <select name="is_admin" id="modal_is_admin" class="form-control">
+                <select name="is_admin" class="form-control">
                     <option value="0">User</option>
                     <option value="1">Admin</option>
                 </select>
             </div>
         </div>
         <div class="modal-footer">
-          <button type="submit" class="btn btn-primary">Speichern</button>
+          <button type="submit" name="add_user" value="1" class="btn btn-success">Benutzer anlegen</button>
+          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Abbrechen</button>
+        </div>
+      </form>
+    </div>
+  </div>
+</div>
+
+<!-- Modal für Rolle ändern -->
+<div class="modal fade" id="roleModal" tabindex="-1" aria-hidden="true">
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <form method="post" id="roleForm">
+        <div class="modal-header">
+          <h5 class="modal-title">Rolle ändern</h5>
+          <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
+        </div>
+        <div class="modal-body">
+            <input type="hidden" name="user_id" id="role_user_id">
+            <div class="mb-3">
+                <label>Username</label>
+                <input type="text" name="username" id="role_username" class="form-control" required>
+            </div>
+            <div class="mb-3">
+                <label>Rolle</label>
+                <select name="is_admin" id="role_is_admin" class="form-control">
+                    <option value="0">User</option>
+                    <option value="1">Admin</option>
+                </select>
+            </div>
+        </div>
+        <div class="modal-footer">
+          <button type="submit" name="change_role" value="1" class="btn btn-primary">Rolle ändern</button>
+          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Abbrechen</button>
+        </div>
+      </form>
+    </div>
+  </div>
+</div>
+
+<!-- Modal für Passwort ändern -->
+<div class="modal fade" id="passwordModal" tabindex="-1" aria-hidden="true">
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <form method="post" id="passwordForm">
+        <div class="modal-header">
+          <h5 class="modal-title">Passwort ändern</h5>
+          <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
+        </div>
+        <div class="modal-body">
+            <input type="hidden" name="user_id" id="password_user_id">
+            <div class="mb-3">
+                <label>Username</label>
+                <input type="text" name="username" id ="password_username" class="form-control" readonly>
+            </div>
+            <div class="mb-3">
+                <label>Neues Passwort</label>
+                <input type="password" name="new_password" class="form-control" required>
+            </div>
+        </div>
+        <div class="modal-footer">
+          <button type="submit" name="change_password" value="1" class="btn btn-warning">Passwort ändern</button>
           <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Abbrechen</button>
         </div>
       </form>
@@ -74,13 +146,21 @@
 </div>
 
 <script>
-function openUserModal(id=null, username='', is_admin=0) {
-    document.getElementById('user_id').value = id || '';
-    document.getElementById('modal_username').value = username || '';
-    document.getElementById('modal_password').value = '';
-    document.getElementById('modal_is_admin').value = is_admin;
-    document.getElementById('edit_user').value = id ? 1 : '';
-    document.getElementById('userModalTitle').innerText = id ? 'Benutzer bearbeiten' : 'Neuen Benutzer anlegen';
+function openUserModal() {
+    document.getElementById('userForm').reset();
+}
+
+function openRoleModal(user_id, username, is_admin) {
+    document.getElementById('role_user_id').value = user_id;
+    document.getElementById('role_username').value = username;
+    document.getElementById('role_is_admin').value = is_admin;
+}
+
+function openPasswordModal(user_id, username) {
+    document.getElementById('password_user_id').value = user_id;
+    document.getElementById('password_username').value = username;
+    // Nur das Passwort-Feld zurücksetzen
+    document.querySelector("#passwordForm input[name='new_password']").value = "";
 }
 </script>