RuoYi Vue3

https://github.com/yangzongzhuan/ruoyi-vue3
Admin
RuoYi Vue3 is a Java rapid development framework based on SpringBoot and Vue3, offering a full-stack...
Tokens:55,739
Snippets:516
Trust Score:9.3
License:MIT
Update:2 months ago
Show doc for...
Tokens:
Raw
### Run RuoYi-Vue3 Frontend

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/README.md

Commands to clone the repository, install dependencies, and start the development server.

```bash
# 克隆项目
git clone https://github.com/yangzongzhuan/RuoYi-Vue3.git

# 进入项目目录
cd RuoYi-Vue3

# 安装依赖
yarn --registry=https://registry.npmmirror.com

# 启动服务
yarn dev

# 构建测试环境 yarn build:stage
# 构建生产环境 yarn build:prod
# 前端访问地址 http://localhost:80
```

--------------------------------

### GET /system/config/list

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

获取参数配置列表。

```APIDOC
## GET /system/config/list

### Description
获取参数配置列表。

### Method
GET

### Endpoint
/system/config/list

### Parameters
#### Query Parameters
- **pageNum** (number) - Optional
- **pageSize** (number) - Optional
- **configName** (string) - Optional
- **configKey** (string) - Optional
- **configType** (string) - Optional
```

--------------------------------

### GET /system/post/list

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

获取岗位列表。

```APIDOC
## GET /system/post/list

### Description
获取岗位列表。

### Method
GET

### Endpoint
/system/post/list

### Parameters
#### Query Parameters
- **pageNum** (number) - Optional
- **pageSize** (number) - Optional
- **postCode** (string) - Optional
- **postName** (string) - Optional
- **status** (string) - Optional
```

--------------------------------

### GET /system/menu/list

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

获取菜单列表，支持按名称和状态过滤。

```APIDOC
## GET /system/menu/list

### Description
获取菜单列表。

### Method
GET

### Endpoint
/system/menu/list

### Parameters
#### Query Parameters
- **menuName** (string) - Optional - 菜单名称
- **status** (string) - Optional - 菜单状态
```

--------------------------------

### GET /monitor/server

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/06-api-监控和工具接口.md

获取服务器运行信息，包括CPU、内存、磁盘及操作系统相关信息。

```APIDOC
## GET /monitor/server

### Description
获取服务器运行信息（CPU、内存、磁盘等）。

### Method
GET

### Endpoint
/monitor/server

### Response
#### Success Response (200)
- **cpu** (object) - CPU使用率信息
- **mem** (object) - 内存使用率信息
- **sys** (object) - 操作系统信息
- **jvm** (object) - JVM内存信息
```

--------------------------------

### GET /system/config/{configId}

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

获取参数配置详情。

```APIDOC
## GET /system/config/{configId}

### Description
获取参数配置详情。

### Method
GET

### Endpoint
/system/config/{configId}

### Parameters
#### Path Parameters
- **configId** (string) - Required
```

--------------------------------

### GET /system/role/list

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

获取角色列表，支持分页查询及按名称、标识、状态和时间范围筛选。

```APIDOC
## GET /system/role/list

### Description
获取角色列表，支持分页查询及按名称、标识、状态和时间范围筛选。

### Method
GET

### Endpoint
/system/role/list

### Parameters
#### Query Parameters
- **pageNum** (number) - Optional - 页码
- **pageSize** (number) - Optional - 每页条数
- **roleName** (string) - Optional - 角色名称搜索
- **roleKey** (string) - Optional - 角色标识搜索
- **status** (string) - Optional - 角色状态：0-正常 1-停用
- **beginTime** (string) - Optional - 创建开始时间
- **endTime** (string) - Optional - 创建结束时间

### Response
#### Success Response (200)
- **total** (number) - 总记录数
- **rows** (array) - 角色列表数据
```

--------------------------------

### GET /monitor/logininfor/list

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/06-api-监控和工具接口.md

获取登录日志列表。

```APIDOC
## GET /monitor/logininfor/list

### Description
获取登录日志列表。

### Method
GET

### Endpoint
/monitor/logininfor/list

### Parameters
#### Query Parameters
- **pageNum** (number) - Optional
- **pageSize** (number) - Optional
- **ipaddr** (string) - Optional
- **userName** (string) - Optional
- **status** (string) - Optional
- **beginTime** (string) - Optional
- **endTime** (string) - Optional

### Response
#### Success Response (200)
- **total** (number) - 总记录数
- **rows** (array) - 日志列表
```

--------------------------------

### GET /system/config/configKey/{configKey}

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

根据参数键名获取参数值。

```APIDOC
## GET /system/config/configKey/{configKey}

### Description
根据参数键名获取参数值。常用于在应用中读取系统配置。

### Method
GET

### Endpoint
/system/config/configKey/{configKey}

### Parameters
#### Path Parameters
- **configKey** (string) - Required - 参数键

### Response
#### Success Response (200)
- **configValue** (string) - 参数值
```

