# edu-Agent-Pro-frontend

**Repository Path**: NBz/edu-Agent-Pro-frontend

## Basic Information

- **Project Name**: edu-Agent-Pro-frontend
- **Description**: 项目旨在解决高校实训教学中的“三高三低”问题，通过开源大模型技术，打造一个名为EduAgent-Pro的智能教学实训平台。该平台不依赖本地部署，而是采用轻量化、零运维的API+微服务架构，使高校无需GPU服务器即可接入DeepSeek、OpenAI、Qwen等开放大模型接口，实现智能化教学升级。平台已在校级试点中取得显著成效，包括备课时间减少75%，批改时间减少100%，学生二次正确率提高42%。
- **Primary Language**: TypeScript
- **License**: Not specified
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 2
- **Created**: 2026-04-15
- **Last Updated**: 2026-04-15

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 智能教学辅助系统 (edu-Agent-Pro-frontend)

这是一个智能教学辅助系统的前端项目，基于 Vue 3 + TypeScript + Vite 开发，使用 Ant Design Vue 作为 UI 组件库。该项目旨在为教育工作者和学生提供一个全面的智能教学辅助系统，包括学习助手、练习评测、备课设计、考核内容生成等多种功能。

## 项目简介

`automatic-teach-frontend` 是一个现代化的教育平台前端项目，支持多角色用户（管理员、教师、学生）使用不同的功能模块。系统采用前后端分离架构，前端负责界面展示和用户交互，后端提供API接口服务。

## 技术栈

- **前端框架**: Vue 3.5.12
- **开发语言**: TypeScript
- **构建工具**: Vite 5.4.10
- **UI 组件库**: Ant Design Vue 4.2.6
- **状态管理**: Pinia 3.0.3
- **路由管理**: Vue Router 4.4.5
- **代码编辑器**: Monaco Editor 0.52.2
- **Markdown 渲染**: Markdown-it 14.1.0
- **代码高亮**: Highlight.js 11.11.1
- **图表库**: ECharts 5.6.0
- **文档处理**: @vue-office/docx, @vue-office/excel, @vue-office/pdf
- **协同编辑**: Yjs 13.6.27, Quill 2.0.3
- **复制功能**: Clipboard.js 2.0.11
- **行号插件**: highlightjs-line-numbers.js 2.9.0

## 功能模块

### 用户模块

- **登录/注册功能**: 支持学生和教师角色登录注册
- **毛玻璃效果的登录界面**: 现代化的用户界面设计
- **用户中心**: 个人信息管理和设置
- **思维导图**: 创建和编辑思维导图
- **文档中心**: 文档查看和管理

### 教师模块

- **备课与设计**: 根据课程大纲自动设计教学内容
  - 智能备课工具，支持课程设计
  - 备课内容编辑和管理
- **智能PPT**: 自动生成教学PPT
- **知识图谱**: 构建和展示知识图谱
- **考核内容生成**: 自动生成多样化考核题目及参考答案
  - 智能生成各类考核内容
  - 考核内容编辑和管理
- **学情数据分析**: 自动化检测学生答案，提供数据分析
- **我的资源**: 管理教学资源
- **文档差异**: 对比文档差异
- **协同空间**: 支持多人协同编辑
- **图片教学**: 图片生成和编辑功能
- **视频教学**: 视频生成和编辑功能
- **教学班级**: 管理教学班级和学生

### 学生模块

- **学习助手**: 结合教学内容解答问题
  - RAG对话和文档总结
  - 智能问答系统
- **实时练习评测助手**: 生成随练题目并纠错
- **编程练习**: 支持在线编程练习和评测
- **编程刷题**: 提供编程题目练习
- **错题集**: 收集和管理练习中的错题
- **测试练习**: 提供各类测试练习功能

### 管理模块

- **用户管理**: 管理员/教师/学生等用户基本管理
- **课件资源管理**: 按学科列表管理教师备课资源
- **大屏概览**: 使用统计、效率指数、学习效果等
  - 系统数据大屏展示
  - 系统概览和统计
