igor/org.ccalm.main
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

+

Browse Source
This commit is contained in:
igor
2024-12-19 08:14:21 +06:00
parent 63e7081516
commit 5abfd87c06
2 changed files with 136 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

166
src/main/resources/templates/login/login.html
View File

@ -1,11 +1,17 @@
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<html xmlns:th="http://www.thymeleaf.org" lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title th:text="${Authorization}">Authorization</title>
<link rel="icon" href="../resources/favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="../resources/engine/css/buttons.css?v=8">
<link rel="stylesheet" href="../resources/engine/normalize.css?v=8">
<link rel="stylesheet" type="text/css" href="../resources/engine/index.css?v=14"/>
<link rel="stylesheet" type="text/css" href="../resources/metadata/dbms/dbms.css?v=14"/>
<script type="text/javascript" src="../translation?v=9"></script>
<script type="text/javascript" src="../resources/metadata/dbms/tools.js?v=14"></script>
<script type="text/javascript" src="../resources/metadata/dbms/window.js?v=14"></script>
<style>
body {
font-family: Arial, sans-serif;
@ -13,6 +19,7 @@
margin: 0;
padding: 0;
display: flex;
flex-direction: column; /* Вертикальная ориентация */
justify-content: center;
align-items: center;
height: 100vh;
@ -79,11 +86,38 @@
margin-top: 10px;
text-align: center;
}
/* Custom style for checkbox */
.checkbox-group {
display: flex;
align-items: center;
}
.checkbox-group input {
margin-right: 8px;
}
.centered-text {
text-align: center;
font-size: 14px;
color: #333;
margin-top: auto; /* Этот стиль заставит блок с .centered-text быть внизу */
}
.centered-text a {
color: #007bff;
text-decoration: none;
}
.centered-text a:hover {
text-decoration: underline;
}
</style>
</head>
<body>
<div class="login-container">
<!-- Форма авторизации -->
<div class="login-container" id="loginForm">
<h2 th:text="${Authorization}">Authorization</h2>
<div>
<div class="form-group">
@ -110,59 +144,115 @@
</div>
</div>
<!-- Форма регистрации -->
<div class="login-container" style="display: none;" id="registrationForm">
<h2 th:text="${Registration}">Registration</h2>
<div>
<div class="form-group">
<label for="3_country_id"><span th:text="${Country}">Country</span> *</label>
<input type="text" id="3_country_id" name="country" maxlength="50" placeholder="Country">
</div>
<div class="form-group">
<label for="3_lastname"><span th:text="${Surname}">Surname</span></label>
<input type="text" id="3_lastname" name="lastname" maxlength="50" placeholder="Surname">
</div>
<div class="form-group">
<label for="3_firstname"><span th:text="${Name}">Name</span> *</label>
<input type="text" id="3_firstname" name="firstname" maxlength="50" placeholder="Name">
</div>
<div class="form-group">
<label for="3_company"><span th:text="${Company}">Company</span></label>
<input type="text" id="3_company" name="company" maxlength="50" placeholder="Company">
</div>
<div class="form-group">
<label for="3_position"><span th:text="${Position}">Position</span></label>
<input type="text" id="3_position" name="position" maxlength="50" placeholder="Position">
</div>
<div class="form-group">
<label for="3_phone"><span th:text="${Phone}">Phone</span></label>
<input type="text" id="3_phone" name="phone" maxlength="50" placeholder="Phone">
</div>
<div class="form-group">
<label for="3_email"><span th:text="${E_mail}">Email</span> *</label>
<input type="text" id="3_email" name="email" maxlength="50" placeholder="E-mail">
</div>
<!-- Checkbox for Privacy Policy -->
<div class="form-group checkbox-group">
<input type="checkbox" id="privacyPolicy" onclick="toggleRegisterButton()">
<label for="privacyPolicy">
Я согласен с <a href="#">политикой конфиденциальности</a>
</label>
</div>
<div class="form-group">
<button id="registerBtn" class="button" th:text="${Registration}" disabled>Registration</button>
</div>
<div class="progress-bar" id="progressBar2">
<span>Загрузка...</span>
</div>
</div>
</div>
<!-- Password recovery -->
<div class="login-container" style="display: none;" id="registrationForm">
<h2 th:text="${Password_recovery}">Password_recovery</h2>
<div>
</div>
</div>
<!-- Ссылки для переключения -->
<div class="centered-text">
<p><a href="#" onclick="showForm(1);" th:text="${Authorization}">Authorization</a></p>
<p><a href="#" onclick="showForm(2);" th:text="${Create_a_new_user}">Create a new user</a></p>
<p><a href="#" onclick="showForm(3);" th:text="${Password_recovery}">Password recovery</a></p>
<p><a href="#" onclick="showForm(4);" th:text="${Change_password}">Change password</a></p>
<p><a href="#" onclick="showForm(5);" th:text="${Get_new_TOTP_key}">Get new TOTP key</a></p>
</div>
<script>
// Функция для отправки данных на сервер
function postJsonData(url, data, callback) {
fetch(url, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(data)
})
.then(response => response.json())
.then(data => callback(true, data))
.catch(error => {
console.error('Error:', error);
callback(false, { error_message: 'Что-то пошло не так. Попробуйте еще раз.' });
});
// Функция для отображения формы авторизации
function showForm(num) {
document.getElementById('loginForm').style.display = num === 1 ? 'block' : 'none';
document.getElementById('registrationForm').style.display = num === 2 ? 'block' : 'none';
}
// Функция для включения/выключения кнопки регистрации в зависимости от состояния галочки
function toggleRegisterButton() {
const checkbox = document.getElementById('privacyPolicy');
const registerBtn = document.getElementById('registerBtn');
registerBtn.disabled = !checkbox.checked;
}
// Функция для обработки авторизации
function authorizeUser() {
const login = document.getElementById('login0').value;
const password = document.getElementById('password0').value;
const obj = {
login: login,
password: password,
appid: 'ccalm'
};
// Отправляем запрос на сервер для авторизации
const obj = { login, password, appid: 'ccalm' };
postJsonData('/api/authorization/v02/login', obj, (ok, data) => {
if (ok) {
if (data.error_code == 0) {
window.location.href = "/engine";
} else {
alert2(trt('Alert'), data.error_message);
alert2(trt('Alert'), trt(data.error_message));
}
}else{
alert2(trt('Error'),data);
} else {
alert2(trt('Alert'), trt('Error: Unable to authorize.'));
}
document.getElementById('progressBar').style.display = 'none'; // Скрываем прогресс-бар
});
document.getElementById('progressBar').style.display = 'block';
}
// Функция для восстановления пароля
function showRestoreForm() {
alert('Форма восстановления пароля будет здесь!');
}
// Обработчик клика на кнопку "Войти"
document.getElementById('loginBtn').onclick = authorizeUser;
// Изначально показываем форму авторизации
showLoginForm();
</script>
</body>