first commit

templates/index.html

@@ -0,0 +1,79 @@
+{% extends "base.html" %}
+{% block title %}导航 · 本地导航{% endblock %}
+{% block body %}
+<div class="app-shell">
+<header class="topbar">
+  <h1>本地导航</h1>
+  <nav>
+    <span class="user">{{ current_user.username }}</span>
+    <a href="{{ url_for('admin_groups') }}">分组管理</a>
+    <a href="{{ url_for('admin_services') }}">服务管理</a>
+    <a href="{{ url_for('logout') }}">退出</a>
+  </nav>
+</header>
+{% with messages = get_flashed_messages(with_categories=true) %}
+{% if messages %}
+<div class="flash-wrap" style="padding-top: 0.5rem">
+  {% for cat, msg in messages %}
+  <div class="flash {{ cat }}">{{ msg }}</div>
+  {% endfor %}
+</div>
+{% endif %}
+{% endwith %}
+<div class="layout-main">
+  <aside class="sidebar" id="sidebar">
+    {% for group, services in grouped %}
+    <div class="sidebar-section">
+      <h2>{{ group.name }}</h2>
+      {% for svc in services %}
+      <a
+        href="#"
+        class="nav-link"
+        role="button"
+        data-url="{{ svc.build_url() }}"
+        data-name="{{ svc.name | e }}"
+        >{{ svc.name }}</a
+      >
+      {% else %}
+      <div class="hint" style="padding: 0 1rem">该分组下暂无服务</div>
+      {% endfor %}
+    </div>
+    {% else %}
+    <div class="hint" style="padding: 1rem">
+      暂无分组与服务，请到「分组管理」「服务管理」添加。
+    </div>
+    {% endfor %}
+  </aside>
+  <div class="frame-wrap">
+    <div class="frame-placeholder" id="placeholder">在左侧点击服务，在此区域以内嵌方式打开（不跳转、不开新标签）</div>
+    <iframe id="svc-frame" title="内嵌服务" hidden></iframe>
+  </div>
+</div>
+</div>
+<script>
+  (function () {
+    var frame = document.getElementById("svc-frame");
+    var placeholder = document.getElementById("placeholder");
+    var links = document.querySelectorAll(".nav-link[data-url]");
+
+    function setActive(el) {
+      links.forEach(function (a) {
+        a.classList.remove("active");
+      });
+      if (el) el.classList.add("active");
+    }
+
+    links.forEach(function (a) {
+      a.addEventListener("click", function (e) {
+        e.preventDefault();
+        var url = a.getAttribute("data-url");
+        if (!url) return;
+        placeholder.hidden = true;
+        frame.hidden = false;
+        frame.src = url;
+        setActive(a);
+      });
+    });
+  })();
+</script>
+{% endblock %}