docs: 更新 STRUCTURE.md 和 mock 数据

- STRUCTURE.md 添加 MarketDataView Panel 拆分记录
- 更新目录结构说明,包含 panels/ 子目录
- 更新 company.js 和 market.js mock 数据

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
zdl
2025-12-12 18:11:03 +08:00
parent adfc0bd478
commit 276b280cb9
3 changed files with 208 additions and 47 deletions

View File

@@ -1,6 +1,6 @@
# Company 目录结构说明
> 最后更新2025-12-11
> 最后更新2025-12-12
## 目录结构
@@ -67,7 +67,7 @@ src/views/Company/
│ │ └── ManagementCard.tsx # 人员卡片memo
│ │
│ ├── MarketDataView/ # Tab: 股票行情TypeScript
│ │ ├── index.tsx # 主组件入口
│ │ ├── index.tsx # 主组件入口~285 行Tab 容器)
│ │ ├── types.ts # 类型定义
│ │ ├── constants.ts # 主题配置、常量
│ │ ├── services/
@@ -82,7 +82,14 @@ src/views/Company/
│ │ ├── ThemedCard.tsx # 主题化卡片
│ │ ├── MarkdownRenderer.tsx # Markdown 渲染
│ │ ├── StockSummaryCard.tsx # 股票概览卡片
│ │ ── AnalysisModal.tsx # 涨幅分析模态框
│ │ ── AnalysisModal.tsx # 涨幅分析模态框
│ │ └── panels/ # Tab 面板组件
│ │ ├── index.ts # 面板组件统一导出
│ │ ├── TradeDataPanel.tsx # 交易数据K线图、分钟图、表格
│ │ ├── FundingPanel.tsx # 融资融券面板
│ │ ├── BigDealPanel.tsx # 大宗交易面板
│ │ ├── UnusualPanel.tsx # 龙虎榜面板
│ │ └── PledgePanel.tsx # 股权质押面板
│ │
│ ├── DeepAnalysis/ # Tab: 深度分析
│ │ └── index.js
@@ -451,7 +458,7 @@ CompanyOverview/
**拆分后文件结构**
```
MarketDataView/
├── index.tsx # 主组件入口(~1049 行
├── index.tsx # 主组件入口(~285 行Tab 容器
├── types.ts # 类型定义(~383 行)
├── constants.ts # 主题配置、常量(~49 行)
├── services/
@@ -466,14 +473,21 @@ MarketDataView/
├── ThemedCard.tsx # 主题化卡片(~32 行)
├── MarkdownRenderer.tsx # Markdown 渲染(~65 行)
├── StockSummaryCard.tsx # 股票概览卡片(~133 行)
── AnalysisModal.tsx # 涨幅分析模态框(~188 行)
── AnalysisModal.tsx # 涨幅分析模态框(~188 行)
└── panels/ # Tab 面板组件2025-12-12 拆分)
├── index.ts # 面板组件统一导出
├── TradeDataPanel.tsx # 交易数据面板(~381 行)
├── FundingPanel.tsx # 融资融券面板(~113 行)
├── BigDealPanel.tsx # 大宗交易面板(~143 行)
├── UnusualPanel.tsx # 龙虎榜面板(~163 行)
└── PledgePanel.tsx # 股权质押面板(~124 行)
```
**文件职责说明**
| 文件 | 行数 | 职责 |
|------|------|------|
| `index.tsx` | ~1049 | 主组件,包含 5 个 Tab 面板(交易数据、融资融券、大宗交易、龙虎榜、股权质押) |
| `index.tsx` | ~285 | 主组件,Tab 容器和状态管理,导入使用 5 个 Panel 组件 |
| `types.ts` | ~383 | 所有 TypeScript 类型定义Theme、TradeDayData、MinuteData、FundingData 等) |
| `constants.ts` | ~49 | 主题配置light/dark、周期选项常量 |
| `marketService.ts` | ~173 | API 服务封装getMarketData、getMinuteData、getBigDealData 等) |
@@ -780,4 +794,44 @@ index.tsx
- **Hook 数据层**`useFinancialData` 封装 9 个 API 并行加载
- **组件解耦**:每个表格/分析视图独立为组件
- **常量配置化**:指标定义可维护、可扩展
- **工具函数复用**:计算和图表配置统一管理
- **工具函数复用**:计算和图表配置统一管理
### 2025-12-12 MarketDataView Panel 拆分
**改动概述**
- `MarketDataView/index.tsx` 从 **1,049 行** 精简至 **285 行**(减少 73%
- 将 5 个 TabPanel 拆分为独立的面板组件
- 创建 `components/panels/` 子目录
**拆分后文件结构**
```
MarketDataView/components/panels/
├── index.ts # 面板组件统一导出
├── TradeDataPanel.tsx # 交易数据面板(~381 行)
├── FundingPanel.tsx # 融资融券面板(~113 行)
├── BigDealPanel.tsx # 大宗交易面板(~143 行)
├── UnusualPanel.tsx # 龙虎榜面板(~163 行)
└── PledgePanel.tsx # 股权质押面板(~124 行)
```
**面板组件职责**
| 组件 | 行数 | 功能 |
|------|------|------|
| `TradeDataPanel` | ~381 | K线图、分钟K线图、交易明细表格 |
| `FundingPanel` | ~113 | 融资融券图表和数据卡片 |
| `BigDealPanel` | ~143 | 大宗交易记录表格 |
| `UnusualPanel` | ~163 | 龙虎榜数据(买入/卖出前五) |
| `PledgePanel` | ~124 | 股权质押图表和明细表格 |
**优化效果**
| 指标 | 优化前 | 优化后 | 改善 |
|------|--------|--------|------|
| 主文件行数 | 1,049 | 285 | -73% |
| 面板组件 | 内联 | 5 个独立文件 | 模块化 |
| 可维护性 | 低 | 高 | 每个面板独立维护 |
**设计原则**
- **职责分离**:主组件只负责 Tab 容器和状态管理
- **组件复用**:面板组件可独立测试和维护
- **类型安全**:每个面板组件有独立的 Props 类型定义