84 lines
2.0 KiB
Markdown
84 lines
2.0 KiB
Markdown
# A股交易分析系统 - Web UI
|
|
|
|
现代化的 Web 界面,用于替代原有的 tkinter GUI。
|
|
|
|
## 技术栈
|
|
|
|
### 后端
|
|
- **FastAPI** - 高性能异步 Web 框架
|
|
- **Uvicorn** - ASGI 服务器
|
|
- **Pydantic** - 数据验证
|
|
|
|
### 前端
|
|
- **React 18** - UI 框架
|
|
- **TypeScript** - 类型安全
|
|
- **Vite** - 构建工具
|
|
- **Tailwind CSS** - 样式框架
|
|
- **Lucide React** - 图标库
|
|
|
|
## 快速启动
|
|
|
|
### Windows
|
|
双击运行 `启动Web界面.bat`
|
|
|
|
### 手动启动
|
|
|
|
1. 启动后端:
|
|
```bash
|
|
cd backend
|
|
pip install -r requirements.txt
|
|
uvicorn main:app --reload --host 0.0.0.0 --port 8000
|
|
```
|
|
|
|
2. 启动前端:
|
|
```bash
|
|
cd frontend
|
|
npm install
|
|
npm run dev
|
|
```
|
|
|
|
3. 访问 http://localhost:3000
|
|
|
|
## 项目结构
|
|
|
|
```
|
|
web-ui/
|
|
├── backend/
|
|
│ ├── main.py # FastAPI 主入口
|
|
│ └── requirements.txt # Python 依赖
|
|
├── frontend/
|
|
│ ├── src/
|
|
│ │ ├── components/ # React 组件
|
|
│ │ │ ├── Header.tsx
|
|
│ │ │ ├── Sidebar.tsx
|
|
│ │ │ ├── MetricCards.tsx
|
|
│ │ │ ├── StockAnalysis.tsx
|
|
│ │ │ ├── StockTable.tsx
|
|
│ │ │ ├── Recommendations.tsx
|
|
│ │ │ └── SystemStatus.tsx
|
|
│ │ ├── App.tsx # 主应用组件
|
|
│ │ ├── main.tsx # 入口文件
|
|
│ │ └── index.css # 全局样式
|
|
│ ├── package.json
|
|
│ ├── tailwind.config.js
|
|
│ └── vite.config.ts
|
|
└── 启动Web界面.bat
|
|
```
|
|
|
|
## API 端点
|
|
|
|
| 端点 | 方法 | 描述 |
|
|
|------|------|------|
|
|
| `/api/market/overview` | GET | 获取市场概览数据 |
|
|
| `/api/stocks/ranking` | GET | 获取股票排行榜 |
|
|
| `/api/stocks/recommendations` | GET | 获取 AI 推荐 |
|
|
| `/api/stocks/analyze` | POST | 分析指定股票 |
|
|
| `/api/system/status` | GET | 获取系统状态 |
|
|
|
|
## 设计规范
|
|
|
|
- **主题色**: Vermillion Red (#E42313)
|
|
- **字体**: Space Grotesk (标题) + Inter (正文)
|
|
- **圆角**: 0px (Swiss Clean 风格)
|
|
- **边框**: 1px #E8E8E8
|