feat: 搭建二期项目架构

README.md

@@ -23,7 +23,9 @@ php -S localhost:8899
 
 ### 2. 打开浏览器
 
-访问 **http://localhost:8899**，会看到 5 张示例图表和 11 张泡泡玛特财报图表：
+访问 **http://localhost:8899**。页面左侧选择公司，中间用 Tab 切换分析维度，右侧可跳转到当前分类的图表。
+
+当前 manifest 内登记了 5 张示例图表和 14 张泡泡玛特财报图表：
 
 **示例图表：**
 1. **存货、营收与存货周转天数** — 双柱 + 折线，双 Y 轴
@@ -50,7 +52,7 @@ php -S localhost:8899
 
 ### 3. 修改数据
 
-编辑 `data/*.csv`，保存后点击页面右上角的 **「重新加载数据」** 按钮。
+编辑对应公司的 CSV，保存后点击页面右上角的 **「重新加载数据」** 按钮。数据目录按公司划分，例如 `data/ppmt/ppmt_profit.csv`、`data/demo/inventory.csv`。
 
 CSV 格式：首行是表头，逗号分隔，数字列会自动转换。示例：
 
@@ -69,22 +71,20 @@ period,inventory,revenue,turnover_days
 ## 项目结构
 
 ```
-echart-demo/
+smart-fin-chart/
 ├── index.html              # 主页面
-├── data/                   # 数据文件
-│   ├── inventory.csv       # 图 1-5：示例数据
-│   ├── margin.csv
-│   ├── growth.csv
-│   ├── fx.csv
-│   ├── ppmt.xlsx           # 泡泡玛特原始财报
-│   └── ppmt_*.csv          # 图 6-16：从 xlsx 提取的各口径数据
+├── manifest.json           # 公司、Tab、图表、CSV 的唯一配置来源
+├── data/                   # 数据文件（按公司划分）
+│   ├── demo/
+│   └── ppmt/
 ├── js/
-│   ├── main.js             # 入口：CHARTS 清单、渲染、导出 PNG
+│   ├── main.js             # 入口：读取 manifest、渲染、导出 PNG
+│   ├── ui.js               # 三栏 UI 构建
 │   ├── csv.js              # CSV 解析工具
 │   ├── theme.js            # 主题：配色、字体、水印、共享系列构造器
-│   └── charts/             # 一图一文件，共 16 张
+│   └── charts/             # 图表构建函数与 registry
 ├── test/
-│   └── regress.mjs         # 回归测试：SSR 渲染 16 张图 + 样式规范断言
+│   └── regress.mjs         # 回归测试：遍历 manifest + 样式规范断言
 └── css/
     └── style.css           # 页面样式
 ```
@@ -95,13 +95,13 @@ echart-demo/
 npm test
 ```
 
-用 ECharts 的 SSR 模式把 16 张图渲染成 SVG，断言：
+用 ECharts 的 SSR 模式遍历 manifest 中的图表并渲染成 SVG，断言：
 
 - `legend.top` = 85、`grid.top` = 145（统一间距）
 - 折线 `symbolSize` = 9、`borderWidth` = 2.5（空心圆点规范）
 - SVG 属性未被字体名里的引号提前闭合
 
-加新图后往 `regress.mjs` 顶部的 `all` 数组加一行，否则不会被测到。
+回归测试会遍历 `manifest.json`，不用再手工维护图表清单。
 
 ---
 
@@ -138,9 +138,9 @@ A：点击页面右上角的 **「重新加载数据」** 按钮。普通刷新
 A：
 1. 在 `data/` 下创建新 CSV
 2. 在 `js/charts/` 下创建新 `.js`，从 `theme.js` 取共享配置（`lineSeries()`、`barSeries()`、`standardLegend()`、`periodAxis`），不要手写等价值
-3. 在 `js/main.js` 的 `CHARTS` 数组里加一行
-4. 在 `index.html` 加一个 `<div class="card">` 容器
-5. 在 `test/regress.mjs` 的 `all` 数组里加一行，然后跑 `npm test`
+3. 在 `js/charts/index.js` 注册 chart key
+4. 在 `manifest.json` 对应公司与 Tab 中添加图表配置
+5. 跑 `node test/regress.mjs <chart-id>`；浏览器检查标签、颜色和脚注
 
 **Q：能改水印文字吗？**  
 A：编辑 `js/theme.js` 的 `WATERMARK_TEXT` 常量。