102 lines
4.8 KiB
HTML
102 lines
4.8 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Bahmcloud Bridge Manager</title>
|
|
<style>
|
|
body { font-family: -apple-system, system-ui, sans-serif; background: #111; color: white; text-align: center; padding: 20px; }
|
|
.card { background: #222; border-radius: 15px; padding: 25px; max-width: 400px; margin: 40px auto; box-shadow: 0 10px 30px rgba(0,0,0,0.5); border: 1px solid #333; }
|
|
h1 { color: #25D366; margin-bottom: 5px; }
|
|
.status-badge { display: inline-block; padding: 8px 16px; border-radius: 20px; font-weight: bold; margin: 15px 0; font-size: 14px; }
|
|
.connected { background: #25D366; color: black; }
|
|
.disconnected { background: #e74c3c; color: white; }
|
|
.loading { background: #f39c12; color: black; }
|
|
.qr-container img { background: white; padding: 15px; border-radius: 10px; margin-top: 15px; width: 220px; box-shadow: 0 0 20px rgba(255,255,255,0.1); }
|
|
.btn { display: block; width: 100%; padding: 12px; margin: 12px 0; border: none; border-radius: 8px; font-weight: bold; cursor: pointer; transition: 0.2s; font-size: 14px; }
|
|
.btn-orange { background: #f39c12; color: white; }
|
|
.btn-orange:hover { background: #e67e22; }
|
|
.btn-red { background: #e74c3c; color: white; }
|
|
.btn-red:hover { background: #c0392b; }
|
|
#msg { font-size: 12px; color: #aaa; margin-top: 15px; min-height: 1.2em; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="card">
|
|
<h1>Bahmcloud Bridge</h1>
|
|
<p style="color: #666; font-size: 13px; margin-bottom: 20px;">WhatsApp Management Interface</p>
|
|
|
|
<div id="status" class="status-badge loading">Initialisiere...</div>
|
|
|
|
<div id="qr-section" class="qr-container" style="display:none;">
|
|
<p style="font-size: 14px;">Bitte QR-Code scannen:</p>
|
|
<div id="qr-code"></div>
|
|
</div>
|
|
|
|
<div style="margin-top: 30px; border-top: 1px solid #333; padding-top: 10px;">
|
|
<button class="btn btn-orange" onclick="cmd('auth/logout', 'POST', 'ACHTUNG: Dies erzwingt das Löschen der Session-Dateien. Fortfahren?')">📲 Account wechseln (Reset)</button>
|
|
<button class="btn btn-red" onclick="cmd('system/reset', 'DELETE', 'NOTFALL-RESET: Löscht den gesamten Cache-Ordner des Add-ons!')">⚠️ Werkseinstellungen (Nuklear)</button>
|
|
</div>
|
|
<p id="msg"></p>
|
|
</div>
|
|
|
|
<script>
|
|
const getBaseUrl = () => {
|
|
const path = window.location.pathname;
|
|
return path.endsWith('/') ? path : path + '/';
|
|
};
|
|
|
|
async function update() {
|
|
try {
|
|
const response = await fetch(getBaseUrl() + 'api/status');
|
|
const data = await response.json();
|
|
|
|
const statusEl = document.getElementById('status');
|
|
const qrSection = document.getElementById('qr-section');
|
|
|
|
if (data.isReady) {
|
|
statusEl.innerText = "VERBUNDEN ✅";
|
|
statusEl.className = "status-badge connected";
|
|
qrSection.style.display = "none";
|
|
} else if (data.hasQr) {
|
|
statusEl.innerText = "WARTE AUF SCAN 📱";
|
|
statusEl.className = "status-badge disconnected";
|
|
qrSection.style.display = "block";
|
|
document.getElementById('qr-code').innerHTML = `<img src="${data.qrCode}">`;
|
|
} else if (data.isInitializing) {
|
|
statusEl.innerText = "LADE CLIENT... ⏳";
|
|
statusEl.className = "status-badge loading";
|
|
qrSection.style.display = "none";
|
|
} else {
|
|
statusEl.innerText = "INITIALISIERE...";
|
|
statusEl.className = "status-badge loading";
|
|
qrSection.style.display = "none";
|
|
}
|
|
} catch (e) {
|
|
statusEl.innerText = "VERBINDUNG VERLOREN ❌";
|
|
statusEl.className = "status-badge disconnected";
|
|
}
|
|
}
|
|
|
|
async function cmd(endpoint, method, confirmMsg) {
|
|
if (!confirm(confirmMsg)) return;
|
|
|
|
const msgEl = document.getElementById('msg');
|
|
msgEl.innerText = "Befehl wird erzwungen...";
|
|
|
|
try {
|
|
const res = await fetch(getBaseUrl() + endpoint, { method });
|
|
const data = await res.json();
|
|
alert(data.message);
|
|
location.reload();
|
|
} catch (e) {
|
|
alert("Erfolgreich gesendet! Add-on startet im Hintergrund neu.");
|
|
location.reload();
|
|
}
|
|
}
|
|
|
|
setInterval(update, 3000);
|
|
update();
|
|
</script>
|
|
</body>
|
|
</html> |