### Get User List API Call Example
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/07-其他API模块.md
Demonstrates how to fetch a list of users with pagination and filtering. Requires importing the getList function.
```javascript
import { getList } from '@/api/system/user'
const result = await getList(1, 20, { realName: '小卓' })
const { total, data } = result.data.data
console.log(`总数: ${total}, 数据: `, data)
```
--------------------------------
### Install Vue DevTools
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/09-配置参考汇总.md
Instructions for installing the Vue.js devtools Chrome extension.
```bash
# 安装 Chrome 扩展
https://chrome.google.com/webstore/
搜索 "Vue.js devtools"
```
--------------------------------
### Get Menu Tree API Call Example
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/07-其他API模块.md
Shows how to retrieve the menu tree structure. Requires importing the 'getList' function from the menu API.
```javascript
import { getList } from '@/api/system/menu'
const result = await getList(1, 100)
const menuTree = result.data.data.data
console.log('菜单树:', menuTree)
```
--------------------------------
### Get Permission Buttons API Call Example
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/07-其他API模块.md
Demonstrates fetching permission buttons for the current user. Requires importing the 'getButtons' function.
```javascript
import { getButtons } from '@/api/user'
const result = await getButtons()
const permissionTree = result.data.data
console.log('权限树:', permissionTree)
```
--------------------------------
### Static Route Configuration Example
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/09-配置参考汇总.md
Example of defining static routes in a Vue application, including paths, components, and meta information for authentication and tab display.
```javascript
const pageRouter = [
{
path: '/login',
name: 'login',
component: () => import('@/page/login/index.vue'),
meta: { isAuth: false, isTab: false }
},
{
path: '/lock',
name: 'lock',
component: () => import('@/page/lock/index.vue'),
meta: { isTab: false }
},
{
path: '/404',
name: 'notfound',
component: () => import('@/components/error-page/404.vue')
}
]
export default pageRouter
```
--------------------------------
### Update User API Call Example
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/07-其他API模块.md
Provides an example of updating an existing user's information. Requires importing the 'update' function.
```javascript
import { update } from '@/api/system/user'
const user = {
id: 1,
realName: '更新后的名称',
email: 'newemail@163.com'
}
await update(user)
console.log('更新成功')
```
--------------------------------
### Send Logs API Call Example
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/07-其他API模块.md
Provides an example of sending error logs to the server. Requires importing the 'sendLogs' function and formatting logs correctly.
```javascript
import { sendLogs } from '@/api/logs'
const logs = [
{
type: 'error',
message: 'Cannot read property "foo" of undefined',
stack: 'at Object.xxx ...',
info: 'in mounted hook',
timestamp: Date.now()
}
]
await sendLogs(logs)
console.log('日志上报成功')
```
--------------------------------
### Run Development Server
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/核心架构.md
Starts the development server for local development and debugging. The --host flag allows external access.
```bash
pnpm run dev
```
--------------------------------
### Run Production Server
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/核心架构.md
Starts the development server using production environment variables. Useful for testing production builds locally.
```bash
pnpm run prod
```
--------------------------------
### getScreen()
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/04-工具函数库.md
Gets the screen state, used for responsiveness.
```APIDOC
## getScreen()
### Description
Gets the screen state, used for responsiveness.
### Parameters
#### Path Parameters
None
#### Query Parameters
None
#### Request Body
- **folded** (boolean, optional) - If true, returns the sidebar collapsed state.
### Request Example
```javascript
import { getScreen } from '@/utils/util'
getScreen() // boolean (based on viewport width)
getScreen(true) // sidebar collapsed state
```
### Response
- **boolean**: The screen state.
```
--------------------------------
### Example of Backend Menu Data Structure
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/06-HTTP拦截器与配置.md
Illustrates a typical backend menu data structure that aligns with the configured menu properties.
```javascript
{
name: '用户管理', // 读取 label 字段
path: '/system/user', // 读取 path 字段
source: 'icon-user', // 读取 icon 字段
children: [...], // 读取 children 字段
meta: {...} // 读取 meta 字段
}
```
--------------------------------
### Add User API Call Example
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/07-其他API模块.md
Shows how to add a new user, including password encryption using the 'encrypt' utility. Requires importing 'add' and 'encrypt'.
```javascript
import { add } from '@/api/system/user'
import { encrypt } from '@/utils/sm2'
const user = {
username: 'newuser',
realName: '新用户',
password: encrypt('password123'),
email: 'user@163.com',
phone: '18888888888',
deptId: 1,
status: 1
}
const result = await add(user)
console.log('新用户 ID:', result.data.data.id)
```
--------------------------------
### Input and Output for SET_PERMISSION Mutation
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/03-状态管理.md
Provides example input (permission tree) and output (permission object) for the `SET_PERMISSION` mutation, illustrating how permissions are structured and transformed.
```javascript
[
{
code: 'dict',
children: [
{ code: 'dict_add' },
{ code: 'dict_delete' }
]
}
]
```
```javascript
{
dict_add: true,
dict_delete: true
}
```
--------------------------------
### Run Development Server and Build Commands
Source: https://github.com/chillzhuang/saber/blob/master/CLAUDE.md
Use these pnpm commands to start the development server, build the project for production, or preview the build artifacts. The development server runs on port 2888 with host enabled by default.
```bash
pnpm run dev # 启动开发服务器(端口 2888,带 --host)
```
```bash
pnpm run prod # 启动开发服务器(加载 production 模式环境变量)
```
```bash
pnpm run build # 构建(默认模式)
```
```bash
pnpm run build:prod # 构建(production 模式,产出 dist/)
```
```bash
pnpm run serve # 预览构建产物
```
--------------------------------
### Example of Request with Error Handling
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/06-HTTP拦截器与配置.md
Demonstrates how to use a request function and catch potential errors, specifically when the status code is not 200.
```javascript
request('/api/user')
.then(res => {
// 状态码为 200 时执行
console.log(res.data.data)
})
.catch(err => {
// 状态码非 200 时执行
console.log('请求失败:', err.message)
})
```
--------------------------------
### Avue Select Field Configuration (Dynamic)
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/08-CRUD框架与Avue集成.md
Example of configuring a select dropdown that loads data dynamically from a URL. Includes properties for the dictionary URL and mapping for label and value.
```javascript
{
label: '部门',
prop: 'deptId',
type: 'select',
dicUrl: '/blade-system/dept/list',
props: { label: 'name', value: 'id' }
}
```
--------------------------------
### Example Top Menu Response (JavaScript)
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/02-系统管理API.md
Shows the expected response format for the getTopMenu API call, containing a list of top-level menu objects, each with an ID and name.
```javascript
{
code: 200,
data: {
data: [
{ id: 1, name: '工作台', path: '/wel/index' },
{ id: 2, name: '系统管理', path: '/system' }
]
}
}
```
--------------------------------
### Delete User API Call Example
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/07-其他API模块.md
Demonstrates how to delete users, supporting both single and multiple deletions by ID. Requires importing the 'remove' function.
```javascript
import { remove } from '@/api/system/user'
// 删除单个
await remove('1')
// 删除多个
await remove('1,2,3')
console.log('删除成功')
```
--------------------------------
### Example Menu Data Structure (JavaScript)
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/02-系统管理API.md
Illustrates the structure of a single menu item object as returned by the API, including its ID, name, path, component, icon, sort order, status, parent ID, and meta information.
```javascript
{
code: 200,
data: {
data: {
total: 50,
data: [
{
id: 1,
name: '系统管理',
path: '/system',
component: 'views/system/user',
icon: 'icon-xitong',
sort: 1,
status: 1,
parentId: 0,
meta: {
i18n: 'menu.system'
}
}
]
}
}
}
```
--------------------------------
### Avue Select Field Configuration (Static)
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/08-CRUD框架与Avue集成.md
Example of configuring a select dropdown with static dictionary data. Specifies the label, property, type, and the data for the dropdown options.
```javascript
{
label: '状态',
prop: 'status',
type: 'select',
dicData: [
{ label: '启用', value: 1 },
{ label: '禁用', value: 0 }
]
}
```
--------------------------------
### Avue Date Field Configuration
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/08-CRUD框架与Avue集成.md
Example of configuring a date picker field. Specifies the label, property, type, and formatting for the date input.
```javascript
{
label: '创建日期',
prop: 'createTime',
type: 'date',
format: 'yyyy-MM-dd',
valueFormat: 'yyyy-MM-dd'
}
```
--------------------------------
### Get Tenant List
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/07-其他API模块.md
Retrieves a paginated list of tenants with optional filtering parameters. Returns total count and tenant data.
```javascript
export const getList = (current, size, params)
```
```json
{
data: {
total: 10,
data: [
{
id: 1,
tenantId: '000000',
name: '管理员租户',
status: 1,
// 其他字段...
}
]
}
}
```
--------------------------------
### Get and Format Menu
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/03-状态管理.md
Retrieves the menu structure from the API, processes it (e.g., handling components, iframes), and updates the application's menu state. Also dispatches an action to fetch permission buttons.
```javascript
dispatch('GetMenu', topMenuId)
.then(menu => {
console.log('菜单树:', menu)
})
```
--------------------------------
### Avue Input Field Configuration
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/08-CRUD框架与Avue集成.md
Example of configuring a text input field for a form. Includes properties for label, property name, type, placeholder, validation rules, and clearable option.
```javascript
{
label: '用户名',
prop: 'username',
type: 'input',
placeholder: '请输入用户名',
rules: [{ required: true, message: '用户名必填' }],
clearable: true
}
```
--------------------------------
### Avue Number Field Configuration
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/08-CRUD框架与Avue集成.md
Example of configuring a number input field. Specifies the label, property, type, and constraints such as minimum, maximum, and step increment.
```javascript
{
label: '排序',
prop: 'sort',
type: 'number',
min: 0,
max: 9999,
step: 1
}
```
--------------------------------
### 安装动态路由插件
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/05-路由与权限系统.md
通过 `AvueRouter.install()` 方法安装路由插件,需要传入 Vuex Store、Vue Router 和 i18n 实例。安装后即可使用 `$avueRouter` 提供的路由管理功能。
```javascript
AvueRouter.install({
store: Store, // Vuex Store 实例
router: Router, // Vue Router 实例
i18n: i18n // i18n 实例
})
```
--------------------------------
### Backend Menu Data Example
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/05-路由与权限系统.md
This JSON represents the structure of menu data received from the backend, which is used to dynamically generate routes. It includes nested children and external link definitions.
```json
[
{
"id": 1,
"name": "系统管理",
"path": "/system",
"component": "views/system/index",
"source": "icon-system",
"meta": {
"i18n": "menu.system",
"target": false,
"isTab": true
},
"children": [
{
"id": 2,
"name": "用户管理",
"path": "/system/user",
"component": "views/system/user",
"source": "icon-user",
"meta": { "i18n": "menu.user" },
"children": []
},
{
"id": 3,
"name": "外链示例",
"path": "/system/external",
"href": "https://example.com?token=${token}",
"meta": { "target": false }
}
]
}
]
```
--------------------------------
### Avue Textarea Field Configuration
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/08-CRUD框架与Avue集成.md
Example of configuring a textarea field for multi-line text input. Includes properties for label, property, type, number of rows, and placeholder text.
```javascript
{
label: '描述',
prop: 'description',
type: 'textarea',
rows: 5,
placeholder: '请输入描述'
}
```
--------------------------------
### Serve Build Artifacts
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/核心架构.md
Serves the built production artifacts, allowing you to preview the deployed version of the application.
```bash
pnpm run serve
```
--------------------------------
### Get User Info API
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/01-认证与授权API.md
Fetches detailed information about the currently logged-in user. This function makes a GET request to the /user/getUserInfo endpoint. It requires authentication.
```javascript
export const getUserInfo = () => request({
url: '/user/getUserInfo',
method: 'get'
})
```
```javascript
import { getUserInfo } from '@/api/user'
import store from '@/store'
// Vuex action 中
GetUserInfo ({ commit }) {
return getUserInfo().then((res) => {
const data = res.data.data
commit('SET_ROLES', data.roles)
return data
})
}
// 在页面中
this.$store.dispatch('GetUserInfo').then(userInfo => {
console.log('当前用户:', userInfo.realName)
})
```
--------------------------------
### Get Captcha API
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/01-认证与授权API.md
Retrieves a login verification code (CAPTCHA). This function makes a GET request to the /blade-auth/captcha endpoint and returns a UUID for the CAPTCHA and its image data in base64 format. No token is required.
```javascript
export const getCaptcha = () => request({
url: '/blade-auth/captcha',
method: 'get'
})
```
```javascript
import { getCaptcha } from '@/api/user'
const result = await getCaptcha()
const { uuid, img } = result.data.data
// 显示验证码图片
document.getElementById('captchaImg').src = `data:image/jpeg;base64,${img}`
// 保存 uuid 供登录时使用
const captchaKey = uuid
```
--------------------------------
### Build Production Version (Production Mode)
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/核心架构.md
Builds the application for production deployment specifically in production mode, outputting to the dist/ directory.
```bash
pnpm run build:prod
```
--------------------------------
### Avue Upload Field Configuration
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/08-CRUD框架与Avue集成.md
Example of configuring a file upload field, specifically for images using the 'picture-card' list type. Includes the upload action URL and list type.
```javascript
{
label: '头像',
prop: 'avatar',
type: 'upload',
action: '/upload',
listType: 'picture-card'
}
```
--------------------------------
### Avue CRUD Page Example
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/08-CRUD框架与Avue集成.md
A complete Vue component demonstrating the integration of Avue's CRUD component with a backend API. It includes table column definitions, dialog configurations, and various lifecycle hooks.
```vue
```
--------------------------------
### getObjType()
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/04-工具函数库.md
Gets the type of an object.
```APIDOC
## getObjType()
### Description
Gets the type of an object.
### Parameters
#### Path Parameters
None
#### Query Parameters
None
#### Request Body
- **obj** (any) - The object to get the type of.
### Request Example
```javascript
import { getObjType } from '@/utils/util'
getObjType([]) // 'array'
getObjType({}) // 'object'
getObjType('string') // 'string'
getObjType(123) // 'number'
getObjType(true) // 'boolean'
getObjType(new Date()) // 'date'
```
### Response
- **string**: The type of the object.
```
--------------------------------
### getQueryString()
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/04-工具函数库.md
Gets a URL query parameter.
```APIDOC
## getQueryString()
### Description
Gets a URL query parameter.
### Parameters
#### Path Parameters
None
#### Query Parameters
None
#### Request Body
- **key** (string) - The key of the query parameter to retrieve.
### Request Example
```javascript
import { getQueryString } from '@/utils/util'
getQueryString('id') // '123' (from ?id=123)
```
### Response
- **string**: The value of the query parameter, or null if not found.
```
--------------------------------
### getTopUrl()
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/04-工具函数库.md
Gets the URL from the top address bar.
```APIDOC
## getTopUrl()
### Description
Gets the URL from the top address bar.
### Parameters
None
### Request Example
```javascript
import { getTopUrl } from '@/utils/util'
getTopUrl() // 'http://example.com'
```
### Response
- **string**: The URL from the top address bar.
```
--------------------------------
### listenfullscreen()
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/04-工具函数库.md
Listens for fullscreen state changes.
```APIDOC
## listenfullscreen()
### Description
Listens for fullscreen state changes.
### Parameters
#### Path Parameters
None
#### Query Parameters
None
#### Request Body
- **callback** (function) - The function to call when the fullscreen state changes.
### Request Example
```javascript
import { listenfullscreen } from '@/utils/util'
listenfullscreen(() => {
console.log('Fullscreen state changed')
})
```
### Response
None.
```
--------------------------------
### Converted Route Structure Example
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/05-路由与权限系统.md
This JavaScript object shows the structure of a route after being converted from backend menu data. It includes the path, component, and meta information, with specific handling for layout and iframe components.
```javascript
{
path: '/system',
component: LayoutComponent, // 布局容器
children: [
{
path: '',
name: '系统管理',
component: () => import('@/views/system/index.vue'),
meta: { i18n: 'menu.system' }
},
{
path: 'user',
name: '用户管理',
component: () => import('@/views/system/user.vue'),
meta: { i18n: 'menu.user' }
},
{
path: 'external',
name: '外链示例',
component: IframeComponent, // iframe 容器
query: { url: 'https://example.com?token=' }
}
]
}
```
--------------------------------
### Get Department List
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/02-系统管理API.md
Retrieves a list of departments in a tree structure.
```javascript
export const getList = ()
```
--------------------------------
### Get User Details
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/02-系统管理API.md
Retrieves the details of a single user by their ID.
```APIDOC
## GET /blade-system/user/detail
### Description
Retrieves the details of a single user by their ID.
### Method
GET
### Endpoint
/blade-system/user/detail
### Parameters
#### Query Parameters
- **id** (string / number) - Required - The ID of the user.
### Response
#### Success Response (200)
- **code** (number) - The response status code.
- **data** (object) - The response data.
- **success** (boolean) - Indicates if the operation was successful.
- **msg** (string) - A message describing the result.
- **data** (object) - The user object containing detailed information.
- **id** (number) - User ID.
- **username** (string) - Username.
- **realName** (string) - Real name.
- ... (other user fields)
```
--------------------------------
### Build Production Version
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/核心架构.md
Builds the application for production deployment. This command uses the default build mode.
```bash
pnpm run build
```
--------------------------------
### Configuration Reference Summary
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/README.md
A consolidated reference for global website configuration, Vite settings, Prettier, routing, and internationalization.
```APIDOC
## Configuration Reference Summary
### Description
Provides a comprehensive summary of all configuration options and references.
### Configuration Areas
- Global website configuration.
- Vite environment variables and build configuration.
- Prettier code formatting configuration.
- Routing configuration examples.
- Internationalization (i18n) setup.
- localStorage key mapping.
- Path alias mapping.
- Best practices and debugging tools.
```
--------------------------------
### Get Permission Buttons
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/07-其他API模块.md
Retrieves a tree structure of permission buttons.
```APIDOC
## Get Permission Buttons
### Description
Retrieves a tree structure of permission buttons.
### Method
GET (inferred from context of retrieving data)
### Endpoint
/api/user/buttons (inferred)
### Response
#### Success Response (200)
- **code** (number) - Status code (200 for success).
- **msg** (string) - Operation message.
- **success** (boolean) - Indicates if the operation was successful.
- **data** (object) - Contains the permission tree structure.
```
--------------------------------
### Get Menu Tree
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/07-其他API模块.md
Retrieves a hierarchical tree structure of menus.
```APIDOC
## Get Menu Tree
### Description
Retrieves a hierarchical tree structure of menus.
### Method
GET (inferred from context of list retrieval)
### Endpoint
/api/menus (inferred)
### Parameters
#### Query Parameters
- **current** (number) - Required - Current page number.
- **size** (number) - Required - Number of items per page.
### Response
#### Success Response (200)
- **code** (number) - Status code (200 for success).
- **msg** (string) - Operation message.
- **success** (boolean) - Indicates if the operation was successful.
- **data** (object) - Contains the list data.
- **total** (number) - Total number of items.
- **data** (array) - Array of menu objects, forming a tree structure.
```
--------------------------------
### Get Department Tree
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/07-其他API模块.md
Retrieves a hierarchical tree structure of departments.
```APIDOC
## Get Department Tree
### Description
Retrieves a hierarchical tree structure of departments.
### Method
GET (inferred from context of retrieving data)
### Endpoint
/api/departments/tree (inferred)
### Response
#### Success Response (200)
- **code** (number) - Status code (200 for success).
- **msg** (string) - Operation message.
- **success** (boolean) - Indicates if the operation was successful.
- **data** (object) - Contains the tree-shaped department structure.
```
--------------------------------
### reqFullScreen()
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/04-工具函数库.md
Requests to enter fullscreen mode.
```APIDOC
## reqFullScreen()
### Description
Requests to enter fullscreen mode.
### Parameters
None
### Request Example
```javascript
import { reqFullScreen } from '@/utils/util'
reqFullScreen()
```
### Response
None.
```
--------------------------------
### Get Menu Details
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/02-系统管理API.md
Retrieves the details of a single menu item by its ID.
```APIDOC
## GET /api/system/menu/detail
### Description
Retrieves the details of a single menu item.
### Method
GET
### Endpoint
/api/system/menu/detail
### Parameters
#### Query Parameters
- **id** (string) - Required - The ID of the menu to retrieve.
### Response
#### Success Response (200)
- **code** (number) - Response status code.
- **data** (object) - Menu details (structure similar to the 'data' in getList response).
### Response Example
```json
{
"code": 200,
"data": {
"id": 1,
"name": "系统管理",
"path": "/system",
"component": "views/system/user",
"icon": "icon-xitong",
"sort": 1,
"status": 1,
"parentId": 0,
"meta": {
"i18n": "menu.system"
}
}
}
```
```
--------------------------------
### Get User List
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/07-其他API模块.md
Retrieves a list of users with pagination and filtering capabilities.
```APIDOC
## Get User List
### Description
Retrieves a list of users with pagination and filtering capabilities.
### Method
GET (inferred from context of list retrieval)
### Endpoint
/api/users (inferred)
### Parameters
#### Query Parameters
- **current** (number) - Required - Current page number.
- **size** (number) - Required - Number of items per page.
- **params** (object) - Optional - Filtering parameters, e.g., { realName: '小卓' }.
### Response
#### Success Response (200)
- **code** (number) - Status code (200 for success).
- **msg** (string) - Operation message.
- **success** (boolean) - Indicates if the operation was successful.
- **data** (object) - Contains the list data.
- **total** (number) - Total number of items.
- **data** (array) - Array of user objects.
```
--------------------------------
### openWindow()
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/04-工具函数库.md
Opens a new window, centered on the screen.
```APIDOC
## openWindow()
### Description
Opens a new window, centered on the screen.
### Parameters
#### Path Parameters
None
#### Query Parameters
None
#### Request Body
- **url** (string) - The URL to open in the new window.
- **name** (string) - The name of the new window.
- **width** (number) - The width of the new window.
- **height** (number) - The height of the new window.
### Request Example
```javascript
import { openWindow } from '@/utils/util'
openWindow('https://example.com', 'example', 800, 600)
```
### Response
None.
```
--------------------------------
### Get Post List
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/07-其他API模块.md
Retrieves a list of posts with pagination and filtering capabilities.
```APIDOC
## Get Post List
### Description
Retrieves a list of posts with pagination and filtering capabilities.
### Method
GET (inferred from context of list retrieval)
### Endpoint
/api/posts (inferred)
### Parameters
#### Query Parameters
- **current** (number) - Required - Current page number.
- **size** (number) - Required - Number of items per page.
- **params** (object) - Optional - Filtering parameters.
### Response
#### Success Response (200)
- **code** (number) - Status code (200 for success).
- **msg** (string) - Operation message.
- **success** (boolean) - Indicates if the operation was successful.
- **data** (object) - Contains the list data.
- **total** (number) - Total number of items.
- **data** (array) - Array of post objects.
```
--------------------------------
### Get Role Permissions Tree
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/07-其他API模块.md
Retrieves the permission tree for a specific role.
```javascript
export const getPermission = (roleId)
```
--------------------------------
### Dynamic Route Loading Sequence
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/05-路由与权限系统.md
Illustrates the sequence of events from application startup to page rendering, including permission checks, user info retrieval, menu loading, and dynamic route mounting.
```text
Application startup
↓
main.js - Mount application
↓
permission.js beforeEach guard
↓
Check Token existence → No → Redirect to /login
↓ Yes
Check user info loaded → No → dispatch('GetUserInfo')
↓ Yes (skip)
Check menu loaded → No → dispatch('GetMenu') [Optional, usually called after login]
↓ Yes (skip)
formatPath Preprocess menu
↓
formatRoutes Recursively convert menu to routes
↓
router.addRoute Dynamically mount routes
↓
next() Allow navigation
↓
afterEach After hook
↓
Page rendering
```
--------------------------------
### isMobile()
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/04-工具函数库.md
Validates if a given string is a 11-digit mobile number starting with '1'.
```APIDOC
## isMobile()
### Description
Validates if a given string is a 11-digit mobile number starting with '1'.
### Usage
```javascript
import { isMobile } from '@/utils/validate'
isMobile('18888888888') // true
isMobile('123') // false
```
```
--------------------------------
### 使用动态路由插件格式化菜单为路由
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/05-路由与权限系统.md
调用 `$avueRouter.formatRoutes()` 方法,传入菜单树数组和是否为顶级菜单的布尔值,将后端菜单数据转换为 Vue Router 路由配置。该方法会自动处理菜单的层级关系和路由挂载。
```javascript
Router.$avueRouter.formatRoutes(menuData, true)
```
--------------------------------
### Get Refresh Token
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/04-工具函数库.md
Retrieves the refresh token from cookies. It is stored under the key 'saber3-refresh-token'.
```javascript
import { getRefreshToken } from '@/utils/auth'
const refreshToken = getRefreshToken() // string | undefined
```
--------------------------------
### User Info Object Structure
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/03-状态管理.md
Illustrates the expected structure of the `userInfo` object within the user module's state, detailing fields like ID, username, roles, and tenant information.
```javascript
{
id: 1,
username: 'admin',
realName: '小卓',
avatar: 'http://...',
email: 'admin@163.com',
phone: '18888888888',
authority: ['admin'],
roles: [{ id: 1, roleName: '管理员', roleCode: 'admin' }],
deptId: 1,
tenantId: '000000',
// 其他字段...
}
```
--------------------------------
### Routing and Permission System
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/README.md
Documentation on router configuration, dynamic routing, route guards, and permission control.
```APIDOC
## Routing and Permission System
### Description
Manages application routing, dynamic route generation from menus, and permission-based access control.
### Key Functions
- `formatRoutes(menu, first)`: Converts menu structure to routes.
- `formatPath(menu, first)`: Preprocesses menu items for routing.
- `router.beforeEach()`: Navigation guard for authentication and other checks.
- `router.afterEach()`: Hook for post-navigation tasks like setting page titles.
### Permission Coding Convention
Permissions are encoded as `{module}_{action}`, e.g., `dict_add`, `user_delete`.
```
--------------------------------
### Get Access Token
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/04-工具函数库.md
Retrieves the access token from cookies. It is stored under the key 'saber3-access-token'.
```javascript
import { getToken } from '@/utils/auth'
const token = getToken() // string | undefined
```
--------------------------------
### Get Single User Details
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/02-系统管理API.md
Retrieves the detailed information for a specific user by their ID.
```javascript
export const getUser = (id) => request({
url: '/blade-system/user/detail',
method: 'get',
params: { id }
})
```
```javascript
{
code: 200,
data: {
success: true,
msg: '获取成功',
data: {
id: 1,
username: 'admin',
realName: '小卓',
// 完整用户对象...
}
}
}
```
--------------------------------
### Get Top Menu List
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/02-系统管理API.md
Retrieves a list of top-level menus, often used for navigation.
```APIDOC
## GET /api/system/menu/top-menu
### Description
Retrieves a list of top-level menus.
### Method
GET
### Endpoint
/api/system/menu/top-menu
### Response
#### Success Response (200)
- **code** (number) - Response status code.
- **data** (object) - Response data.
- **data** (array) - Array of top menu objects.
- **id** (number) - Menu ID.
- **name** (string) - Menu name.
- **path** (string) - Menu path.
### Response Example
```json
{
"code": 200,
"data": {
"data": [
{ "id": 1, "name": "工作台", "path": "/wel/index" },
{ "id": 2, "name": "系统管理", "path": "/system" }
]
}
}
```
```
--------------------------------
### Get Dynamic Routes
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/02-系统管理API.md
Retrieves the dynamic routing tree, typically used for menu generation.
```APIDOC
## GET /api/system/menu/routes
### Description
Retrieves the dynamic routing tree (menu tree) for dynamic route conversion.
### Method
GET
### Endpoint
/api/system/menu/routes
### Parameters
#### Query Parameters
- **topMenuId** (string) - Optional - The ID of the top-level menu to filter routes.
### Response
#### Success Response (200)
- **code** (number) - Response status code.
- **data** (object) - The complete menu tree structure.
### Response Example
```json
{
"code": 200,
"data": {
// ... complete menu tree structure ...
}
}
```
```
--------------------------------
### Dynamic Page Title and Local Storage Prefix
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/06-HTTP拦截器与配置.md
Shows how the application title and localStorage keys are constructed using configuration values.
```javascript
// 页面标题格式
document.title = `${pageName} | ${website.indexTitle}`
// 结果:'用户管理 | Saber Admin'
// localStorage 键前缀
// 'saber-token', 'saber-menu', 等
```
--------------------------------
### Get Top Menu List
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/03-状态管理.md
Fetches the list of top-level menu items available in the application.
```javascript
dispatch('GetTopMenu')
.then(topMenuList => {
console.log('顶部菜单:', topMenuList)
})
```
--------------------------------
### Get Role Permissions List
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/07-其他API模块.md
Retrieves a list of role permissions. Accepts pagination parameters.
```javascript
export const getList = (current, size, params)
```
--------------------------------
### Add User
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/07-其他API模块.md
Adds a new user to the system.
```APIDOC
## Add User
### Description
Adds a new user to the system.
### Method
POST (inferred from context of adding data)
### Endpoint
/api/users (inferred)
### Parameters
#### Request Body
- **user** (object) - Required - The user object to add.
- **username** (string) - Required - The username.
- **realName** (string) - Required - The real name of the user.
- **password** (string) - Required - The user's password (encrypted).
- **email** (string) - Optional - The user's email address.
- **phone** (string) - Optional - The user's phone number.
- **deptId** (number) - Optional - The ID of the department the user belongs to.
- **status** (number) - Optional - The status of the user.
### Response
#### Success Response (200)
- **code** (number) - Status code (200 for success).
- **msg** (string) - Operation message.
- **success** (boolean) - Indicates if the operation was successful.
- **data** (object) - Contains the added user data, potentially with an ID.
```
--------------------------------
### Get Menu List
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/02-系统管理API.md
Retrieves a paginated list of menus. The parameters are the same as for the getList() method in User Management.
```APIDOC
## GET /api/system/menu/list
### Description
Retrieves a paginated list of menus.
### Method
GET
### Endpoint
/api/system/menu/list
### Parameters
#### Query Parameters
- **current** (number) - Required - Current page number.
- **size** (number) - Required - Number of items per page.
- **params** (object) - Optional - Additional filter parameters.
### Response
#### Success Response (200)
- **code** (number) - Response status code.
- **data** (object) - Response data.
- **total** (number) - Total number of menus.
- **data** (array) - Array of menu objects.
- **id** (number) - Menu ID.
- **name** (string) - Menu name.
- **path** (string) - Menu path.
- **component** (string) - Menu component path.
- **icon** (string) - Menu icon class.
- **sort** (number) - Menu sort order.
- **status** (number) - Menu status (e.g., 1 for enabled).
- **parentId** (number) - Parent menu ID.
- **meta** (object) - Menu metadata.
- **i18n** (string) - Internationalization key for menu name.
### Response Example
```json
{
"code": 200,
"data": {
"total": 50,
"data": [
{
"id": 1,
"name": "系统管理",
"path": "/system",
"component": "views/system/user",
"icon": "icon-xitong",
"sort": 1,
"status": 1,
"parentId": 0,
"meta": {
"i18n": "menu.system"
}
}
]
}
}
```
```
--------------------------------
### getAllStore()
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/04-工具函数库.md
Retrieves all items from storage (either localStorage or sessionStorage).
```APIDOC
## getAllStore()
### Description
Retrieves all items from storage.
### Method Signature
```javascript
getAllStore({
type?: 'session' // Optional: 'session' for sessionStorage, defaults to localStorage
})
```
### Parameters
#### Parameters
- **type** (string) - Optional - Specifies 'session' to retrieve from sessionStorage; otherwise, defaults to localStorage.
### Return Value
An array of objects, where each object contains the `name` (prefixed key) and `content` of a stored item.
### Example
```javascript
import { getAllStore } from '@/utils/store';
// Get all items from localStorage
const allLocalStores = getAllStore();
// Get all items from sessionStorage
const allSessionStores = getAllStore({ type: 'session' });
```
### Response Example
```json
[
{ "name": "saber-userInfo", "content": {...} },
{ "name": "saber-token", "content": "..." }
]
```
```
--------------------------------
### Get Top Menu List (JavaScript)
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/02-系统管理API.md
Retrieves a list of top-level menus, typically used for navigation.
```javascript
export const getTopMenu = () =>
request({
url: '/blade-system/menu/top-menu',
method: 'get'
})
```
--------------------------------
### Vuex 权限状态存储
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/05-路由与权限系统.md
权限数据存储在 Vuex 的 user 模块 state 中,采用 {module}_{action} 的编码格式。
```javascript
state: {
permission: {
dict_add: true,
dict_delete: true,
dict_edit: true,
user_add: true,
user_delete: true
// ...编码格式:{module}_{action}
}
}
```
--------------------------------
### Get Single Menu Detail (JavaScript)
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/02-系统管理API.md
Retrieves the details for a specific menu item using its ID.
```javascript
export const getMenu = (id) => request({
url: '/blade-system/menu/detail',
method: 'get',
params: { id }
})
```
--------------------------------
### Get Region List (Tree Structure)
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/07-其他API模块.md
Fetches a hierarchical list of regions, suitable for tree-based displays.
```javascript
export const getList = ()
```
```javascript
[
{
id: 1,
name: '中国',
children: [
{ id: 2, name: '广东', children: [...] },
{ id: 3, name: '浙江', children: [...] }
]
}
]
```
--------------------------------
### Login by Username
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/03-状态管理.md
Initiates a login process using username and password. Requires tenant ID, username, password (SM2 encrypted), type, captcha key, and code. Handles token and user info updates upon success.
```javascript
dispatch('LoginByUsername', {
tenantId: '000000',
username: 'admin',
password: 'encrypted-password', // SM2 加密
type: 'account',
key: 'captcha-key',
code: '123456'
})
```
--------------------------------
### Get Refresh Token Utility
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/01-认证与授权API.md
Retrieves the stored refresh token using the getRefreshToken utility function from '@/utils/auth'.
```javascript
import { getRefreshToken } from '@/utils/auth'
const refreshToken = getRefreshToken()
```
--------------------------------
### Configure AES and DES Keys
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/04-工具函数库.md
Set the AES and DES keys for the crypto utility. Ensure these keys match the backend configuration.
```javascript
import crypto from '@/utils/crypto'
// 需与后端配置保持一致
crypto.aesKey = 'your-aes-key-here'
crypto.desKey = 'your-des-key-here'
```
--------------------------------
### Get Access Token Utility
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/01-认证与授权API.md
Retrieves the stored access token using the getToken utility function from '@/utils/auth'.
```javascript
import { getToken } from '@/utils/auth'
const token = getToken()
```
--------------------------------
### Configure Gzip Compression
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/09-配置参考汇总.md
Enables Gzip compression for assets. Configure the algorithm, file extension, and whether to delete the original file.
```javascript
// vite.config.mjs
import compression from 'vite-plugin-compression'
plugins: [
compression({
algorithm: 'gzip',
ext: '.gz',
deleteOriginFile: false
})
]
```
--------------------------------
### Get Menu List (JavaScript)
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/02-系统管理API.md
Fetches a paginated list of menus. Parameters are similar to user management's getList function.
```javascript
export const getList = (current, size, params)
=> request({...})
```
--------------------------------
### Get Permission Buttons
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/03-状态管理.md
Fetches the list of permission buttons available to the user from the API and updates the application's permission state.
```javascript
dispatch('GetButtons')
.then(() => {
console.log('权限对象:', this.$store.state.user.permission)
})
```
--------------------------------
### Basic Application Configuration
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/06-HTTP拦截器与配置.md
Defines basic application settings including title, logo, localStorage prefix, and page title suffix.
```javascript
title: 'saber' // 应用标题
logo: 'A' // Logo 标记
key: 'saber' // localStorage 前缀
indexTitle: 'Saber Admin' // 页面标题后缀
```
--------------------------------
### 通用存储工具
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/README.md
用于在 localStorage 或 sessionStorage 中进行数据存储、获取和移除的工具函数。
```javascript
setStore(key, value)
getStore(key)
removeStore(key)
```
--------------------------------
### Full Permission Check Flow
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/05-路由与权限系统.md
Demonstrates the complete process for permission control, from user login and data retrieval to checking permissions in templates and handling insufficient permissions.
```javascript
// 1. User login
await this.$store.dispatch('LoginByUsername', {
tenantId: '000000',
username: 'admin',
password: encrypt('password')
})
// Store Token
// 2. Get user information
await this.$store.dispatch('GetUserInfo')
// Store user info, roles
// 3. Get menu and permissions
await this.$store.dispatch('GetMenu', topMenuId)
// Convert menu to routes, get permission button list
// 4. Check permissions in template
Add User
// 5. When permission is insufficient
const hasPermission = this.$store.getters.permission.user_delete
if (!hasPermission) {
this.$message.error('You do not have permission to delete users')
return
}
```
--------------------------------
### Get Interface Permissions
Source: https://github.com/chillzhuang/saber/blob/master/_autodocs/07-其他API模块.md
Retrieves the interface permissions for a specified role ID. Used to check which API endpoints a role can access.
```javascript
export const getApiScope = (roleId)
```