Webseite überarbeitet und Telegram Bot funktion hinzugefügt #1
@@ -218,24 +218,57 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="edit-node-modal" class="hidden fixed inset-0 bg-black/80 flex items-center justify-center z-[2000]">
|
||||
<div class="bg-slate-800 p-6 rounded-lg border border-slate-600 w-96">
|
||||
<h3 class="text-lg font-bold mb-4">Node bearbeiten</h3>
|
||||
<div id="edit-node-modal" class="hidden fixed inset-0 bg-black/80 flex items-center justify-center z-[2000] p-4">
|
||||
<div class="bg-slate-800 p-6 rounded-lg border border-slate-600 w-full max-w-xl">
|
||||
<h3 class="text-lg font-bold mb-4 text-sky-400">Node-Konfiguration bearbeiten</h3>
|
||||
<input type="hidden" id="edit-node-id">
|
||||
<div class="space-y-4">
|
||||
<div>
|
||||
<label class="text-xs text-slate-400">Anzeigename</label>
|
||||
<input type="text" id="edit-node-name" class="w-full bg-slate-900 border border-slate-700 p-2 rounded text-sm text-white">
|
||||
|
||||
<div class="grid grid-cols-2 gap-4">
|
||||
<div class="space-y-3">
|
||||
<div>
|
||||
<label class="text-[10px] uppercase text-slate-400 font-bold">Anzeigename</label>
|
||||
<input type="text" id="edit-node-name" class="w-full bg-slate-900 border border-slate-700 p-2 rounded text-sm text-white focus:border-sky-500 outline-none">
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-[10px] uppercase text-slate-400 font-bold">SSH Benutzer</label>
|
||||
<input type="text" id="edit-node-user" class="w-full bg-slate-900 border border-slate-700 p-2 rounded text-sm text-white focus:border-sky-500 outline-none">
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-[10px] uppercase text-slate-400 font-bold">Betriebssystem</label>
|
||||
<input type="text" id="edit-node-os" class="w-full bg-slate-900 border border-slate-700 p-2 rounded text-sm text-white focus:border-sky-500 outline-none">
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-[10px] uppercase text-slate-400 font-bold">Status-Text</label>
|
||||
<input type="text" id="edit-node-status" class="w-full bg-slate-900 border border-slate-700 p-2 rounded text-sm text-white focus:border-sky-500 outline-none">
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-xs text-slate-400">IP Adresse</label>
|
||||
<input type="text" id="edit-node-ip" class="w-full bg-slate-900 border border-slate-700 p-2 rounded text-sm text-white">
|
||||
</div>
|
||||
<div class="flex justify-end gap-2 pt-2">
|
||||
<button type="button" onclick="closeEditNode()" class="px-4 py-2 text-sm text-slate-400">Abbrechen</button>
|
||||
<button type="button" onclick="updateNode()" class="bg-sky-600 px-4 py-2 text-sm rounded font-bold">Speichern</button>
|
||||
|
||||
<div class="space-y-3">
|
||||
<div>
|
||||
<label class="text-[10px] uppercase text-slate-400 font-bold">IP Adresse</label>
|
||||
<input type="text" id="edit-node-ip" class="w-full bg-slate-900 border border-slate-700 p-2 rounded text-sm text-white focus:border-sky-500 outline-none">
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-[10px] uppercase text-slate-400 font-bold">Sudo Passwort</label>
|
||||
<input type="password" id="edit-node-password" class="w-full bg-slate-900 border border-slate-700 p-2 rounded text-sm text-white focus:border-sky-500 outline-none">
|
||||
</div>
|
||||
<div>
|
||||
<label class="text-[10px] uppercase text-slate-400 font-bold">Architektur</label>
|
||||
<input type="text" id="edit-node-arch" class="w-full bg-slate-900 border border-slate-700 p-2 rounded text-sm text-white focus:border-sky-500 outline-none">
|
||||
</div>
|
||||
<div class="flex items-center h-full pt-4">
|
||||
<label class="flex items-center gap-3 cursor-pointer group">
|
||||
<input type="checkbox" id="edit-node-docker" class="w-4 h-4 rounded border-slate-700 bg-slate-900 text-sky-600 focus:ring-sky-500">
|
||||
<span class="text-sm text-slate-300 group-hover:text-white transition-colors">Docker installiert</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex justify-end gap-3 mt-6 pt-4 border-t border-slate-700">
|
||||
<button type="button" onclick="closeEditNode()" class="px-4 py-2 text-sm text-slate-400 hover:text-white transition-colors">Abbrechen</button>
|
||||
<button type="button" onclick="updateNode()" class="bg-sky-600 hover:bg-sky-500 px-6 py-2 text-sm rounded font-bold transition-all shadow-lg shadow-sky-900/20">Änderungen speichern</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -262,29 +295,48 @@
|
||||
window.closeAddNode = () => document.getElementById('add-node-modal').classList.add('hidden');
|
||||
|
||||
// EDIT LOGIK
|
||||
window.editNode = (id, name, ip) => {
|
||||
document.getElementById('edit-node-id').value = id;
|
||||
document.getElementById('edit-node-name').value = name;
|
||||
document.getElementById('edit-node-ip').value = ip;
|
||||
document.getElementById('edit-node-modal').classList.remove('hidden');
|
||||
// Ruft alle Daten ab, bevor das Modal öffnet
|
||||
window.editNode = async (id) => {
|
||||
try {
|
||||
const res = await fetch(`/api/node/${id}`);
|
||||
const node = await res.json();
|
||||
|
||||
document.getElementById('edit-node-id').value = node.id;
|
||||
document.getElementById('edit-node-name').value = node.name;
|
||||
document.getElementById('edit-node-ip').value = node.ip;
|
||||
document.getElementById('edit-node-user').value = node.user;
|
||||
document.getElementById('edit-node-password').value = node.sudo_password;
|
||||
document.getElementById('edit-node-os').value = node.os;
|
||||
document.getElementById('edit-node-arch').value = node.arch;
|
||||
document.getElementById('edit-node-status').value = node.status;
|
||||
document.getElementById('edit-node-docker').checked = node.docker_installed === 1;
|
||||
|
||||
document.getElementById('edit-node-modal').classList.remove('hidden');
|
||||
} catch (e) { alert("Fehler beim Laden der Node-Daten"); }
|
||||
};
|
||||
window.closeEditNode = () => document.getElementById('edit-node-modal').classList.add('hidden');
|
||||
|
||||
window.updateNode = async function() {
|
||||
const id = document.getElementById('edit-node-id').value;
|
||||
const name = document.getElementById('edit-node-name').value;
|
||||
const ip = document.getElementById('edit-node-ip').value;
|
||||
const payload = {
|
||||
name: document.getElementById('edit-node-name').value,
|
||||
ip: document.getElementById('edit-node-ip').value,
|
||||
user: document.getElementById('edit-node-user').value,
|
||||
sudo_password: document.getElementById('edit-node-password').value,
|
||||
os: document.getElementById('edit-node-os').value,
|
||||
arch: document.getElementById('edit-node-arch').value,
|
||||
status: document.getElementById('edit-node-status').value,
|
||||
docker_installed: document.getElementById('edit-node-docker').checked ? 1 : 0
|
||||
};
|
||||
|
||||
try {
|
||||
const res = await fetch(`/api/node/${id}`, {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ name, ip })
|
||||
body: JSON.stringify(payload)
|
||||
});
|
||||
if(res.ok) {
|
||||
document.getElementById(`node-name-${id}`).textContent = name;
|
||||
document.getElementById(`node-ip-${id}`).textContent = ip;
|
||||
closeEditNode();
|
||||
location.reload(); // Einfachste Methode, um alle Badges zu aktualisieren
|
||||
}
|
||||
} catch (e) { alert("Fehler beim Speichern"); }
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user