--------------------------------

### GET /system/user/list

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/03-api-用户管理接口.md

获取用户列表，支持分页及多条件筛选。

```APIDOC
## GET /system/user/list

### Description
获取用户列表，支持分页及多条件筛选。

### Method
GET

### Endpoint
/system/user/list

### Parameters
#### Query Parameters
- **pageNum** (number) - Optional - 页码（默认1）
- **pageSize** (number) - Optional - 每页条数（默认10）
- **deptId** (number) - Optional - 部门ID
- **userName** (string) - Optional - 用户名搜索
- **nickName** (string) - Optional - 昵称搜索
- **userType** (string) - Optional - 用户类型
- **sex** (string) - Optional - 性别
- **status** (string) - Optional - 用户状态：0-正常 1-停用
- **beginTime** (string) - Optional - 创建开始时间
- **endTime** (string) - Optional - 创建结束时间

### Response
#### Success Response (200)
- **total** (number) - 用户总数
- **rows** (array) - 用户列表数据
- **code** (number) - 状态码
- **msg** (string) - 响应消息
```

--------------------------------

### GET /monitor/cache

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/06-api-监控和工具接口.md

获取缓存监控信息。

```APIDOC
## GET /monitor/cache

### Description
获取缓存信息。

### Method
GET

### Endpoint
/monitor/cache
```

--------------------------------

### GET /monitor/operlog/list

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/06-api-监控和工具接口.md

获取操作日志列表。

```APIDOC
## GET /monitor/operlog/list

### Description
获取操作日志列表。

### Method
GET

### Endpoint
/monitor/operlog/list

### Parameters
#### Query Parameters
- **pageNum** (number) - Optional
- **pageSize** (number) - Optional
- **title** (string) - Optional
- **operName** (string) - Optional
- **businessType** (string) - Optional
- **status** (string) - Optional
- **beginTime** (string) - Optional
- **endTime** (string) - Optional

### Response
#### Success Response (200)
- **total** (number) - 总记录数
- **rows** (array) - 日志列表
```

--------------------------------

### GET /system/dept/list

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

获取部门列表，支持按名称、状态及时间范围搜索。

```APIDOC
## GET /system/dept/list

### Description
获取部门列表。

### Method
GET

### Endpoint
/system/dept/list

### Parameters
#### Query Parameters
- **deptName** (string) - Optional - 部门名称搜索
- **status** (string) - Optional - 部门状态
- **beginTime** (string) - Optional - 开始时间
- **endTime** (string) - Optional - 结束时间
```

--------------------------------

### GET /tool/gen/list

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/06-api-监控和工具接口.md

获取已导入的表列表。

```APIDOC
## GET /tool/gen/list

### Description
获取已导入的表列表。

### Method
GET

### Endpoint
/tool/gen/list

### Parameters
#### Query Parameters
- **pageNum** (number) - Optional
- **pageSize** (number) - Optional
- **tableName** (string) - Optional
- **tableComment** (string) - Optional
```

--------------------------------

### GET /getInfo

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/02-api-认证和登录接口.md

获取当前登录用户的详细信息和权限。

```APIDOC
## GET /getInfo

### Description
获取当前登录用户的详细信息和权限。

### Method
GET

### Endpoint
/getInfo

### Response
#### Success Response (200)
- **user** (object) - 用户详细信息
- **roles** (array) - 用户角色列表
- **permissions** (array) - 用户权限列表
- **pwdChrtype** (string) - 密码字符类型
- **isDefaultModifyPwd** (boolean) - 是否为默认密码
- **isPasswordExpired** (boolean) - 密码是否过期
```

--------------------------------

### GetInfo Usage Example

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/04-store-用户和权限状态管理.md

演示如何调用 getInfo 方法并根据返回结果执行后续逻辑。

```javascript
import useUserStore from '@/store/modules/user'

const userStore = useUserStore()

try {
  const result = await userStore.getInfo()
  console.log('用户角色:', result.roles)
  console.log('用户权限:', result.permissions)
  // 检查是否需要修改密码
  if (result.isDefaultModifyPwd) {
    console.log('需要修改初始密码')
  }
} catch (err) {
  console.error('获取用户信息失败:', err)
}
```

--------------------------------

### GET /system/user/profile

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/03-api-用户管理接口.md

获取当前登录用户的个人信息。

```APIDOC
## GET /system/user/profile

### Description
获取当前登录用户的个人信息。

### Method
GET

### Endpoint
/system/user/profile

### Response
#### Success Response (200)
- **user** (object) - 用户个人信息对象
- **roles** ([string]) - 角色列表
- **permissions** ([string]) - 权限列表
```

--------------------------------

### Login Usage Example

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/04-store-用户和权限状态管理.md

演示如何调用 login 方法并处理登录成功或失败的逻辑。

