# teaching-case-demonstration-system-frontend

**Repository Path**: aimaier4869/teaching-case-demonstration-system-frontend

## Basic Information

- **Project Name**: teaching-case-demonstration-system-frontend
- **Description**: 基于大语言模型的教学案例演示系统
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-02-03
- **Last Updated**: 2025-05-18

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 基于大模型语言的教学案例演示系统

## 项目简介
本系统是一个基于大模型语言技术的教学案例演示平台，旨在为教育工作者提供一个智能化的教学辅助工具。通过整合人工智能与教育教学，为教师和学生提供更加直观、高效的案例教学体验。

## 功能特点
- 智能案例生成：基于大模型语言，自动生成符合教学需求的案例
- 交互式演示：提供丰富的可视化界面，支持实时交互
- 案例管理：支持案例的创建、编辑、分类和检索
- 教学反馈：实时收集学习数据，提供教学效果分析
- 多端适配：支持PC端和移动端访问

## 技术栈
### 前端
- React.js
- Next.js
- TypeScript
- Tailwind CSS
- Ant Design

### 后端
- Node.js
- 大语言模型API集成
- RESTful API

## 安装说明
1. 克隆项目
```bash
git clone [项目地址]
cd teaching-case-demonstration-system/frontend
```

2. 安装依赖
```bash
npm install
# 或
yarn install
```

3. 运行开发环境
```bash
npm run dev
# 或
yarn dev
```

4. 构建生产环境
```bash
npm run build
# 或
yarn build
```

## 使用说明
1. 访问系统首页
2. 登录/注册账号
3. 进入案例管理界面
4. 创建或浏览教学案例
5. 开始案例演示

## 项目结构
```
teaching-case-demonstration-system/
├── frontend/                    # 前端项目目录
│   ├── src/                    # 源代码目录
│   │   ├── apis/              # API接口定义
│   │   ├── assets/            # 静态资源
│   │   ├── components/        # 公共组件
│   │   ├── layout/            # 布局组件
│   │   ├── pages/             # 页面组件
│   │   ├── router/            # 路由配置
│   │   ├── stores/            # 状态管理
│   │   ├── teaching-cases/    # 教学案例相关组件
│   │   ├── utils/             # 工具函数
│   │   ├── App.vue            # 根组件
│   │   ├── main.ts            # 入口文件
│   │   └── style.css          # 全局样式
│   ├── public/                # 公共资源
│   ├── dist/                  # 构建输出目录
│   ├── tools/                 # 工具脚本
│   ├── package.json           # 项目配置文件
│   ├── tsconfig.json          # TypeScript配置
│   ├── vite.config.ts         # Vite配置
│   └── tailwind.config.ts     # Tailwind CSS配置
```

## 教学案例结构
```
teaching-cases/                    # 教学案例目录
├── interfaces.ts                 # 案例通用接口定义
├── _template/                    # 案例模板目录
│   ├── index.ts                 # 案例入口文件
│   ├── Before.vue               # 案例初始状态组件
│   ├── After.vue                # 案例最终状态组件
│   ├── interfaces.ts            # 案例特定接口定义
│   └── core/                    # 案例核心逻辑
│       ├── index.ts             # 核心逻辑入口
│       └── ...                  # 其他核心文件
├── data-struct-stack/           # 数据结构-栈案例
├── insert-sort/                 # 插入排序案例
├── hnuvm/                       # 湖南大学虚拟机案例
├── vspm/                        # 虚拟存储管理案例
├── fibonacci-stack/             # 斐波那契栈案例
└── bubble-sort/                 # 冒泡排序案例
```

每个教学案例目录包含以下文件：
- `index.ts`: 案例入口文件，负责案例的初始化和配置
- `Before.vue`: 展示案例初始状态的组件
- `After.vue`: 展示案例最终状态的组件
- `interfaces.ts`: 定义案例特定的接口和类型
- `core/`: 存放案例的核心逻辑实现