浏览代码

feat: lake console page tabs (overview / detail) with lazy report init

KenZ1117 2 周之前
父节点
当前提交
80caff061d
共有 4 个文件被更改,包括 35 次插入 和 6 次删除
  1. 1 4
      public/app.js
  2. 11 0
      public/index.html
  3. 21 1
      public/lake.js
  4. 2 1
      public/reports.js

+ 1 - 4
public/app.js

@@ -343,10 +343,7 @@
     if (name === 'tasks' && window.shanTasksInit) window.shanTasksInit();
     if (name === 'history' && window.shanHistoryInit) window.shanHistoryInit();
     if (name === 'reports' && window.shanReportsInit) window.shanReportsInit();
-    if (name === 'lake') {
-      if (window.shanReportsInit) window.shanReportsInit(); // 明细浏览(含全部字段)已挪到中台
-      if (window.shanLakeInit) window.shanLakeInit();
-    }
+    if (name === 'lake' && window.shanLakeInit) window.shanLakeInit(); // 明细 tab 激活时再懒加载报表
     if (name === 'analysis' && window.shanAnalysisActivate) window.shanAnalysisActivate();
     if (name === 'settings') initSettings();
     // 系统日志:仅日志页激活时轮询

+ 11 - 0
public/index.html

@@ -342,6 +342,13 @@
           </div>
         </div>
 
+
+        <div class="seg-control lake-tabs" id="lakeTabs" role="tablist" style="margin-bottom:14px; max-width:fit-content;">
+          <button type="button" class="active" data-tab="overview">湖全景</button>
+          <button type="button" data-tab="detail">明细数据</button>
+        </div>
+
+        <div id="lakeTabOverview">
         <div class="stats-grid" id="lakeKpis">
           <div class="metric"><span class="metric-body"><span class="metric-label">数据主体</span><span class="metric-value" id="lakeEntityCount">–</span><span class="metric-sub">已注册的商家账号</span></span></div>
           <div class="metric"><span class="metric-body"><span class="metric-label">湖内总行数</span><span class="metric-value" id="lakeRowCount">–</span><span class="metric-sub">按 日期×维度×门店 幂等去重</span></span></div>
@@ -369,6 +376,9 @@
           <div class="help">冲突策略:同一行(日期×账号×维度×门店)多机写入时以取数时间新者为准;云端更新的行不会被本机旧数据覆盖。大批量全零数据会被拦截,防止取数异常污染云端主档案。</div>
         </div>
 
+        </div>
+
+        <div id="lakeTabDetail" hidden>
         <div class="entity-tabs" id="lakeEntityTabs"></div>
 
         <div class="report-toolbar panel">
@@ -443,6 +453,7 @@
           </div>
         </div>
 
+        </div>
       </main>
     </div>
 

+ 21 - 1
public/lake.js

@@ -96,12 +96,32 @@
     }
   }
 
+  // 页内 tab:湖全景 / 明细数据(明细区首次激活时才初始化报表浏览,懒加载)
+  function activateLakeTab(tab) {
+    const tabs = $('lakeTabs');
+    if (!tabs) return;
+    tabs.querySelectorAll('button').forEach((b) => b.classList.toggle('active', b.dataset.tab === tab));
+    $('lakeTabOverview').hidden = tab !== 'overview';
+    $('lakeTabDetail').hidden = tab !== 'detail';
+    if (tab === 'overview') loadLake();
+    else if (window.shanReportsInit) window.shanReportsInit();
+  }
+
   window.shanLakeInit = function () {
     if (!inited) {
       inited = true;
       $('btnLakeRefresh').addEventListener('click', loadLake);
       $('btnLakePull').addEventListener('click', pullAll);
+      $('lakeTabs').addEventListener('click', (event) => {
+        const btn = event.target.closest('button[data-tab]');
+        if (btn) activateLakeTab(btn.dataset.tab);
+      });
     }
-    loadLake();
+    activateLakeTab('overview');
+  };
+
+  // 供问数「应用到报表」等外部入口直接落到明细 tab
+  window.shanLakeShowDetail = function () {
+    activateLakeTab('detail');
   };
 })();

+ 2 - 1
public/reports.js

@@ -958,7 +958,8 @@
     state.shopFilter = new Set((a.shopIds || []).map(String));
     renderShopOptions();
     loadReport();
-    // 明细浏览已挪到数据中台页,应用后跳到中台
+    // 明细浏览在数据中台页:先切到明细 tab,再导航过去
+    if (window.shanLakeShowDetail) window.shanLakeShowDetail();
     const nav = document.querySelector('.nav-item[data-view="lake"]');
     if (nav) nav.click();
   }