zmianu w css i poprawki w server-list
This commit is contained in:
Mateusz Gruszczyński
parent
146e0f5ab2
commit
7fb796357f
2
app.py
2
app.py
@ -1636,7 +1636,7 @@ def server_info(id):
|
||||
if resp.status_code == 200:
|
||||
data = resp.json()
|
||||
return {
|
||||
"hostname": format_host(host),
|
||||
"hostname": host.resolved_daemon if host.daemon_url else host.resolved_hostname,
|
||||
"ip": host.raw_ip,
|
||||
"cpu": data.get('cpu_percent'),
|
||||
"mem": data.get('memory_percent'),
|
||||
|
||||
71
static/css/custom.css
Normal file
71
static/css/custom.css
Normal file
@ -0,0 +1,71 @@
|
||||
/* Style trybu ciemnego – stosujemy je tylko, gdy body ma klasę dark-mode */
|
||||
body.dark-mode {
|
||||
background-color: #121212;
|
||||
color: #e0e0e0;
|
||||
}
|
||||
body.dark-mode footer {
|
||||
background-color: #1e1e1e !important;
|
||||
}
|
||||
/* Tabele – style ciemnego motywu */
|
||||
body.dark-mode .table {
|
||||
color: #e0e0e0;
|
||||
background-color: #1e1e1e;
|
||||
border: 1px solid #444;
|
||||
}
|
||||
body.dark-mode .table th,
|
||||
body.dark-mode .table td {
|
||||
border: 1px solid #444;
|
||||
}
|
||||
body.dark-mode .table-striped tbody tr:nth-of-type(odd) {
|
||||
background-color: #2e2e2e;
|
||||
}
|
||||
body.dark-mode .table-striped tbody tr:nth-of-type(even) {
|
||||
background-color: #1e1e1e;
|
||||
}
|
||||
body.dark-mode .table thead {
|
||||
background-color: #333;
|
||||
color: #e0e0e0;
|
||||
}
|
||||
/* Karty */
|
||||
body.dark-mode .card {
|
||||
background-color: #1e1e1e;
|
||||
color: #e0e0e0;
|
||||
border-color: #333;
|
||||
}
|
||||
/* Formularze */
|
||||
body.dark-mode .form-control,
|
||||
body.dark-mode .form-select {
|
||||
background-color: #2e2e2e;
|
||||
color: #e0e0e0;
|
||||
border: 1px solid #444;
|
||||
}
|
||||
body.dark-mode .form-control:focus,
|
||||
body.dark-mode .form-select:focus {
|
||||
background-color: #2e2e2e;
|
||||
color: #e0e0e0;
|
||||
border-color: #777;
|
||||
box-shadow: none;
|
||||
}
|
||||
/* Przycisk Wyloguj – solidny przycisk, by był czytelny */
|
||||
.btn-logout {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* Zmniejszenie rozmiaru czcionki w navbarze */
|
||||
.navbar {
|
||||
font-size: 0.9rem; /* zmniejszony rozmiar czcionki */
|
||||
}
|
||||
|
||||
/* Sprytne odwracanie kolorow dla svg */
|
||||
html[data-bs-theme="dark"] .mikrotik-logo {
|
||||
filter: invert(1);
|
||||
}
|
||||
html[data-bs-theme="dark"] .linux-logo {
|
||||
filter: invert(1);
|
||||
}
|
||||
|
||||
.progress-bar {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
1
static/img/linux.svg
Normal file
1
static/img/linux.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg enable-background="new 0 0 24 24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="m19.7 17.6c-.1-.2-.2-.4-.2-.6 0-.4-.2-.7-.5-1-.1-.1-.3-.2-.4-.2.6-1.8-.3-3.6-1.3-4.9-.8-1.2-2-2.1-1.9-3.7 0-1.9.2-5.4-3.3-5.1-3.6.2-2.6 3.9-2.7 5.2 0 1.1-.5 2.2-1.3 3.1-.2.2-.4.5-.5.7-1 1.2-1.5 2.8-1.5 4.3-.2.2-.4.4-.5.6-.1.1-.2.2-.2.3-.1.1-.3.2-.5.3-.4.1-.7.3-.9.7-.1.3-.2.7-.1 1.1.1.2.1.4 0 .7-.2.4-.2.9 0 1.4.3.4.8.5 1.5.6.5 0 1.1.2 1.6.4.5.3 1.1.5 1.7.5.3 0 .7-.1 1-.2.3-.2.5-.4.6-.7.4 0 1-.2 1.7-.2.6 0 1.2.2 2 .1 0 .1 0 .2.1.3.2.5.7.9 1.3 1h.2c.8-.1 1.6-.5 2.1-1.1.4-.4.9-.7 1.4-.9.6-.3 1-.5 1.1-1 .1-.7-.1-1.1-.5-1.7zm-6.9-12.8c.6.1 1.1.6 1 1.2 0 .3-.1.6-.3.9 0 0 0 0-.1 0-.2-.1-.3-.1-.4-.2.1-.1.1-.3.2-.5 0-.4-.2-.7-.4-.7-.3 0-.5.3-.5.7v.1c-.1-.1-.3-.1-.4-.2v-.1c-.1-.5.3-1.1.9-1.2zm-.3 2c.1.1.3.2.4.2s.3.1.4.2c.2.1.4.2.4.5s-.3.6-.9.8c-.2.1-.3.1-.4.2-.3.2-.6.3-1 .3-.3 0-.6-.2-.8-.4-.1-.1-.2-.2-.4-.3-.1-.1-.3-.3-.4-.6 0-.1.1-.2.2-.3.3-.2.4-.3.5-.4l.1-.1c.2-.3.6-.5 1-.5.3.1.6.2.9.4zm-2.1-1.8c.4 0 .7.4.8 1.1v.2c-.1 0-.3.1-.4.2 0 0 0-.1 0-.2 0-.3-.2-.6-.4-.5-.2 0-.3.3-.3.6 0 .2.1.3.2.4s-.1.1-.2.1c-.2-.2-.4-.5-.4-.8 0-.6.3-1.1.7-1.1zm-1 16.1c-.7.3-1.6.2-2.2-.2-.6-.3-1.1-.4-1.8-.4-.5-.1-1-.1-1.1-.3s-.1-.5.1-1c.1-.3.1-.6 0-.9s-.1-.5 0-.8.3-.4.6-.5.5-.2.7-.4c.1-.1.2-.2.3-.4.3-.4.5-.6.8-.6.6.1 1.1 1 1.5 1.9.2.3.4.7.7 1 .4.5.9 1.2.9 1.6 0 .5-.2.8-.5 1zm4.9-2.2c0 .1 0 .1-.1.2-1.2.9-2.8 1-4.1.3-.2-.3-.4-.6-.6-.9.9-.1.7-1.3-1.2-2.5-2-1.3-.6-3.7.1-4.8.1-.1.1 0-.3.8-.3.6-.9 2.1-.1 3.2 0-.8.2-1.6.5-2.4.7-1.3 1.2-2.8 1.5-4.3.1.1.1.1.2.1.1.1.2.2.3.2.2.3.6.4.9.4h.1c.4 0 .8-.1 1.1-.4.1-.1.2-.2.4-.2.3-.1.6-.3.9-.6.4 1.3.8 2.5 1.4 3.6.4.8.7 1.6.9 2.5.3 0 .7.1 1 .3.8.4 1.1.7 1 1.2-.1 0-.1 0-.2 0 0-.3-.2-.6-.9-.9s-1.3-.3-1.5.4c-.1 0-.2.1-.3.1-.8.4-.8 1.5-.9 2.6.1.4 0 .7-.1 1.1zm4.6.6c-.6.2-1.1.6-1.5 1.1-.4.6-1.1 1-1.9.9-.4 0-.8-.3-.9-.7-.1-.6-.1-1.2.2-1.8.1-.4.2-.7.3-1.1.1-1.2.1-1.9.6-2.2 0 .5.3.8.7 1 .5 0 1-.1 1.4-.5h.2c.3 0 .5 0 .7.2s.3.5.3.7c0 .3.2.6.3.9.5.5.5.8.5.9-.1.2-.5.4-.9.6zm-9-12c-.1 0-.1 0-.1.1 0 0 0 .1.1.1.1 0 .1.1.1.1.3.4.8.6 1.4.7.5-.1 1-.2 1.5-.6.2-.1.4-.2.6-.3.1 0 .1-.1.1-.1 0-.1 0-.1-.1-.1-.2.1-.5.2-.7.3-.4.3-.9.5-1.4.5s-.9-.3-1.2-.6c-.1 0-.2-.1-.3-.1z"/></svg>
|
||||
|
After Width: | Height: | Size: 2.1 KiB |
1
static/img/mikrotik.svg
Normal file
1
static/img/mikrotik.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg height="610" viewBox="0 0 610 610" width="610" xmlns="http://www.w3.org/2000/svg"><path d="m586.8 193.4v222.5c0 13.8-1.7 25.6-5.5 34.3-.7 1.6-1.5 3.2-2.3 4.7-5.5 8.9-16.6 17.7-31.6 25.9l-203 111.2c-12.6 6.9-24.2 11.4-34 12.7q-2.8.4-5.4.4-2.7 0-5.5-.4c-9.8-1.3-21.4-5.8-34-12.7l-101.5-55.6-101.4-55.6c-15.1-8.2-26.2-17-31.6-25.9-5.5-9-7.9-22.5-7.9-39v-222.5c0-13.8 1.7-25.5 5.5-34.2.7-1.7 1.5-3.3 2.4-4.7q1.3-2.2 3-4.3c6.1-7.5 16-14.7 28.6-21.7l101.4-55.6 101.5-55.6c15-8.2 28.6-13 39.5-13q2.6 0 5.4.4c9.8 1.2 21.4 5.7 34 12.6l101.5 55.6 101.5 55.6c12.6 7 22.4 14.2 28.5 21.7q1.8 2.1 3.1 4.3c.8 1.4 1.6 3 2.3 4.7 3.8 8.7 5.5 20.4 5.5 34.2zm-102.5 33.2c0-9.8-5.3-18.8-13.8-23.4l-152.7-83.7c-8-4.4-17.7-4.4-25.7 0l-38.9 21.3c-4.6 2.6-4.6 9.2 0 11.7l116.4 63.8c4.6 2.6 4.6 9.2 0 11.7l-51.8 28.4c-8 4.4-17.7 4.4-25.7 0l-112-61.4c-8-4.4-17.7-4.4-25.7 0l-14.9 8.2c-8.6 4.7-13.9 13.6-13.9 23.4v7l135.5 74.3c8.6 4.6 13.9 13.6 13.9 23.3v141.4c0 4.8 2.6 9.3 6.9 11.7l10.2 5.6c8 4.4 17.7 4.4 25.7 0l10.3-5.6c4.2-2.4 6.9-6.9 6.9-11.7v-141.4c0-9.7 5.3-18.7 13.9-23.3l65.5-36c4.5-2.4 9.9.8 9.9 5.9v142.4c0 5.1 5.4 8.3 9.9 5.9l36.3-19.9c8.5-4.7 13.8-13.7 13.8-23.4zm-298.7 78.2c0-4.8-2.6-9.3-6.9-11.7l-43.2-23.7c-4.5-2.4-9.9.8-9.9 5.9v107.5c0 9.7 5.3 18.7 13.9 23.4l36.3 19.9c4.4 2.4 9.8-.8 9.8-5.9z" fill="#263037" fill-rule="evenodd"/></svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
@ -6,66 +6,10 @@
|
||||
<title>{% block title %}/etc/hosts Manager{% endblock %}</title>
|
||||
<!-- Bootstrap CSS (Bootstrap 5.3.0) -->
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='css/custom.css') }}">
|
||||
<!-- Dodatkowe style -->
|
||||
<style>
|
||||
/* Style trybu ciemnego – stosujemy je tylko, gdy body ma klasę dark-mode */
|
||||
body.dark-mode {
|
||||
background-color: #121212;
|
||||
color: #e0e0e0;
|
||||
}
|
||||
body.dark-mode footer {
|
||||
background-color: #1e1e1e !important;
|
||||
}
|
||||
/* Tabele – style ciemnego motywu */
|
||||
body.dark-mode .table {
|
||||
color: #e0e0e0;
|
||||
background-color: #1e1e1e;
|
||||
border: 1px solid #444;
|
||||
}
|
||||
body.dark-mode .table th,
|
||||
body.dark-mode .table td {
|
||||
border: 1px solid #444;
|
||||
}
|
||||
body.dark-mode .table-striped tbody tr:nth-of-type(odd) {
|
||||
background-color: #2e2e2e;
|
||||
}
|
||||
body.dark-mode .table-striped tbody tr:nth-of-type(even) {
|
||||
background-color: #1e1e1e;
|
||||
}
|
||||
body.dark-mode .table thead {
|
||||
background-color: #333;
|
||||
color: #e0e0e0;
|
||||
}
|
||||
/* Karty */
|
||||
body.dark-mode .card {
|
||||
background-color: #1e1e1e;
|
||||
color: #e0e0e0;
|
||||
border-color: #333;
|
||||
}
|
||||
/* Formularze */
|
||||
body.dark-mode .form-control,
|
||||
body.dark-mode .form-select {
|
||||
background-color: #2e2e2e;
|
||||
color: #e0e0e0;
|
||||
border: 1px solid #444;
|
||||
}
|
||||
body.dark-mode .form-control:focus,
|
||||
body.dark-mode .form-select:focus {
|
||||
background-color: #2e2e2e;
|
||||
color: #e0e0e0;
|
||||
border-color: #777;
|
||||
box-shadow: none;
|
||||
}
|
||||
/* Przycisk Wyloguj – solidny przycisk, by był czytelny */
|
||||
.btn-logout {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* Zmniejszenie rozmiaru czcionki w navbarze */
|
||||
.navbar {
|
||||
font-size: 0.9rem; /* zmniejszony rozmiar czcionki */
|
||||
}
|
||||
|
||||
/* */
|
||||
</style>
|
||||
{% block extra_css %}{% endblock %}
|
||||
</head>
|
||||
|
||||
@ -8,6 +8,27 @@
|
||||
max-width: 300px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
/* Zmniejsz tekst w nagłówku tabeli i wyśrodkuj go */
|
||||
thead th {
|
||||
font-size: 0.75rem;
|
||||
text-align: center;
|
||||
}
|
||||
/* Klasa zmniejszająca przyciski akcji */
|
||||
.btn-action {
|
||||
font-size: 0.65rem;
|
||||
padding: 0.25rem 0.4rem;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
form.inline-button button.btn {
|
||||
background-color: #dc3545; /* btn-danger */
|
||||
border-color: #dc3545;
|
||||
font-size: 0.65rem;
|
||||
padding: 0.25rem 0.4rem;
|
||||
line-height: 1;
|
||||
/* ewentualnie dodatkowe właściwości, aby upodobnić go do linków */
|
||||
}
|
||||
</style>
|
||||
{% endblock %}
|
||||
|
||||
@ -21,15 +42,15 @@
|
||||
<thead>
|
||||
<tr>
|
||||
<th>ID</th>
|
||||
<th>Nazwa hosta</th>
|
||||
<th>Serwer</th>
|
||||
<th>Użytkownik</th>
|
||||
<th>Port</th>
|
||||
<th>Typ</th>
|
||||
<th>Uwierzytelnianie</th>
|
||||
<th>Wybrany plik /etc/hosts</th>
|
||||
<th>Wybrany /etc/hosts</th>
|
||||
<th>Auto Deploy</th>
|
||||
<th>Auto Backup</th>
|
||||
<th>Wyłącz CIDR/regex deploy</th>
|
||||
<th>Wyłącz CIDR / regex</th>
|
||||
<th>Akcje</th>
|
||||
</tr>
|
||||
</thead>
|
||||
@ -44,7 +65,6 @@
|
||||
{{ h.resolved_hostname }}
|
||||
{% endif %}
|
||||
</td>
|
||||
|
||||
|
||||
<td>
|
||||
{% if h.use_daemon and h.type == 'linux' %}
|
||||
@ -60,75 +80,96 @@
|
||||
{{ h.port }}
|
||||
{% endif %}
|
||||
</td>
|
||||
<td>
|
||||
|
||||
<td class="text-center">
|
||||
{% if h.type == 'linux' %}
|
||||
Linux{% if h.use_daemon %} (Demon){% endif %}
|
||||
{% else %}
|
||||
Mikrotik
|
||||
{% endif %}
|
||||
<img src="{{ url_for('static', filename='img/linux.svg') }}"
|
||||
alt="Linux"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-placement="top"
|
||||
title="{% if h.use_daemon %}Linux - Używa Linux Demon{% else %}Linux{% endif %}"
|
||||
class="linux-logo"
|
||||
style="width: 40px; height: 40px;">
|
||||
{% else %}
|
||||
<img src="{{ url_for('static', filename='img/mikrotik.svg') }}"
|
||||
alt="Mikrotik"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-placement="top"
|
||||
title="Mikrotik"
|
||||
class="mikrotik-logo"
|
||||
style="width: 40px; height: 40px;">
|
||||
{% endif %}
|
||||
</td>
|
||||
|
||||
<td>
|
||||
{% if h.use_daemon and h.type == 'linux' %}
|
||||
<em>- używa Demona -</em>
|
||||
<span class="badge bg-secondary" style="font-size: 0.75rem;">- linux daemon -</span>
|
||||
{% else %}
|
||||
{% if h.auth_method == 'password' %}
|
||||
Hasło
|
||||
<span class="badge bg-primary" style="font-size: 0.75rem;">Hasło</span>
|
||||
{% elif h.auth_method == 'ssh_key' %}
|
||||
Klucz SSH
|
||||
<span class="badge bg-success" style="font-size: 0.75rem;">Klucz SSH</span>
|
||||
{% elif h.auth_method == 'global_key' %}
|
||||
Globalny klucz
|
||||
<span class="badge bg-info" style="font-size: 0.75rem;">Globalny klucz</span>
|
||||
{% else %}
|
||||
{{ h.auth_method }}
|
||||
<span class="badge bg-light text-dark" style="font-size: 0.75rem;">{{ h.auth_method }}</span>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</td>
|
||||
<td>
|
||||
{% if h.preferred_hostfile %}
|
||||
{{ h.preferred_hostfile.title }}
|
||||
{% else %}
|
||||
(Default)
|
||||
{% endif %}
|
||||
</td>
|
||||
<td>
|
||||
<form method="POST" action="{{ url_for('update_host_automation', id=h.id) }}" style="display:inline;">
|
||||
<input type="hidden" name="setting" value="auto_deploy">
|
||||
<input type="checkbox" name="enabled" value="1"
|
||||
onchange="this.form.submit()" {% if h.auto_deploy_enabled %}checked{% endif %}>
|
||||
</form>
|
||||
</td>
|
||||
<td>
|
||||
<form method="POST" action="{{ url_for('update_host_automation', id=h.id) }}" style="display:inline;">
|
||||
<input type="hidden" name="setting" value="auto_backup">
|
||||
<input type="checkbox" name="enabled" value="1"
|
||||
onchange="this.form.submit()" {% if h.auto_backup_enabled %}checked{% endif %}>
|
||||
</form>
|
||||
</td>
|
||||
<td>
|
||||
<form method="POST" action="{{ url_for('update_host_automation', id=h.id) }}" style="display:inline;">
|
||||
<input type="hidden" name="setting" value="disable_regex">
|
||||
<input type="checkbox" name="enabled" value="1"
|
||||
onchange="this.form.submit()" {% if h.disable_regex_deploy %}checked{% endif %}>
|
||||
</form>
|
||||
|
||||
<td>
|
||||
{% if h.preferred_hostfile %}
|
||||
{{ h.preferred_hostfile.title }}
|
||||
{% else %}
|
||||
(Default)
|
||||
{% endif %}
|
||||
</td>
|
||||
|
||||
<td>
|
||||
<form method="POST" action="{{ url_for('update_host_automation', id=h.id) }}" class="d-flex justify-content-center">
|
||||
<input type="hidden" name="setting" value="auto_deploy">
|
||||
<div class="form-check form-switch">
|
||||
<input class="form-check-input" type="checkbox" id="autoDeployCheckbox{{ h.id }}" name="enabled" value="1" onchange="this.form.submit()" {% if h.auto_deploy_enabled %}checked{% endif %}>
|
||||
<label class="form-check-label" for="autoDeployCheckbox{{ h.id }}"></label>
|
||||
</div>
|
||||
</form>
|
||||
</td>
|
||||
<td>
|
||||
<form method="POST" action="{{ url_for('update_host_automation', id=h.id) }}" class="d-flex justify-content-center">
|
||||
<input type="hidden" name="setting" value="auto_backup">
|
||||
<div class="form-check form-switch">
|
||||
<input class="form-check-input" type="checkbox" id="autoBackupCheckbox{{ h.id }}" name="enabled" value="1" onchange="this.form.submit()" {% if h.auto_backup_enabled %}checked{% endif %}>
|
||||
<label class="form-check-label" for="autoBackupCheckbox{{ h.id }}"></label>
|
||||
</div>
|
||||
</form>
|
||||
</td>
|
||||
<td>
|
||||
<form method="POST" action="{{ url_for('update_host_automation', id=h.id) }}" class="d-flex justify-content-center">
|
||||
<input type="hidden" name="setting" value="disable_regex">
|
||||
<div class="form-check form-switch">
|
||||
<input class="form-check-input" type="checkbox" id="disableRegexCheckbox{{ h.id }}" name="enabled" value="1" onchange="this.form.submit()" {% if h.disable_regex_deploy %}checked{% endif %}>
|
||||
<label class="form-check-label" for="disableRegexCheckbox{{ h.id }}"></label>
|
||||
</div>
|
||||
</form>
|
||||
</td>
|
||||
|
||||
<td>
|
||||
<div class="d-flex flex-wrap gap-1">
|
||||
<a href="{{ url_for('edit_server', id=h.id) }}" class="btn btn-primary btn-sm">Edytuj</a>
|
||||
|
||||
<a href="{{ url_for('edit_server', id=h.id) }}" class="btn btn-primary btn-sm btn-action">Edytuj</a>
|
||||
{% if h.use_daemon and h.type == 'linux' %}
|
||||
<!-- Serwery z demonem – nowy sposób -->
|
||||
<button class="btn btn-info btn-sm test-daemon-btn" data-host-id="{{ h.id }}">
|
||||
Testuj
|
||||
</button>
|
||||
<button class="btn btn-info btn-sm btn-action test-daemon-btn" data-host-id="{{ h.id }}">
|
||||
Test
|
||||
</button>
|
||||
{% else %}
|
||||
<!-- Dotychczasowy sposób dla SSH/Mikrotik -->
|
||||
<a href="{{ url_for('test_server_connection', id=h.id) }}" class="btn btn-info btn-sm">Testuj</a>
|
||||
<a href="{{ url_for('test_server_connection', id=h.id) }}" class="btn btn-info btn-sm btn-action">Test</a>
|
||||
{% endif %}
|
||||
|
||||
<a href="{{ url_for('server_backup', host_id=h.id) }}" class="btn btn-success btn-sm">Backup</a>
|
||||
<form method="GET" action="{{ url_for('delete_server', id=h.id) }}" style="display:inline;">
|
||||
<button type="submit" class="btn btn-danger btn-sm">Usuń</button>
|
||||
</form>
|
||||
<a href="{{ url_for('server_backup', host_id=h.id) }}" class="btn btn-success btn-sm btn-action">Backup</a>
|
||||
<form method="GET" action="{{ url_for('delete_server', id=h.id) }}" class="inline-button d-flex justify-content-center">
|
||||
<button type="submit" class="btn btn-danger btn-sm btn-action" onclick="return confirm('Czy na pewno chcesz usunąć serwer?')">Usuń</button>
|
||||
</form>
|
||||
</div>
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
@ -180,48 +221,49 @@
|
||||
</div>
|
||||
{% endblock %}
|
||||
{% block extra_js %}
|
||||
<script>
|
||||
function secondsToDhms(seconds) {
|
||||
{{ super() }}
|
||||
<script>
|
||||
function secondsToDhms(seconds) {
|
||||
seconds = Number(seconds);
|
||||
const d = Math.floor(seconds / (3600*24));
|
||||
const h = Math.floor(seconds % (3600*24) / 3600);
|
||||
const d = Math.floor(seconds / (3600 * 24));
|
||||
const h = Math.floor(seconds % (3600 * 24) / 3600);
|
||||
const m = Math.floor(seconds % 3600 / 60);
|
||||
const s = Math.floor(seconds % 60);
|
||||
return `${d} dni, ${h} godz, ${m} min, ${s} sek`;
|
||||
}
|
||||
|
||||
document.querySelectorAll('.test-daemon-btn').forEach(btn => {
|
||||
btn.addEventListener('click', function() {
|
||||
const hostId = this.dataset.hostId;
|
||||
fetch(`/server-info/${hostId}`)
|
||||
.then(res => res.json())
|
||||
.then(data => {
|
||||
if (data.error) {
|
||||
alert(`Błąd: ${data.error}`);
|
||||
return;
|
||||
}
|
||||
document.querySelector('#modal-hostname').textContent = data.hostname;
|
||||
document.querySelector('#modal-ip').textContent = data.ip;
|
||||
|
||||
const cpu = document.querySelector('#modal-cpu');
|
||||
cpu.style.width = `${data.cpu}%`;
|
||||
cpu.textContent = `${data.cpu}%`;
|
||||
|
||||
const mem = document.querySelector('#modal-mem');
|
||||
mem.style.width = `${data.mem}%`;
|
||||
mem.textContent = `${data.mem}%`;
|
||||
|
||||
const disk = document.querySelector('#modal-disk');
|
||||
disk.style.width = `${data.disk}%`;
|
||||
disk.textContent = `${data.disk}%`;
|
||||
|
||||
document.querySelector('#modal-uptime').textContent = secondsToDhms(data.uptime_seconds);
|
||||
|
||||
new bootstrap.Modal(document.getElementById('serverInfoModal')).show();
|
||||
})
|
||||
.catch(() => alert('Błąd podczas pobierania danych.'));
|
||||
}
|
||||
|
||||
document.querySelectorAll('.test-daemon-btn').forEach(btn => {
|
||||
btn.addEventListener('click', function() {
|
||||
const hostId = this.dataset.hostId;
|
||||
fetch(`/server-info/${hostId}`)
|
||||
.then(res => res.json())
|
||||
.then(data => {
|
||||
if (data.error) {
|
||||
alert(`Błąd: ${data.error}`);
|
||||
return;
|
||||
}
|
||||
document.querySelector('#modal-hostname').textContent = data.hostname;
|
||||
document.querySelector('#modal-ip').textContent = data.ip;
|
||||
|
||||
const cpu = document.querySelector('#modal-cpu');
|
||||
cpu.style.width = `${data.cpu}%`;
|
||||
cpu.textContent = `${data.cpu}%`;
|
||||
|
||||
const mem = document.querySelector('#modal-mem');
|
||||
mem.style.width = `${data.mem}%`;
|
||||
mem.textContent = `${data.mem}%`;
|
||||
|
||||
const disk = document.querySelector('#modal-disk');
|
||||
disk.style.width = `${data.disk}%`;
|
||||
disk.textContent = `${data.disk}%`;
|
||||
|
||||
document.querySelector('#modal-uptime').textContent = secondsToDhms(data.uptime_seconds);
|
||||
|
||||
new bootstrap.Modal(document.getElementById('serverInfoModal')).show();
|
||||
})
|
||||
.catch(() => alert('Błąd podczas pobierania danych.'));
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
{% endblock %}
|
||||
{% endblock %}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user