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

refactor web interface

Browse Source
This commit is contained in:
Mateusz Gruszczyński
2025-02-25 10:53:13 +01:00
parent 4b5d7526ff
commit c6f865bbb8
3 changed files with 146 additions and 107 deletions
Download Patch File Download Diff File Expand all files Collapse all files

111
templates/clear_servers.html
View File

@ -1,8 +1,11 @@
{% extends "base.html" %}
{% block title %}Wyczyść Server - /etc/hosts Manager{% endblock %}
{% block title %}Czyszczenie /etc/hosts - /etc/hosts Manager{% endblock %}
{% block extra_css %}
{{ super() }}
<style>
.section {
margin-bottom: 2rem;
}
.tooltip-inner {
max-width: 300px;
text-align: left;
@ -10,69 +13,65 @@
</style>
{% endblock %}
{% block content %}
<div class="card mb-4">
<div class="card-header">
<h2>Wyczyść /etc/hosts</h2>
</div>
<div class="card-body">
<form method="POST" action="{{ url_for('clear_server') }}">
<div class="mb-3">
<label class="form-label">Opcja czyszczenia:</label>
<div class="form-check">
<input class="form-check-input" type="radio" name="clear_option" id="clear_all" value="all" checked>
<label class="form-check-label" for="clear_all">Wyczyść dla wszystkich hostów</label>
<div class="section">
<div class="card">
<div class="card-header">
<h2>Grupowe czyszczenie /etc/hosts</h2>
</div>
<div class="card-body">
<form method="POST" action="{{ url_for('clear_all_server') }}">
<div class="mb-3">
<label class="form-label">Wybierz typy hostów do czyszczenia:</label>
<div class="form-check">
<input class="form-check-input" type="checkbox" name="linux" id="linux_group">
<label class="form-check-label" for="linux_group">Wyczyść Linux</label>
</div>
<div class="form-check">
<input class="form-check-input" type="checkbox" name="mikrotik" id="mikrotik_group">
<label class="form-check-label" for="mikrotik_group">Wyczyść Mikrotik</label>
</div>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="clear_option" id="clear_one" value="one">
<label class="form-check-label" for="clear_one">Wybierz serwer</label>
</div>
</div>
<div class="mb-3" id="host_select_div" style="display: none;">
<label for="host_id" class="form-label">Wybierz serwer:</label>
<select class="form-select" id="host_id" name="host_id">
{% for host in hosts %}
<option value="{{ host.id }}">{{ host.hostname }}</option>
{% endfor %}
</select>
</div>
<div class="mb-3">
<div class="form-check">
<input class="form-check-input" type="checkbox" name="linux" id="linux">
<label class="form-check-label" for="linux">Wyczyść Linux</label>
</div>
<div class="form-check">
<input class="form-check-input" type="checkbox" name="mikrotik" id="mikrotik">
<label class="form-check-label" for="mikrotik">Wyczyść Mikrotik</label>
</div>
</div>
<button type="submit" class="btn btn-danger">Wyczyść</button>
</form>
<button type="submit" class="btn btn-danger">Wyczyść dla wszystkich hostów</button>
</form>
</div>
</div>
</div>
<div class="mt-3 text-center">
<a href="{{ url_for('dashboard') }}" class="btn btn-secondary">Przejdź do pulpitu</a>
<div class="section">
<div class="card">
<div class="card-header">
<h2>Czyszczenie pojedynczego serwera</h2>
</div>
<div class="card-body">
<form id="clear-single-form" method="POST">
<div class="mb-3">
<label for="host_id" class="form-label">Wybierz serwer:</label>
<select class="form-select" id="host_id" name="host_id">
{% for host in hosts %}
<option value="{{ host.id }}">{{ host.hostname }}</option>
{% endfor %}
</select>
</div>
<button type="submit" class="btn btn-warning">Czyszczenie pojedynczego serwera</button>
</form>
</div>
</div>
</div>
{% endblock %}
{% block extra_js %}
{{ super() }}
<script>
// Pokazuj lub ukrywaj rozwijaną listę w zależności od wybranej opcji
const clearAllRadio = document.getElementById('clear_all');
const clearOneRadio = document.getElementById('clear_one');
const hostSelectDiv = document.getElementById('host_select_div');
function toggleHostSelect() {
if (clearOneRadio.checked) {
hostSelectDiv.style.display = 'block';
} else {
hostSelectDiv.style.display = 'none';
// Ustaw dynamicznie action formularza dla czyszczenia pojedynczego serwera
document.getElementById('clear-single-form').addEventListener('submit', function(e) {
e.preventDefault();
var hostId = document.getElementById('host_id').value;
if(!hostId) {
alert("Proszę wybrać serwer!");
return;
}
}
clearAllRadio.addEventListener('change', toggleHostSelect);
clearOneRadio.addEventListener('change', toggleHostSelect);
// Inicjalnie ustaw stan przy załadowaniu strony
toggleHostSelect();
// Skonstruuj URL bez użycia url_for
this.action = "/clear-single-server/" + hostId;
this.submit();
});
</script>
{% endblock %}

43
templates/deploy_hosts_file.html
View File

@ -1,17 +1,32 @@
{% extends "base.html" %}
{% block title %}Deploy Hosts File - /etc/hosts Manager{% endblock %}
{% block content %}
<h2>Deploy Hosts File: "{{ file.title }}"</h2>
<form method="post">
<div class="form-group">
<label>Wybierz hosty do deploy:</label>
{% for host in hosts %}
<div class="form-check">
<input class="form-check-input" type="checkbox" name="hosts" value="{{ host.id }}" id="host{{ host.id }}">
<label class="form-check-label" for="host{{ host.id }}">{{ host.hostname }} ({{ host.type }})</label>
</div>
{% endfor %}
</div>
<button type="submit" class="btn btn-success">Deploy Hosts File</button>
</form>
{% block extra_css %}
{{ super() }}
<style>
.tooltip-inner {
max-width: 300px;
text-align: left;
}
</style>
{% endblock %}
{% block content %}
<div class="card mb-4">
<div class="card-header">
<h2>Wgraj plik hosts: "{{ file.title }}"</h2>
</div>
<div class="card-body">
<form method="post">
<div class="mb-3">
<label class="form-label">Wybierz serwery do wgrania:</label>
{% for host in hosts %}
<div class="form-check">
<input class="form-check-input" type="checkbox" name="hosts" value="{{ host.id }}" id="host{{ host.id }}">
<label class="form-check-label" for="host{{ host.id }}">{{ host.hostname }} ({{ host.type }})</label>
</div>
{% endfor %}
</div>
<button type="submit" class="btn btn-success">Wgraj plik hosts do serwera</button>
</form>
</div>
</div>
{% endblock %}