# WzSystem-frontend

**Repository Path**: laydi887/general-java-code-frontend

## Basic Information

- **Project Name**: WzSystem-frontend
- **Description**: 前端架构-供自己学习使用
- **Primary Language**: TypeScript
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-08-07
- **Last Updated**: 2025-06-20

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# GeneralJavaCode-frontend

## 项目介绍
这是一个基于 Vue 3 + TypeScript + Element Plus 的前端项目，主要用于在线考试系统的前端实现。项目采用现代化的前端技术栈和工程化实践。

## 技术栈
- 核心框架：Vue 3.4.x
- 开发语言：TypeScript 5.5.x
- UI 框架：Element Plus 2.7.x
- 状态管理：Pinia 2.2.x
- 路由管理：Vue Router 4.4.x
- 构建工具：Vite 5.3.x
- 代码规范：ESLint + Prettier + Stylelint
- 其他工具：
  - VXE Table - 表格解决方案
  - ECharts - 图表库
  - WangEditor - 富文本编辑器
  - Vue I18n - 国际化
  - Axios - HTTP 请求
  - UnoCSS - 原子化 CSS 框架

## 开发环境要求
- Node.js >= 18.0.0
- pnpm 包管理器

## 安装和运行

1. 安装依赖
```bash
pnpm install
```

2. 开发环境运行
```bash
pnpm run dev
```

3. 生产环境构建
```bash
pnpm run build
```

## 项目特性
- 基于 Vue 3 Composition API
- TypeScript 支持
- 完整的代码规范配置
- Git 提交规范（commitizen + husky）
- 自动导入组件和 API
- 支持 SVG 图标
- 响应式布局
- 在线考试系统功能
  - 试卷管理
  - 题目管理
  - 考试管理
  - 成绩统计

## 项目结构

### src 目录
- **api/**: 存放与后端交互的 API 文件。
- **types/**: 存放 TypeScript 类型定义文件。
- **components/**: 存放 Vue 组件。
- **utils/**: 存放工具函数。
- **views/**: 存放不同页面的 Vue 组件。
- **store/**: 存放状态管理相关的文件（如 Pinia）。
- **assets/**: 存放静态资源（如图片、字体等）。
- **styles/**: 存放样式文件。
- **plugins/**: 存放 Vue 插件。
- **layout/**: 存放布局相关的组件。
- **lang/**: 存放国际化相关的文件。
- **enums/**: 存放枚举类型。
- **directive/**: 存放自定义指令。
- **router/**: 存放路由配置文件。
- **main.ts**: 项目的入口文件。
- **App.vue**: 根组件。
- **settings.ts**: 项目设置相关的文件。

### 功能概述
该项目是一个在线考试系统的前端实现，支持试卷的查询、展示、编辑、删除和发布等功能，用户可以方便地管理试卷信息。

## 目录结构
```
├── src/                    # 源码目录
│   ├── api/               # API 接口
│   ├── assets/            # 静态资源
│   ├── components/        # 公共组件
│   ├── layout/           # 布局组件
│   ├── router/           # 路由配置
│   ├── store/            # Pinia 状态管理
│   ├── styles/           # 全局样式
│   ├── utils/            # 工具函数
│   └── views/            # 页面组件
├── public/                # 公共静态资源
├── mock/                  # 数据mock
├── .husky/               # Git hooks
├── vite.config.ts        # Vite 配置
└── tsconfig.json         # TypeScript 配置
```

## 代码规范
- 使用 ESLint 进行代码检查
- 使用 Prettier 进行代码格式化
- 使用 Stylelint 进行样式规范检查
- 提交前自动运行 lint-staged

## 参与贡献
1. 本项目参考 有来开源组织/vue3-element-admin，感谢提供支持
2. Fork 本仓库
3. 新建功能分支
4. 提交代码
5. 创建 Pull Request

## 许可证
MIT License