131 lines
4.4 KiB
JavaScript
131 lines
4.4 KiB
JavaScript
/**
|
||
* LogBoard+ - Скрипт страницы входа
|
||
* Автор: Сергей Антропов
|
||
* Сайт: https://devops.org.ru
|
||
*/
|
||
|
||
/**
|
||
* Инициализация переключателя темы
|
||
* Загружает сохраненную тему из localStorage и настраивает переключатель
|
||
*/
|
||
(function initTheme(){
|
||
const saved = localStorage.lb_theme || 'dark';
|
||
document.documentElement.setAttribute('data-theme', saved);
|
||
document.getElementById('themeSwitch').checked = (saved==='light');
|
||
document.getElementById('themeSwitch').addEventListener('change', ()=>{
|
||
const t = document.getElementById('themeSwitch').checked ? 'light' : 'dark';
|
||
document.documentElement.setAttribute('data-theme', t);
|
||
localStorage.lb_theme = t;
|
||
});
|
||
})();
|
||
|
||
/**
|
||
* Обработчик переключения видимости пароля
|
||
* Показывает/скрывает пароль и меняет иконку
|
||
*/
|
||
document.getElementById('passwordToggle').addEventListener('click', function() {
|
||
const passwordInput = document.getElementById('password');
|
||
const icon = this.querySelector('i');
|
||
|
||
if (passwordInput.type === 'password') {
|
||
passwordInput.type = 'text';
|
||
icon.className = 'fas fa-eye-slash';
|
||
} else {
|
||
passwordInput.type = 'password';
|
||
icon.className = 'fas fa-eye';
|
||
}
|
||
});
|
||
|
||
/**
|
||
* Обработчик отправки формы входа
|
||
* Выполняет аутентификацию пользователя через API
|
||
*/
|
||
document.getElementById('loginForm').addEventListener('submit', async function(e) {
|
||
e.preventDefault();
|
||
|
||
const username = document.getElementById('username').value.trim();
|
||
const password = document.getElementById('password').value;
|
||
const loginButton = document.getElementById('loginButton');
|
||
const buttonText = document.getElementById('buttonText');
|
||
const loadingSpinner = document.getElementById('loadingSpinner');
|
||
const errorMessage = document.getElementById('errorMessage');
|
||
|
||
// Validation
|
||
if (!username || !password) {
|
||
showError('Пожалуйста, заполните все поля');
|
||
return;
|
||
}
|
||
|
||
// Show loading state
|
||
loginButton.disabled = true;
|
||
buttonText.textContent = 'Вход...';
|
||
loadingSpinner.classList.add('show');
|
||
hideError();
|
||
|
||
try {
|
||
const response = await fetch('/api/auth/login', {
|
||
method: 'POST',
|
||
headers: {
|
||
'Content-Type': 'application/json',
|
||
},
|
||
body: JSON.stringify({
|
||
username: username,
|
||
password: password
|
||
})
|
||
});
|
||
|
||
if (response.ok) {
|
||
const data = await response.json();
|
||
|
||
// Store token in localStorage
|
||
localStorage.setItem('access_token', data.access_token);
|
||
|
||
// Redirect to main page
|
||
window.location.href = '/';
|
||
} else {
|
||
const errorData = await response.json();
|
||
showError(errorData.detail || 'Ошибка входа в систему');
|
||
}
|
||
} catch (error) {
|
||
console.error('Login error:', error);
|
||
showError('Ошибка соединения с сервером');
|
||
} finally {
|
||
// Reset loading state
|
||
loginButton.disabled = false;
|
||
buttonText.textContent = 'Войти';
|
||
loadingSpinner.classList.remove('show');
|
||
}
|
||
});
|
||
|
||
/**
|
||
* Показывает сообщение об ошибке
|
||
* @param {string} message - Текст ошибки
|
||
*/
|
||
function showError(message) {
|
||
const errorMessage = document.getElementById('errorMessage');
|
||
errorMessage.textContent = message;
|
||
errorMessage.classList.add('show');
|
||
}
|
||
|
||
/**
|
||
* Скрывает сообщение об ошибке
|
||
*/
|
||
function hideError() {
|
||
const errorMessage = document.getElementById('errorMessage');
|
||
errorMessage.classList.remove('show');
|
||
}
|
||
|
||
/**
|
||
* Автофокус на поле имени пользователя при загрузке страницы
|
||
*/
|
||
document.addEventListener('DOMContentLoaded', function() {
|
||
document.getElementById('username').focus();
|
||
});
|
||
|
||
// Handle Enter key in password field
|
||
document.getElementById('password').addEventListener('keypress', function(e) {
|
||
if (e.key === 'Enter') {
|
||
document.getElementById('loginForm').dispatchEvent(new Event('submit'));
|
||
}
|
||
});
|