基本面分析报告生成器（工程级 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 已按正斜杠重新打包。
