{% extends "base.html" %}

{% block title %}Dashboard{% endblock %}

{% block extra_css %}
<style>
    .stat-card {
        transition: transform 0.2s;
    }
    .stat-card:hover {
        transform: translateY(-5px);
    }
    .status-aktiv { color: #28a745; }
    .status-ablaufend { color: #ffc107; }
    .status-abgelaufen { color: #dc3545; }
</style>
{% endblock %}

{% block content %}
<div class="container py-4">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h1>Dashboard</h1>
        <div>
            <a href="/create" class="btn btn-primary">➕ Neue Lizenz</a>
            <a href="/batch" class="btn btn-primary">🔑 Batch-Lizenzen</a>
            <a href="/licenses" class="btn btn-secondary">📋 Lizenzen</a>
            <a href="/customers" class="btn btn-secondary">👥 Kunden</a>
            <a href="/sessions" class="btn btn-secondary">🟢 Sessions</a>
            <a href="/audit" class="btn btn-secondary">📋 Audit</a>
            <a href="/backups" class="btn btn-secondary">💾 Backups</a>
        </div>
    </div>

    <!-- Statistik-Karten -->
    <div class="row g-3 mb-4">
        <div class="col-md-3">
            <div class="card stat-card h-100">
                <div class="card-body text-center">
                    <h5 class="card-title">👥 Kunden</h5>
                    <h2 class="text-primary">{{ stats.total_customers }}</h2>
                    <p class="text-muted mb-0">Gesamt</p>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card stat-card h-100">
                <div class="card-body text-center">
                    <h5 class="card-title">📋 Lizenzen</h5>
                    <h2 class="text-info">{{ stats.total_licenses }}</h2>
                    <p class="text-muted mb-0">Gesamt</p>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card stat-card h-100">
                <div class="card-body text-center">
                    <h5 class="card-title">✅ Aktiv</h5>
                    <h2 class="text-success">{{ stats.active_licenses }}</h2>
                    <p class="text-muted mb-0">Gültige Lizenzen</p>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card stat-card h-100">
                <div class="card-body text-center">
                    <h5 class="card-title">🟢 Sessions</h5>
                    <h2 class="text-success">{{ stats.active_sessions }}</h2>
                    <p class="text-muted mb-0">Aktive Nutzer</p>
                </div>
            </div>
        </div>
    </div>

    <!-- Lizenztypen -->
    <div class="row g-3 mb-4">
        <div class="col-md-6">
            <div class="card h-100">
                <div class="card-body">
                    <h5 class="card-title">Lizenztypen</h5>
                    <div class="row">
                        <div class="col-6 text-center">
                            <h3 class="text-success">{{ stats.full_licenses }}</h3>
                            <p class="text-muted">Vollversionen</p>
                        </div>
                        <div class="col-6 text-center">
                            <h3 class="text-warning">{{ stats.test_licenses }}</h3>
                            <p class="text-muted">Testversionen</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-6">
            <div class="card h-100">
                <div class="card-body">
                    <h5 class="card-title">Lizenzstatus</h5>
                    <div class="row">
                        <div class="col-6 text-center">
                            <h3 class="text-success">{{ stats.active_licenses }}</h3>
                            <p class="text-muted">Aktiv</p>
                        </div>
                        <div class="col-6 text-center">
                            <h3 class="text-danger">{{ stats.expired_licenses }}</h3>
                            <p class="text-muted">Abgelaufen</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Backup-Status und Sicherheit nebeneinander -->
    <div class="row g-3 mb-4">
        <div class="col-md-6">
            <div class="card h-100">
                <div class="card-body">
                    <h5 class="card-title">💾 Backup-Status</h5>
                    {% if stats.last_backup %}
                        {% if stats.last_backup[4] == 'success' %}
                            <p class="mb-1">
                                <strong>Letztes Backup:</strong> 
                                <span class="text-success">✅ Erfolgreich</span>
                                am {{ stats.last_backup[0].strftime('%d.%m.%Y %H:%M:%S') }}
                            </p>
                            <p class="mb-0">
                                <small class="text-muted">
                                    Größe: {{ (stats.last_backup[1] / 1024 / 1024)|round(2) }} MB | 
                                    Dauer: {{ stats.last_backup[2]|round(1) }} Sekunden | 
                                    Typ: {{ 'Manuell' if stats.last_backup[3] == 'manual' else 'Automatisch' }}
                                </small>
                            </p>
                        {% else %}
                            <p class="mb-0">
                                <strong>Letztes Backup:</strong> 
                                <span class="text-danger">❌ Fehlgeschlagen</span>
                                am {{ stats.last_backup[0].strftime('%d.%m.%Y %H:%M:%S') }}
                            </p>
                        {% endif %}
                    {% else %}
                        <p class="text-muted mb-0">Noch kein Backup vorhanden</p>
                    {% endif %}
                    <a href="/backups" class="btn btn-sm btn-outline-primary mt-2">Backup-Verwaltung →</a>
                </div>
            </div>
        </div>
        
        <!-- Sicherheitsstatus -->
        <div class="col-md-6">
            <div class="card h-100">
                <div class="card-body">
                    <h5 class="card-title">🔒 Sicherheitsstatus</h5>
                    <div class="d-flex justify-content-between align-items-center mb-3">
                        <span>Sicherheitslevel:</span>
                        <span class="badge bg-{{ stats.security_level }} fs-6">{{ stats.security_level_text }}</span>
                    </div>
                    <div class="row text-center">
                        <div class="col-6">
                            <h4 class="text-danger mb-0">{{ stats.blocked_ips_count }}</h4>
                            <small class="text-muted">Gesperrte IPs</small>
                        </div>
                        <div class="col-6">
                            <h4 class="text-warning mb-0">{{ stats.failed_attempts_today }}</h4>
                            <small class="text-muted">Fehlversuche heute</small>
                        </div>
                    </div>
                    <a href="/security/blocked-ips" class="btn btn-sm btn-outline-danger mt-3">IP-Verwaltung →</a>
                </div>
            </div>
        </div>
    </div>
    
    <!-- Sicherheitsereignisse -->
    {% if stats.recent_security_events %}
    <div class="row g-3 mb-4">
        <div class="col-12">
            <div class="card">
                <div class="card-header bg-dark text-white">
                    <h6 class="mb-0">🚨 Letzte Sicherheitsereignisse</h6>
                </div>
                <div class="card-body p-0">
                    <div class="table-responsive">
                        <table class="table table-sm mb-0">
                            <thead>
                                <tr>
                                    <th>Zeit</th>
                                    <th>IP-Adresse</th>
                                    <th>Versuche</th>
                                    <th>Fehlermeldung</th>
                                    <th>Status</th>
                                </tr>
                            </thead>
                            <tbody>
                                {% for event in stats.recent_security_events %}
                                <tr>
                                    <td>{{ event.last_attempt }}</td>
                                    <td><code>{{ event.ip_address }}</code></td>
                                    <td><span class="badge bg-secondary">{{ event.attempt_count }}</span></td>
                                    <td><strong class="text-danger">{{ event.error_message }}</strong></td>
                                    <td>
                                        {% if event.blocked_until %}
                                            <span class="badge bg-danger">Gesperrt bis {{ event.blocked_until }}</span>
                                        {% else %}
                                            <span class="badge bg-warning">Aktiv</span>
                                        {% endif %}
                                    </td>
                                </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    {% endif %}

    <div class="row g-3">
        <!-- Bald ablaufende Lizenzen -->
        <div class="col-md-6">
            <div class="card">
                <div class="card-header bg-warning text-dark">
                    <h5 class="mb-0">⏰ Bald ablaufende Lizenzen</h5>
                </div>
                <div class="card-body">
                    {% if stats.expiring_licenses %}
                    <div class="table-responsive">
                        <table class="table table-sm">
                            <thead>
                                <tr>
                                    <th>Kunde</th>
                                    <th>Lizenz</th>
                                    <th>Tage</th>
                                </tr>
                            </thead>
                            <tbody>
                                {% for license in stats.expiring_licenses %}
                                <tr>
                                    <td>{{ license[2] }}</td>
                                    <td><small><code>{{ license[1][:8] }}...</code></small></td>
                                    <td><span class="badge bg-warning">{{ license[4] }} Tage</span></td>
                                </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                    </div>
                    {% else %}
                    <p class="text-muted mb-0">Keine Lizenzen laufen in den nächsten 30 Tagen ab.</p>
                    {% endif %}
                </div>
            </div>
        </div>

        <!-- Letzte Lizenzen -->
        <div class="col-md-6">
            <div class="card">
                <div class="card-header bg-info text-white">
                    <h5 class="mb-0">🆕 Zuletzt erstellte Lizenzen</h5>
                </div>
                <div class="card-body">
                    {% if stats.recent_licenses %}
                    <div class="table-responsive">
                        <table class="table table-sm">
                            <thead>
                                <tr>
                                    <th>Kunde</th>
                                    <th>Lizenz</th>
                                    <th>Status</th>
                                </tr>
                            </thead>
                            <tbody>
                                {% for license in stats.recent_licenses %}
                                <tr>
                                    <td>{{ license[2] }}</td>
                                    <td><small><code>{{ license[1][:8] }}...</code></small></td>
                                    <td>
                                        {% if license[4] == 'abgelaufen' %}
                                            <span class="status-abgelaufen">⚠️ Abgelaufen</span>
                                        {% elif license[4] == 'läuft bald ab' %}
                                            <span class="status-ablaufend">⏰ Läuft bald ab</span>
                                        {% else %}
                                            <span class="status-aktiv">✅ Aktiv</span>
                                        {% endif %}
                                    </td>
                                </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                    </div>
                    {% else %}
                    <p class="text-muted mb-0">Noch keine Lizenzen erstellt.</p>
                    {% endif %}
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}