```javascript
import useUserStore from '@/store/modules/user'

const userStore = useUserStore()

const loginData = {
  username: 'admin',
  password: 'admin123',
  code: 'yzx1',
  uuid: 'uuid-string'
}

try {
  await userStore.login(loginData)
  console.log('登录成功，Token:', userStore.token)
  // 重定向到首页
  router.push('/')
} catch (err) {
  console.error('登录失败:', err)
}
```

--------------------------------

### GET /tool/gen/db/list

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/06-api-监控和工具接口.md

获取数据库中的表列表（未导入）。

```APIDOC
## GET /tool/gen/db/list

### Description
获取数据库中的表列表（未导入）。

### Method
GET

### Endpoint
/tool/gen/db/list

### Parameters
#### Query Parameters
- **pageNum** (number) - Optional
- **pageSize** (number) - Optional
- **tableName** (string) - Optional
- **tableComment** (string) - Optional
```

--------------------------------

### GET /tool/gen/synchDb/{tableName}

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/06-api-监控和工具接口.md

同步数据库表结构。

```APIDOC
## GET /tool/gen/synchDb/{tableName}

### Description
同步数据库表结构。

### Method
GET

### Endpoint
/tool/gen/synchDb/{tableName}

### Parameters
#### Path Parameters
- **tableName** (string) - Required
```

--------------------------------

### GET /system/post/{postId}

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

获取岗位详情。

```APIDOC
## GET /system/post/{postId}

### Description
获取岗位详情。

### Method
GET

### Endpoint
/system/post/{postId}

### Parameters
#### Path Parameters
- **postId** (string) - Required
```

--------------------------------

### GET /system/user/{userId}

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/03-api-用户管理接口.md

根据用户ID获取用户的详细信息，包括角色列表。

```APIDOC
## GET /system/user/{userId}

### Description
根据用户ID获取用户的详细信息，包括角色列表。

### Method
GET

### Endpoint
/system/user/{userId}

### Parameters
#### Path Parameters
- **userId** (number) - Required - 用户ID

### Response
#### Success Response (200)
- **user** (object) - 用户详细信息
- **roles** (array) - 用户的角色列表
- **roleIds** (array) - 用户的角色ID列表
```

--------------------------------

### GET /system/user/authRole/{userId}

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/03-api-用户管理接口.md

获取指定用户的已授权角色和所有可用角色列表。

```APIDOC
## GET /system/user/authRole/{userId}

### Description
获取用户的已授权角色和所有可用角色列表。

### Method
GET

### Endpoint
/system/user/authRole/{userId}

### Parameters
#### Path Parameters
- **userId** (number) - Required - 用户ID

### Response
#### Success Response (200)
- **user** (object) - 用户信息
- **roles** (array) - 角色列表
```

--------------------------------

### Use Store in Vue Components

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/12-响应式数据和composition-api.md

Access store state and actions in a component setup function. Use storeToRefs to maintain reactivity when destructuring state properties.

```javascript
import { storeToRefs } from 'pinia'
import useMyStore from '@/store/modules/my'

export default {
  setup() {
    const myStore = useMyStore()
    
    // 使用storeToRefs来解包，保持响应性
    const { count, items } = storeToRefs(myStore)
    
    return {
      count,
      items,
      // action可以直接访问
      increment: myStore.increment
    }
  }
}
```

--------------------------------

### GET /monitor/operlog/{operId}

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/06-api-监控和工具接口.md

获取操作日志详情。

```APIDOC
## GET /monitor/operlog/{operId}

### Description
获取操作日志详情。

### Method
GET

### Endpoint
/monitor/operlog/{operId}

### Parameters
#### Path Parameters
- **operId** (number) - Required - 操作日志ID
```

--------------------------------

### GET /system/role/{roleId}

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

获取指定角色的详细信息及其关联的菜单权限。

```APIDOC
## GET /system/role/{roleId}

### Description
获取指定角色的详细信息及其关联的菜单权限。

### Method
GET

### Endpoint
/system/role/{roleId}

### Parameters
#### Path Parameters
- **roleId** (number) - Required - 角色ID

### Response
#### Success Response (200)
- **role** (object) - 角色详细信息
- **menuIds** (array) - 该角色拥有的菜单ID列表
```

--------------------------------

### GET /tool/gen/preview/{tableId}

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/06-api-监控和工具接口.md

预览代码生成结果。

```APIDOC
## GET /tool/gen/preview/{tableId}

### Description
预览代码生成结果。

### Method
GET

### Endpoint
/tool/gen/preview/{tableId}

### Parameters
#### Path Parameters
- **tableId** (number) - Required

### Response
#### Success Response (200)
- **fileName** (string) - 文件名
- **code** (string) - 生成的代码
```

--------------------------------

### 在组件中加载字典数据

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/13-常见应用场景和示例.md

使用useDict工具函数在组件setup中加载字典，并绑定到下拉选择框。

