initial: blog-app snapshot

static/js/pages/index.js

@@ -0,0 +1,41 @@
+/* 首页逻辑: 统计卡片 + 项目 dashboard.
+ * renderProjectCard 由模板内联 module 注入 (templates/index.html 直接引用组件,
+ * 保持组件对模板可见, 便于逐页切换验证).
+ */
+
+import { fetchJson } from "../utils.js";
+import { renderStatsCards } from "../components/stats-card.js";
+
+export function initIndexPage(renderProjectCard) {
+    async function loadStats() {
+        try {
+            const stats = await fetchJson("/api/stats");
+            renderStatsCards(stats);
+        } catch (err) {
+            console.error("加载统计失败:", err);
+        }
+    }
+
+    async function loadProjects() {
+        const container = document.getElementById("projectCards");
+        try {
+            const projects = await fetchJson("/api/projects");
+            if (!projects.length) {
+                container.innerHTML = '<div class="empty-hint">暂无项目数据</div>';
+                return;
+            }
+            container.innerHTML = projects
+                .map((p) => renderProjectCard(p, { showDescription: false }))
+                .join("");
+        } catch (err) {
+            console.error("加载项目失败:", err);
+            container.innerHTML =
+                '<div class="empty-hint empty-hint-error">加载失败, <button type="button" class="btn btn-sm btn-outline-danger js-retry-btn">点击重试</button></div>';
+        }
+    }
+
+    document.addEventListener("DOMContentLoaded", () => {
+        loadStats();
+        loadProjects();
+    });
+}