- Add django-otp and qrcode dependencies - Create comprehensive 2FA views and templates in German - Add 2FA setup, verification, and management interfaces - Implement backup token system with 10 recovery codes - Add TwoFactorMiddleware for session enforcement - Integrate 2FA controls into user navigation menu - Support QR code generation for authenticator apps - Add forms for secure 2FA operations with validation - Configure OTP settings and admin site integration Features: - Optional 2FA (users can enable/disable) - TOTP compatible with Google Authenticator, Authy, etc. - Backup codes for emergency access - German language interface - Session-based 2FA enforcement - Password confirmation for sensitive operations - Production-ready with HTTPS support
146 lines
7.6 KiB
HTML
146 lines
7.6 KiB
HTML
{% extends "base.html" %}
|
|
{% load static %}
|
|
|
|
{% block title %}{{ title }}{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="container-fluid">
|
|
<div class="row justify-content-center">
|
|
<div class="col-md-8">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h4 class="mb-0">
|
|
<i class="fas fa-key text-primary"></i>
|
|
Backup-Codes verwalten
|
|
</h4>
|
|
</div>
|
|
<div class="card-body">
|
|
{% if has_tokens %}
|
|
<div class="alert alert-info">
|
|
<h6><i class="fas fa-info-circle"></i> Backup-Codes Status</h6>
|
|
<p class="mb-0">
|
|
Sie haben derzeit <strong>{{ token_count }} Backup-Codes</strong> verfügbar.
|
|
Aus Sicherheitsgründen werden die Codes nicht angezeigt.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<h5>Neue Backup-Codes generieren</h5>
|
|
<p class="text-muted">
|
|
Wenn Sie neue Backup-Codes benötigen (z.B. weil Sie alle verbraucht haben
|
|
oder sie verloren haben), können Sie neue generieren.
|
|
</p>
|
|
|
|
<div class="alert alert-warning small">
|
|
<strong>Warnung:</strong> Das Generieren neuer Codes macht alle
|
|
bisherigen Backup-Codes ungültig.
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-6">
|
|
<h5>Passwort eingeben</h5>
|
|
<p class="text-muted">
|
|
Geben Sie Ihr Passwort ein, um neue Backup-Codes zu generieren:
|
|
</p>
|
|
|
|
<form method="post">
|
|
{% csrf_token %}
|
|
<input type="hidden" name="regenerate" value="1">
|
|
|
|
<div class="mb-3">
|
|
<label for="password" class="form-label">Passwort</label>
|
|
<input type="password"
|
|
class="form-control"
|
|
id="password"
|
|
name="password"
|
|
required
|
|
autocomplete="current-password">
|
|
</div>
|
|
|
|
<div class="d-grid">
|
|
<button type="submit" class="btn btn-warning">
|
|
<i class="fas fa-sync-alt"></i>
|
|
Neue Backup-Codes generieren
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
{% else %}
|
|
<div class="alert alert-warning">
|
|
<h6><i class="fas fa-exclamation-triangle"></i> Keine Backup-Codes vorhanden</h6>
|
|
<p class="mb-0">
|
|
Sie haben derzeit keine Backup-Codes. Das kann passieren, wenn:
|
|
</p>
|
|
<ul class="mb-0 mt-2">
|
|
<li>Sie alle Codes bereits verwendet haben</li>
|
|
<li>Die Zwei-Faktor-Authentifizierung neu eingerichtet wurde</li>
|
|
<li>Die Codes aus anderen Gründen gelöscht wurden</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<h5>Neue Backup-Codes generieren</h5>
|
|
<p class="text-muted">
|
|
Generieren Sie neue Backup-Codes, um sicherzustellen, dass Sie
|
|
auch ohne Authenticator-App auf Ihr Konto zugreifen können.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="col-md-6">
|
|
<h5>Passwort eingeben</h5>
|
|
|
|
<form method="post">
|
|
{% csrf_token %}
|
|
<input type="hidden" name="regenerate" value="1">
|
|
|
|
<div class="mb-3">
|
|
<label for="password" class="form-label">Passwort</label>
|
|
<input type="password"
|
|
class="form-control"
|
|
id="password"
|
|
name="password"
|
|
required
|
|
autocomplete="current-password">
|
|
</div>
|
|
|
|
<div class="d-grid">
|
|
<button type="submit" class="btn btn-primary">
|
|
<i class="fas fa-plus"></i>
|
|
Backup-Codes generieren
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<div class="row mt-4">
|
|
<div class="col-12">
|
|
<div class="alert alert-info">
|
|
<h6><i class="fas fa-lightbulb"></i> Über Backup-Codes:</h6>
|
|
<ul class="mb-0 small">
|
|
<li><strong>Zweck:</strong> Zugriff auf Ihr Konto, wenn die Authenticator-App nicht verfügbar ist</li>
|
|
<li><strong>Anzahl:</strong> 10 Codes werden generiert</li>
|
|
<li><strong>Verwendung:</strong> Jeder Code kann nur einmal verwendet werden</li>
|
|
<li><strong>Format:</strong> 8 Zeichen (Buchstaben und Zahlen)</li>
|
|
<li><strong>Sicherheit:</strong> Codes sollten sicher aufbewahrt werden</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="text-center mt-3">
|
|
<a href="{% url 'stiftung:dashboard' %}" class="btn btn-outline-secondary">
|
|
<i class="fas fa-arrow-left"></i>
|
|
Zurück zum Dashboard
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %} |