```javascript
import { useDict } from '@/utils/dict'

export default {
  setup() {
    // 加载性别和状态字典
    const { sys_user_sex, sys_user_status } = useDict('sys_user_sex', 'sys_user_status')

    return {
      sys_user_sex,
      sys_user_status
    }
  },
  template: `
    <el-select v-model="form.sex" placeholder="选择性别">
      <el-option
        v-for="item in sys_user_sex"
        :key="item.value"
        :label="item.label"
        :value="item.value"
      />
    </el-select>

    <el-select v-model="form.status" placeholder="选择状态">
      <el-option
        v-for="item in sys_user_status"
        :key="item.value"
        :label="item.label"
        :value="item.value"
      />
    </el-select>
  `
}
```

--------------------------------

### GET /system/role/authUser/unallocatedList

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

获取角色未授权的用户列表。

```APIDOC
## GET /system/role/authUser/unallocatedList

### Description
获取角色未授权的用户列表。

### Method
GET

### Endpoint
/system/role/authUser/unallocatedList
```

--------------------------------

### GET /system/role/authUser/allocatedList

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

获取角色已授权的用户列表。

```APIDOC
## GET /system/role/authUser/allocatedList

### Description
获取角色已授权的用户列表。

### Method
GET

### Endpoint
/system/role/authUser/allocatedList

### Parameters
#### Query Parameters
- **pageNum** (number) - Required - 页码
- **pageSize** (number) - Required - 每页条数
- **roleId** (number) - Required - 角色ID
- **userName** (string) - Optional - 用户名
```

--------------------------------

### POST /system/config

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

创建参数配置。

```APIDOC
## POST /system/config

### Description
创建参数配置。

### Method
POST

### Endpoint
/system/config

### Parameters
#### Request Body
- **configName** (string) - Required - 参数名称
- **configKey** (string) - Required - 参数键
- **configValue** (string) - Required - 参数值
- **configType** (string) - Required - 配置类型
- **remark** (string) - Optional - 备注
```

--------------------------------

### GET /captchaImage

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/02-api-认证和登录接口.md

获取验证码图片和UUID，用于登录页面展示。

```APIDOC
## GET /captchaImage

### Description
获取验证码图片和UUID，用于登录页面展示。超时时间设置为20秒。

### Method
GET

### Endpoint
/captchaImage

### Response
#### Success Response (200)
- **uuid** (string) - 验证码唯一标识
- **img** (string) - Base64编码的验证码图片
- **captchaEnabled** (boolean) - 是否启用验证码

#### Response Example
{
  "uuid": "string",
  "img": "string",
  "captchaEnabled": true
}
```

--------------------------------

### PUT /system/config

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

更新参数配置。

```APIDOC
## PUT /system/config

### Description
更新参数配置。

### Method
PUT

### Endpoint
/system/config
```

--------------------------------

### 注册全局插件

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/07-plugins-插件系统.md

通过 installPlugins 函数将插件挂载到 Vue 应用的全局属性中。

```javascript
export default function installPlugins(app) {
  app.config.globalProperties.$tab = tab       // 页签管理
  app.config.globalProperties.$auth = auth     // 权限认证
  app.config.globalProperties.$cache = cache   // 缓存
  app.config.globalProperties.$modal = modal   // 模态框
  app.config.globalProperties.$download = download // 文件下载
}
```

```javascript
import plugins from './plugins'
app.use(plugins)
```

--------------------------------

### GET /system/user/deptTree

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/03-api-用户管理接口.md

获取部门树结构，用于部门选择器。

```APIDOC
## GET /system/user/deptTree

### Description
获取部门树结构，用于部门选择器。

### Method
GET

### Endpoint
/system/user/deptTree

### Response
#### Success Response (200)
- **depts** (array) - 部门树结构列表
```

--------------------------------

### POST /system/menu

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

创建新的菜单项。

```APIDOC
## POST /system/menu

### Description
创建菜单。

### Method
POST

### Endpoint
/system/menu

### Parameters
#### Request Body
- **parentId** (number) - Required - 父菜单ID
- **menuName** (string) - Required - 菜单名称
- **icon** (string) - Optional - 菜单图标
- **path** (string) - Optional - 菜单路径
- **component** (string) - Optional - 组件路径
- **perms** (string) - Optional - 权限标识
- **orderNum** (number) - Optional - 排序号
- **status** (string) - Optional - 菜单状态
- **visible** (string) - Optional - 是否显示
```

--------------------------------

### 项目构建命令

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/00-目录和总览.md

用于预发布和生产环境的构建操作。

```bash
# 预发布环境构建
yarn build:stage

# 生产环境构建
yarn build:prod
```

--------------------------------

### 获取服务器监控信息

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/06-api-监控和工具接口.md

通过getServer函数获取服务器的CPU、内存、操作系统及JVM运行状态信息。

```javascript
export function getServer()
```

```javascript
{
  cpu: {
    usage: number       // CPU使用率百分比
  },
  mem: {
    usage: number,      // 内存使用率百分比
    total: number,      // 总内存（字节）
    used: number,       // 已用内存（字节）
    free: number        // 空闲内存（字节）
  },
  sys: {
    computerName: string,
    computerIp: string,
    osName: string,
    osArch: string
  },
  jvm: {
    total: number,
    max: number,
    free: number,
    used: number
  }
}
```

