Files
haproxy-dashboard/templates/logs.html
Mateusz Gruszczyński da1af612ef fixes
2025-11-04 08:43:42 +01:00

100 lines
4.3 KiB
HTML

{% extends "base.html" %}
{% set active_page = "logs" %}
{% block title %}HAProxy • Logs{% endblock %}
{% block breadcrumb %}
<nav aria-label="breadcrumb" class="mb-3">
<ol class="breadcrumb mb-0">
<li class="breadcrumb-item"><a href="{{ url_for('main.index') }}"><i class="bi bi-house"></i></a></li>
<li class="breadcrumb-item active" aria-current="page">Logs</li>
</ol>
</nav>
{% endblock %}
{% block content %}
<div class="card shadow-sm mb-4">
<div class="card-header bg-primary text-white">
<h5 class="mb-0"><i class="bi bi-file-earmark-text me-2"></i>HAProxy Logs</h5>
</div>
<div class="card-body">
{% if error_message %}
<div class="alert alert-warning">
<i class="bi bi-exclamation-triangle me-2"></i>{{ error_message }}
</div>
{% endif %}
<!-- Search & Filter Controls -->
<div class="row mb-3 g-2">
<div class="col-md-4">
<div class="input-group input-group-sm">
<span class="input-group-text"><i class="bi bi-search"></i></span>
<input type="text" class="form-control" id="search_filter" placeholder="Filter logs (regex)...">
</div>
</div>
<div class="col-md-3">
<label for="logs_per_page" class="form-label form-label-sm">Logs Per Page</label>
<select class="form-select form-select-sm" id="logs_per_page">
<option value="25" selected>25</option>
<option value="50">50</option>
<option value="100">100</option>
<option value="200">200</option>
</select>
</div>
<div class="col-md-2">
<button class="btn btn-primary btn-sm w-100" id="refresh_logs_btn">
<i class="bi bi-arrow-clockwise me-1"></i>Refresh
</button>
</div>
<div class="col-md-3">
<div class="btn-group btn-group-sm w-100" role="group">
<button type="button" class="btn btn-outline-secondary" id="clear_filter_btn">
<i class="bi bi-x-circle me-1"></i>Clear
</button>
<button type="button" class="btn btn-outline-secondary" id="toggle_wrap_btn">
<i class="bi bi-arrow-left-right me-1"></i>Wrap
</button>
</div>
</div>
</div>
<!-- Statistics -->
<div class="alert alert-info small">
<i class="bi bi-info-circle me-2"></i>
<strong>Loaded:</strong> <span id="loaded_count">{{ loaded_count|default(0) }}</span> /
<strong>Total:</strong> <span id="total_count">{{ total_logs|default(0) }}</span> logs |
<strong>Matches:</strong> <span id="match_count">0</span>
</div>
<!-- Logs Container (Dark Theme) -->
<div id="logs_container_wrapper" style="max-height: 700px; overflow-y: auto; border: 1px solid #444; border-radius: 4px; background: #1a1a1a; position: relative;">
<pre id="logs_container" style="margin: 0; padding: 12px; color: #e0e0e0; font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', monospace; font-size: 12px; line-height: 1.6; background: #1a1a1a; white-space: pre-wrap; word-wrap: break-word;">Loading logs...</pre>
</div>
<!-- Pagination -->
<div class="mt-3 d-flex justify-content-between align-items-center flex-wrap gap-2">
<small class="text-muted">
Page <span id="current_page">1</span> of <span id="total_pages">1</span>
</small>
<div class="btn-group" role="group">
<button class="btn btn-sm btn-outline-primary" id="prev_btn" disabled>
<i class="bi bi-chevron-left"></i> Previous
</button>
<button class="btn btn-sm btn-outline-primary" id="next_btn">
Next <i class="bi bi-chevron-right"></i>
</button>
<button class="btn btn-sm btn-outline-secondary" id="load_all_btn">
<i class="bi bi-download me-1"></i>Load All
</button>
</div>
</div>
</div>
</div>
<script src="{{ url_for('static', filename='js/logs.js') }}"></script>
{% endblock %}