105 lines
2.8 KiB
Markdown
105 lines
2.8 KiB
Markdown
# 数据仪表盘功能说明
|
||
|
||
## 功能概述
|
||
|
||
数据仪表盘是一个系统数据概览页面，提供以下关键指标和图表：
|
||
|
||
### 核心指标
|
||
- **用户总数**: 系统中注册用户的总数量
|
||
- **付费用户数**: 有成功支付记录的用户数量
|
||
- **今日收入**: 当天成功支付的金额总和
|
||
- **转化率**: 付费用户数占总用户数的百分比
|
||
|
||
### 图表展示
|
||
- **日活用户趋势**: 最近30天的日活跃用户数量变化
|
||
- **收入趋势**: 最近30天的收入变化情况
|
||
- **订单状态分布**: 不同订单状态的分布饼图
|
||
- **支付方式分布**: 不同支付方式的使用情况
|
||
|
||
### 数据列表
|
||
- **最近订单**: 显示最新的10个订单信息
|
||
|
||
## 技术实现
|
||
|
||
### 后端实现
|
||
- `DashboardService`: 提供数据统计和计算服务
|
||
- `DashboardApiController`: 提供RESTful API接口
|
||
- 支持的数据源：用户、订单、支付记录
|
||
|
||
### 前端实现
|
||
- `Dashboard.vue`: 主要仪表盘组件
|
||
- `dashboard.js`: API调用封装
|
||
- 使用ECharts进行图表渲染
|
||
- 响应式设计，支持移动端访问
|
||
|
||
## 访问权限
|
||
|
||
- 需要管理员权限才能访问
|
||
- 路径：`/admin/dashboard`
|
||
- API路径：`/api/dashboard/**`
|
||
|
||
## 安装和运行
|
||
|
||
### 后端
|
||
1. 确保Spring Boot应用正常运行
|
||
2. 运行数据库迁移脚本（为users表添加created_at字段）：
|
||
```sql
|
||
-- 运行 migration_add_created_at.sql
|
||
```
|
||
3. 数据库中有用户、订单、支付数据
|
||
|
||
### 前端
|
||
1. 安装依赖：
|
||
```bash
|
||
cd demo/frontend
|
||
npm install
|
||
```
|
||
|
||
2. 启动前端服务：
|
||
```bash
|
||
npm run dev
|
||
```
|
||
|
||
3. 使用管理员账户登录后访问仪表盘
|
||
|
||
**注意**: ECharts图表库通过CDN动态加载，无需额外安装npm包
|
||
|
||
### 数据库迁移
|
||
如果users表没有created_at字段，需要运行迁移脚本：
|
||
```sql
|
||
ALTER TABLE users ADD COLUMN created_at TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP;
|
||
UPDATE users SET created_at = CURRENT_TIMESTAMP WHERE created_at IS NULL;
|
||
```
|
||
|
||
## API接口
|
||
|
||
### 获取所有数据
|
||
```
|
||
GET /api/dashboard/all
|
||
```
|
||
|
||
### 单独获取各项数据
|
||
- `GET /api/dashboard/overview` - 概览数据
|
||
- `GET /api/dashboard/daily-active-users` - 日活数据
|
||
- `GET /api/dashboard/revenue-trend` - 收入趋势
|
||
- `GET /api/dashboard/order-status-distribution` - 订单状态分布
|
||
- `GET /api/dashboard/payment-method-distribution` - 支付方式分布
|
||
- `GET /api/dashboard/recent-orders` - 最近订单
|
||
|
||
## 注意事项
|
||
|
||
1. 所有API都需要管理员权限
|
||
2. 数据统计基于现有数据库记录
|
||
3. 图表数据为最近30天的趋势
|
||
4. 需要确保数据库中有足够的测试数据
|
||
5. 建议在生产环境中添加数据缓存机制
|
||
|
||
## 扩展功能
|
||
|
||
可以考虑添加的功能：
|
||
- 数据导出功能
|
||
- 自定义时间范围查询
|
||
- 实时数据更新
|
||
- 更多图表类型
|
||
- 数据对比分析
|