@finebi/finebi-cli 1.6.2 → 2.0.0

package/skills/finebi-cli-agent/scripts/finebi-cli/templates/web-app/examples/retail.config.json

@@ -1,185 +1,185 @@
-{
-  "schemaVersion": "1",
-  "templateVersion": "0.3.0",
-  "title": "零售经营简报",
-  "description": "请根据同一来源的真实指标、字段和控件替换绑定。",
-  "basePath": "/webroot/decision",
-  "layout": "retail",
-  "dashboardId": "REPLACE_DASHBOARD_ID",
-  "directoryEntryId": "REPLACE_DIRECTORY_ENTRY_ID",
-  "maxRows": 1000,
-  "pageSize": 8,
-  "insights": false,
-  "widgets": [
-    {
-      "entryId": "REPLACE_ENTRY_1",
-      "name": "销售额",
-      "type": "kpi",
-      "description": "替换为已核实的源指标口径与范围。",
-      "filterNames": [],
-      "valueFieldId": "REPLACE_VALUE_1",
-      "valueFormat": "number"
-    },
-    {
-      "entryId": "REPLACE_ENTRY_2",
-      "name": "毛利",
-      "type": "kpi",
-      "description": "替换为已核实的源指标口径与范围。",
-      "filterNames": [],
-      "valueFieldId": "REPLACE_VALUE_2",
-      "valueFormat": "number"
-    },
-    {
-      "entryId": "REPLACE_ENTRY_3",
-      "name": "比率指标",
-      "type": "kpi",
-      "description": "替换为已核实的源指标口径与范围。",
-      "filterNames": [],
-      "valueFieldId": "REPLACE_VALUE_3",
-      "valueFormat": "percent"
-    },
-    {
-      "entryId": "REPLACE_ENTRY_4",
-      "name": "计数指标",
-      "type": "kpi",
-      "description": "替换为已核实的源指标口径与范围。",
-      "filterNames": [],
-      "valueFieldId": "REPLACE_VALUE_4",
-      "valueFormat": "number"
-    },
-    {
-      "entryId": "REPLACE_ENTRY_5",
-      "name": "销售与毛利趋势",
-      "type": "line",
-      "description": "替换为已核实的源指标口径与范围。",
-      "filterNames": [],
-      "categoryFieldId": "REPLACE_CATEGORY_5",
-      "valueFieldId": "REPLACE_VALUE_5",
-      "categoryFormat": "epoch-month",
-      "categoryTimeZone": "Asia/Shanghai",
-      "series": [
-        {
-          "fieldId": "REPLACE_SERIES_5_1",
-          "label": "销售额"
-        },
-        {
-          "fieldId": "REPLACE_SERIES_5_2",
-          "label": "毛利"
-        }
-      ]
-    },
-    {
-      "entryId": "REPLACE_ENTRY_6",
-      "name": "销售额 TOP10 门店",
-      "type": "bar",
-      "description": "替换为已核实的源指标口径与范围。",
-      "filterNames": [],
-      "categoryFieldId": "REPLACE_CATEGORY_6",
-      "valueFieldId": "REPLACE_VALUE_6"
-    },
-    {
-      "entryId": "REPLACE_ENTRY_7",
-      "name": "区域销售构成",
-      "type": "pie",
-      "description": "替换为已核实的源指标口径与范围。",
-      "filterNames": [],
-      "categoryFieldId": "REPLACE_CATEGORY_7",
-      "valueFieldId": "REPLACE_VALUE_7"
-    },
-    {
-      "entryId": "REPLACE_ENTRY_8",
-      "name": "品类销售额",
-      "type": "bar",
-      "description": "替换为已核实的源指标口径与范围。",
-      "filterNames": [],
-      "categoryFieldId": "REPLACE_CATEGORY_8",
-      "valueFieldId": "REPLACE_VALUE_8"
-    },
-    {
-      "entryId": "REPLACE_ENTRY_9",
-      "name": "自有店 / 管理店销售趋势",
-      "type": "line",
-      "description": "替换为已核实的源指标口径与范围。",
-      "filterNames": [],
-      "categoryFieldId": "REPLACE_CATEGORY_9",
-      "valueFieldId": "REPLACE_VALUE_9",
-      "categoryFormat": "epoch-month",
-      "categoryTimeZone": "Asia/Shanghai",
-      "series": [
-        {
-          "fieldId": "REPLACE_SERIES_9_1",
-          "label": "自有店"
-        },
-        {
-          "fieldId": "REPLACE_SERIES_9_2",
-          "label": "管理店"
-        }
-      ]
-    },
-    {
-      "entryId": "REPLACE_ENTRY_10",
-      "name": "生活馆 / 时尚馆销售趋势",
-      "type": "line",
-      "description": "替换为已核实的源指标口径与范围。",
-      "filterNames": [],
-      "categoryFieldId": "REPLACE_CATEGORY_10",
-      "valueFieldId": "REPLACE_VALUE_10",
-      "categoryFormat": "epoch-month",
-      "categoryTimeZone": "Asia/Shanghai",
-      "series": [
-        {
-          "fieldId": "REPLACE_SERIES_10_1",
-          "label": "生活馆"
-        },
-        {
-          "fieldId": "REPLACE_SERIES_10_2",
-          "label": "时尚馆"
-        }
-      ]
-    },
-    {
-      "entryId": "REPLACE_ENTRY_11",
-      "name": "门店风格构成",
-      "type": "pie",
-      "description": "替换为已核实的源指标口径与范围。",
-      "filterNames": [],
-      "categoryFieldId": "REPLACE_CATEGORY_11",
-      "valueFieldId": "REPLACE_VALUE_11"
-    },
-    {
-      "entryId": "REPLACE_ENTRY_12",
-      "name": "门店性质构成",
-      "type": "pie",
-      "description": "替换为已核实的源指标口径与范围。",
-      "filterNames": [],
-      "categoryFieldId": "REPLACE_CATEGORY_12",
-      "valueFieldId": "REPLACE_VALUE_12"
-    },
-    {
-      "entryId": "REPLACE_ENTRY_13",
-      "name": "门店经营明细",
-      "type": "table",
-      "description": "替换为已核实的源指标口径与范围。",
-      "filterNames": [],
-      "tableFieldIds": [
-        "REPLACE_TABLE_FIELD_1",
-        "REPLACE_TABLE_FIELD_2",
-        "REPLACE_TABLE_FIELD_3",
-        "REPLACE_TABLE_FIELD_4"
-      ],
-      "localFilterFieldIds": [
-        "REPLACE_TABLE_FIELD_1"
-      ]
-    }
-  ],
-  "filters": [
-    {
-      "name": "REPLACE_STORE_CONTROL",
-      "label": "店名（精确匹配）",
-      "type": "text"
-    }
-  ],
-  "dataNotes": [
-    "请填写已核实的来源、单位、期间、门店计数口径与控件作用范围。未确认公式时保留源指标名称。"
-  ]
-}
+{
+  "schemaVersion": "1",
+  "templateVersion": "0.3.0",
+  "title": "零售经营简报",
+  "description": "请根据同一来源的真实指标、字段和控件替换绑定。",
+  "basePath": "/webroot/decision",
+  "layout": "retail",
+  "dashboardId": "REPLACE_DASHBOARD_ID",
+  "directoryEntryId": "REPLACE_DIRECTORY_ENTRY_ID",
+  "maxRows": 1000,
+  "pageSize": 8,
+  "insights": false,
+  "widgets": [
+    {
+      "entryId": "REPLACE_ENTRY_1",
+      "name": "销售额",
+      "type": "kpi",
+      "description": "替换为已核实的源指标口径与范围。",
+      "filterNames": [],
+      "valueFieldId": "REPLACE_VALUE_1",
+      "valueFormat": "number"
+    },
+    {
+      "entryId": "REPLACE_ENTRY_2",
+      "name": "毛利",
+      "type": "kpi",
+      "description": "替换为已核实的源指标口径与范围。",
+      "filterNames": [],
+      "valueFieldId": "REPLACE_VALUE_2",
+      "valueFormat": "number"
+    },
+    {
+      "entryId": "REPLACE_ENTRY_3",
+      "name": "比率指标",
+      "type": "kpi",
+      "description": "替换为已核实的源指标口径与范围。",
+      "filterNames": [],
+      "valueFieldId": "REPLACE_VALUE_3",
+      "valueFormat": "percent"
+    },
+    {
+      "entryId": "REPLACE_ENTRY_4",
+      "name": "计数指标",
+      "type": "kpi",
+      "description": "替换为已核实的源指标口径与范围。",
+      "filterNames": [],
+      "valueFieldId": "REPLACE_VALUE_4",
+      "valueFormat": "number"
+    },
+    {
+      "entryId": "REPLACE_ENTRY_5",
+      "name": "销售与毛利趋势",
+      "type": "line",
+      "description": "替换为已核实的源指标口径与范围。",
+      "filterNames": [],
+      "categoryFieldId": "REPLACE_CATEGORY_5",
+      "valueFieldId": "REPLACE_VALUE_5",
+      "categoryFormat": "epoch-month",
+      "categoryTimeZone": "Asia/Shanghai",
+      "series": [
+        {
+          "fieldId": "REPLACE_SERIES_5_1",
+          "label": "销售额"
+        },
+        {
+          "fieldId": "REPLACE_SERIES_5_2",
+          "label": "毛利"
+        }
+      ]
+    },
+    {
+      "entryId": "REPLACE_ENTRY_6",
+      "name": "销售额 TOP10 门店",
+      "type": "bar",
+      "description": "替换为已核实的源指标口径与范围。",
+      "filterNames": [],
+      "categoryFieldId": "REPLACE_CATEGORY_6",
+      "valueFieldId": "REPLACE_VALUE_6"
+    },
+    {
+      "entryId": "REPLACE_ENTRY_7",
+      "name": "区域销售构成",
+      "type": "pie",
+      "description": "替换为已核实的源指标口径与范围。",
+      "filterNames": [],
+      "categoryFieldId": "REPLACE_CATEGORY_7",
+      "valueFieldId": "REPLACE_VALUE_7"
+    },
+    {
+      "entryId": "REPLACE_ENTRY_8",
+      "name": "品类销售额",
+      "type": "bar",
+      "description": "替换为已核实的源指标口径与范围。",
+      "filterNames": [],
+      "categoryFieldId": "REPLACE_CATEGORY_8",
+      "valueFieldId": "REPLACE_VALUE_8"
+    },
+    {
+      "entryId": "REPLACE_ENTRY_9",
+      "name": "自有店 / 管理店销售趋势",
+      "type": "line",
+      "description": "替换为已核实的源指标口径与范围。",
+      "filterNames": [],
+      "categoryFieldId": "REPLACE_CATEGORY_9",
+      "valueFieldId": "REPLACE_VALUE_9",
+      "categoryFormat": "epoch-month",
+      "categoryTimeZone": "Asia/Shanghai",
+      "series": [
+        {
+          "fieldId": "REPLACE_SERIES_9_1",
+          "label": "自有店"
+        },
+        {
+          "fieldId": "REPLACE_SERIES_9_2",
+          "label": "管理店"
+        }
+      ]
+    },
+    {
+      "entryId": "REPLACE_ENTRY_10",
+      "name": "生活馆 / 时尚馆销售趋势",
+      "type": "line",
+      "description": "替换为已核实的源指标口径与范围。",
+      "filterNames": [],
+      "categoryFieldId": "REPLACE_CATEGORY_10",
+      "valueFieldId": "REPLACE_VALUE_10",
+      "categoryFormat": "epoch-month",
+      "categoryTimeZone": "Asia/Shanghai",
+      "series": [
+        {
+          "fieldId": "REPLACE_SERIES_10_1",
+          "label": "生活馆"
+        },
+        {
+          "fieldId": "REPLACE_SERIES_10_2",
+          "label": "时尚馆"
+        }
+      ]
+    },
+    {
+      "entryId": "REPLACE_ENTRY_11",
+      "name": "门店风格构成",
+      "type": "pie",
+      "description": "替换为已核实的源指标口径与范围。",
+      "filterNames": [],
+      "categoryFieldId": "REPLACE_CATEGORY_11",
+      "valueFieldId": "REPLACE_VALUE_11"
+    },
+    {
+      "entryId": "REPLACE_ENTRY_12",
+      "name": "门店性质构成",
+      "type": "pie",
+      "description": "替换为已核实的源指标口径与范围。",
+      "filterNames": [],
+      "categoryFieldId": "REPLACE_CATEGORY_12",
+      "valueFieldId": "REPLACE_VALUE_12"
+    },
+    {
+      "entryId": "REPLACE_ENTRY_13",
+      "name": "门店经营明细",
+      "type": "table",
+      "description": "替换为已核实的源指标口径与范围。",
+      "filterNames": [],
+      "tableFieldIds": [
+        "REPLACE_TABLE_FIELD_1",
+        "REPLACE_TABLE_FIELD_2",
+        "REPLACE_TABLE_FIELD_3",
+        "REPLACE_TABLE_FIELD_4"
+      ],
+      "localFilterFieldIds": [
+        "REPLACE_TABLE_FIELD_1"
+      ]
+    }
+  ],
+  "filters": [
+    {
+      "name": "REPLACE_STORE_CONTROL",
+      "label": "店名（精确匹配）",
+      "type": "text"
+    }
+  ],
+  "dataNotes": [
+    "请填写已核实的来源、单位、期间、门店计数口径与控件作用范围。未确认公式时保留源指标名称。"
+  ]
+}

