# trainer-ui

**Repository Path**: geeksx/trainer-ui

## Basic Information

- **Project Name**: trainer-ui
- **Description**: 学习教练前端项目
- **Primary Language**: Unknown
- **License**: MulanPSL-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-08-22
- **Last Updated**: 2025-11-05

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Trainer UI - 智能学习训练系统

一个基于Vue.js的智能学习训练系统，支持多种学习模式和智能题目推荐。

## 功能特性

### 🚀 学习模式选择

#### 1. 智能推荐模式
- **特点**: 不显示题目数量和学习进度
- **适用场景**: 想要快速开始学习，不需要预设目标
- **智能推荐**: 后端根据用户答题情况智能推荐下一道题目
- **无限学习**: 用户可以一直作答，系统持续提供新题目

#### 2. 详细设置模式
- **特点**: 显示完整的学习进度和题目统计
- **适用场景**: 有明确学习目标，需要跟踪进度
- **自定义设置**: 可选择学习模式、题型、题目数量
- **进度跟踪**: 实时显示学习进度和完成情况

### 🎯 学习模式
- **练习模式**: 自由练习，即时反馈
- **复习模式**: 错题复习，重点突破
- **考试模式**: 限时考试，模拟真实环境

### 📝 题型支持
- 单选题
- 多选题
- 判断题
- 填空题
- 编程题
- 简答题
- 案例题

## 技术架构

- **前端框架**: Vue.js 2.x
- **UI组件库**: Element UI
- **状态管理**: Vuex
- **路由管理**: Vue Router
- **样式**: CSS3 + 响应式设计

## 项目结构

```
src/
├── components/          # 组件目录
│   ├── ModeSelection.vue    # 学习模式选择
│   ├── QuestionInterface.vue # 答题界面
│   └── ...
├── views/              # 页面视图
│   ├── Learn.vue      # 学习页面
│   └── ...
├── store/              # 状态管理
├── api/                # API接口
└── styles/             # 样式文件
```

## 智能推荐

## 使用方法

### 启动开发环境
```bash
# 使用开发环境配置启动
npm run serve:dev
# 或者
npm run serve
```

### 启动生产环境（本地测试）
```bash
# 使用生产环境配置启动
npm run serve:prod
```

### 构建项目
```bash
# 构建生产环境版本
npm run build:prod
# 或者
npm run build

# 构建开发环境版本
npm run build:dev
```

## 使用说明

### 智能推荐学习
1. 选择学习分类和子分类
2. 点击"直接开始"按钮
3. 系统使用推荐设置开始学习
4. 根据答题情况，系统智能推荐下一题

### 详细设置学习
1. 选择学习分类和子分类
2. 点击"详细设置"按钮
3. 选择学习模式、题型、题目数量
4. 点击"开始学习"按钮
5. 按预设目标完成学习任务

## API接口

### 开始练习
```javascript
POST /api/question/start-practice
{
  "categoryId": "分类ID",
  "studyModeId": "学习模式ID",
  "questionTypeId": "题型ID",
  "limit": "题目数量"
}
```

### 智能推荐模式
```javascript
POST /api/question/recommend
{
  "userId": "用户ID",
  "categoryId": "分类ID",
  "previousAnswers": "历史答题记录",
  "learningProgress": "学习进度"
}
```

## 开发说明

### 添加新的学习模式
1. 在`ModeSelection.vue`中添加新的模式选项
2. 在`QuestionInterface.vue`中添加对应的界面逻辑
3. 在store中添加相关的状态管理

### 自定义题型
1. 在`QuestionInterface.vue`中添加新的题型渲染逻辑
2. 在`getQuestionTypeClass`和`getQuestionTypeText`方法中添加新题型

## 贡献指南

1. Fork 项目
2. 创建功能分支 (`git checkout -b feature/AmazingFeature`)
3. 提交更改 (`git commit -m 'Add some AmazingFeature'`)
4. 推送到分支 (`git push origin feature/AmazingFeature`)
5. 打开 Pull Request

## 许可证

本项目采用 MIT 许可证 - 查看 [LICENSE](LICENSE) 文件了解详情

## 联系方式

如有问题或建议，请提交 Issue 或联系开发团队。