82 lines
3.9 KiB
HTML
82 lines
3.9 KiB
HTML
{% extends 'base.html' %}
|
||
|
||
{% block title %}Настройка на Двуфакторна Автентификация - Официален Портал{% endblock %}
|
||
|
||
{% block content %}
|
||
<div class="form-container">
|
||
<h2>Настройка на Двуфакторна Автентификация</h2>
|
||
|
||
{% if mfa_enabled %}
|
||
<div class="gov-alert gov-alert-info">
|
||
<div class="alert-icon">ℹ</div>
|
||
<div class="alert-content">
|
||
<p>Двуфакторната автентификация вече е активирана за вашия акаунт.</p>
|
||
<a href="{% url 'accounts:mfa_disable' %}" class="btn btn-danger" style="margin-top: 1rem;">Деактивиране</a>
|
||
</div>
|
||
</div>
|
||
{% else %}
|
||
<div class="mfa-setup-steps">
|
||
<div class="step">
|
||
<h3>Стъпка 1: Инсталиране на Приложение за Автентификация</h3>
|
||
<p>Ако все още нямате такова, инсталирайте приложение за автентификация на вашето мобилно устройство:</p>
|
||
<ul>
|
||
<li><strong>Google Authenticator</strong> (iOS, Android)</li>
|
||
<li><strong>Microsoft Authenticator</strong> (iOS, Android)</li>
|
||
<li><strong>Authy</strong> (iOS, Android)</li>
|
||
<li><strong>1Password</strong> (iOS, Android, Desktop)</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="step">
|
||
<h3>Стъпка 2: Сканиране на QR Код</h3>
|
||
<p>Отворете вашето приложение за автентификация и сканирайте този QR код:</p>
|
||
{% if qr_code %}
|
||
<div class="qr-code-container">
|
||
<img src="{{ qr_code }}" alt="QR Code" class="qr-code">
|
||
</div>
|
||
<div class="secret-key">
|
||
<p><strong>Или въведете този ключ ръчно:</strong></p>
|
||
<div class="secret-code">{{ secret_key }}</div>
|
||
<button type="button" class="btn btn-sm btn-secondary" onclick="copySecretKey('{{ secret_key }}')" style="margin-top: 1rem;" data-tooltip="Копиране на секретния ключ">
|
||
Копиране на Ключ
|
||
</button>
|
||
</div>
|
||
{% else %}
|
||
<p>Генериране на QR код...</p>
|
||
{% endif %}
|
||
</div>
|
||
|
||
<div class="step">
|
||
<h3>Стъпка 3: Потвърждаване на Настройката</h3>
|
||
<p>Въведете 6-цифрения код от вашето приложение за автентификация, за да потвърдите настройката:</p>
|
||
<div style="text-align: center; margin-top: 1.5rem;">
|
||
<a href="{% url 'accounts:mfa_enable' %}" class="btn btn-primary" data-tooltip="Продължете към страницата за потвърждаване">Продължи към Потвърждаване</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
{% endif %}
|
||
|
||
<div class="form-actions">
|
||
<a href="{% url 'accounts:profile' %}" class="btn btn-secondary">Обратно към Профил</a>
|
||
</div>
|
||
</div>
|
||
|
||
<script>
|
||
function copySecretKey(key) {
|
||
navigator.clipboard.writeText(key).then(function() {
|
||
if (typeof Toast !== 'undefined') {
|
||
Toast.success('Секретният ключ е копиран в клипборда!');
|
||
} else {
|
||
alert('Секретният ключ е копиран в клипборда!');
|
||
}
|
||
}, function(err) {
|
||
console.error('Failed to copy: ', err);
|
||
if (typeof Toast !== 'undefined') {
|
||
Toast.error('Неуспешно копиране. Моля, копирайте ръчно.');
|
||
}
|
||
});
|
||
}
|
||
</script>
|
||
{% endblock %}
|
||
|