gru/hosts_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

NEW MODAL informacje o serwerze

Browse Source
This commit is contained in:
Mateusz Gruszczyński 2025-03-09 14:25:22 +01:00
parent 7d4a856a03
commit 67c6e8a92e
1 changed files with 112 additions and 187 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

299
templates/server_list.html
View File

@ -8,220 +8,145 @@
max-width: 300px; max-width: 300px;
text-align: left; text-align: left;
} }
.badge-status {
font-size: 0.85em;
}
.action-btns a,
.action-btns button {
margin-right: 3px;
}
</style> </style>
{% endblock %} {% endblock %}
{% block content %} {% block content %}
<div class="card"> <div class="container py-4">
<div class="card-header"> <div class="card shadow-sm">
<h2>Lista serwerów</h2> <div class="card-header bg-primary text-white">
</div> <h2 class="mb-0">Lista serwerów</h2>
<div class="card-body table-responsive"> </div>
<table class="table table-striped align-middle"> <div class="card-body table-responsive">
<thead> <table class="table table-striped align-middle">
<tr> <thead>
<th>ID</th> <tr>
<th>Nazwa hosta</th> <th>ID</th>
<th>Użytkownik</th> <th>Nazwa hosta</th>
<th>Port</th> <th>Użytkownik</th>
<th>Typ</th> <th>Port</th>
<th>Uwierzytelnianie</th> <th>Typ</th>
<th>Wybrany plik /etc/hosts</th> <th>Uwierzytelnianie</th>
<th>Auto Deploy</th> <th>Plik /etc/hosts</th>
<th>Auto Backup</th> <th>Auto Deploy</th>
<th>Wyłącz CIDR/regex deploy</th> <th>Auto Backup</th>
<th>Akcje</th> <th>Wyłącz CIDR</th>
</tr> <th>Akcje</th>
</thead> </tr>
<tbody> </thead>
{% for h in hosts %} <tbody>
<tr> {% for h in hosts %}
<td>{{ h.id }}</td> <tr>
<td data-bs-toggle="tooltip" data-bs-placement="top" title="{{ h.raw_ip }}"> <td>{{ h.id }}</td>
{% if h.use_daemon and h.type == 'linux' and h.daemon_url %} <td data-bs-toggle="tooltip" data-bs-placement="top" title="{{ h.raw_ip }}">
{{ h.resolved_daemon }} {% if h.use_daemon and h.type == 'linux' and h.daemon_url %}
{% else %} {{ h.resolved_daemon }}
{{ h.resolved_hostname }}
{% endif %}
</td>
<td>
{% if h.use_daemon and h.type == 'linux' %}
<em>—</em>
{% else %}
{{ h.username }}
{% endif %}
</td>
<td>
{% if h.use_daemon and h.type == 'linux' %}
<em>—</em>
{% else %}
{{ h.port }}
{% endif %}
</td>
<td>
{% if h.type == 'linux' %}
Linux{% if h.use_daemon %} (Demon){% endif %}
{% else %}
Mikrotik
{% endif %}
</td>
<td>
{% if h.use_daemon and h.type == 'linux' %}
<em>- używa Demona -</em>
{% else %}
{% if h.auth_method == 'password' %}
Hasło
{% elif h.auth_method == 'ssh_key' %}
Klucz SSH
{% elif h.auth_method == 'global_key' %}
Globalny klucz
{% else %} {% else %}
{{ h.auth_method }} {{ h.resolved_hostname }}
{% endif %} {% 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>
<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>
{% 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>
{% 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>
{% 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>
</div>
</td> </td>
</tr> <td>{{ '-' if h.use_daemon and h.type == 'linux' else h.username }}</td>
{% endfor %} <td>{{ '-' if h.use_daemon and h.type == 'linux' else h.port }}</td>
</tbody> <td>
<span class="badge badge-status bg-secondary">{{ 'Linux (Demon)' if h.use_daemon else h.type.capitalize() }}</span>
</table> </td>
</div> <td>{{ '- używa Demona -' if h.use_daemon else h.auth_method|capitalize }}</td>
</div> <td>{{ h.preferred_hostfile.title if h.preferred_hostfile else '(Default)' }}</td>
<td>
<!-- Modal z informacjami --> <form method="POST" action="{{ url_for('update_host_automation', id=h.id) }}" style="display:inline;">
<div class="modal fade" id="serverInfoModal" tabindex="-1" aria-hidden="true"> <input type="hidden" name="setting" value="auto_deploy">
<div class="modal-dialog modal-dialog-centered"> <input type="checkbox" name="enabled" value="1" onchange="this.form.submit()" {% if h.auto_deploy_enabled %}checked{% endif %}>
<div class="modal-content"> </form>
<div class="modal-header"> </td>
<h5 class="modal-title">Informacje o serwerze</h5> <td>
<button type="button" class="btn-close" data-bs-dismiss="modal"></button> <form method="POST" action="{{ url_for('update_host_automation', id=h.id) }}" style="display:inline;">
</div> <input type="hidden" name="setting" value="auto_backup">
<div class="modal-body"> <input type="checkbox" name="enabled" value="1" onchange="this.form.submit()" {% if h.auto_backup_enabled %}checked{% endif %}>
<p><strong>Host:</strong> <span id="modal-hostname"></span> (<span id="modal-ip"></span>)</p> </form>
</td>
<label><strong>CPU:</strong></label> <td>
<div class="progress mb-3"> <form method="POST" action="{{ url_for('update_host_automation', id=h.id) }}" style="display:inline;">
<div id="modal-cpu" class="progress-bar" role="progressbar"></div> <input type="hidden" name="setting" value="disable_regex">
</div> <input type="checkbox" name="enabled" value="1" onchange="this.form.submit()" {% if h.disable_regex_deploy %}checked{% endif %}>
</form>
<label><strong>Pamięć:</strong></label> </td>
<div class="progress mb-3"> <td class="action-btns">
<div id="modal-mem" class="progress-bar bg-warning" role="progressbar"></div> <a href="{{ url_for('edit_server', id=h.id) }}" class="btn btn-sm btn-outline-primary" title="Edytuj">
</div> <i class="fa fa-edit"></i>
</a>
<label><strong>Dysk:</strong></label> {% if h.use_daemon and h.type == 'linux' %}
<div class="progress mb-3"> <button class="btn btn-sm btn-outline-info test-daemon-btn" data-host-id="{{ h.id }}" title="Testuj">
<div id="modal-disk" class="progress-bar bg-success" role="progressbar"></div> <i class="fa fa-server"></i>
</div> </button>
{% else %}
<p><strong>Czas działania:</strong> <span id="modal-uptime"></span></p> <a href="{{ url_for('test_server_connection', id=h.id) }}" class="btn btn-sm btn-outline-info" title="Testuj">
</div> <i class="fa fa-server"></i>
<div class="modal-footer"> </a>
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Zamknij</button> {% endif %}
</div> <a href="{{ url_for('server_backup', host_id=h.id) }}" class="btn btn-sm btn-outline-success" title="Backup">
<i class="fa fa-download"></i>
</a>
<form method="GET" action="{{ url_for('delete_server', id=h.id) }}" class="d-inline">
<button class="btn btn-sm btn-outline-danger" title="Usuń">
<i class="fa fa-trash"></i>
</button>
</form>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div> </div>
</div> </div>
<div class="text-center my-4">
<a href="{{ url_for('add_server') }}" class="btn btn-primary">Dodaj nowy serwer</a>
<a href="{{ url_for('import_servers') }}" class="btn btn-outline-secondary">Importuj z CSV</a>
<a href="{{ url_for('export_servers_to_csv') }}" class="btn btn-outline-secondary">Eksportuj do CSV</a>
</div>
</div> </div>
<!-- Modal pozostaje bez zmian -->
{% include 'server_info_modal.html' %}
<div class="mt-3 text-center">
<a href="{{ url_for('add_server') }}" class="btn btn-secondary">Dodaj nowy serwer</a>
<a href="{{ url_for('import_servers') }}" class="btn btn-secondary">Importuj z CSV</a>
<a href="{{ url_for('export_servers_to_csv') }}" class="btn btn-secondary">Eksportuj do CSV</a>
</div>
{% endblock %} {% endblock %}
{% block extra_js %} {% block extra_js %}
<script> <script>
function secondsToDhms(seconds) { function secondsToDhms(seconds) {
seconds = Number(seconds); const d = Math.floor(seconds / (3600*24));
const d = Math.floor(seconds / (3600*24)); const h = Math.floor(seconds % (3600*24) / 3600);
const h = Math.floor(seconds % (3600*24) / 3600); const m = Math.floor(seconds % 3600 / 60);
const m = Math.floor(seconds % 3600 / 60); const s = Math.floor(seconds % 60);
const s = Math.floor(seconds % 60); return `${d} dni, ${h} godz, ${m} min, ${s} sek`;
return `${d} dni, ${h} godz, ${m} min, ${s} sek`;
} }
document.querySelectorAll('.test-daemon-btn').forEach(btn => { document.querySelectorAll('.test-daemon-btn').forEach(btn => {
btn.addEventListener('click', function() { btn.addEventListener('click', function() {
const hostId = this.dataset.hostId; fetch(`/server-info/${this.dataset.hostId}`)
fetch(`/server-info/${hostId}`)
.then(res => res.json()) .then(res => res.json())
.then(data => { .then(data => {
if (data.error) { if (data.error) return alert(`Błąd: ${data.error}`);
alert(`Błąd: ${data.error}`);
return;
}
document.querySelector('#modal-hostname').textContent = data.hostname; document.querySelector('#modal-hostname').textContent = data.hostname;
document.querySelector('#modal-ip').textContent = data.ip; document.querySelector('#modal-ip').textContent = data.ip;
document.querySelector('#modal-cpu').style.width = data.cpu + '%';
const cpu = document.querySelector('#modal-cpu'); document.querySelector('#modal-cpu').textContent = data.cpu + '%';
cpu.style.width = `${data.cpu}%`; document.querySelector('#modal-mem').style.width = data.mem + '%';
cpu.textContent = `${data.cpu}%`; document.querySelector('#modal-mem').textContent = data.mem + '%';
document.querySelector('#modal-disk').style.width = data.disk + '%';
const mem = document.querySelector('#modal-mem'); document.querySelector('#modal-disk').textContent = data.disk + '%';
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); document.querySelector('#modal-uptime').textContent = secondsToDhms(data.uptime_seconds);
new bootstrap.Modal(document.getElementById('serverInfoModal')).show(); new bootstrap.Modal(document.getElementById('serverInfoModal')).show();
}) })
.catch(() => alert('Błąd podczas pobierania danych.')); .catch(() => alert('Błąd podczas pobierania danych.'));
}); });
}); });
</script> </script>
{% endblock %} {% endblock %}