feat: add web admin panel for node management

Add Flask panel with login, add/delete nodes, and share link copy.
Generate sing-box config from SQLite; add uninstall script and clean install flow.
Panel served at https://DOMAIN:8444 via nginx.

Co-authored-by: Cursor <cursoragent@cursor.com>

panel/static/app.js

@@ -0,0 +1,74 @@
+function toast(msg) {
+  const el = document.getElementById("toast");
+  el.textContent = msg;
+  el.classList.remove("hidden");
+  setTimeout(() => el.classList.add("hidden"), 2200);
+}
+
+document.querySelectorAll("[data-copy]").forEach((btn) => {
+  btn.addEventListener("click", async () => {
+    const text = btn.dataset.copy;
+    try {
+      await navigator.clipboard.writeText(text);
+      toast("已复制到剪贴板");
+    } catch {
+      toast("复制失败，请手动选择文本");
+    }
+  });
+});
+
+const modal = document.getElementById("modal");
+const addBtn = document.getElementById("addBtn");
+const cancelBtn = document.getElementById("cancelBtn");
+const confirmAddBtn = document.getElementById("confirmAddBtn");
+const nodeName = document.getElementById("nodeName");
+
+if (addBtn) {
+  addBtn.addEventListener("click", () => {
+    nodeName.value = "";
+    modal.classList.remove("hidden");
+    nodeName.focus();
+  });
+}
+
+if (cancelBtn) {
+  cancelBtn.addEventListener("click", () => modal.classList.add("hidden"));
+}
+
+if (confirmAddBtn) {
+  confirmAddBtn.addEventListener("click", async () => {
+    const name = nodeName.value.trim() || "新节点";
+    confirmAddBtn.disabled = true;
+    try {
+      const res = await fetch("/api/nodes", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ name }),
+      });
+      const data = await res.json();
+      if (!res.ok) throw new Error(data.error || "创建失败");
+      location.reload();
+    } catch (err) {
+      toast(err.message);
+    } finally {
+      confirmAddBtn.disabled = false;
+    }
+  });
+}
+
+document.querySelectorAll(".delete-btn").forEach((btn) => {
+  btn.addEventListener("click", async () => {
+    const id = btn.dataset.id;
+    if (!confirm("确定删除该节点？删除后对应链接将失效。")) return;
+    btn.disabled = true;
+    try {
+      const res = await fetch(`/api/nodes/${id}`, { method: "DELETE" });
+      const data = await res.json();
+      if (!res.ok) throw new Error(data.error || "删除失败");
+      location.reload();
+    } catch (err) {
+      toast(err.message);
+      btn.disabled = false;
+    }
+  });
+});

panel/static/style.css

@@ -0,0 +1,171 @@
+:root {
+  --bg: #0f1419;
+  --card: #1a2332;
+  --border: #2a3544;
+  --text: #e7ecf3;
+  --muted: #8b98a8;
+  --primary: #3b82f6;
+  --danger: #ef4444;
+  --radius: 12px;
+}
+
+* { box-sizing: border-box; }
+body {
+  margin: 0;
+  font-family: "Segoe UI", system-ui, sans-serif;
+  background: var(--bg);
+  color: var(--text);
+  min-height: 100vh;
+}
+
+.auth-wrap {
+  min-height: 100vh;
+  display: grid;
+  place-items: center;
+  padding: 24px;
+}
+
+.auth-card, .modal-card, .node-card {
+  background: var(--card);
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+  padding: 24px;
+}
+
+.auth-card { width: min(420px, 100%); }
+.auth-card h1 { margin: 0 0 8px; font-size: 1.5rem; }
+
+.topbar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 16px 24px;
+  border-bottom: 1px solid var(--border);
+  background: rgba(26, 35, 50, 0.8);
+  backdrop-filter: blur(8px);
+  position: sticky;
+  top: 0;
+}
+
+.container { max-width: 960px; margin: 0 auto; padding: 24px; }
+
+.hero {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  gap: 16px;
+  margin-bottom: 24px;
+}
+
+.hero h1 { margin: 0 0 8px; }
+
+.muted { color: var(--muted); }
+
+.form label, .field label {
+  display: block;
+  margin: 12px 0 6px;
+  color: var(--muted);
+  font-size: 0.9rem;
+}
+
+input[type="text"],
+input[type="password"],
+input[readonly] {
+  width: 100%;
+  padding: 10px 12px;
+  border-radius: 8px;
+  border: 1px solid var(--border);
+  background: #111827;
+  color: var(--text);
+}
+
+.btn {
+  border: 1px solid var(--border);
+  background: #111827;
+  color: var(--text);
+  padding: 8px 14px;
+  border-radius: 8px;
+  cursor: pointer;
+  text-decoration: none;
+  display: inline-block;
+}
+
+.btn:hover { border-color: var(--primary); }
+.btn.primary {
+  background: var(--primary);
+  border-color: var(--primary);
+  color: white;
+}
+.btn.ghost { background: transparent; }
+.btn.danger {
+  color: var(--danger);
+  border-color: rgba(239, 68, 68, 0.4);
+}
+
+.node-list { display: grid; gap: 16px; }
+.node-head {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 12px;
+}
+.node-head h2 { margin: 0; font-size: 1.1rem; }
+.tag {
+  font-size: 0.8rem;
+  color: var(--muted);
+  background: #111827;
+  padding: 4px 8px;
+  border-radius: 999px;
+}
+
+.copy-row {
+  display: grid;
+  grid-template-columns: 1fr auto;
+  gap: 8px;
+}
+
+.node-actions { margin-top: 16px; text-align: right; }
+
+.alert {
+  background: rgba(239, 68, 68, 0.15);
+  border: 1px solid rgba(239, 68, 68, 0.35);
+  padding: 10px 12px;
+  border-radius: 8px;
+  margin: 12px 0;
+}
+
+.toast {
+  position: fixed;
+  right: 24px;
+  bottom: 24px;
+  background: var(--card);
+  border: 1px solid var(--border);
+  padding: 12px 16px;
+  border-radius: 8px;
+  z-index: 20;
+}
+
+.hidden { display: none !important; }
+
+.modal {
+  position: fixed;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.55);
+  display: grid;
+  place-items: center;
+  padding: 24px;
+  z-index: 10;
+}
+
+.modal-card { width: min(420px, 100%); }
+.modal-actions {
+  display: flex;
+  justify-content: flex-end;
+  gap: 8px;
+  margin-top: 20px;
+}
+
+@media (max-width: 640px) {
+  .hero { flex-direction: column; align-items: flex-start; }
+  .copy-row { grid-template-columns: 1fr; }
+}