Working version before modification.

2026-04-20 21:04:54 +02:00
parent 28d167f11f
commit e7127f3215
30 changed files with 7046 additions and 1201 deletions
@@ -0,0 +1,132 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta name="theme-color" content="#f3efe6" />
+    <title>Check List PoC — User Login</title>
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet" />
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" />
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" rel="stylesheet" />
+    <style>
+      body {
+        font-family: "Inter", "Segoe UI", sans-serif;
+        background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
+        min-height: 100vh;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        padding: 24px;
+      }
+      .login-card {
+        max-width: 400px;
+        width: 100%;
+      }
+      .login-header {
+        text-align: center;
+        margin-bottom: 24px;
+      }
+      .login-header h1 {
+        font-size: 1.5rem;
+        font-weight: 700;
+        margin-bottom: 8px;
+      }
+      .login-header p {
+        color: #6c757d;
+        font-size: 0.9rem;
+      }
+      .alert {
+        display: none;
+      }
+      .alert.show {
+        display: block;
+      }
+    </style>
+  </head>
+  <body>
+    <div class="login-card">
+      <div class="card shadow-sm">
+        <div class="card-body p-4">
+          <div class="login-header">
+            <i class="bi bi-person-circle fs-1 text-primary mb-2 d-block"></i>
+            <h1>User Login</h1>
+            <p>Sign in to access your task workspace</p>
+          </div>
+
+          <div id="errorAlert" class="alert alert-danger" role="alert"></div>
+
+          <form id="loginForm">
+            <div class="mb-3">
+              <label for="email" class="form-label">Email</label>
+              <input type="email" class="form-control" id="email" name="email" required autofocus />
+            </div>
+            <div class="mb-3">
+              <label for="password" class="form-label">Password</label>
+              <input type="password" class="form-control" id="password" name="password" required />
+            </div>
+            <button type="submit" class="btn btn-primary w-100" id="loginBtn">
+              <span id="loginText">Sign In</span>
+              <span id="loginSpinner" class="spinner-border spinner-border-sm d-none" role="status"></span>
+            </button>
+          </form>
+
+          <div class="text-center mt-4">
+            <a href="/" class="text-decoration-none"><i class="bi bi-arrow-left me-1"></i>Back to portal</a>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <script>
+      document.getElementById('loginForm').addEventListener('submit', async (e) => {
+        e.preventDefault();
+
+        const email = document.getElementById('email').value.trim();
+        const password = document.getElementById('password').value;
+        const errorAlert = document.getElementById('errorAlert');
+        const loginBtn = document.getElementById('loginBtn');
+        const loginText = document.getElementById('loginText');
+        const loginSpinner = document.getElementById('loginSpinner');
+
+        /* Hide previous error */
+        errorAlert.classList.remove('show');
+
+        /* Show loading state */
+        loginBtn.disabled = true;
+        loginText.textContent = 'Signing in...';
+        loginSpinner.classList.remove('d-none');
+
+        try {
+          const response = await fetch('/api/v1/auth/user/login', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ email, password })
+          });
+
+          const data = await response.json();
+
+          if (data.success) {
+            /* Store token and user info in sessionStorage */
+            sessionStorage.setItem('auth_token', data.token);
+            sessionStorage.setItem('auth_type', 'user');
+            sessionStorage.setItem('auth_user', JSON.stringify(data.user));
+            /* Redirect to user page with userId */
+            window.location.href = '/user?userId=' + data.user.id;
+          } else {
+            errorAlert.textContent = data.message || 'Login failed. Please check your credentials.';
+            errorAlert.classList.add('show');
+          }
+        } catch (err) {
+          errorAlert.textContent = 'Network error. Please try again.';
+          errorAlert.classList.add('show');
+        } finally {
+          loginBtn.disabled = false;
+          loginText.textContent = 'Sign In';
+          loginSpinner.classList.add('d-none');
+        }
+      });
+    </script>
+  </body>
+</html>