- **系统管理**: 系统配置和管理
  - 资源管理: 系统资源管理
  - 提示词管理: AI提示词管理

## 项目结构

```
src/
├── api/                    # API 接口定义
├── assets/                 # 静态资源
├── components/             # 公共组件
├── config/                 # 配置文件
├── document/               # 项目文档
├── layouts/                # 布局组件
├── pages/                  # 页面组件
│   ├── admin/             # 管理员页面
│   ├── demo/              # 示例页面
│   ├── student/           # 学生页面
│   ├── teacher/           # 教师页面
│   └── user/              # 用户页面
├── router/                 # 路由配置
├── store/                  # 状态管理
├── ui/                     # UI 组件
├── utils/                  # 工具函数
├── App.vue                # 根组件
└── main.ts                # 入口文件
```

## 安装与运行

### 环境要求

- Node.js >= 18
- npm >= 9

### 安装依赖

```bash
npm install
```

### 开发环境运行

```bash
npm run dev
```

### 生产环境构建

```bash
npm run build
```

### 预览生产环境

```bash
npm run preview
```

### 代码检查

```bash
npm run lint
```

### 代码格式化

```bash
npm run format
```

### 类型检查

```bash
npm run type-check
```

### API 文档生成

```bash
npm run openapi
```

## 环境配置

项目使用环境变量进行配置，主要配置项如下：

- `VITE_DEPLOY_DOMAIN`: 应用部署域名，默认为 `http://localhost`
- `VITE_API_BASE_URL`: API 基础地址，默认为 `http://localhost:8123/api`

可以在项目根目录的 `.env.development` 文件中配置开发环境变量。

## 权限管理

项目使用基于角色的访问控制（RBAC），主要角色包括：

- **管理员 (ADMIN)**: 拥有系统所有权限
- **教师 (TEACHER)**: 拥有教学相关功能权限
- **学生 (STUDENT)**: 拥有学习相关功能权限
- **默认用户 (DEFAULT)**: 拥有基本功能权限

权限枚举定义在 `src/utils/access/ACCESS_ENUM.ts` 中。

## 特色功能

### 1. 智能代码块渲染

项目实现了智能代码块渲染功能，包括：

- **代码高亮**: 使用 Highlight.js 实现代码语法高亮
- **行号显示**: 使用 highlightjs-line-numbers.js 显示代码行号
- **一键复制**: 使用 Clipboard.js 实现代码一键复制功能
- **视觉反馈**: 复制成功后按钮变为绿色，提供直观的视觉反馈

### 2. 多模态内容处理

项目支持多种内容格式的处理和展示：

- **文档处理**: 支持 Word、Excel、PDF 文档的在线预览
- **图片处理**: 支持图片生成和编辑功能
- **视频处理**: 支持视频生成和编辑功能
- **Markdown**: 支持 Markdown 内容的渲染和编辑

### 3. 协同编辑

项目支持多人协同编辑功能：

- **实时同步**: 使用 Yjs 实现文档的实时同步
- **富文本编辑**: 使用 Quill 提供富文本编辑功能
- **光标跟踪**: 支持多人编辑时的光标位置跟踪

### 4. 双主题支持

项目支持专业科技风和暗黑风两种主题，用户可以根据个人喜好进行切换。

## 开发指南

### 添加新页面

1. 在 `src/pages` 对应目录下创建页面组件
2. 在 `src/router/index.ts` 中添加路由配置
3. 根据需要添加权限控制

### 添加新API

1. 在 `src/api` 目录下创建对应的 API 接口文件
2. 使用 TypeScript 定义接口类型
3. 在组件中导入并使用 API

### 添加新组件

1. 在 `src/components` 目录下创建组件
2. 使用 TypeScript 定义组件 props 和 emits
3. 在需要的页面中导入并使用组件

## 贡献指南

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
- 发送邮件至项目维护者

## 更新日志

查看 [CHANGELOG.md](CHANGELOG.md) 了解版本更新详情。