package/skills/finebi-cli-agent/scripts/finebi-cli/templates/web-app/gitignore.template

@@ -0,0 +1,6 @@
+node_modules/
+dist/
+temp/
+.env
+.env.local
+.env.*.local

package/skills/finebi-cli-agent/scripts/finebi-cli/templates/web-app/index.html

@@ -1,2 +1,2 @@
-<!doctype html>
-<html lang="zh-CN"><head><meta charset="UTF-8"/><meta name="viewport" content="width=device-width, initial-scale=1.0"/><title>FineBI 数据应用</title></head><body><div id="root"></div><script type="module" src="/src/main.tsx"></script></body></html>
+<!doctype html>
+<html lang="zh-CN"><head><meta charset="UTF-8"/><meta name="viewport" content="width=device-width, initial-scale=1.0"/><title>FineBI 数据应用</title></head><body><div id="root"></div><script type="module" src="/src/main.tsx"></script></body></html>

package/skills/finebi-cli-agent/scripts/finebi-cli/templates/web-app/public/app-config.json

@@ -1,11 +1,11 @@
-{
-  "schemaVersion": "1",
-  "title": "FineBI 数据应用",
-  "basePath": "/webroot/decision",
-  "layout": "overview",
-  "dashboardId": "",
-  "maxRows": 1000,
-  "pageSize": 8,
-  "widgets": [],
-  "filters": []
-}
+{
+  "schemaVersion": "1",
+  "title": "FineBI 数据应用",
+  "basePath": "/webroot/decision",
+  "layout": "overview",
+  "dashboardId": "",
+  "maxRows": 1000,
+  "pageSize": 8,
+  "widgets": [],
+  "filters": []
+}

