@extends('admin.panel.layout')

@section('admin_content')
    <div class="admin-header">
        <div>
            <span class="shop-muted-label">Übersicht</span>
            <h1>Admin Dashboard</h1>
            <p class="shop-copy" style="margin-top: 14px;">Alle Websites, Bot-Aktivität und System-Status auf einen Blick.</p>
        </div>
        <div class="admin-toolbar">
            <a href="{{ route('admin.panel.reports') }}" class="shop-button">Reports senden</a>
            <a href="{{ route('admin.panel.anfragen') }}" class="shop-button-light">Anfragen ansehen</a>
        </div>
    </div>

    {{-- Metric Cards --}}
    <div class="admin-card-grid">
        <div class="admin-metric-card">
            <span>Besucher heute</span>
            <strong>{{ $combinedToday }}</strong>
        </div>
        <div class="admin-metric-card">
            <span>Diese Woche</span>
            <strong>{{ $combinedWeek }}</strong>
        </div>
        <div class="admin-metric-card">
            <span>Gesamt</span>
            <strong>{{ number_format($combinedTotal, 0, ',', '.') }}</strong>
        </div>
        <div class="admin-metric-card">
            <span>Bot-Nutzer</span>
            <strong>{{ count($botUsers) }}</strong>
        </div>
        <div class="admin-metric-card">
            <span>Offene Anfragen</span>
            <strong>{{ count($openRequests) }}</strong>
        </div>
        <div class="admin-metric-card">
            <span>Bot-Anfragen gesamt</span>
            <strong>{{ count($botRequests) }}</strong>
        </div>
    </div>

    {{-- Per-site visitor table --}}
    <div class="admin-panel">
        <div class="admin-toolbar" style="margin-bottom: 18px;">
            <div>
                <span class="shop-muted-label">Traffic</span>
                <h2 style="font-size: 1.8rem; margin-top: 10px;">Besucher pro Website</h2>
            </div>
        </div>

        <div class="admin-table-wrap">
            <table class="admin-table">
                <thead>
                    <tr>
                        <th>Website</th>
                        <th>Heute</th>
                        <th>Diese Woche</th>
                        <th>Gesamt</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($visitorStats as $site => $stats)
                        <tr>
                            <td><strong>{{ $site }}</strong></td>
                            <td>{{ $stats['today'] }}</td>
                            <td>{{ $stats['week'] }}</td>
                            <td>{{ number_format($stats['total'], 0, ',', '.') }}</td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>

    {{-- System Status --}}
    <div class="admin-panel">
        <div class="admin-toolbar" style="margin-bottom: 18px;">
            <div>
                <span class="shop-muted-label">Monitoring</span>
                <h2 style="font-size: 1.8rem; margin-top: 10px;">System-Status</h2>
            </div>
            <button onclick="refreshStatus()" class="shop-button-light" id="status-refresh-btn">
                <i class="fas fa-sync-alt"></i> Aktualisieren
            </button>
        </div>

        <div class="admin-card-grid" id="status-cards">
            @foreach ($monitoredSites as $site)
                <div class="admin-metric-card" id="status-{{ str_replace('.', '-', $site) }}" style="opacity: 0.5;">
                    <span>{{ $site }}</span>
                    <strong><i class="fas fa-circle-notch fa-spin"></i> Prüfe...</strong>
                </div>
            @endforeach
        </div>
    </div>

    {{-- ===== Eigene Projekt-Site: haehner-printing.de — Live-Health via /api/health.php ===== --}}
    <div class="admin-panel">
        <div class="admin-toolbar" style="margin-bottom: 18px;">
            <div>
                <span class="shop-muted-label">Eigenes Projekt · Live-Health</span>
                <h2 style="font-size: 1.8rem; margin-top: 10px;">haehner-printing.de</h2>
            </div>
            <div class="admin-toolbar" style="gap:10px;">
                <a href="{{ config('services.haehner.site_url', 'https://212.227.70.84/') }}" target="_blank" rel="noopener" class="shop-button-light"><i class="fas fa-external-link-alt"></i> Öffnen</a>
                <button onclick="refreshHaehner()" class="shop-button-light" id="haehner-refresh-btn"><i class="fas fa-sync-alt"></i> Aktualisieren</button>
            </div>
        </div>
        <div id="haehner-health">
            <div class="shop-note"><i class="fas fa-circle-notch fa-spin"></i> Lade Health-Report …</div>
        </div>
    </div>

    {{-- Last 5 Bot Requests --}}
    <div class="admin-panel">
        <div class="admin-toolbar" style="margin-bottom: 18px;">
            <div>
                <span class="shop-muted-label">Bot</span>
                <h2 style="font-size: 1.8rem; margin-top: 10px;">Letzte Anfragen</h2>
            </div>
            <a href="{{ route('admin.panel.anfragen') }}" class="shop-button-light">Alle ansehen</a>
        </div>

        <div class="admin-table-wrap">
            <table class="admin-table">
                <thead>
                    <tr>
                        <th>#</th>
                        <th>Typ</th>
                        <th>Name</th>
                        <th>Datum</th>
                        <th>Status</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse ($recentRequests as $req)
                        <tr>
                            <td><strong>{{ $req['id'] ?? '-' }}</strong></td>
                            <td>{{ $req['type'] ?? '-' }}</td>
                            <td>{{ $req['name'] ?? '-' }}</td>
                            <td>
                                <span class="shop-note">
                                    {{ isset($req['created_at']) ? date('d.m.Y H:i', strtotime($req['created_at'])) : ($req['date'] ?? '-') }}
                                </span>
                            </td>
                            <td>
                                <span class="admin-badge" style="{{ ($req['status'] ?? 'offen') === 'erledigt' ? 'background:#2ecc71;color:#fff;' : 'background:#e74c3c;color:#fff;' }}">
                                    {{ $req['status'] ?? 'offen' }}
                                </span>
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="5"><div class="shop-note">Keine Anfragen vorhanden.</div></td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>

    <script>
        function refreshStatus() {
            const btn = document.getElementById('status-refresh-btn');
            btn.disabled = true;
            btn.innerHTML = '<i class="fas fa-circle-notch fa-spin"></i> Prüfe...';

            fetch('{{ route('admin.panel.status') }}', { credentials: 'same-origin' })
                .then(r => {
                    if (!r.ok) throw new Error('HTTP ' + r.status);
                    return r.json();
                })
                .then(data => {
                    for (const [site, info] of Object.entries(data)) {
                        const id = 'status-' + site.replace(/\./g, '-');
                        const card = document.getElementById(id);
                        if (!card) continue;
                        card.style.opacity = '1';
                        const strong = card.querySelector('strong');
                        if (info.ok) {
                            strong.innerHTML = '<i class="fas fa-check-circle" style="color:#2ecc71;"></i> Online';
                            card.style.borderLeft = '4px solid #2ecc71';
                        } else {
                            const code = info.code ? ' (' + info.code + ')' : '';
                            strong.innerHTML = '<i class="fas fa-times-circle" style="color:#e74c3c;"></i> Offline' + code;
                            card.style.borderLeft = '4px solid #e74c3c';
                        }
                    }
                })
                .catch(err => {
                    document.querySelectorAll('#status-cards .admin-metric-card strong').forEach(el => {
                        el.innerHTML = '<i class="fas fa-exclamation-triangle" style="color:#f39c12;"></i> Timeout';
                    });
                    console.error('Status check failed:', err);
                })
                .finally(() => {
                    btn.disabled = false;
                    btn.innerHTML = '<i class="fas fa-sync-alt"></i> Aktualisieren';
                });
        }

        // Auto-load on page open
        refreshStatus();

        // Auto-refresh every 60 seconds
        setInterval(refreshStatus, 60000);

        // ===== haehner-printing.de — Live-Health =====
        function hEsc(s){ return String(s==null?'':s).replace(/[&<>"]/g,function(c){return {'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;'}[c];}); }
        function hBar(pct, color){
            pct = Math.max(0, Math.min(100, Number(pct)||0));
            return '<div style="height:8px;background:#e9edf3;border-radius:6px;overflow:hidden;margin-top:8px;"><div style="height:100%;width:'+pct+'%;background:'+(color||'#2ecc71')+';"></div></div>';
        }
        function hCard(label, value, accent, extra){
            var style = accent ? ' style="border-left:4px solid '+accent+'"' : '';
            return '<div class="admin-metric-card"'+style+'><span>'+label+'</span><strong>'+value+'</strong>'+(extra||'')+'</div>';
        }
        function hPctColor(p){ return p>85 ? '#e74c3c' : (p>60 ? '#f39c12' : '#2ecc71'); }

        function refreshHaehner(){
            var btn = document.getElementById('haehner-refresh-btn');
            var box = document.getElementById('haehner-health');
            if (btn){ btn.disabled = true; btn.innerHTML = '<i class="fas fa-circle-notch fa-spin"></i> Prüfe...'; }

            fetch('{{ route('admin.panel.haehner.health') }}', { credentials: 'same-origin' })
                .then(function(r){ return r.json(); })
                .then(function(res){
                    if (!res || !res.ok){
                        var msg = (res && res.error) ? res.error : 'unbekannt';
                        var c   = (res && res.code) ? (' (HTTP ' + res.code + ')') : '';
                        box.innerHTML = '<div class="admin-card-grid">' +
                            hCard('Status', '<i class="fas fa-times-circle" style="color:#e74c3c"></i> Nicht erreichbar', '#e74c3c') +
                            '</div><div class="shop-note" style="margin-top:10px;">Fehler: ' + hEsc(msg) + c + '</div>';
                        return;
                    }
                    var h = res.health || {};
                    var fun = h.fun || {}, site = h.site || {}, srv = h.server || null;
                    var accent = fun.accent || '#e8670c';
                    var html = '';

                    html += '<div class="admin-card-grid">';
                    html += hCard('Status', '<i class="fas fa-check-circle" style="color:#2ecc71"></i> ' + hEsc(h.status || '?') + ' · ' + hEsc(h.service || ''), '#2ecc71');
                    html += hCard('Online seit', (fun.days_online != null ? fun.days_online + ' Tagen' : '–'));
                    html += hCard('Vibe', hEsc(fun.vibe || '–'));
                    html += hCard('Antwortzeit', (h.generated_in_ms != null ? h.generated_in_ms + ' ms' : '–'));
                    html += '</div>';
                    if (fun.fun_fact){
                        html += '<div class="shop-note" style="margin-top:12px;border-left:4px solid ' + accent + ';padding-left:12px;">💡 ' + hEsc(fun.fun_fact) + '</div>';
                    }

                    html += '<h3 style="margin:22px 0 10px;font-size:1.05rem;color:var(--ink,#0f172a);">Website</h3><div class="admin-card-grid">';
                    html += hCard('Seiten', site.pages != null ? site.pages : '–');
                    html += hCard('Materialien', site.materials != null ? site.materials : '–');
                    html += hCard('Schriften', site.fonts_available != null ? site.fonts_available : '–');
                    if (site.leads != null){ html += hCard('Leads', site.leads); }
                    html += hCard('Config', hEsc(site.config_updated || '–'));
                    html += hCard('Cache-Token', hEsc(site.cache_token || '–'));
                    html += '</div>';

                    if (srv){
                        html += '<h3 style="margin:22px 0 10px;font-size:1.05rem;color:var(--ink,#0f172a);">Server-Bericht</h3><div class="admin-card-grid">';
                        html += hCard('Host', hEsc(srv.hostname || '–'));
                        html += hCard('Uptime', hEsc(srv.uptime_pretty || '–'));
                        html += hCard('Last 1/5/15', (Array.isArray(srv.load) ? srv.load.join(' / ') : '–') + (srv.cpu_cores ? (' · ' + srv.cpu_cores + ' Kerne') : ''));
                        if (srv.mem_pct != null){
                            html += hCard('RAM', (srv.mem_used_mb||'?') + ' / ' + (srv.mem_total_mb||'?') + ' MB · ' + srv.mem_pct + '%', hPctColor(srv.mem_pct), hBar(srv.mem_pct, hPctColor(srv.mem_pct)));
                        }
                        if (srv.disk_pct != null){
                            html += hCard('Disk', (srv.disk_free_gb||'?') + ' GB frei / ' + (srv.disk_total_gb||'?') + ' GB · ' + srv.disk_pct + '%', hPctColor(srv.disk_pct), hBar(srv.disk_pct, hPctColor(srv.disk_pct)));
                        }
                        html += hCard('PHP', hEsc(srv.php_version || '–'));
                        html += hCard('Kernel', hEsc(srv.kernel || '–'));
                        html += hCard('TLS gültig', (srv.tls_days_left != null ? srv.tls_days_left + ' Tage' : '–'), (srv.tls_days_left != null && srv.tls_days_left < 21) ? '#e74c3c' : null);
                        html += hCard('Backups', (srv.backups_count != null ? srv.backups_count : '–') + (srv.last_backup_age_h != null ? (' · neuestes ' + srv.last_backup_age_h + 'h') : ''));
                        html += hCard('fail2ban', (srv.fail2ban_banned != null ? srv.fail2ban_banned + ' gebannt' : '–'));
                        html += hCard('Security-Updates', (srv.security_updates != null ? srv.security_updates : '–'), (srv.security_updates > 0) ? '#f39c12' : null);
                        html += hCard('Snapshot', (srv.snapshot_age_s != null ? srv.snapshot_age_s + ' s alt' : '–'), (srv.snapshot_age_s != null && srv.snapshot_age_s > 600) ? '#f39c12' : null);
                        html += '</div>';
                    } else {
                        html += '<div class="shop-note" style="margin-top:14px;border-left:4px solid #f39c12;padding-left:12px;">' +
                            'Nur öffentliche Daten. Für den vollen <strong>Server-Bericht</strong> (Uptime, RAM, Disk, TLS, Backups, Security-Updates) den Token in <code>.env</code> setzen: <code>HAEHNER_HEALTH_TOKEN=…</code> (aus <code>health-token.txt</code> der Ziel-Site), dann <code>php artisan config:cache</code>.' +
                            '</div>';
                    }

                    box.innerHTML = html;
                })
                .catch(function(err){
                    box.innerHTML = '<div class="shop-note" style="border-left:4px solid #e74c3c;padding-left:12px;">Abruf fehlgeschlagen: ' + hEsc(err && err.message ? err.message : err) + '</div>';
                })
                .finally(function(){ if (btn){ btn.disabled = false; btn.innerHTML = '<i class="fas fa-sync-alt"></i> Aktualisieren'; } });
        }
        refreshHaehner();
        setInterval(refreshHaehner, 60000);
    </script>
@endsection