# VsbFrame

**Repository Path**: garytwelve/vsb-frame

## Basic Information

- **Project Name**: VsbFrame
- **Description**: 一套vue+springboot+mysql的通用项目基础模版，包含基础的权限管理模块，可直接用于生产项目快速搭建
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-04-13
- **Last Updated**: 2026-05-03

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 后台管理系统

基于 Vue3 + Spring Boot + MyBatis-Plus 的企业级后台管理系统，采用 RBAC 权限模型，支持按钮级权限控制、动态路由、定时任务调度、国际化等功能。

![](assets/2026-05-03-11-05-04-image.png)



![](assets/2026-05-03-11-05-54-image.png)



![](assets/2026-05-03-11-06-25-image.png)



![](assets/2026-05-03-11-07-20-image.png)

## 功能概述

- **用户管理**：用户增删改查、密码重置、状态管理、头像上传
- **角色管理**：角色增删改查、权限分配（菜单树选择）
- **菜单管理**：树形菜单管理、按钮级权限配置、图标选择
- **定时任务**：动态 Cron 调度、手动执行、执行日志查看
- **系统监控**：CPU/JVM/服务器实时监控
- **系统配置**：系统名称、图标、Favicon 等在线配置
- **个人中心**：个人资料修改、密码修改、头像更换
- **国际化**：中文/英文双语支持
- **主题切换**：亮色/暗色主题、字体大小调整
- **安全机制**：JWT 认证、空闲超时自动退出、密码策略校验

## 技术架构

### 前端

| 技术           | 说明         |
| ------------ | ---------- |
| Vue 3        | 渐进式前端框架    |
| Element Plus | UI 组件库     |
| Pinia        | 状态管理       |
| Vue Router   | 路由管理（动态路由） |
| vue-i18n     | 国际化        |
| Axios        | HTTP 客户端   |
| Vite         | 构建工具       |

### 后端

| 技术              | 说明       |
| --------------- | -------- |
| Spring Boot 2.7 | 应用框架     |
| Spring Security | 安全框架     |
| JWT (jjwt)      | Token 认证 |
| MyBatis-Plus    | ORM 框架   |
| MySQL 8.0       | 数据库      |

## 安装部署

### 环境要求

- JDK 11+
- Node.js 16+
- MySQL 8.0+
- Maven 3.6+

### 1. 克隆项目

```bash
git clone https://gitee.com/your-username/admin-system.git
cd admin-system
```

### 2. 数据库配置

修改 `backend/src/main/resources/application.yml` 中的数据库连接信息：

```yaml
spring:
  datasource:
    url: jdbc:mysql://localhost:3306/admin_system?useUnicode=true&characterEncoding=utf-8&useSSL=false&serverTimezone=Asia/Shanghai&allowPublicKeyRetrieval=true
    username: your_username
    password: your_password
```

数据库会在首次启动时自动初始化（表结构和基础数据）。

### 3. 启动后端

```bash
cd backend
mvn clean package -DskipTests
java -Dfile.encoding=UTF-8 -jar target/admin-system-1.0.0.jar
```

后端默认运行在 `http://localhost:8080`

### 4. 启动前端

```bash
cd frontend
npm install
npm run dev
```

前端默认运行在 `http://localhost:3001`

### 5. 访问系统

- 地址：`http://localhost:3001`
- 管理员账号：`admin` / `admin123`

## 使用说明

### 权限管理

系统采用 RBAC 权限模型，权限细化到按钮级别：

1. 在 **菜单管理** 中配置菜单和按钮权限（权限标识格式：`模块:资源:操作`）
2. 在 **角色管理** 中为角色分配菜单和按钮权限
3. 在 **用户管理** 中为用户分配角色

### 定时任务

1. 在 **定时任务** 页面新增任务，配置调用目标和 Cron 表达式
2. 调用目标格式：`beanName.methodName()` 或 `beanName.methodName('param')`
3. 支持手动执行一次、暂停/恢复、查看执行日志
4. 系统内置示例任务：`demoTask.logCurrentTime()`、`demoTask.logMemoryUsage()`

### 系统配置

在 **系统配置** 页面可在线修改：

- 系统名称（显示在登录页和浏览器标题）
- 系统图标（显示在侧边栏）
- Favicon（浏览器标签图标）

### 国际化

系统支持中文和英文切换，点击顶部导航栏的语言切换按钮即可。

### 主题

- 亮色/暗色主题切换
- 字体大小调整（小/默认/大）

## 项目结构

```
admin-system/
├── backend/                    # 后端项目
│   ├── src/main/java/          # Java 源码
│   │   └── com/admin/system/
│   │       ├── controller/     # 控制器
│   │       ├── service/        # 服务层
│   │       ├── mapper/         # 数据访问层
│   │       ├── entity/         # 实体类
│   │       ├── dto/            # 请求数据传输对象
│   │       ├── vo/             # 响应数据传输对象
│   │       ├── config/         # 配置类
│   │       ├── security/       # 安全相关
│   │       ├── task/           # 定时任务
│   │       ├── exception/      # 异常处理
│   │       ├── util/           # 工具类
│   │       └── common/         # 公共类
│   └── src/main/resources/
│       ├── application.yml     # 应用配置
│       ├── logback-spring.xml  # 日志配置
│       └── sql/init.sql        # 数据库初始化脚本
├── frontend/                   # 前端项目
│   └── src/
│       ├── api/                # API 接口
│       ├── store/              # 状态管理
│       ├── router/             # 路由配置
│       ├── utils/              # 工具函数
│       ├── directives/         # 自定义指令
│       ├── components/         # 公共组件
│       ├── layout/             # 布局组件
│       ├── views/              # 页面组件
│       └── locales/            # 国际化文件
└── doc/                        # 技术文档
    ├── architecture.md         # 架构文档
    └── api.md                  # API 文档
```

## 贡献指南

1. Fork 本仓库
2. 创建功能分支：`git checkout -b feature/your-feature`
3. 提交更改：`git commit -m 'Add some feature'`
4. 推送分支：`git push origin feature/your-feature`
5. 提交 Pull Request

### 代码规范

- 后端遵循阿里巴巴 Java 开发手册
- 前端遵循 Vue.js 官方风格指南
- 所有业务数据必须在后端处理，前端只负责展示
- 所有业务数据必须取自数据库，禁止硬编码
- UI 组件优先使用 Element Plus

## 联系方式

如有问题或建议，请通过以下方式联系：

- 提交 Issue：[Gitee Issues](https://gitee.com/your-username/admin-system/issues)
- 邮箱：your-email@example.com

## 开源协议

[MIT License](LICENSE)