```http
GET /monitor/server
Authorization: Bearer {token}
```

```javascript
import { getServer } from '@/api/monitor/server'

try {
  const result = await getServer()
  console.log('CPU使用率:', result.cpu.usage + '%')
  console.log('内存使用率:', result.mem.usage + '%')
  console.log('操作系统:', result.sys.osName)
} catch (err) {
  console.error('获取服务器信息失败:', err)
}
```

--------------------------------

### 配置环境变量文件

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/10-全局配置和环境.md

通过.env系列文件管理不同环境下的API基础地址和应用名称。

```env
# 应用名称
VITE_APP_TITLE = 若依管理系统

# API基础地址
VITE_APP_BASE_API = /api
```

```env
# API服务器地址（开发环境）
VITE_APP_BASE_API = http://localhost:8080/api
```

```env
# API服务器地址（生产环境）
VITE_APP_BASE_API = https://api.example.com/api
```

```env
# API服务器地址（预发布环境）
VITE_APP_BASE_API = https://staging-api.example.com/api
```

--------------------------------

### 项目初始化与启动

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/00-目录和总览.md

执行克隆、依赖安装及开发服务器启动的完整流程。

```bash
# 克隆项目
git clone https://github.com/yangzongzhuan/ruoyi-vue3.git
cd ruoyi-vue3

# 安装依赖
yarn --registry=https://registry.npmmirror.com

# 启动开发服务器
yarn dev

# 浏览器访问 http://localhost:80
```

--------------------------------

### 使用 $download 插件下载文件

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/07-plugins-插件系统.md

展示了如何调用 $download 插件的不同方法来处理文件下载需求。

```javascript
this.$download.name('user-report-2024.xlsx')
```

```javascript
this.$download.resource('/upload/file/image.png')
```

```javascript
// 下载代码生成的zip文件
this.$download.zip('/tool/gen/genCode/sys_user', 'code-gen.zip')
```

```javascript
const content = 'Hello World'
this.$download.saveAs(content, 'hello.txt')
```

--------------------------------

### this.$download.resource(resource)

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/07-plugins-插件系统.md

下载指定的资源文件。

```APIDOC
## this.$download.resource(resource)

### Description
下载资源文件。

### Parameters
- **resource** (string) - Required - 资源路径

### Usage Example
```javascript
this.$download.resource('/upload/file/image.png')
```
```

--------------------------------

### 构建与启动命令

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/10-全局配置和环境.md

不同环境下的启动和构建命令示例。

```bash
npm run dev

# 使用.env.development中的配置
# API将指向 http://localhost:8080/api
```

```bash
npm run build:stage

# 使用.env.staging中的配置
# API将指向 https://staging-api.example.com/api
```

```bash
npm run build:prod

# 使用.env.production中的配置
# API将指向 https://api.example.com/api
```

--------------------------------

### GET /system/role/deptTree/{roleId}

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

获取角色的部门树结构（用于数据权限配置）。

```APIDOC
## GET /system/role/deptTree/{roleId}

### Description
获取角色的部门树结构（用于数据权限配置）。

### Method
GET

### Endpoint
/system/role/deptTree/{roleId}

### Parameters
#### Path Parameters
- **roleId** (number) - Required - 角色ID

### Response
#### Success Response (200)
- **depts** (array) - 部门树结构
```

--------------------------------

### 定义Settings Store状态结构

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/10-全局配置和环境.md

描述了src/store/modules/settings.js中Pinia Store的State结构。

```javascript
{
  theme: string,           // 主题名称
  sideTheme: string,       // 侧边栏主题
  showLogo: boolean,       // 是否显示logo
  fixedHeader: boolean,    // 是否固定头部
  showFooter: boolean,     // 是否显示页脚
  tagsView: boolean,       // 是否显示标签页
  cacheTagsView: boolean,  // 是否缓存标签页
  dynamicTitle: boolean,   // 是否使用动态标题
  topNav: boolean,         // 是否显示顶部导航
  rightPanel: boolean      // 是否显示右侧面板
}
```

--------------------------------

### this.$download.zip(url, name)

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/07-plugins-插件系统.md

通过接口下载 ZIP 压缩文件并指定保存名称。

```APIDOC
## this.$download.zip(url, name)

### Description
下载zip文件。

### Parameters
- **url** (string) - Required - 接口URL（相对路径）
- **name** (string) - Required - 保存的文件名

### Usage Example
```javascript
this.$download.zip('/tool/gen/genCode/sys_user', 'code-gen.zip')
```
```

--------------------------------

### this.$download.name(fileName, isDelete)

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/07-plugins-插件系统.md

根据文件名下载服务器文件，并可选择下载后是否删除服务器端文件。

