基本面分析报告生成器（工程级 HTML 交付）

一句话价值

把"基本面分析"从一段 Markdown 文本，升级为一份生产可上线的 HTML 研报：图表会自适应、屏幕阅读器能读懂、打印有摘要、部署有 CSP/SRI 防护、手机有深色模式、可加到主屏幕。并且自带质量自检闭环——生成后跑一遍审计清单 + 校验脚本，确保不出现"图表被 CSP 拦截""打印版丢数据"这类线上事故。

与市面上"只输出 Markdown 诊断"的研报类 skill 的区别：本 skill 的交付物是自包含、可部署的网页，而非聊天窗口里的一段文字。与 fintrust-deep-research 的区别：本 skill 不绑定任何付费 API Key、覆盖全市场、且工程化质量（安全/a11y/性能）是显式卖点。

触发场景

用户说"分析一下某某股票/基本面""给我出一份研报""生成一份可分享的 HTML 分析报告"
用户给了某标的数据，希望"做成好看的网页/报告"
用户已有研报文字，希望"补图表并做成可上线页面"

核心设计原则

数据源无关（最关键）：本 skill 不依赖任何特定连接器。取数优先顺序：
- 用户已在对话中提供的数据 → 直接用
- 用 WebSearch / WebFetch 公开检索 → 兜底
- 若用户已连接行情类连接器（westock / 腾讯自选股 / wind / 东方财富妙想等），可用其补充，但绝不能把可用性绑死在连接器上
数据与展示分离：图表数据只写在 HTML 容器的 data-chart='{...}' JSON 里，JS 引擎只读不写。改数据不必动 JS。
先分析、后渲染：先按 references/finance-framework.md 的框架把结论想清楚，再套模板。模板只是"好看的壳"。
交付前必过自检：生成后必须跑 assets/self-check.js，并对照 references/audit-checklist.md 复核。

工作流程

步骤 1 · 收集数据（数据源无关）

确定标的：名称、代码、交易所、行业、关键日期。
取数：用户数据 > web 检索 > 可选连接器。记录每个数字的来源与口径。
形成结构化底稿：业务结构、近 4-8 季度财务、资产负债、估值口径、机构观点、风险。

步骤 2 · 框架化分析

依 references/finance-framework.md 拆解：业务模型 → 财务质量 → 成长/催化 → 估值 → 风险。产出"一句话本质"和"看多/看空"两栏逻辑。

步骤 3 · 渲染模板

复制 assets/report-template.html 为工作副本。
替换 <head> 中的占位 token：{{REPORT_TITLE}} {{REPORT_DESC}} {{CANONICAL_URL}} {{OG_URL}} {{OG_IMAGE}} {{TWITTER_IMAGE}} {{STOCK_NAME}} {{TICKER}} {{DATE}}。
按底稿填充各 <section> 文字与表格。
图表：在三个 <figure> 的 data-chart 中填入 JSON（契约见下）。预测值用 * 后缀标注（如 "Q2 2026*"）。
如需更多图表，复制一个 <figure class="chart-box"> 块，改 id 与 data-chart（type 支持 revenue/quarterly/rePrice，或自行扩展 buildOption）。

步骤 4 · 质量自检（对照清单）

阅读 references/audit-checklist.md，逐项确认。重点红线：
- CSP 与内联脚本哈希必须一致（self-check.js 会自动重算并回填，见步骤 5）。
- 打印样式必须保留图表文字摘要（.sr-only 在 @media print 下可见）。
- 图表 aria-label 要含关键数据结论，而非只写"柱状图"。

步骤 5 · 运行校验脚本（强约束）

node assets/self-check.js <你的报告.html>

脚本会：①校验内联 JS 语法 ②校验 JSON-LD ③校验所有 data-chart JSON 结构 ④检查 30+ 项工程特征是否存在 ⑤自动重算内联脚本 sha256 并回填 CSP script-src，避免"哈希过期导致图表被浏览器拦截"。全部 PASS 才允许交付；有 FAIL 必须修复后重跑。

