<!DOCTYPE html>
<html lang="de">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?= $title ?></title>
    <link rel="stylesheet" href="/css/admin.css">
</head>
<body class="admin-page">
    <div class="admin-header">
        <h1>Performance-Übersicht</h1>
    </div>

    <div class="admin-nav">
        <a href="/admin">Dashboard</a>
        <a href="/admin/routes">Routen</a>
        <a href="/admin/services">Dienste</a>
        <a href="/admin/environment">Umgebung</a>
        <a href="/admin/performance" class="active">Performance</a>
        <a href="/admin/redis">Redis</a>
        <a href="/admin/phpinfo">PHP Info</a>
    </div>

    <div class="admin-content">
        <div class="dashboard-stats">
            <div class="stat-box">
                <h3>Aktueller Speicherverbrauch</h3>
                <div class="stat-value"><?= $performance['currentMemoryUsage'] ?></div>
            </div>

            <div class="stat-box">
                <h3>Maximaler Speicherverbrauch</h3>
                <div class="stat-value"><?= $performance['peakMemoryUsage'] ?></div>
            </div>

            <div class="stat-box">
                <h3>Speicherlimit</h3>
                <div class="stat-value"><?= $performance['memoryLimit'] ?></div>
            </div>

            <div class="stat-box">
                <h3>Speicherauslastung</h3>
                <div class="stat-value">
                    <div class="progress-bar">
                        <div class="progress" style="width: <?= $performance['memoryUsagePercentage'] ?>%"></div>
                    </div>
                    <div class="progress-value"><?= $performance['memoryUsagePercentage'] ?>%</div>
                </div>
            </div>

            <div class="stat-box">
                <h3>Systemlast (1/5/15 min)</h3>
                <div class="stat-value">
                    <?= $performance['loadAverage'][0] ?> /
                    <?= $performance['loadAverage'][1] ?> /
                    <?= $performance['loadAverage'][2] ?>
                </div>
            </div>

            <div class="stat-box">
                <h3>OPCache aktiviert</h3>
                <div class="stat-value"><?= $performance['opcacheEnabled'] ?></div>
            </div>

            <?php if (isset($performance['opcacheMemoryUsage'])): ?>
            <div class="stat-box">
                <h3>OPCache Speicherverbrauch</h3>
                <div class="stat-value"><?= $performance['opcacheMemoryUsage'] ?></div>
            </div>

            <div class="stat-box">
                <h3>OPCache Cache Hits</h3>
                <div class="stat-value"><?= $performance['opcacheCacheHits'] ?></div>
            </div>

            <div class="stat-box">
                <h3>OPCache Miss Rate</h3>
                <div class="stat-value"><?= $performance['opcacheMissRate'] ?></div>
            </div>
            <?php endif; ?>

            <div class="stat-box">
                <h3>Ausführungszeit</h3>
                <div class="stat-value"><?= $performance['executionTime'] ?></div>
            </div>

            <div class="stat-box">
                <h3>Geladene Dateien</h3>
                <div class="stat-value"><?= $performance['includedFiles'] ?></div>
            </div>
        </div>

        <div class="admin-section">
            <h2>Geladene Dateien</h2>
            <div class="admin-tools">
                <input type="text" id="fileFilter" placeholder="Dateien filtern..." class="search-input">
            </div>

            <div class="file-list" id="fileList">
                <?php foreach(get_included_files() as $file): ?>
                <div class="file-item">
                    <?= $file ?>
                </div>
                <?php endforeach; ?>
            </div>
        </div>
    </div>

    <div class="admin-footer">
        <p>&copy; <?= date('Y') ?> Framework Admin</p>
    </div>

    <script>
        document.getElementById('fileFilter').addEventListener('input', function() {
            const filterValue = this.value.toLowerCase();
            const items = document.querySelectorAll('#fileList .file-item');

            items.forEach(item => {
                const text = item.textContent.toLowerCase();
                item.style.display = text.includes(filterValue) ? '' : 'none';
            });
        });
    </script>
</body>
</html>