```APIDOC
## this.$download.name(fileName, isDelete)

### Description
按文件名下载文件。

### Parameters
- **fileName** (string) - Required - 文件名
- **isDelete** (boolean) - Optional - 下载后是否删除服务器文件，默认值为 true

### Usage Example
```javascript
this.$download.name('user-report-2024.xlsx')
```
```

--------------------------------

### GET /tool/gen/genCode/{tableName}

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/06-api-监控和工具接口.md

生成代码文件。

```APIDOC
## GET /tool/gen/genCode/{tableName}

### Description
生成代码文件。

### Method
GET

### Endpoint
/tool/gen/genCode/{tableName}

### Parameters
#### Path Parameters
- **tableName** (string) - Required

### Response
#### Success Response (200)
- **file** (binary) - 文件流（zip格式）
```

--------------------------------

### Define a Pinia Store

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/12-响应式数据和composition-api.md

Create a store using defineStore with state, getters, and actions. Actions support both synchronous and asynchronous operations.

```javascript
import { defineStore } from 'pinia'

const useMyStore = defineStore('my', {
  state: () => ({
    count: 0,
    items: []
  }),
  
  getters: {
    // getter可以访问state和其他getter
    doubleCount: (state) => state.count * 2,
    
    // 需要参数时使用函数
    getItemById: (state) => (id) => {
      return state.items.find(item => item.id === id)
    }
  },
  
  actions: {
    // action可以异步
    increment() {
      this.count++
    },
    
    async fetchItems() {
      const result = await listItem()
      this.items = result.data
    }
  }
})

export default useMyStore
```

--------------------------------

### GET /tool/gen/{tableId}

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/06-api-监控和工具接口.md

获取表的代码生成配置。

```APIDOC
## GET /tool/gen/{tableId}

### Description
获取表的代码生成配置。

### Method
GET

### Endpoint
/tool/gen/{tableId}

### Parameters
#### Path Parameters
- **tableId** (number) - Required

### Response
#### Success Response (200)
- **table** (object) - 表配置信息
- **tables** (array) - 关联表列表
- **dictTypes** (array) - 字典类型列表
```

--------------------------------

### 获取用户信息

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/04-store-用户和权限状态管理.md

调用userStore的getInfo方法获取并设置用户角色和权限。

```javascript
await userStore.getInfo()
// 设置roles和permissions
```

--------------------------------

### GET /monitor/cache/{cacheName}

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/06-api-监控和工具接口.md

获取指定缓存的详细信息。

```APIDOC
## GET /monitor/cache/{cacheName}

### Description
获取指定缓存的详细信息。

### Method
GET

### Endpoint
/monitor/cache/{cacheName}

### Parameters
#### Path Parameters
- **cacheName** (string) - Required - 缓存名称
```

--------------------------------

### this.$modal.loading(content)

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/07-plugins-插件系统.md

显示加载遮罩层。

```APIDOC
## loading(content)

### Description
显示加载遮罩层。

### Parameters
- **content** (string) - Required - 加载提示文本
```

--------------------------------

### POST /system/post

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

创建岗位。

```APIDOC
## POST /system/post

### Description
创建岗位。

### Method
POST

### Endpoint
/system/post

### Parameters
#### Request Body
- **postCode** (string) - Required - 岗位代码
- **postName** (string) - Required - 岗位名称
- **postSort** (number) - Required - 排序
- **status** (string) - Required - 状态
- **remark** (string) - Optional - 备注
```

--------------------------------

### LogOut Usage Example

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/04-store-用户和权限状态管理.md

演示如何调用 logOut 方法并处理登出后的重定向逻辑。

```javascript
import useUserStore from '@/store/modules/user'

const userStore = useUserStore()

try {
  await userStore.logOut()
  console.log('登出成功')
  // 重定向到登录页
  router.push('/login')
} catch (err) {
  // 即使请求失败也应该清除本地数据
  console.error('登出失败:', err)
  // 清除本地数据并跳转
  router.push('/login')
}
```

--------------------------------

### PUT /system/role/authUser/selectAll

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

批量授权用户。

```APIDOC
## PUT /system/role/authUser/selectAll

### Description
批量授权用户。

### Method
PUT

### Endpoint
/system/role/authUser/selectAll

### Parameters
#### Request Body
- **roleId** (number) - Required - 角色ID
- **userIds** (string) - Required - 用户ID，逗号分隔
```

--------------------------------

### this.$download.saveAs(text, name, opts)

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/07-plugins-插件系统.md

将文本内容或 Blob 对象直接保存为文件。

```APIDOC
## this.$download.saveAs(text, name, opts)

### Description
直接保存内容为文件。

### Parameters
- **text** (Blob | string) - Required - 要保存的内容
- **name** (string) - Required - 保存的文件名
- **opts** (object) - Optional - 保存选项

### Usage Example
```javascript
const content = 'Hello World'
this.$download.saveAs(content, 'hello.txt')
```
```

--------------------------------

### POST /system/user

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/03-api-用户管理接口.md

创建一个新用户。

