initial project commit

web/templates/admin/users.html

@@ -0,0 +1,139 @@
+{% extends 'base.html' %} {% block content %}
+<div id="users">
+  <h2>Users</h2>
+  <form id="user-form" method="post" action="{{ url_for('admin_users') }}">
+    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />
+    <table>
+      <thead>
+        <tr>
+          <th>ID</th>
+          <th>Username</th>
+          <th>Admin</th>
+          <th>Active</th>
+          <th colspan="2">Password</th>
+          <th>Created</th>
+          <th>Last Login</th>
+          <th></th>
+        </tr>
+      </thead>
+      <tbody>
+        {% for u in users %}
+        <tr class="user-row" data-user-id="{{ u.user_id }}">
+          <td>
+            {{ u.user_id }}<input
+              type="hidden"
+              name="user_id"
+              value="{{ u.user_id }}"
+            />
+          </td>
+          <td>
+            <input
+              type="text"
+              name="username"
+              value="{{ u.username }}"
+              required
+            />
+          </td>
+          <td>
+            <input type="checkbox" name="is_admin" {{ 'checked' if u.is_admin
+            else '' }} />
+          </td>
+          <td>
+            <input type="checkbox" name="is_active" {{ 'checked' if u.is_active
+            else '' }} />
+          </td>
+          <td>{{ '✅' if u.has_password else '❌' }}</td>
+          <td><input type="password" name="password" /></td>
+          <td>{{ u.created_at }}</td>
+          <td>{{ u.last_login or 'never' }}</td>
+          <td>
+            <button type="submit" data-user-id="{{ u.user_id }}">Save</button>
+          </td>
+        </tr>
+        {% endfor %}
+      </tbody>
+    </table>
+  </form>
+</div>
+<h3>Create / Update User</h3>
+<form
+  id="create-update-user-form"
+  method="post"
+  action="{{ url_for('admin_users') }}"
+>
+  <input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />
+  <label>Username <input type="text" name="username" required /></label>
+  <label>Password <input type="password" name="password" /></label>
+  <label>Admin <input type="checkbox" name="is_admin" value="1" /></label>
+  <label
+    >Active <input type="checkbox" name="is_active" value="1" checked
+  /></label>
+  <button type="submit">Save</button>
+</form>
+{% endblock %} {% block footer_scripts %}
+<script>
+  function updateUser(userId) {
+    const row = document.querySelector(`.user-row[data-user-id="${userId}"]`);
+    const passwordInput = row.querySelector('input[name="password"]');
+    const hasPassword =
+      row.querySelector("td:nth-child(5)").textContent.trim() === "✅";
+    const formData = row.querySelector("form").elements;
+    const username = formData.username.value;
+    const password = hasPassword ? passwordInput.value : undefined;
+    const isAdmin = formData.is_admin.checked;
+    const isActive = formData.is_active.checked;
+
+    fetch("/admin/users", {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify({
+        user_id: userId,
+        password: password,
+        username: username,
+        is_admin: isAdmin,
+        is_active: isActive,
+        csrf_token: formData.csrf_token.value,
+      }),
+    })
+      .then((response) => {
+        if (response.ok) {
+          alert("User updated successfully");
+          // Clear the password field after successful update
+          passwordInput.value = "";
+        } else {
+          alert("Error updating user");
+        }
+      })
+      .catch((error) => {
+        console.error("Error:", error);
+        alert("Error updating user");
+      });
+  }
+
+  function initUserForm() {
+    const form = document.getElementById("user-form");
+    const createUpdateForm = document.getElementById("create-update-user-form");
+
+    form.addEventListener("submit", function (event) {
+      const userId = event.target.querySelector('input[name="user_id"]').value;
+      event.preventDefault(); // Prevent the default form submission
+      updateUser(userId);
+    });
+
+    form.addEventListener("click", function (event) {
+      const userId = event.target.closest(".user-row").dataset.userId;
+      updateUser(userId);
+    });
+
+    createUpdateForm.addEventListener("submit", function (event) {
+      const passwordInput = createUpdateForm.querySelector(
+        'input[name="password"]'
+      );
+    });
+  }
+
+  initUserForm();
+</script>
+{% endblock %}