AkurAI-CRM / site/frontend/index.html

Latest change d7881502b38897a157bd49340f35ea33e81cbaa7 - feat: initial AkurAI-CRM implementation by Ólafur B. J.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Sign in — AkurAI-CRM</title>
  <link rel="stylesheet" href="styles.css">
</head>
<body>
  <div class="login-page">
    <div class="login-card slide-up">
      <div class="login-brand">
        <div class="brand-icon">A</div>
        <h1>AkurAI-CRM</h1>
        <p>Sign in to your workspace</p>
      </div>

      <div class="login-error" id="login-error"></div>

      <form id="login-form" onsubmit="return false;">
        <div class="form-group">
          <label class="form-label" for="email">Email address</label>
          <input class="form-input" type="email" id="email" placeholder="you@company.com" required autocomplete="email">
        </div>
        <div class="form-group">
          <label class="form-label" for="password">Password</label>
          <input class="form-input" type="password" id="password" placeholder="Enter your password" required autocomplete="current-password">
        </div>
        <button class="btn btn-primary btn-lg" type="submit" style="width:100%;justify-content:center;margin-top:var(--space-2);" id="signin-btn">
          Sign in
        </button>
      </form>

      <div class="login-footer">
        Don't have an account? <a href="/signup.html">Sign up</a>
      </div>
    </div>
  </div>

  <div class="toast-container" id="toast-container"></div>

  <script type="module">
    import { showToast } from './app.js';

    document.getElementById('login-form').addEventListener('submit', async (e) => {
      e.preventDefault();
      const btn = document.getElementById('signin-btn');
      const email = document.getElementById('email').value;
      const password = document.getElementById('password').value;
      const errorEl = document.getElementById('login-error');

      btn.disabled = true;
      btn.textContent = 'Signing in...';

      errorEl.style.display = 'none';

      try {
        const res = await fetch('/api/auth/login', {
          method: 'POST',
          headers: { 'Content-Type': 'application/json' },
          body: JSON.stringify({ email, password }),
        });
        if (!res.ok) {
          const data = await res.json().catch(() => ({}));
          throw new Error(data.message || 'Invalid email or password');
        }
        window.location.href = '/dashboard.html';
      } catch (err) {
        errorEl.textContent = err.message;
        errorEl.style.display = 'block';
        showToast(err.message, 'error');
        btn.disabled = false;
        btn.textContent = 'Sign in';
      }
    });
  </script>
</body>
</html>