{% extends 'admin/admin_base.html' %}
{% block title %}Нагрузочное тестирование{% endblock %}
{% block breadcrumb %}
{{ super() }}
<li class="breadcrumb-item active">Нагрузочное тестирование</li>
{% endblock %}
{% block admin_content %}
<div class="admin-toolbar">
    <div class="admin-toolbar__main">
        <h1 class="admin-toolbar__title">Нагрузочное тестирование</h1>
        <p class="admin-toolbar__meta muted">Запуск бенчмарков производительности для проверки целевых показателей</p>
    </div>
</div>

<!-- Текущие метрики производительности -->
    <div class="row mb-4">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h5 class="mb-0"><i class="bi bi-speedometer2"></i> Текущие метрики производительности</h5>
                </div>
                <div class="card-body">
                    <div class="row" id="currentMetrics">
                        <div class="col-md-3">
                            <div class="text-center">
                                <h6 class="text-muted">RPS</h6>
                                <h3 id="currentRPS">-</h3>
                            </div>
                        </div>
                        <div class="col-md-3">
                            <div class="text-center">
                                <h6 class="text-muted">Avg Latency</h6>
                                <h3 id="currentAvgLatency">-</h3>
                            </div>
                        </div>
                        <div class="col-md-3">
                            <div class="text-center">
                                <h6 class="text-muted">P99 Latency</h6>
                                <h3 id="currentP99Latency">-</h3>
                            </div>
                        </div>
                        <div class="col-md-3">
                            <div class="text-center">
                                <h6 class="text-muted">Active Requests</h6>
                                <h3 id="currentActiveRequests">-</h3>
                            </div>
                        </div>
                    </div>
                    <div class="row mt-3">
                        <div class="col-12">
                            <div id="validationStatus" class="alert"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Форма запуска теста -->
    <div class="row mb-4">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h5 class="mb-0"><i class="bi bi-play-circle"></i> Запуск нагрузочного теста</h5>
                </div>
                <div class="card-body">
                    <form id="benchmarkForm">
                        <div class="row">
                            <div class="col-md-6 mb-3">
                                <label for="testUrl" class="form-label">URL для тестирования <span class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="testUrl" 
                                       value="http://localhost:5000/api/module/back/test" required>
                                <small class="form-text text-muted">URL endpoint для нагрузочного тестирования</small>
                            </div>
                            <div class="col-md-6 mb-3">
                                <label for="testType" class="form-label">Тип теста <span class="text-danger">*</span></label>
                                <select class="form-select" id="testType" required>
                                    <option value="rps">RPS (Пропускная способность)</option>
                                    <option value="latency">Latency (Задержка)</option>
                                    <option value="concurrent">Concurrent Connections (Одновременные соединения)</option>
                                    <option value="all">Все тесты</option>
                                </select>
                            </div>
                        </div>
                        <div class="row" id="rpsParams">
                            <div class="col-md-6 mb-3">
                                <label for="targetRPS" class="form-label">Целевой RPS</label>
                                <input type="number" class="form-control" id="targetRPS" value="10000" min="1">
                            </div>
                            <div class="col-md-6 mb-3">
                                <label for="duration" class="form-label">Длительность (секунды)</label>
                                <input type="number" class="form-control" id="duration" value="60" min="1">
                            </div>
                        </div>
                        <div class="row" id="latencyParams" style="display: none;">
                            <div class="col-md-6 mb-3">
                                <label for="numRequests" class="form-label">Количество запросов</label>
                                <input type="number" class="form-control" id="numRequests" value="10000" min="1">
                            </div>
                        </div>
                        <div class="row" id="concurrentParams" style="display: none;">
                            <div class="col-md-6 mb-3">
                                <label for="maxConnections" class="form-label">Максимальное количество соединений</label>
                                <input type="number" class="form-control" id="maxConnections" value="100000" min="1">
                            </div>
                            <div class="col-md-6 mb-3">
                                <label for="concurrentDuration" class="form-label">Длительность (секунды)</label>
                                <input type="number" class="form-control" id="concurrentDuration" value="60" min="1">
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-12">
                                <button type="button" class="btn primary" id="runBenchmarkBtn">
                                    <i class="bi bi-play-fill"></i> Запустить тест
                                </button>
                                <button type="button" class="btn ghost" id="refreshMetricsBtn">
                                    <i class="bi bi-arrow-clockwise"></i> Обновить метрики
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <!-- Результаты теста -->
    <div class="row mb-4" id="resultsSection" style="display: none;">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h5 class="mb-0"><i class="bi bi-graph-up"></i> Результаты теста</h5>
                </div>
                <div class="card-body">
                    <div id="benchmarkStatus" class="alert alert-info" style="display: none;">
                        <i class="bi bi-hourglass-split"></i> Ожидание запуска теста...
                    </div>
                    <div id="benchmarkLogs" class="mt-3" style="display: none;">
                        <h6>Лог выполнения:</h6>
                        <div class="border rounded p-2 bg-light" style="max-height: 200px; overflow-y: auto; font-family: monospace; font-size: 0.85rem;">
                            <div id="benchmarkLogsContent"></div>
                        </div>
                    </div>
                    <div id="benchmarkResults" class="mt-3"></div>
                </div>
            </div>
        </div>
    </div>

    <!-- История тестов -->
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h5 class="mb-0"><i class="bi bi-clock-history"></i> История тестов</h5>
                </div>
                <div class="card-body">
                    <div id="benchmarkHistory">
                        <p class="text-muted">История тестов будет отображаться здесь</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}

{% block extra_css %}
<style>
    .metric-card {
        border-left: 4px solid #007bff;
        padding: 1rem;
        margin-bottom: 1rem;
    }
    .metric-value {
        font-size: 2rem;
        font-weight: bold;
    }
    .validation-success {
        background-color: #d4edda;
        border-color: #c3e6cb;
        color: #155724;
    }
    .validation-warning {
        background-color: #fff3cd;
        border-color: #ffeaa7;
        color: #856404;
    }
    .validation-error {
        background-color: #f8d7da;
        border-color: #f5c6cb;
        color: #721c24;
    }
</style>
{% endblock %}

{% block admin_scripts %}
<script src="{{ url_for('static', filename='js/performance.js') }}"></script>
{% endblock %}