functions and interface
This commit is contained in:
@ -1,5 +1,26 @@
|
||||
{% extends "base.html" %}
|
||||
{% block title %}Szczegóły urządzenia - RouterOS Update{% endblock %}
|
||||
{% block extra_head %}
|
||||
<style>
|
||||
/* Stylizacja kart w trybie ciemnym */
|
||||
body.dark-mode .card {
|
||||
background-color: #1e1e1e;
|
||||
color: #e0e0e0;
|
||||
border-color: #444;
|
||||
}
|
||||
/* Stylizacja bloku logów – przewijalny, z odpowiednim tłem i kolorem tekstu */
|
||||
.log-block {
|
||||
background-color: inherit;
|
||||
color: inherit;
|
||||
padding: 1rem;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 0.25rem;
|
||||
max-height: 300px;
|
||||
overflow-y: auto;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
</style>
|
||||
{% endblock %}
|
||||
{% block content %}
|
||||
<div class="container">
|
||||
<div class="my-4">
|
||||
@ -11,19 +32,10 @@
|
||||
</ol>
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
<!-- Zakładki dla danych urządzenia i informacji o systemie -->
|
||||
<ul class="nav nav-tabs mb-3" id="deviceTab" role="tablist">
|
||||
<li class="nav-item" role="presentation">
|
||||
<button class="nav-link active" id="device-data-tab" data-bs-toggle="tab" data-bs-target="#device-data" type="button" role="tab" aria-controls="device-data" aria-selected="true">Dane urządzenia</button>
|
||||
</li>
|
||||
<li class="nav-item" role="presentation">
|
||||
<button class="nav-link" id="system-info-tab" data-bs-toggle="tab" data-bs-target="#system-info" type="button" role="tab" aria-controls="system-info" aria-selected="false">Informacje o systemie</button>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="tab-content" id="deviceTabContent">
|
||||
<!-- Dane urządzenia -->
|
||||
<div class="tab-pane fade show active" id="device-data" role="tabpanel" aria-labelledby="device-data-tab">
|
||||
|
||||
<!-- Dwukolumnowy układ: dane urządzenia i informacje o systemie -->
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="card mb-3">
|
||||
<div class="card-header bg-primary text-white">
|
||||
Dane urządzenia
|
||||
@ -55,10 +67,9 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Informacje o systemie -->
|
||||
<div class="tab-pane fade" id="system-info" role="tabpanel" aria-labelledby="system-info-tab">
|
||||
<div class="col-md-6">
|
||||
<div class="card mb-3">
|
||||
<div class="card-header bg-info text-white">
|
||||
<div class="card-header bg-primary text-white">
|
||||
Informacje o systemie
|
||||
</div>
|
||||
<div class="card-body">
|
||||
@ -85,19 +96,19 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Logi urządzenia w formie accordion -->
|
||||
<div class="accordion mb-3" id="logsAccordion">
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="headingLogs">
|
||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseLogs" aria-expanded="false" aria-controls="collapseLogs">
|
||||
Logi urządzenia
|
||||
</button>
|
||||
</h2>
|
||||
<div id="collapseLogs" class="accordion-collapse collapse" aria-labelledby="headingLogs" data-bs-parent="#logsAccordion">
|
||||
<div class="accordion-body">
|
||||
<pre class="bg-light p-3" style="white-space: pre-wrap;">{{ device.last_log or 'Brak logów' }}</pre>
|
||||
<!-- Logi urządzenia jako pojedynczy blok tekstu -->
|
||||
<div class="card mb-3">
|
||||
<div class="card-header bg-secondary text-white">
|
||||
Logi urządzenia
|
||||
</div>
|
||||
<div class="card-body">
|
||||
{% if device.last_log %}
|
||||
<div class="log-block">
|
||||
{{ device.last_log }}
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
<p>Brak logów</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
Reference in New Issue
Block a user