package/skills/finebi-cli-agent/scripts/finebi-cli/templates/web-app/src/App.tsx

@@ -1,63 +1,63 @@
-import {lazy,Suspense,useEffect,useRef,useState} from 'react';
-import {queryWidget,validateConfig} from './finebi/client';
-import type {AppConfig,FilterState,WidgetBinding} from './finebi/types';
-import {Boundary,Widget} from './components/Widget';
-import {Insights} from './components/Insights';
-import {loadWidgets,widgetKey,type WidgetState} from './services/widget-queries';
-import './cockpit.css';
-import './retail.css';
-const FilterBar=lazy(()=>import('./components/FilterBar').then(module=>({default:module.FilterBar})));
-function Dashboard({config}: {config: AppConfig}) {
-  const [filters,setFilters]=useState<FilterState>({}),[refresh,setRefresh]=useState(0);
-  const [states,setStates]=useState<Record<string,WidgetState>>({});
-  const [activeHash,setActiveHash]=useState(()=>window.location.hash||'#dashboard');
-  useEffect(()=>{
-    const syncHash=()=>setActiveHash(window.location.hash||'#dashboard');
-    window.addEventListener('hashchange',syncHash);
-    syncHash();
-    return ()=>window.removeEventListener('hashchange',syncHash);
-  },[]);
-  const generation=useRef(0),retries=useRef(new Map<string,AbortController>());
-  useEffect(()=>{
-    const controller=new AbortController();generation.current++;setStates({});
-    void loadWidgets(config,filters,controller.signal,(key,state)=>setStates(old=>({...old,[key]:state})));
-    return ()=>{controller.abort();retries.current.forEach(c=>c.abort());retries.current.clear();};
-  },[config,filters,refresh]);
-  const retry=async(binding:WidgetBinding,index:number)=>{
-    const key=widgetKey(binding,index),current=generation.current,controller=new AbortController();
-    retries.current.get(key)?.abort();retries.current.set(key,controller);
-    setStates(old=>({...old,[key]:{loading:true}}));
-    try {const result=await queryWidget(config,binding,filters,controller.signal);if(current===generation.current&&!controller.signal.aborted)setStates(old=>({...old,[key]:{loading:false,result,at:new Date().toLocaleTimeString()}}));}
-    catch(error){if(current===generation.current&&!controller.signal.aborted)setStates(old=>({...old,[key]:{loading:false,error:error as Error}}));}
-  };
-  const complete=Object.values(states).filter(s=>s.result).length,failed=Object.values(states).filter(s=>s.error).length;
-  const scope=Object.fromEntries(config.filters.map(filter=>{
-    const known=config.widgets.filter(w=>w.filterNames?.includes(filter.name)).map(w=>w.name);
-    const unknown=config.widgets.some(w=>w.filterNames===undefined);
-    return [filter.name,`${known.length?known.join('、'):'无已确认组件'}${unknown?'；未映射组件由源看板决定':''}`];
-  }));
-  const retail=config.layout==='retail';
-  const card=(binding:WidgetBinding,index:number)=><Widget key={`${refresh}-${JSON.stringify(filters)}-${index}`} binding={binding} state={states[widgetKey(binding,index)]??{loading:true}} pageSize={config.pageSize} onRetry={()=>void retry(binding,index)} compact={retail}/>;
-  const cockpit=config.layout==='cockpit';
-  const separateKpis=cockpit||retail;
-  return <div className={`app ${config.layout}`}>
-    {retail&&<nav className="retail-nav" aria-label="页面导航"><a className="retail-brand" href="#dashboard"><b>F.</b><span>FineBI <small>经营简报</small></span></a><div><a href="#dashboard" aria-current={activeHash==='#dashboard'?'location':undefined}>经营概览</a><a href="#components" aria-current={activeHash==='#components'?'location':undefined}>销售分析</a><a href="#data-notes" aria-current={activeHash==='#data-notes'?'location':undefined}>口径说明</a></div><span className="retail-live">动态数据</span></nav>}
-    {config.layout!=='overview'&&!retail&&<aside><strong>FineBI<span>数据应用</span></strong><nav><a href="#dashboard">数据概览</a><a href="#components">分析组件</a>{config.insights&&<a href="#observations">经营观察</a>}<a href="#data-notes">数据口径</a></nav><p className="source-label">{config.directoryEntryId?'目录发布来源':'分析主题来源'}<br/>访问者权限由 FineBI 控制</p></aside>}
-    <main id="dashboard"><header><div><span className="eyebrow">FINEBI · LIVE DATA</span><h1>{config.title}</h1><p className="muted">{config.description??'基于源看板的实时数据，按当前访问权限呈现'}</p></div><div className="header-actions"><a href={retail?'#data-notes':config.basePath} target={retail?undefined:'_blank'} rel="noreferrer">{retail?'口径说明':'打开 FineBI'}</a><button onClick={()=>setRefresh(n=>n+1)}>刷新数据</button></div></header>
-    {config.filters.length>0&&<Boundary><Suspense fallback={<p role="status">正在加载筛选控件…</p>}><FilterBar bindings={config.filters} onApply={setFilters} cockpit={cockpit} scope={scope} compact={retail}/></Suspense></Boundary>}
-    <p className="live query-status" role="status">{config.widgets.length} 个展示组件 · 已返回 {complete} · 失败 {failed} · 其余加载中或等待查询</p>
-    {retail&&<div className="section-heading"><span>01 / OVERVIEW</span><h2>经营概览</h2><p>源看板当前条件 · 随查询更新</p></div>}
-    {separateKpis&&<div className="kpi-grid">{config.widgets.map((binding,i)=>binding.type==='kpi'?card(binding,i):null)}</div>}
-    {config.insights&&<Insights config={config} states={states}/>}
-    {retail&&<div className="section-heading" id="components"><span>02 / PERFORMANCE</span><h2>销售表现</h2><p>趋势、构成与门店表现</p></div>}
-    <div className="grid" id={retail?undefined:'components'}>{config.widgets.map((binding,i)=>!separateKpis||binding.type!=='kpi'?card(binding,i):null)}</div>
-    <details className="data-notes" id="data-notes"><summary>数据口径与范围</summary><p>当前仅消费单次返回结果；COMPLETE 表示本次转换完整，不保证全量。搜索、排序、筛选、分页和 CSV 仅作用于已加载数据。UNKNOWN 行不自动累加，受限值与空值不补零。</p>{config.dataNotes?.map((note,i)=><p key={i}>{note}</p>)}<p>{config.directoryEntryId?'目录入口已绑定；查询失败不会切换到其他来源。':'来源为当前配置的分析看板。'}</p></details>
-    <footer>数据范围以当前查询结果为准 · 权限由 FineBI 服务端控制</footer></main>
-  </div>;
-}
-export default function App() {
-  const [config, setConfig] = useState<AppConfig>(); const [error, setError] = useState('');
-  useEffect(()=>{const controller=new AbortController(); fetch('./app-config.json',{signal:controller.signal,cache:'no-store'}).then(r=>{if(!r.ok)throw Error('应用配置加载失败');return r.json();}).then(c=>{validateConfig(c);setConfig(c);}).catch(e=>{if(!controller.signal.aborted)setError(e.message);});return()=>controller.abort();},[]);
-  if(error)return <main className="state" role="alert"><h1>请完成应用配置</h1><p>{error}</p><p>在 public/app-config.json 中绑定 CLI 发现的仪表板实例与字段。</p></main>;
-  return config ? <Dashboard config={config}/> : <p className="state">正在加载应用…</p>;
-}
+import {lazy,Suspense,useEffect,useRef,useState} from 'react';
+import {queryWidget,validateConfig} from './finebi/client';
+import type {AppConfig,FilterState,WidgetBinding} from './finebi/types';
+import {Boundary,Widget} from './components/Widget';
+import {Insights} from './components/Insights';
+import {loadWidgets,widgetKey,type WidgetState} from './services/widget-queries';
+import './cockpit.css';
+import './retail.css';
+const FilterBar=lazy(()=>import('./components/FilterBar').then(module=>({default:module.FilterBar})));
+function Dashboard({config}: {config: AppConfig}) {
+  const [filters,setFilters]=useState<FilterState>({}),[refresh,setRefresh]=useState(0);
+  const [states,setStates]=useState<Record<string,WidgetState>>({});
+  const [activeHash,setActiveHash]=useState(()=>window.location.hash||'#dashboard');
+  useEffect(()=>{
+    const syncHash=()=>setActiveHash(window.location.hash||'#dashboard');
+    window.addEventListener('hashchange',syncHash);
+    syncHash();
+    return ()=>window.removeEventListener('hashchange',syncHash);
+  },[]);
+  const generation=useRef(0),retries=useRef(new Map<string,AbortController>());
+  useEffect(()=>{
+    const controller=new AbortController();generation.current++;setStates({});
+    void loadWidgets(config,filters,controller.signal,(key,state)=>setStates(old=>({...old,[key]:state})));
+    return ()=>{controller.abort();retries.current.forEach(c=>c.abort());retries.current.clear();};
+  },[config,filters,refresh]);
+  const retry=async(binding:WidgetBinding,index:number)=>{
+    const key=widgetKey(binding,index),current=generation.current,controller=new AbortController();
+    retries.current.get(key)?.abort();retries.current.set(key,controller);
+    setStates(old=>({...old,[key]:{loading:true}}));
+    try {const result=await queryWidget(config,binding,filters,controller.signal);if(current===generation.current&&!controller.signal.aborted)setStates(old=>({...old,[key]:{loading:false,result,at:new Date().toLocaleTimeString()}}));}
+    catch(error){if(current===generation.current&&!controller.signal.aborted)setStates(old=>({...old,[key]:{loading:false,error:error as Error}}));}
+  };
+  const complete=Object.values(states).filter(s=>s.result).length,failed=Object.values(states).filter(s=>s.error).length;
+  const scope=Object.fromEntries(config.filters.map(filter=>{
+    const known=config.widgets.filter(w=>w.filterNames?.includes(filter.name)).map(w=>w.name);
+    const unknown=config.widgets.some(w=>w.filterNames===undefined);
+    return [filter.name,`${known.length?known.join('、'):'无已确认组件'}${unknown?'；未映射组件由源看板决定':''}`];
+  }));
+  const retail=config.layout==='retail';
+  const card=(binding:WidgetBinding,index:number)=><Widget key={`${refresh}-${JSON.stringify(filters)}-${index}`} binding={binding} state={states[widgetKey(binding,index)]??{loading:true}} pageSize={config.pageSize} onRetry={()=>void retry(binding,index)} compact={retail}/>;
+  const cockpit=config.layout==='cockpit';
+  const separateKpis=cockpit||retail;
+  return <div className={`app ${config.layout}`}>
+    {retail&&<nav className="retail-nav" aria-label="页面导航"><a className="retail-brand" href="#dashboard"><b>F.</b><span>FineBI <small>经营简报</small></span></a><div><a href="#dashboard" aria-current={activeHash==='#dashboard'?'location':undefined}>经营概览</a><a href="#components" aria-current={activeHash==='#components'?'location':undefined}>销售分析</a><a href="#data-notes" aria-current={activeHash==='#data-notes'?'location':undefined}>口径说明</a></div><span className="retail-live">动态数据</span></nav>}
+    {config.layout!=='overview'&&!retail&&<aside><strong>FineBI<span>数据应用</span></strong><nav><a href="#dashboard">数据概览</a><a href="#components">分析组件</a>{config.insights&&<a href="#observations">经营观察</a>}<a href="#data-notes">数据口径</a></nav><p className="source-label">{config.directoryEntryId?'目录发布来源':'分析主题来源'}<br/>访问者权限由 FineBI 控制</p></aside>}
+    <main id="dashboard"><header><div><span className="eyebrow">FINEBI · LIVE DATA</span><h1>{config.title}</h1><p className="muted">{config.description??'基于源看板的实时数据，按当前访问权限呈现'}</p></div><div className="header-actions"><a href={retail?'#data-notes':config.basePath} target={retail?undefined:'_blank'} rel="noreferrer">{retail?'口径说明':'打开 FineBI'}</a><button onClick={()=>setRefresh(n=>n+1)}>刷新数据</button></div></header>
+    {config.filters.length>0&&<Boundary><Suspense fallback={<p role="status">正在加载筛选控件…</p>}><FilterBar bindings={config.filters} onApply={setFilters} cockpit={cockpit} scope={scope} compact={retail}/></Suspense></Boundary>}
+    <p className="live query-status" role="status">{config.widgets.length} 个展示组件 · 已返回 {complete} · 失败 {failed} · 其余加载中或等待查询</p>
+    {retail&&<div className="section-heading"><span>01 / OVERVIEW</span><h2>经营概览</h2><p>源看板当前条件 · 随查询更新</p></div>}
+    {separateKpis&&<div className="kpi-grid">{config.widgets.map((binding,i)=>binding.type==='kpi'?card(binding,i):null)}</div>}
+    {config.insights&&<Insights config={config} states={states}/>}
+    {retail&&<div className="section-heading" id="components"><span>02 / PERFORMANCE</span><h2>销售表现</h2><p>趋势、构成与门店表现</p></div>}
+    <div className="grid" id={retail?undefined:'components'}>{config.widgets.map((binding,i)=>!separateKpis||binding.type!=='kpi'?card(binding,i):null)}</div>
+    <details className="data-notes" id="data-notes"><summary>数据口径与范围</summary><p>当前仅消费单次返回结果；COMPLETE 表示本次转换完整，不保证全量。搜索、排序、筛选、分页和 CSV 仅作用于已加载数据。UNKNOWN 行不自动累加，受限值与空值不补零。</p>{config.dataNotes?.map((note,i)=><p key={i}>{note}</p>)}<p>{config.directoryEntryId?'目录入口已绑定；查询失败不会切换到其他来源。':'来源为当前配置的分析看板。'}</p></details>
+    <footer>数据范围以当前查询结果为准 · 权限由 FineBI 服务端控制</footer></main>
+  </div>;
+}
+export default function App() {
+  const [config, setConfig] = useState<AppConfig>(); const [error, setError] = useState('');
+  useEffect(()=>{const controller=new AbortController(); fetch('./app-config.json',{signal:controller.signal,cache:'no-store'}).then(r=>{if(!r.ok)throw Error('应用配置加载失败');return r.json();}).then(c=>{validateConfig(c);setConfig(c);}).catch(e=>{if(!controller.signal.aborted)setError(e.message);});return()=>controller.abort();},[]);
+  if(error)return <main className="state" role="alert"><h1>请完成应用配置</h1><p>{error}</p><p>在 public/app-config.json 中绑定 CLI 发现的仪表板实例与字段。</p></main>;
+  return config ? <Dashboard config={config}/> : <p className="state">正在加载应用…</p>;
+}