步骤 6 · 交付与提示

交付 HTML 文件（连同 manifest.json / icon.svg 若启用 PWA）。
提醒用户：上线前把 {{OG_IMAGE}} / {{CANONICAL_URL}} 等占位替换为真实资源 URL；部署到 HTTP 服务（非 file://）CSP 才完全生效；Service Worker 需 HTTP 环境。

图表数据契约（data-chart）

JS 引擎按 type 渲染，三种内置类型：

// 营收结构 vs 利润贡献（双柱状，可含负值）
{ "type":"revenue", "cats":["板材","稀土精矿",...], "rev":[49,18,...], "profit":[-5,82,...] }

// 季度营收 + 归母净利润（柱+折线双轴）
{ "type":"quarterly", "cats":["Q1 2025","Q2 2026*",...], "rev":[154.33,160,...], "net":[0.45,7.0,...] }

// 价格序列（单柱，自动按阈值着色）
{ "type":"rePrice", "cats":["2024 Q3","2026 Q3*",...], "price":[16741,38565,...] }

校验规则（readData 已实现）：type+cats 必填；各类型对应数组必填且与 cats 等长的数组。readData 失败时控制台输出精确错误并降级为文字摘要，不会静默白屏。

文件清单

| 文件 | 用途 | |------|------| | SKILL.md | 本说明 | | references/finance-framework.md | 基本面分析框架（保证结论结构一致） | | references/audit-checklist.md | 8 大类 HTML 质量自检清单（可复用 IP） | | assets/report-template.html | 通用、参数化、可直接填充的 HTML 母本 | | assets/self-check.js | Node 校验脚本（语法/JSON/特征/CSP 哈希自动回填） | | assets/manifest.json + assets/icon.svg / icon.png | 可选 PWA 资源 | | examples/example-report.html | 完整示例输出（包钢股份 600010），可直接打开看效果 |

局限与取舍（写明，避免误用）

ECharts 用完整构建 + defer + load 等待，未做 ESM 按需引入（zrender 子依赖在静态页环境难验证，贸然切模块可能弄坏图表；真要 tree-shaking 建议用打包器）。
CSP 用 meta + 哈希白名单（静态页无法用 nonce）。file:// 打开时个别浏览器对"跨域脚本 + CSP"敏感，部署到 HTTP 即生效。
og:image/og:url 默认为占位，上线前必换真实 URL。
本 skill 产出分析报告，不构成投资建议；交付物须含免责声明（模板已带）。

快速开始（一句话触发示例）

"帮我用 stock-fundamental-html-report 分析一下宁德时代（300750）的基本面，输出一份可直接打开看的 HTML 研报。"

Agent 会按 6 步工作流：检索数据 → 按框架分析 → 填模板 → 跑 self-check → 交付 HTML。

常见问题（FAQ）

Q1：这个 skill 必须接付费行情 API 吗？ 不必。默认用 WebSearch / WebFetch 检索公开数据；若用户已连接行情连接器，可作为补充。

Q2：为什么交付的 HTML 里还有"包钢"的字样？ 那是模板母本的示例占位。正确执行时，agent 会按步骤 3 重写所有 <section> 与图表数据。如果只改了标题没改正文，说明未完整执行工作流。

Q3：CSP 哈希会不会因为改数据而失效？ 不会。只有 <script> 脚本内容变化才会影响 CSP；改 data-chart 或正文数据不动 JS，哈希不变。若扩展了 buildOption，必须重跑 self-check.js 自动回填哈希。

Q4：图标用 svg 还是 png？ icon.svg 是矢量占位；icon.png 是 1024×1024 高清图标，可直接用于 SkillHub 上传或 PWA。SkillHub 图标字段请上传 assets/icon.png。

Q5：为什么打包后 SkillHub 说缺少文件？ 请确保 zip 使用正斜杠路径（如 assets/report-template.html）。Windows 下默认压缩包常为反斜杠，Linux 服务端解压后会把整个字符串当文件名。本 skill 已按正斜杠重新打包。