```APIDOC
## POST /system/user

### Description
创建一个新用户。

### Method
POST

### Endpoint
/system/user

### Parameters
#### Request Body
- **deptId** (number) - Required - 部门ID
- **userName** (string) - Required - 用户名
- **nickName** (string) - Required - 昵称
- **password** (string) - Required - 密码
- **userType** (string) - Optional - 用户类型
- **sex** (string) - Optional - 性别：0-男 1-女 2-未知
- **phonenumber** (string) - Optional - 手机号
- **email** (string) - Optional - 邮箱
- **status** (string) - Optional - 状态：0-正常 1-停用
- **remark** (string) - Optional - 备注
- **roleIds** (array) - Optional - 角色ID列表

### Response
#### Success Response (200)
- **code** (number) - 状态码
- **msg** (string) - 响应消息
```

--------------------------------

### 用户登录操作

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/04-store-用户和权限状态管理.md

调用userStore的login方法进行身份验证，并将Token保存至Cookies和State。

```javascript
await userStore.login({ username, password, code, uuid })
// Token保存到Cookies和State
```

--------------------------------

### POST /tool/gen/createTable

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/06-api-监控和工具接口.md

创建新表。

```APIDOC
## POST /tool/gen/createTable

### Description
创建新表。

### Method
POST

### Endpoint
/tool/gen/createTable

### Request Body
- **tableName** (string) - Required
- **tableComment** (string) - Optional
- **columns** (array) - Required
```

--------------------------------

### 生成权限路由

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/04-store-用户和权限状态管理.md

调用permissionStore的generateRoutes方法获取权限路由并添加到Router。

```javascript
const routes = await permissionStore.generateRoutes()
// 获取权限路由，添加到Router
```

--------------------------------

### POST /system/role

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

创建新角色。

```APIDOC
## POST /system/role

### Description
创建新角色。

### Method
POST

### Endpoint
/system/role

### Parameters
#### Request Body
- **roleName** (string) - Required - 角色名称
- **roleKey** (string) - Required - 角色标识
- **roleSort** (number) - Required - 角色排序
- **dataScope** (string) - Optional - 数据范围
- **status** (string) - Optional - 状态：0-正常 1-停用
- **remark** (string) - Optional - 备注
- **menuIds** (array) - Optional - 菜单ID列表
```

--------------------------------

### PUT /system/post

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

更新岗位。

```APIDOC
## PUT /system/post

### Description
更新岗位。

### Method
PUT

### Endpoint
/system/post
```

--------------------------------

### 获取参数键值使用示例

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

演示如何导入并调用 getConfigKey 函数获取系统配置值。

```javascript
import { getConfigKey } from '@/api/system/config'

// 获取默认初始密码
const result = await getConfigKey('sys_user_initPassword')
console.log('默认密码:', result.configValue)  // 输出：'123456'
```

--------------------------------

### 打开新页签

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/07-plugins-插件系统.md

使用 openPage 打开一个新的标签页。

```javascript
openPage(title: string, url: string, params?: object): Promise
```

```javascript
this.$tab.openPage('用户详情', '/system/user/detail', { id: 100 })
```

--------------------------------

### DELETE /system/config/{configId}

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

删除参数配置。

```APIDOC
## DELETE /system/config/{configId}

### Description
删除参数配置。

### Method
DELETE

### Endpoint
/system/config/{configId}

### Parameters
#### Path Parameters
- **configId** (string) - Required
```

--------------------------------

### 创建新表参数

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/06-api-监控和工具接口.md

createTable 接口用于创建新表时的参数结构。

```javascript
{
  tableName: string,
  tableComment: string,
  columns: [...]
}
```

--------------------------------

### 定义全局设置对象

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/10-全局配置和环境.md

在src/settings.js中定义应用的主题、布局和功能开关等全局配置。

```javascript
const settings = {
  /**
   * 主题名称
   * 选项: 'theme-dark', 'theme-light'
   */
  theme: 'theme-light',

  /**
   * 侧边栏主题
   * 选项: 'theme-dark', 'theme-light'
   */
  sideTheme: 'theme-dark',

  /**
   * 是否显示logo
   */
  showLogo: true,

  /**
   * 是否固定头部
   */
  fixedHeader: false,

  /**
   * 是否显示页脚
   */
  showFooter: false,

  /**
   * 是否显示TagsView（页签栏）
   */
  tagsView: true,

  /**
   * 是否缓存标签
   */
  cacheTagsView: false,

  /**
   * 是否使用动态标题
   */
  dynamicTitle: false,

  /**
   * 是否显示顶部导航栏
   */
  topNav: false,

  /**
   * 是否显示右侧边栏（设置面板）
   */
  rightPanel: true
}

export default settings
```

--------------------------------

### 下载文件函数签名

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/07-plugins-插件系统.md

定义了 $download 插件中各方法的参数类型和签名。

```javascript
name(fileName: string, isDelete?: boolean): void
```

```javascript
resource(resource: string): void
```

```javascript
zip(url: string, name: string): void
```

```javascript
saveAs(text: Blob | string, name: string, opts?: object): void
```