package/skills/finebi-cli-agent/scripts/finebi-cli/templates/web-app/src/cockpit.css

@@ -1,3 +1,3 @@
-.panel-heading{display:flex;align-items:start;justify-content:space-between;gap:12px}.panel-heading h2{margin-bottom:6px}.component-status{font-size:10px;color:#71867d;white-space:nowrap}.component-status.failed{color:#bd534f}.result-range,.filter-scope{font-size:11px;color:#84928b;overflow-wrap:anywhere}.filter-scope{margin:4px 0 10px}.component-error{padding:14px 0;color:#af4e46;overflow-wrap:anywhere}.component-error button{color:#8f5044}.header-actions{display:flex;gap:18px;align-items:center;white-space:nowrap}.insight-panel{display:grid;grid-template-columns:220px minmax(0,1fr);gap:28px;background:#edf6f1;border:1px solid #dbece2;border-radius:15px;padding:24px;margin:24px 0}.insight-panel h2{margin:8px 0}.insight-panel p{font-size:12px;color:#6b8576}.insight-panel ul{margin:0;padding-left:18px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 24px;font-size:12px;color:#37604a}.data-notes{background:#fff;padding:20px 24px;border:1px solid #e2e8e3;border-radius:12px;margin-top:24px;font-size:12px}.sort-column{border:0;background:transparent;padding:0;font-weight:600;font-size:inherit}.local-filters,.series-controls{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-bottom:16px}.local-filters label{font-size:12px;color:#64748b}.local-filters select{margin-left:8px;max-width:220px}.series-controls{font-size:12px}.series-controls label{display:flex;gap:6px;align-items:center}.workbench aside strong span{display:block;font-size:12px;font-weight:400}.source-label{font-size:11px;line-height:1.9;opacity:.65;margin-top:45px}
-.cockpit{display:grid;grid-template-columns:208px minmax(0,1fr);min-height:100vh;background:#f3f6f3;color:#253f33}.cockpit aside{background:#123d2c;color:#e0ece4;padding:38px 24px;position:sticky;top:0;height:100vh;min-height:0;display:flex;flex-direction:column}.cockpit aside strong{font-size:27px;letter-spacing:-1px}.cockpit aside strong span{display:block;font-size:11px;letter-spacing:3px;font-weight:400;margin-top:3px;color:#b1c6b8}.cockpit aside nav{margin-top:48px}.cockpit aside a{display:block;font-size:13px;margin:8px -8px;padding:12px 16px;color:#c5d5ca;border-radius:8px;transition:background .15s}.cockpit aside a:hover{background:#ffffff10;color:white}.cockpit aside a:first-child{background:#ffffff13;color:#fff}.cockpit .source-label{margin-top:auto;padding-top:40px}.cockpit main{width:100%;max-width:1640px;padding:38px 40px}.cockpit header{padding-bottom:22px;border-bottom:1px solid #dfe8df;margin-bottom:26px}.cockpit h1{font-size:29px;letter-spacing:-.8px;margin:8px 0}.cockpit h2{font-size:15px;font-weight:650}.cockpit .eyebrow{font-size:10px;color:#659476;letter-spacing:2.5px}.cockpit .muted{font-size:12px;color:#839186}.cockpit a{color:#35775a}.cockpit button:hover{border-color:#197a58}.cockpit .header-actions>button{background:#197a58;border-color:#197a58;color:white;padding:10px 18px}.cockpit .grid{gap:20px}.cockpit .panel{border:1px solid #e0e8df;border-radius:14px;padding:24px;box-shadow:0 3px 12px #193f2103}.cockpit .kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.cockpit .widget-kpi{position:relative;overflow:hidden}.cockpit .widget-kpi:before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:#448b64}.cockpit .widget-kpi:nth-child(2):before{background:#588db2}.cockpit .widget-kpi:nth-child(3):before{background:#d2ad60}.cockpit .widget-kpi:nth-child(4):before{background:#8f7db0}.cockpit .widget-kpi .panel-heading{display:block}.cockpit .widget-kpi .component-status{font-size:9px}.cockpit .kpi{font-size:clamp(22px,2.3vw,36px);color:#24533b;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;margin:15px 0 6px}.cockpit .widget-kpi .result-range{font-size:9px}.cockpit .filter-card{border-color:#dfe8df;border-radius:14px}.cockpit .filter-symbol{color:#377d57;background:#edf5ef}.cockpit .filter-heading h2,.cockpit .filter-label-row label{color:#35533f}.cockpit .query-status{margin:18px 0;color:#6a8976;font-size:11px}.cockpit footer{font-size:11px;color:#8b9b8f}.cockpit .notice{border-radius:5px;font-size:11px}.cockpit .chart{height:290px}.cockpit th{background:#f5f8f4;color:#54725d}.cockpit tbody tr:hover{background:#f5f8f4}.cockpit .table-tools{font-size:11px;flex-wrap:wrap}.cockpit .table-tools input{max-width:220px}.cockpit .pager{font-size:12px}.cockpit .data-notes{color:#6d8171}
-@media(min-width:1500px){.cockpit main{padding:42px 54px}}@media(max-width:1150px){.cockpit{grid-template-columns:170px minmax(0,1fr)}.cockpit main{padding:28px 24px}.cockpit .kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.insight-panel{grid-template-columns:1fr;gap:8px}}@media(max-width:800px){.cockpit{grid-template-columns:1fr}.cockpit aside{display:none}.cockpit main{padding:24px 18px}.cockpit .grid{grid-template-columns:1fr}.cockpit header{align-items:flex-start;gap:20px;flex-direction:column}.cockpit h1{font-size:25px}.cockpit .filter-card{padding:20px 18px}.insight-panel ul{grid-template-columns:1fr}.cockpit .panel{padding:20px}.header-actions{font-size:12px}.local-filters{align-items:stretch;flex-direction:column}.cockpit .kpi-grid{gap:12px}.cockpit .kpi-grid .panel{padding:17px 14px}.cockpit .kpi{font-size:24px}.table-tools input{max-width:180px}.panel-heading{flex-wrap:wrap}.component-status{white-space:normal}}@media(prefers-reduced-motion:reduce){.cockpit *{transition:none!important;scroll-behavior:auto!important}}
+.panel-heading{display:flex;align-items:start;justify-content:space-between;gap:12px}.panel-heading h2{margin-bottom:6px}.component-status{font-size:10px;color:#71867d;white-space:nowrap}.component-status.failed{color:#bd534f}.result-range,.filter-scope{font-size:11px;color:#84928b;overflow-wrap:anywhere}.filter-scope{margin:4px 0 10px}.component-error{padding:14px 0;color:#af4e46;overflow-wrap:anywhere}.component-error button{color:#8f5044}.header-actions{display:flex;gap:18px;align-items:center;white-space:nowrap}.insight-panel{display:grid;grid-template-columns:220px minmax(0,1fr);gap:28px;background:#edf6f1;border:1px solid #dbece2;border-radius:15px;padding:24px;margin:24px 0}.insight-panel h2{margin:8px 0}.insight-panel p{font-size:12px;color:#6b8576}.insight-panel ul{margin:0;padding-left:18px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 24px;font-size:12px;color:#37604a}.data-notes{background:#fff;padding:20px 24px;border:1px solid #e2e8e3;border-radius:12px;margin-top:24px;font-size:12px}.sort-column{border:0;background:transparent;padding:0;font-weight:600;font-size:inherit}.local-filters,.series-controls{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-bottom:16px}.local-filters label{font-size:12px;color:#64748b}.local-filters select{margin-left:8px;max-width:220px}.series-controls{font-size:12px}.series-controls label{display:flex;gap:6px;align-items:center}.workbench aside strong span{display:block;font-size:12px;font-weight:400}.source-label{font-size:11px;line-height:1.9;opacity:.65;margin-top:45px}
+.cockpit{display:grid;grid-template-columns:208px minmax(0,1fr);min-height:100vh;background:#f3f6f3;color:#253f33}.cockpit aside{background:#123d2c;color:#e0ece4;padding:38px 24px;position:sticky;top:0;height:100vh;min-height:0;display:flex;flex-direction:column}.cockpit aside strong{font-size:27px;letter-spacing:-1px}.cockpit aside strong span{display:block;font-size:11px;letter-spacing:3px;font-weight:400;margin-top:3px;color:#b1c6b8}.cockpit aside nav{margin-top:48px}.cockpit aside a{display:block;font-size:13px;margin:8px -8px;padding:12px 16px;color:#c5d5ca;border-radius:8px;transition:background .15s}.cockpit aside a:hover{background:#ffffff10;color:white}.cockpit aside a:first-child{background:#ffffff13;color:#fff}.cockpit .source-label{margin-top:auto;padding-top:40px}.cockpit main{width:100%;max-width:1640px;padding:38px 40px}.cockpit header{padding-bottom:22px;border-bottom:1px solid #dfe8df;margin-bottom:26px}.cockpit h1{font-size:29px;letter-spacing:-.8px;margin:8px 0}.cockpit h2{font-size:15px;font-weight:650}.cockpit .eyebrow{font-size:10px;color:#659476;letter-spacing:2.5px}.cockpit .muted{font-size:12px;color:#839186}.cockpit a{color:#35775a}.cockpit button:hover{border-color:#197a58}.cockpit .header-actions>button{background:#197a58;border-color:#197a58;color:white;padding:10px 18px}.cockpit .grid{gap:20px}.cockpit .panel{border:1px solid #e0e8df;border-radius:14px;padding:24px;box-shadow:0 3px 12px #193f2103}.cockpit .kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.cockpit .widget-kpi{position:relative;overflow:hidden}.cockpit .widget-kpi:before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:#448b64}.cockpit .widget-kpi:nth-child(2):before{background:#588db2}.cockpit .widget-kpi:nth-child(3):before{background:#d2ad60}.cockpit .widget-kpi:nth-child(4):before{background:#8f7db0}.cockpit .widget-kpi .panel-heading{display:block}.cockpit .widget-kpi .component-status{font-size:9px}.cockpit .kpi{font-size:clamp(22px,2.3vw,36px);color:#24533b;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;margin:15px 0 6px}.cockpit .widget-kpi .result-range{font-size:9px}.cockpit .filter-card{border-color:#dfe8df;border-radius:14px}.cockpit .filter-symbol{color:#377d57;background:#edf5ef}.cockpit .filter-heading h2,.cockpit .filter-label-row label{color:#35533f}.cockpit .query-status{margin:18px 0;color:#6a8976;font-size:11px}.cockpit footer{font-size:11px;color:#8b9b8f}.cockpit .notice{border-radius:5px;font-size:11px}.cockpit .chart{height:290px}.cockpit th{background:#f5f8f4;color:#54725d}.cockpit tbody tr:hover{background:#f5f8f4}.cockpit .table-tools{font-size:11px;flex-wrap:wrap}.cockpit .table-tools input{max-width:220px}.cockpit .pager{font-size:12px}.cockpit .data-notes{color:#6d8171}
+@media(min-width:1500px){.cockpit main{padding:42px 54px}}@media(max-width:1150px){.cockpit{grid-template-columns:170px minmax(0,1fr)}.cockpit main{padding:28px 24px}.cockpit .kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.insight-panel{grid-template-columns:1fr;gap:8px}}@media(max-width:800px){.cockpit{grid-template-columns:1fr}.cockpit aside{display:none}.cockpit main{padding:24px 18px}.cockpit .grid{grid-template-columns:1fr}.cockpit header{align-items:flex-start;gap:20px;flex-direction:column}.cockpit h1{font-size:25px}.cockpit .filter-card{padding:20px 18px}.insight-panel ul{grid-template-columns:1fr}.cockpit .panel{padding:20px}.header-actions{font-size:12px}.local-filters{align-items:stretch;flex-direction:column}.cockpit .kpi-grid{gap:12px}.cockpit .kpi-grid .panel{padding:17px 14px}.cockpit .kpi{font-size:24px}.table-tools input{max-width:180px}.panel-heading{flex-wrap:wrap}.component-status{white-space:normal}}@media(prefers-reduced-motion:reduce){.cockpit *{transition:none!important;scroll-behavior:auto!important}}