94 lines
3.9 KiB
HTML
94 lines
3.9 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru" data-theme="auto">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||
<title>Вход в систему</title>
|
||
<link rel="icon" href="design-system/brand/kt-ai-logo.png">
|
||
<link rel="stylesheet" href="design-system/kt-ai-fonts.css">
|
||
<link rel="stylesheet" href="design-system/kt-ai-tokens.css">
|
||
<link rel="stylesheet" href="design-system/kt-ai-components.css">
|
||
<link rel="stylesheet" href="design-system/kt-ai-page.css">
|
||
<style>
|
||
.login-page { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: var(--kt-ai-bg); }
|
||
.login-card { width: 100%; max-width: 400px; padding: var(--kt-ai-space-8); }
|
||
.login-logo { text-align: center; margin-bottom: var(--kt-ai-space-6); }
|
||
.login-logo img { width: 48px; height: 48px; border-radius: var(--kt-ai-radius-xl); margin-bottom: var(--kt-ai-space-3); }
|
||
.login-logo h1 { font-size: var(--kt-ai-text-xl); font-weight: var(--kt-ai-weight-semibold); margin: 0; }
|
||
.login-logo p { font-size: var(--kt-ai-text-sm); color: var(--kt-ai-fg-muted); margin-top: var(--kt-ai-space-2); }
|
||
.login-form { display: flex; flex-direction: column; gap: var(--kt-ai-space-4); }
|
||
.login-hint { margin-top: var(--kt-ai-space-4); font-size: var(--kt-ai-text-xs); color: var(--kt-ai-fg-muted); text-align: center; }
|
||
.login-hint code { background: var(--kt-ai-bg-soft); padding: 2px 6px; border-radius: var(--kt-ai-radius-md); }
|
||
.error-msg { color: var(--kt-ai-status-risk-fg); font-size: var(--kt-ai-text-sm); margin-top: var(--kt-ai-space-2); display: none; }
|
||
.error-msg.visible { display: block; }
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="login-page">
|
||
<div class="login-card">
|
||
<div class="login-logo">
|
||
<img src="design-system/brand/kt-ai-logo.png" alt="KT AI">
|
||
<h1>Реестр приказов АО</h1>
|
||
<p>Войдите для продолжения</p>
|
||
</div>
|
||
<form class="login-form" id="loginForm">
|
||
<div class="kt-ai-field">
|
||
<label class="kt-ai-label">Логин</label>
|
||
<input class="kt-ai-input" name="login" placeholder="Введите логин" required autocomplete="username">
|
||
</div>
|
||
<div class="kt-ai-field">
|
||
<label class="kt-ai-label">Пароль</label>
|
||
<input class="kt-ai-input" name="password" type="password" placeholder="Введите пароль" required autocomplete="current-password">
|
||
</div>
|
||
<button class="kt-ai-btn" data-variant="primary" type="submit" style="width:100%;justify-content:center">
|
||
Войти
|
||
</button>
|
||
<div class="error-msg" id="errorMsg"></div>
|
||
</form>
|
||
<div class="login-hint">
|
||
Тестовые пользователи:<br>
|
||
<code>admin / admin123</code> • <code>user / user123</code> • <code>filial / filial123</code>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script src="design-system/icons/kt-ai-icons.js"></script>
|
||
<script>
|
||
document.getElementById('loginForm').addEventListener('submit', async (e) => {
|
||
e.preventDefault();
|
||
const form = e.target;
|
||
const errorEl = document.getElementById('errorMsg');
|
||
const btn = form.querySelector('button[type="submit"]');
|
||
|
||
btn.disabled = true;
|
||
btn.textContent = 'Вход...';
|
||
errorEl.classList.remove('visible');
|
||
|
||
try {
|
||
const res = await fetch('/api/login', {
|
||
method: 'POST',
|
||
headers: { 'Content-Type': 'application/json' },
|
||
body: JSON.stringify({
|
||
login: form.login.value,
|
||
password: form.password.value
|
||
})
|
||
});
|
||
const data = await res.json();
|
||
if (data.ok) {
|
||
window.location.href = '/';
|
||
} else {
|
||
errorEl.textContent = data.error || 'Ошибка входа';
|
||
errorEl.classList.add('visible');
|
||
}
|
||
} catch (err) {
|
||
errorEl.textContent = 'Ошибка подключения к серверу';
|
||
errorEl.classList.add('visible');
|
||
}
|
||
|
||
btn.disabled = false;
|
||
btn.textContent = 'Войти';
|
||
});
|
||
</script>
|
||
</body>
|
||
</html>
|