{% extends 'administration/base.html.twig' %}

{% block title %}License Server Dashboard{% endblock %}

{% block body %}
{# Breadcrumb hinzufügen #}
<nav aria-label="breadcrumb" class="mb-4">
  <ol class="breadcrumb bg-light p-2 rounded">
    <li class="breadcrumb-item"><a href="/admin/license-server">Lizenzserver</a></li>
    <li class="breadcrumb-item active" aria-current="page">Dashboard</li>
  </ol>
</nav>
<div class="container-fluid">
    <!-- Header -->
    <div class="row mb-4">
        <div class="col-12">
            <div class="admin-card p-4">
                <div class="d-flex flex-column flex-md-row justify-content-between align-items-start align-items-md-center">
                    <div class="mb-3 mb-md-0">
                        <h2 class="gradient-text fw-bold mb-2">
                            <i class="bi bi-shield-check me-3"></i>
                            License Server Dashboard
                        </h2>
                        <p class="text-muted mb-0">Übersicht über alle Lizenzen, Rechnungen und Einnahmen</p>
                    </div>
                    <div class="d-flex gap-2">
                        <button type="button" class="btn btn-primary" onclick="window.location.href='/admin/license-server/licenses'">
                            <i class="bi bi-plus me-2"></i>
                            Neue Lizenz
                        </button>
                        <button type="button" class="btn btn-success" onclick="window.location.href='/admin/license-server/invoices'">
                            <i class="bi bi-receipt me-2"></i>
                            Neue Rechnung
                        </button>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Statistics Cards -->
    <div class="row mb-4">
        <div class="col-xl-3 col-md-6 mb-4">
            <div class="admin-card p-4 h-100">
                <div class="d-flex align-items-center">
                    <div class="flex-shrink-0">
                        <div class="stat-icon bg-primary">
                            <i class="bi bi-key text-white"></i>
                        </div>
                    </div>
                    <div class="flex-grow-1 ms-3">
                        <h6 class="text-muted mb-1">Aktive Lizenzen</h6>
                        <h3 class="fw-bold mb-0">{{ stats.activeLicenses }}</h3>
                        <small class="text-success">
                            <i class="bi bi-arrow-up"></i> +{{ stats.newLicensesThisMonth }} diesen Monat
                        </small>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-xl-3 col-md-6 mb-4">
            <div class="admin-card p-4 h-100">
                <div class="d-flex align-items-center">
                    <div class="flex-shrink-0">
                        <div class="stat-icon bg-success">
                            <i class="bi bi-currency-euro text-white"></i>
                        </div>
                    </div>
                    <div class="flex-grow-1 ms-3">
                        <h6 class="text-muted mb-1">Monatliche Einnahmen</h6>
                        <h3 class="fw-bold mb-0">{{ stats.monthlyRevenue|number_format(2, ',', '.') }}€</h3>
                        <small class="text-success">
                            <i class="bi bi-arrow-up"></i> +{{ stats.revenueGrowth }}% vs. Vormonat
                        </small>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-xl-3 col-md-6 mb-4">
            <div class="admin-card p-4 h-100">
                <div class="d-flex align-items-center">
                    <div class="flex-shrink-0">
                        <div class="stat-icon bg-warning">
                            <i class="bi bi-exclamation-triangle text-white"></i>
                        </div>
                    </div>
                    <div class="flex-grow-1 ms-3">
                        <h6 class="text-muted mb-1">Abgelaufene Lizenzen</h6>
                        <h3 class="fw-bold mb-0">{{ stats.expiredLicenses }}</h3>
                        <small class="text-warning">
                            <i class="bi bi-clock"></i> {{ stats.expiringSoon }} laufen bald ab
                        </small>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-xl-3 col-md-6 mb-4">
            <div class="admin-card p-4 h-100">
                <div class="d-flex align-items-center">
                    <div class="flex-shrink-0">
                        <div class="stat-icon bg-info">
                            <i class="bi bi-people text-white"></i>
                        </div>
                    </div>
                    <div class="flex-grow-1 ms-3">
                        <h6 class="text-muted mb-1">Aktive Kunden</h6>
                        <h3 class="fw-bold mb-0">{{ stats.activeCustomers }}</h3>
                        <small class="text-info">
                            <i class="bi bi-plus"></i> +{{ stats.newCustomersThisMonth }} diesen Monat
                        </small>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Quick Actions -->
    <div class="row">
        <div class="col-xl-6 mb-4">
            <div class="admin-card p-4">
                <h5 class="fw-bold mb-3">Schnellaktionen</h5>
                <div class="row g-3">
                    <div class="col-md-6">
                        <button class="btn btn-outline-primary w-100" onclick="window.location.href='/admin/license-server/licenses'">
                            <i class="bi bi-key me-2"></i>
                            Lizenzen verwalten
                        </button>
                    </div>
                    <div class="col-md-6">
                        <button class="btn btn-outline-success w-100" onclick="window.location.href='/admin/license-server/invoices'">
                            <i class="bi bi-receipt me-2"></i>
                            Rechnungen verwalten
                        </button>
                    </div>
                    <div class="col-md-6">
                        <button class="btn btn-outline-info w-100" onclick="window.location.href='/admin/license-server/plans'">
                            <i class="bi bi-list-check me-2"></i>
                            Lizenzpläne
                        </button>
                    </div>
                    <div class="col-md-6">
                        <button class="btn btn-outline-warning w-100" onclick="window.location.href='/admin/license-server/customers'">
                            <i class="bi bi-people me-2"></i>
                            Kunden verwalten
                        </button>
                    </div>
                    <div class="col-md-6">
                        <button class="btn btn-outline-secondary w-100" onclick="window.location.href='/admin/license-server/discounts'">
                            <i class="bi bi-tag me-2"></i>
                            Rabattcodes
                        </button>
                    </div>
                    <div class="col-md-6">
                        <button class="btn btn-outline-dark w-100" onclick="window.location.href='/admin/license-server/api-docs'">
                            <i class="bi bi-code-slash me-2"></i>
                            API Dokumentation
                        </button>
                    </div>
                </div>
            </div>
        </div>

        <!-- Alerts -->
        <div class="col-xl-6 mb-4">
            <div class="admin-card p-4">
                <h5 class="fw-bold mb-3">Warnungen & Hinweise</h5>
                <div class="alert-list">
                    {% if stats.expiredLicenses > 0 %}
                    <div class="alert alert-warning d-flex align-items-center">
                        <i class="bi bi-exclamation-triangle me-2"></i>
                        <div>
                            <strong>{{ stats.expiredLicenses }} Lizenzen abgelaufen</strong>
                            <br>
                            <small>Diese Lizenzen müssen verlängert werden</small>
                        </div>
                    </div>
                    {% endif %}

                    {% if stats.expiringSoon > 0 %}
                    <div class="alert alert-info d-flex align-items-center">
                        <i class="bi bi-calendar me-2"></i>
                        <div>
                            <strong>{{ stats.expiringSoon }} Lizenzen laufen bald ab</strong>
                            <br>
                            <small>Diese Lizenzen laufen in den nächsten 30 Tagen ab</small>
                        </div>
                    </div>
                    {% endif %}

                    {% if stats.expiredLicenses == 0 and stats.expiringSoon == 0 %}
                    <div class="alert alert-success d-flex align-items-center">
                        <i class="bi bi-check-circle me-2"></i>
                        <div>
                            <strong>Alles in Ordnung!</strong>
                            <br>
                            <small>Keine Warnungen vorhanden</small>
                        </div>
                    </div>
                    {% endif %}
                </div>
            </div>
        </div>
    </div>
</div>

<style>
.gradient-text {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.stat-icon {
    width: 60px;
    height: 60px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
}

.alert-list .alert {
    margin-bottom: 12px;
    border: none;
    border-radius: 8px;
}

.alert-list .alert:last-child {
    margin-bottom: 0;
}
</style>
{% endblock %}