--------------------------------

### PUT /system/user

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/03-api-用户管理接口.md

更新用户信息。

```APIDOC
## PUT /system/user

### Description
更新用户信息。

### Method
PUT

### Endpoint
/system/user

### Request Body
- **userId** (number) - Required - 用户ID
- **userName** (string) - Required - 用户名
- **nickName** (string) - Required - 昵称
- **deptId** (number) - Optional - 部门ID
- **userType** (string) - Optional - 用户类型
- **sex** (string) - Optional - 性别
- **avatar** (string) - Optional - 头像URL
- **phonenumber** (string) - Optional - 手机号
- **email** (string) - Optional - 邮箱
- **status** (string) - Optional - 状态
- **remark** (string) - Optional - 备注
- **roleIds** ([number]) - Optional - 角色ID列表

### Response
#### Success Response (200)
- **code** (number) - 状态码
- **msg** (string) - 提示信息
```

--------------------------------

### isPathMatch(pattern, path)

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/08-utils-工具函数.md

路径模式匹配函数，支持通配符 *、** 和 ?。

```APIDOC
## isPathMatch(pattern, path)

### Description
路径模式匹配（支持通配符）。

### Parameters
- **pattern** (string) - 路径模式
- **path** (string) - 要匹配的路径

### Returns
- **boolean** - 匹配结果
```

--------------------------------

### 设置会话缓存

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/07-plugins-插件系统.md

使用 session.set 存储字符串类型的会话缓存。

```javascript
session.set(key: string, value: string): void
```

```javascript
this.$cache.session.set('userToken', 'xxx-token-xxx')
```

--------------------------------

### UserStore State Structure

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/04-store-用户和权限状态管理.md

定义了用户状态的初始结构，包括令牌、用户信息、角色及权限列表。

```javascript
{
  token: string,        // JWT令牌，从Cookies中读取
  id: number,           // 用户ID
  name: string,         // 用户名
  nickName: string,     // 用户昵称
  avatar: string,       // 用户头像URL
  roles: [string],      // 用户角色列表（如 ['admin', 'editor']）
  permissions: [string] // 用户权限列表（如 ['system:user:list', 'system:user:add']）
}
```

--------------------------------

### useDict(...args)

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/08-utils-工具函数.md

获取字典数据的 Vue 3 Composition API hook。

```APIDOC
## useDict(...args)

### 说明
获取字典数据的 Vue 3 Composition API hook。自动从后端加载字典数据，优先从缓存读取，并缓存到 useDictStore。

### 函数签名
`export function useDict(...args)`

### 参数
- **...args** (string[]) - 必填 - 字典类型列表，如 'sys_user_sex', 'sys_user_status'

### 返回值
- **Ref** - 返回包含字典数据的响应式对象，结构为 { [dictType]: Array<{label, value, elTagType, elTagClass}> }
```

--------------------------------

### 创建菜单参数结构

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

定义 addMenu 方法的请求体参数。

```javascript
{
  parentId: number,      // 父菜单ID
  menuName: string,      // 菜单名称
  icon: string,          // 菜单图标
  path: string,          // 菜单路径
  component: string,     // 组件路径
  perms: string,         // 权限标识（如 'system:user:list'）
  orderNum: number,      // 排序号
  status: string,        // 菜单状态
  visible: string        // 是否显示
}
```

--------------------------------

### this.$modal.closeLoading()

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/07-plugins-插件系统.md

关闭加载遮罩层。

```APIDOC
## closeLoading()

### Description
关闭当前显示的加载遮罩层。
```

--------------------------------

### PUT /system/user/profile

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/03-api-用户管理接口.md

更新当前登录用户的个人信息，如昵称、性别、头像、手机号和邮箱。

```APIDOC
## PUT /system/user/profile

### Description
更新当前登录用户的个人信息。

### Method
PUT

### Endpoint
/system/user/profile

### Request Body
- **nickName** (string) - Optional - 昵称
- **sex** (string) - Optional - 性别
- **avatar** (string) - Optional - 头像URL
- **phonenumber** (string) - Optional - 手机号
- **email** (string) - Optional - 邮箱

### Response
#### Success Response (200)
- **code** (number) - 状态码
- **msg** (string) - 提示信息
```

--------------------------------

### PUT /system/role

Source: https://github.com/yangzongzhuan/ruoyi-vue3/blob/master/_autodocs/05-api-系统管理接口.md

更新角色信息。

```APIDOC
## PUT /system/role

### Description
更新角色信息。

### Method
PUT

### Endpoint
/system/role

### Parameters
#### Request Body
- **roleId** (number) - Required - 角色ID
- **roleName** (string) - Optional - 角色名称
- **roleKey** (string) - Optional - 角色标识
- **roleSort** (number) - Optional - 排序值
- **status** (string) - Optional - 状态
- **remark** (string) - Optional - 备注
- **menuIds** (array) - Optional - 菜单ID列表
```
Tokens:
Raw