v1.4.4 — 蓝图改为 Tab 筛选+明细列表

- 顶栏六板块卡片只显示统计数
- 新增立志/责善/勤学/全部四个 Tab
- 明细列表显示每条记录的板块+类型+内容
- 类型标签颜色区分（立志黄/责善红/勤学绿）

static/app.js

@@ -1009,34 +1009,82 @@
      Blueprint — 蓝图六板块
      ================================================================ */
 
+  var blueprintData = null;
+  var blueprintFilter = 'all';
+
   function loadBlueprint() {
     apiGetStats(function(err, data) {
       if (err || !data || !data.pillar_breakdown) return;
-      var pb = data.pillar_breakdown;
-      PILLARS.forEach(function(p){
-        var el = document.getElementById('bp-count-' + p.name);
-        var info = pb[p.name] || {};
-        var m = info.morning || 0, e = info.evening || 0, s = info.study || 0;
-        if (el) el.textContent = '立志' + m + ' · 责善' + e + ' · 勤学' + s;
-        // 显示详情列表
-        var detailEl = document.getElementById('bp-detail-' + p.name);
-        if (detailEl) {
-          var html = '';
-          (info.morning_items || []).forEach(function(mi){
-            html += '<div class="bp-item" data-type="morning">🥼 ' + esc(mi.text) + '</div>';
-          });
-          (info.evening_items || []).forEach(function(ei){
-            html += '<div class="bp-item" data-type="evening">🔍 ' + esc(ei.mistake || ei.improvement) + '</div>';
-          });
-          (info.study_items || []).forEach(function(si){
-            html += '<div class="bp-item" data-type="study">📚 ' + esc(si.name) + '</div>';
-          });
-          detailEl.innerHTML = html || '<div class="bp-empty">暂无记录</div>';
-        }
-      });
+      blueprintData = data.pillar_breakdown;
+      renderBlueprintPillars(blueprintData);
+      renderBlueprintList();
     });
   }
 
+  function renderBlueprintPillars(pb) {
+    var container = document.getElementById('blueprint-pillars');
+    if (!container) return;
+    var html = '';
+    PILLARS.forEach(function(p){
+      var info = pb[p.name] || {};
+      var m = info.morning || 0, e = info.evening || 0, s = info.study || 0;
+      var total = m + e + s;
+      html += '<div class="blueprint-pillar" data-pillar="' + p.name + '">' +
+        '<div class="bp-icon">' + p.emoji + '</div>' +
+        '<div class="bp-name">' + p.name + '</div>' +
+        '<div class="bp-count">' +
+          (m ? '<span class="bp-type morning">🥼' + m + '</span>' : '') +
+          (e ? '<span class="bp-type evening">🔍' + e + '</span>' : '') +
+          (s ? '<span class="bp-type study">📚' + s + '</span>' : '') +
+          (total === 0 ? '<span class="bp-type">—</span>' : '') +
+        '</div>' +
+      '</div>';
+    });
+    container.innerHTML = html;
+  }
+
+  function renderBlueprintList() {
+    var list = document.getElementById('bp-list');
+    var empty = document.getElementById('bp-list-empty');
+    if (!list || !blueprintData) return;
+    var items = [];
+    PILLARS.forEach(function(p){
+      var info = blueprintData[p.name] || {};
+      if (blueprintFilter === 'all' || blueprintFilter === 'morning') {
+        (info.morning_items || []).forEach(function(mi){ items.push({pillar: p, text: mi.text, type: 'morning'}); });
+      }
+      if (blueprintFilter === 'all' || blueprintFilter === 'evening') {
+        (info.evening_items || []).forEach(function(ei){ items.push({pillar: p, text: ei.mistake || ei.improvement, type: 'evening'}); });
+      }
+      if (blueprintFilter === 'all' || blueprintFilter === 'study') {
+        (info.study_items || []).forEach(function(si){ items.push({pillar: p, text: si.name, type: 'study', done: si.done}); });
+      }
+    });
+    if (items.length === 0) {
+      list.innerHTML = '';
+      if (empty) empty.style.display = 'block';
+      return;
+    }
+    if (empty) empty.style.display = 'none';
+    var typeLabels = {morning: '立志', evening: '责善', study: '勤学'};
+    var html = '';
+    items.forEach(function(item){
+      html += '<div class="bp-list-item">' +
+        '<span class="bp-item-pillar">' + item.pillar.emoji + ' ' + item.pillar.name + '</span>' +
+        '<span class="bp-item-type ' + item.type + '">' + (typeLabels[item.type] || item.type) + '</span>' +
+        '<span class="bp-item-text">' + esc(item.text) + '</span>' +
+      '</div>';
+    });
+    list.innerHTML = html;
+  }
+
+  window.filterBlueprint = function(btn) {
+    blueprintFilter = btn.dataset.filter;
+    document.querySelectorAll('.bp-tab').forEach(function(t){ t.classList.remove('active'); });
+    btn.classList.add('active');
+    renderBlueprintList();
+  };
+
   /* ================================================================
      Init
      ================================================================ */