80 lines
3.5 KiB
HTML
80 lines
3.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Caddy Dashboard</title>
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
<script>
|
|
function toggleSearch() {
|
|
let searchBar = document.getElementById("search-box");
|
|
searchBar.classList.toggle("hidden");
|
|
if (!searchBar.classList.contains("hidden")) {
|
|
searchBar.focus();
|
|
}
|
|
}
|
|
|
|
function filterEntries() {
|
|
let query = document.getElementById("search-box").value.toLowerCase();
|
|
let cards = document.querySelectorAll(".domain-card");
|
|
cards.forEach(card => {
|
|
let domain = card.dataset.domain.toLowerCase();
|
|
card.style.display = domain.includes(query) ? "" : "none";
|
|
});
|
|
}
|
|
|
|
function deleteServer(serverName) {
|
|
fetch('/delete', {
|
|
method: 'POST',
|
|
headers: {'Content-Type': 'application/json'},
|
|
body: JSON.stringify({"server": serverName})
|
|
}).then(response => {
|
|
if (response.ok) {
|
|
document.getElementById("server-box-" + serverName).remove();
|
|
}
|
|
});
|
|
}
|
|
|
|
document.addEventListener("keydown", function(event) {
|
|
if (event.key === "/") {
|
|
event.preventDefault();
|
|
toggleSearch();
|
|
}
|
|
});
|
|
</script>
|
|
</head>
|
|
<body class="bg-gray-900 text-gray-100">
|
|
|
|
<header class="bg-indigo-700 text-white p-6 text-center">
|
|
<h1 class="text-3xl font-bold">Caddy Dashboard</h1>
|
|
<p class="text-cyan-300 text-lg">Übersicht über aller aktiven Proxy-Server</p>
|
|
<button onclick="toggleSearch()" class="bg-cyan-500 hover:bg-cyan-400 text-white text-right px-6 py-3 rounded-lg mt-4 text-lg">🔍 Suche</button>
|
|
</header>
|
|
|
|
<div class="container mx-auto p-4 md:p-6">
|
|
<input type="text" id="search-box" class="hidden w-full p-4 mb-4 text-gray-900 text-lg rounded-md" placeholder="🔍 Suche nach Subdomains.." onkeyup="filterEntries()">
|
|
|
|
{% for server, entries in proxies.items() %}
|
|
<div id="server-box-{{ server }}" class="bg-gray-800 p-6 rounded-lg shadow-lg mb-6">
|
|
<div class="flex flex-col md:flex-row justify-between items-start md:items-center">
|
|
<h2 class="text-2xl font-semibold text-indigo-400">{{ server }}</h2>
|
|
<button onclick="deleteServer('{{ server }}')" class="mt-3 md:mt-0 bg-red-500 text-white px-6 py-2 rounded-lg text-lg">🗑️ Löschen</button>
|
|
</div>
|
|
|
|
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4 mt-4">
|
|
{% for domain, target in entries.items() %}
|
|
<div class="domain-card bg-gray-700 p-4 rounded-lg shadow-md flex flex-col space-y-2" data-domain="{{ domain }}">
|
|
<div class="flex justify-between">
|
|
<a href="https://{{ domain }}" target="_blank" class="text-indigo-400 hover:text-indigo-300 text-lg break-words">{{ domain }}</a>
|
|
<!-- <button onclick="checkStatus('{{ domain }}', this)" class="bg-cyan-500 text-white px-4 py-2 rounded-lg text-sm">🔄 Prüfen</button> -->
|
|
</div>
|
|
<p class="text-gray-300 break-words text-lg">{{ target }}</p>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
|
|
</body>
|
|
</html>
|