110 lines
8.4 KiB
HTML
110 lines
8.4 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||
<title>Вход — ПАБ</title>
|
||
<style>
|
||
*{box-sizing:border-box;margin:0;padding:0}
|
||
body{font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,system-ui,sans-serif;display:flex;align-items:center;justify-content:center;min-height:100vh;background:linear-gradient(135deg,#0F1218 0%,#1a2332 100%)}
|
||
.card{background:#fff;padding:44px 36px;border-radius:14px;width:100%;max-width:400px;box-shadow:0 8px 40px rgba(0,0,0,0.25)}
|
||
.logo{text-align:center;margin-bottom:28px}
|
||
.logo .icon{font-size:44px;display:block;margin-bottom:6px}
|
||
.logo h1{font-size:19px;font-weight:800;color:#0F1218}
|
||
.logo p{font-size:13px;color:#5B6573;margin-top:3px}
|
||
input{width:100%;padding:12px;margin-bottom:14px;border:2px solid #E2E6EB;border-radius:8px;font-size:14px;font-family:inherit;outline:none;transition:border-color .2s}
|
||
input:focus{border-color:#00B4D8}
|
||
button{width:100%;padding:12px;background:#00B4D8;color:#fff;border:none;border-radius:8px;font-size:15px;font-weight:700;cursor:pointer;font-family:inherit;transition:background .2s}
|
||
button:hover{background:#48CAE4}
|
||
.err{color:#E63946;font-size:13px;text-align:center;display:none;margin-top:10px}
|
||
.info{text-align:center;margin-top:16px;font-size:12px;color:#5B6573}
|
||
.info a{color:#00B4D8;text-decoration:none;font-weight:600;cursor:pointer}
|
||
.info a:hover{text-decoration:underline}
|
||
#regForm{display:none;margin-top:12px}
|
||
#regForm.show{display:block}
|
||
#regForm input,#regForm select{margin-bottom:10px}
|
||
.green{background:#EDF7F0;border:1px solid #2D6A4F;color:#2D6A4F;padding:10px;border-radius:8px;font-size:13px;text-align:center;display:none;margin-top:10px;font-weight:600}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="card" id="loginCard">
|
||
<div class="logo"><span class="icon">🛡️</span><h1>Поведенческий аудит безопасности</h1><p>Система ПАБ</p></div>
|
||
<input type="text" id="loginUser" placeholder="Логин" autocomplete="username">
|
||
<input type="password" id="loginPass" placeholder="Пароль">
|
||
<button id="loginBtn">Войти</button>
|
||
<div class="err" id="loginError">Неверный логин или пароль</div>
|
||
<div class="info"><a onclick="document.getElementById('regForm').classList.toggle('show');this.textContent=document.getElementById('regForm').classList.contains('show')?'Скрыть регистрацию':'Зарегистрироваться'">Зарегистрироваться</a></div>
|
||
<div id="regForm">
|
||
<input type="text" id="regLogin" placeholder="Придумайте логин">
|
||
<input type="password" id="regPass" placeholder="Придумайте пароль (мин. 3 символа)">
|
||
<input type="text" id="regName" placeholder="ФИО">
|
||
<input type="email" id="regEmail" placeholder="Email">
|
||
<select id="regRole" style="width:100%;padding:10px;border:2px solid #E2E6EB;border-radius:8px;font-size:13px;margin-bottom:10px;font-family:inherit"><option value="">-- Должность --</option><option>Директор департамента ЦА</option><option>Директор департамента филиала</option><option>Региональный директор филиала</option><option>Директор ДЭСД</option><option>Начальник ТУСМ</option><option>Руководитель структурного подразделения</option><option>Начальник центра/службы/цеха</option><option>Начальник участка</option><option>Инженер БиОТ</option><option>Работник отдела БиОТ</option><option>Сотрудник</option></select>
|
||
<input type="text" id="regBranch" placeholder="Филиал (АО «Казахтелеком»)">
|
||
<input type="text" id="regDept" placeholder="Подразделение (ЦТО МС)">
|
||
<input type="text" id="regRegion" placeholder="Регион (Алматинский)">
|
||
<input type="text" id="regOblast" placeholder="Область">
|
||
<input type="text" id="regCity" placeholder="Город / село">
|
||
<button id="regBtn">Зарегистрироваться</button>
|
||
<div class="err" id="regError"></div>
|
||
<div class="green" id="regSuccess">Регистрация успешна! Теперь войдите.</div>
|
||
</div>
|
||
</div>
|
||
<script>
|
||
document.getElementById('loginBtn').onclick = function(){
|
||
var u = document.getElementById('loginUser').value.trim().toLowerCase();
|
||
var p = document.getElementById('loginPass').value.trim();
|
||
var err = document.getElementById('loginError');
|
||
if (u === 'admin' && p === 'admin') {
|
||
sessionStorage.setItem('pab_user', JSON.stringify({login:'admin',name:'Администратор',role:'Руководитель',email:'admin@telecom.kz',branch:'АО «Казахтелеком»',dept:'ЦА',region:'Центральный',oblast:'—',city:'г. Астана'}));
|
||
window.location.href = 'app.html';
|
||
return;
|
||
}
|
||
var users = {};
|
||
try { users = JSON.parse(localStorage.getItem('pab_users') || '{}'); } catch(e) {}
|
||
if (users[u] && users[u].pass === p) {
|
||
sessionStorage.setItem('pab_user', JSON.stringify({login:u,name:users[u].name,role:users[u].role,email:users[u].email||'',branch:users[u].branch||'',dept:users[u].dept||'',region:users[u].region||'',oblast:users[u].oblast||'',city:users[u].city||''}));
|
||
window.location.href = 'app.html';
|
||
return;
|
||
}
|
||
err.style.display = 'block';
|
||
};
|
||
document.getElementById('loginPass').onkeydown = function(e){ if(e.key==='Enter') document.getElementById('loginBtn').onclick(); };
|
||
document.getElementById('regBtn').onclick = function(){
|
||
var login = document.getElementById('regLogin').value.trim().toLowerCase();
|
||
var pass = document.getElementById('regPass').value.trim();
|
||
var name = document.getElementById('regName').value.trim();
|
||
var email = document.getElementById('regEmail').value.trim();
|
||
var role = document.getElementById('regRole').value;
|
||
var branch = document.getElementById('regBranch').value.trim();
|
||
var dept = document.getElementById('regDept').value.trim();
|
||
var region = document.getElementById('regRegion').value.trim();
|
||
var oblast = document.getElementById('regOblast').value.trim();
|
||
var city = document.getElementById('regCity').value.trim();
|
||
var err = document.getElementById('regError'), ok = document.getElementById('regSuccess'); ok.style.display = 'none';
|
||
if (!login || login.length < 2) { err.textContent = 'Логин минимум 2 символа'; err.style.display = 'block'; return; }
|
||
if (!pass || pass.length < 3) { err.textContent = 'Пароль минимум 3 символа'; err.style.display = 'block'; return; }
|
||
if (!name) { err.textContent = 'Укажите ФИО'; err.style.display = 'block'; return; }
|
||
if (!role) { err.textContent = 'Выберите должность'; err.style.display = 'block'; return; }
|
||
if (!email || email.indexOf('@') < 0) { err.textContent = 'Укажите Email'; err.style.display = 'block'; return; }
|
||
if (!branch) { err.textContent = 'Укажите филиал'; err.style.display = 'block'; return; }
|
||
if (!region) { err.textContent = 'Укажите регион'; err.style.display = 'block'; return; }
|
||
if (!city) { err.textContent = 'Укажите город'; err.style.display = 'block'; return; }
|
||
if (!dept) { err.textContent = 'Укажите подразделение'; err.style.display = 'block'; return; }
|
||
var users = {};
|
||
try { users = JSON.parse(localStorage.getItem('pab_users') || '{}'); } catch(e) {}
|
||
if (users[login]) { err.textContent = 'Логин занят'; err.style.display = 'block'; return; }
|
||
err.style.display = 'none';
|
||
users[login] = {pass:pass,name:name,email:email,role:role,branch:branch,dept:dept,region:region,oblast:oblast,city:city};
|
||
localStorage.setItem('pab_users', JSON.stringify(users));
|
||
ok.style.display = 'block';
|
||
document.getElementById('loginUser').value = login;
|
||
document.getElementById('regLogin').value = ''; document.getElementById('regPass').value = ''; document.getElementById('regName').value = ''; document.getElementById('regEmail').value = '';
|
||
document.getElementById('regBranch').value = ''; document.getElementById('regDept').value = ''; document.getElementById('regRegion').value = ''; document.getElementById('regOblast').value = ''; document.getElementById('regCity').value = '';
|
||
document.getElementById('regForm').classList.remove('show');
|
||
setTimeout(function(){ ok.style.display = 'none'; }, 3000);
|
||
};
|
||
</script>
|
||
</body>
|
||
</html>
|