add: dev branch + caddy && nginx display properly on dashboard

This commit is contained in:
pika 2025-03-30 15:43:11 +02:00
parent ac3acbd1a0
commit 93b355d6c5
2 changed files with 116 additions and 29 deletions

12
app.py
View file

@ -208,11 +208,11 @@ def index():
# Calculate stats
caddy_servers = len(caddy_proxies)
nginx_servers = len(nginx_proxies)
# Calculate total domains
total_domains = 0
domain_list = []
# Build the domain list for both Caddy and Nginx
for server, domains in caddy_proxies.items():
for domain, target in domains.items():
@ -223,7 +223,7 @@ def index():
"server_type": "caddy"
})
total_domains += 1
for server, domains in nginx_proxies.items():
for domain, target in domains.items():
domain_list.append({
@ -233,17 +233,17 @@ def index():
"server_type": "nginx"
})
total_domains += 1
# Sort domains by name
domain_list.sort(key=lambda x: x["domain"])
# Get the latest update time
last_update = "Never"
if timestamps:
# Find the most recent timestamp
latest_time = max(timestamps.values())
last_update = latest_time
return render_template('dashboard.html',
caddy_count=caddy_servers,
nginx_count=nginx_servers,

View file

@ -1,25 +1,33 @@
<!DOCTYPE html>
<!doctype html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<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>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" />
<style>
body {
background-color: #0f0f0f;
background-image:
radial-gradient(circle at 25% 25%, rgba(40, 40, 40, 0.05) 0%, transparent 50%),
radial-gradient(circle at 75% 75%, rgba(40, 40, 40, 0.05) 0%, transparent 50%);
radial-gradient(circle at 25% 25%,
rgba(40, 40, 40, 0.05) 0%,
transparent 50%),
radial-gradient(circle at 75% 75%,
rgba(40, 40, 40, 0.05) 0%,
transparent 50%);
}
.bg-grid {
background-size: 50px 50px;
background-image:
linear-gradient(to right, rgba(40, 40, 40, 0.05) 1px, transparent 1px),
linear-gradient(to bottom, rgba(40, 40, 40, 0.05) 1px, transparent 1px);
linear-gradient(to right,
rgba(40, 40, 40, 0.05) 1px,
transparent 1px),
linear-gradient(to bottom,
rgba(40, 40, 40, 0.05) 1px,
transparent 1px);
}
.card {
@ -37,7 +45,9 @@
<!-- Minimal header -->
<header class="py-4 px-6 bg-black/50 backdrop-blur-sm border-b border-gray-800/50">
<div class="container mx-auto flex justify-between items-center">
<h1 class="text-xl font-medium tracking-tight text-white">Caddy Dashboard</h1>
<h1 class="text-xl font-medium tracking-tight text-white">
Caddy Dashboard
</h1>
<div class="flex items-center gap-3">
<a href="/caddy"
class="text-sm px-3 py-1.5 bg-zinc-800 hover:bg-zinc-700 border border-zinc-700 rounded-md transition-colors">
@ -111,8 +121,12 @@
<i class="fas fa-server text-2xl"></i>
</div>
<div>
<h3 class="text-xl font-medium text-white">Caddy Server Dashboard</h3>
<p class="text-sm text-gray-500 mt-1">View all Caddy reverse proxy configurations</p>
<h3 class="text-xl font-medium text-white">
Caddy Server Dashboard
</h3>
<p class="text-sm text-gray-500 mt-1">
View all Caddy reverse proxy configurations
</p>
</div>
</div>
<div class="flex justify-between items-center mt-2">
@ -127,8 +141,12 @@
<i class="fas fa-server text-2xl"></i>
</div>
<div>
<h3 class="text-xl font-medium text-white">Nginx Server Dashboard</h3>
<p class="text-sm text-gray-500 mt-1">View all Nginx proxy configurations</p>
<h3 class="text-xl font-medium text-white">
Nginx Server Dashboard
</h3>
<p class="text-sm text-gray-500 mt-1">
View all Nginx proxy configurations
</p>
</div>
</div>
<div class="flex justify-between items-center mt-2">
@ -142,17 +160,19 @@
<div class="card bg-zinc-900 border border-zinc-800 rounded-lg overflow-hidden mb-6">
<div class="px-6 py-4 border-b border-zinc-800">
<h3 class="text-lg font-medium text-white">Active Domains</h3>
<p class="text-xs text-gray-500 mt-1">All configured domains across servers</p>
<p class="text-xs text-gray-500 mt-1">
All configured domains across servers
</p>
</div>
<div class="divide-y divide-zinc-800">
{% if domain_list %}
{% for item in domain_list[:20] %}
{% if caddy_proxies %}
<p>Caddy</p>
{% for item in caddy_proxies[:20] %}
<div class="px-6 py-3 flex items-center justify-between hover:bg-zinc-800/30">
<div class="flex items-center">
<div
class="w-8 h-8 flex-shrink-0 flex items-center justify-center rounded-full
{% if item.server_type == 'caddy' %}bg-blue-500/10 text-blue-400{% else %}bg-green-500/10 text-green-400{% endif %} mr-3">
class="w-8 h-8 flex-shrink-0 flex items-center justify-center rounded-full {% if item.server_type == 'caddy' %}bg-blue-500/10 text-blue-400{% else %}bg-green-500/10 text-green-400{% endif %} mr-3">
<i class="fas fa-globe text-xs"></i>
</div>
<div>
@ -171,18 +191,85 @@
</a>
</div>
</div>
{% endfor %}
{% else %}
{% endfor %} {% else %}
<div class="px-6 py-4 text-gray-500 text-center">
<p>No domains configured yet</p>
<p>No caddy-domains configured yet</p>
</div>
{% endif %}
</div>
<div class="divide-y divide-zinc-800">
{% if nginx_proxies %}
<p>Nginx</p>
{% for item in nginx_proxies[:20] %}
<div class="px-6 py-3 flex items-center justify-between hover:bg-zinc-800/30">
<div class="flex items-center">
<div
class="w-8 h-8 flex-shrink-0 flex items-center justify-center rounded-full {% if item.server_type == 'caddy' %}bg-blue-500/10 text-blue-400{% else %}bg-green-500/10 text-green-400{% endif %} mr-3">
<i class="fas fa-globe text-xs"></i>
</div>
<div>
<a href="https://{{ item.domain }}" target="_blank"
class="text-sm font-medium text-white hover:text-blue-400 transition-colors">
{{ item.domain }}
</a>
<p class="text-xs text-gray-500">{{ item.server }}</p>
</div>
</div>
<div class="flex items-center">
<span class="text-xs text-gray-500 font-mono mr-4">{{ item.target }}</span>
<a href="/{% if item.server_type == 'caddy' %}caddy{% else %}nginx{% endif %}"
class="text-xs px-2 py-1 rounded bg-zinc-800 hover:bg-zinc-700 transition-colors">
{{ item.server_type }}
</a>
</div>
</div>
{% endfor %} {% else %}
<div class="px-6 py-4 text-gray-500 text-center">
<p>No nginx-domains configured yet</p>
</div>
{% endif %}
</div>
<!-- <div class="divide-y divide-zinc-800"> -->
<!-- {% if domain_list %} -->
<!-- {% for item in domain_list[:20] %} -->
<!-- <div class="px-6 py-3 flex items-center justify-between hover:bg-zinc-800/30"> -->
<!-- <div class="flex items-center"> -->
<!-- <div -->
<!-- class="w-8 h-8 flex-shrink-0 flex items-center justify-center rounded-full -->
<!-- {% if item.server_type == 'caddy' %}bg-blue-500/10 text-blue-400{% else %}bg-green-500/10 text-green-400{% endif %} mr-3"> -->
<!-- <i class="fas fa-globe text-xs"></i> -->
<!-- </div> -->
<!-- <div> -->
<!-- <a href="https://{{ item.domain }}" target="_blank" -->
<!-- class="text-sm font-medium text-white hover:text-blue-400 transition-colors"> -->
<!-- {{ item.domain }} -->
<!-- </a> -->
<!-- <p class="text-xs text-gray-500">{{ item.server }}</p> -->
<!-- </div> -->
<!-- </div> -->
<!-- <div class="flex items-center"> -->
<!-- <span class="text-xs text-gray-500 font-mono mr-4">{{ item.target }}</span> -->
<!-- <a href="/{% if item.server_type == 'caddy' %}caddy{% else %}nginx{% endif %}" -->
<!-- class="text-xs px-2 py-1 rounded bg-zinc-800 hover:bg-zinc-700 transition-colors"> -->
<!-- {{ item.server_type }} -->
<!-- </a> -->
<!-- </div> -->
<!-- </div> -->
<!-- {% endfor %} -->
<!-- {% else %} -->
<!-- <div class="px-6 py-4 text-gray-500 text-center"> -->
<!-- <p>No domains configured yet</p> -->
<!-- </div> -->
<!-- {% endif %} -->
<!-- </div> -->
{% if domain_list|length > 20 %}
<div class="px-6 py-3 border-t border-zinc-800 text-center">
<a href="/caddy" class="text-sm text-gray-500 hover:text-white transition-colors">
View all {{ domain_list|length }} domains <i class="fas fa-arrow-right ml-1"></i>
View all {{ domain_list|length }} domains
<i class="fas fa-arrow-right ml-1"></i>
</a>
</div>
{% endif %}
@ -196,4 +283,4 @@
</footer>
</body>
</html>
</html>