tongtong/vue3-element-admin
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: 更新 README 文档，调整版本信息及投票链接，优化请求工具函数

Browse Source
This commit is contained in:
Ray.Hao
2026-01-09 10:07:39 +08:00
parent 7ba2e279e8
commit ca9fca7f57
4 changed files with 44 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files

79
README.en-US.md
View File

@@ -2,12 +2,12 @@
<img alt="vue3-element-admin" width="80" height="80" src="./src/assets/images/logo.png">
<h1>vue3-element-admin</h1>
<img src="https://img.shields.io/badge/Vue-3.5.21-brightgreen.svg"/>
<img src="https://img.shields.io/badge/Vite-7.1.5-green.svg"/>
<img src="https://img.shields.io/badge/Element Plus-2.11.2-blue.svg"/>
<img src="https://img.shields.io/badge/Vue-3.5.22-brightgreen.svg"/>
<img src="https://img.shields.io/badge/Vite-7.3.0-green.svg"/>
<img src="https://img.shields.io/badge/Element Plus-2.3.2-blue.svg"/>
<img src="https://img.shields.io/badge/license-MIT-green.svg"/>
<a href="https://gitee.com/youlaiorg" target="_blank">
<img src="https://img.shields.io/badge/Author-有来开源组织-orange.svg"/>
<img src="https://img.shields.io/badge/Author-%E6%9C%89%E6%9D%A5%E5%BC%80%E6%BA%90%E7%BB%84%E7%BB%87-orange.svg"/>
</a>
<a href="https://gitee.com/youlaiorg/vue3-element-admin" target="_blank">
@@ -20,20 +20,21 @@
<img alt="有来技术" src="https://gitcode.com/youlai/vue3-element-admin/star/badge.svg"/>
</a>
<a href="https://atomgit.com/youlai/vue3-element-admin" target="_blank">
<img alt="有来技术" src="https://atomgit.com/youlai/vue3-element-admin/star/2025top.svg"/>
</a>
</div>
![](https://foruda.gitee.com/images/1708618984641188532/a7cca095_716974.png "rainbow.png")
<div align="center">
<a target="_blank" href="https://vue.youlai.tech">🖥️ Live Preview</a> | <a target="_blank" href="https://app.youlai.tech">📲 Mobile Preview</a> | <a target="_blank" href="https://juejin.cn/post/7228990409909108793">📑 Documentation</a>| <a target="_blank" href="https://www.youlai.tech//vue3-element-admin">🌐 Official Website</a> | <a href="./README.md">💬 中文
<a target="_blank" href="https://vue.youlai.tech">🖥️ Live Preview</a> | <a target="_blank" href="https://app.youlai.tech">📲 Mobile Preview</a> | <a target="_blank" href="https://juejin.cn/post/7228990409909108793">📑 Documentation</a>| <a target="_blank" href="https://www.youlai.tech//vue3-element-admin">🌐 Official Website</a> | <a href="./README.md">💬 中文</a> | <a href="./README.en-US.md">💬 English</a>
</div>
## Introduction
[vue3-element-admin](https://gitcode.com/youlai/vue3-element-admin) is a minimalist enterprise-level backend management frontend template built with Vue3, Vite7, TypeScript, and Element-Plus. It comes with complementary Java backend [youlai-boot](https://gitee.com/youlaiorg/youlai-boot) and Node backend [youlai-nest](https://gitee.com/youlaiorg/youlai-nest). A simplified version [vue3-element-template](https://gitee.com/youlaiorg/vue3-element-template) and a JavaScript version [vue3-element-admin-js](https://gitee.com/youlaiorg/vue3-element-admin) are also available for developers to quickly start development.
[vue3-element-admin](https://gitcode.com/youlai/vue3-element-admin) is a minimalist enterprise-level admin frontend template built with Vue3, Vite7, TypeScript, and Element-Plus. It comes with a Java backend [youlai-boot](https://gitee.com/youlaiorg/youlai-boot), a multi-tenant Java backend [youlai-boot-tenant](https://gitee.com/youlaiorg/youlai-boot-tenant), and a Node backend [youlai-nest](https://gitee.com/youlaiorg/youlai-nest). A simplified version [vue3-element-template](https://gitee.com/youlaiorg/vue3-element-template) and a JavaScript version [vue3-element-admin-js](https://gitee.com/youlaiorg/vue3-element-admin) are also available.
## Project Features
@@ -43,10 +44,11 @@
- **System Functions**: Provides user management, role management, menu management, department management, dictionary management, and other functional modules.
- **Permission Management**: Supports dynamic routing, button permissions, role permissions, and data permissions.
- **Multi-tenant**: Supports multi-tenant mode and tenant isolation.
- **Infrastructure**: Provides internationalization, multiple layouts, dark mode, full screen, watermark, API documentation, and code generator functionality.
- **Continuous Updates**: Project is continuously updated with real-time updates of tools and dependencies.
## Project Screenshots
🖥️ **Dashboard**
@@ -63,41 +65,36 @@
## Project Source Code
| Project | Gitee | Github | GitCode|
| ---- | ----| ---- | ---- |
| vue3-element-admin ✅| [vue3-element-admin](https://gitee.com/youlaiorg/vue3-element-admin) | [vue3-element-admin](https://github.com/youlaitech/vue3-element-admin) | [vue3-element-admin](https://gitcode.com/youlai/vue3-element-admin) |
| vue3-element-admin JS Version| [vue3-element-admin-js](https://gitee.com/youlaiorg/vue3-element-admin-js) | [vue3-element-admin-js](https://github.com/youlaitech/vue3-element-admin-js) | [vue3-element-admin-js](https://gitcode.com/youlai/vue3-element-admin-js) |
| vue3-element-admin Lite Version | [vue3-element-template](https://gitee.com/youlaiorg/vue3-element-template) | [vue3-element-template](https://github.com/youlaitech/vue3-element-template) |[vue3-element-template](https://gitcode.com/youlai/vue3-element-template)|
| vue-uniapp-admin Mobile Version | [vue-uniapp-admin](https://gitee.com/youlaiorg/vue-uniapp-admin) | [vue-uniapp-admin](https://github.com/youlaitech/vue-uniapp-admin) |[vue-uniapp-admin](https://gitcode.com/youlai/vue-uniapp-admin)|
| Java Backend | [youlai-boot](https://gitee.com/youlaiorg/youlai-boot) | [youlai-boot](https://github.com/haoxianrui/youlai-boot.git) |[youlai-boot](https://gitcode.com/youlai/youlai-boot.git)|
| Node Backend | [youlai-nest](https://gitee.com/youlaiorg/youlai-nest) | [youlai-nest](https://github.com/haoxianrui/youlai-nest.git) |[youlai-nest](https://gitcode.com/youlai/youlai-nest.git)|
| Project | Gitee | Github | GitCode |
| ------------------------------- | -------------------------------------------------------------------------- | ---------------------------------------------------------------------------- | ------------------------------------------------------------------------- |
| vue3-element-admin ✅ | [vue3-element-admin](https://gitee.com/youlaiorg/vue3-element-admin) | [vue3-element-admin](https://github.com/youlaitech/vue3-element-admin) | [vue3-element-admin](https://gitcode.com/youlai/vue3-element-admin) |
| vue3-element-admin JS Version | [vue3-element-admin-js](https://gitee.com/youlaiorg/vue3-element-admin-js) | [vue3-element-admin-js](https://github.com/youlaitech/vue3-element-admin-js) | [vue3-element-admin-js](https://gitcode.com/youlai/vue3-element-admin-js) |
| vue3-element-admin Lite Version | [vue3-element-template](https://gitee.com/youlaiorg/vue3-element-template) | [vue3-element-template](https://github.com/youlaitech/vue3-element-template) | [vue3-element-template](https://gitcode.com/youlai/vue3-element-template) |
| vue-uniapp-admin Mobile Version | [vue-uniapp-admin](https://gitee.com/youlaiorg/vue-uniapp-admin) | [vue-uniapp-admin](https://github.com/youlaitech/vue-uniapp-admin) | [vue-uniapp-admin](https://gitcode.com/youlai/vue-uniapp-admin) |
| Java Backend | [youlai-boot](https://gitee.com/youlaiorg/youlai-boot) | [youlai-boot](https://github.com/haoxianrui/youlai-boot.git) | [youlai-boot](https://gitcode.com/youlai/youlai-boot.git) |
| Java Multi-tenant Backend | [youlai-boot-tenant](https://gitee.com/youlaiorg/youlai-boot-tenant) | - | - |
| Node Backend | [youlai-nest](https://gitee.com/youlaiorg/youlai-nest) | [youlai-nest](https://github.com/haoxianrui/youlai-nest.git) | [youlai-nest](https://gitcode.com/youlai/youlai-nest.git) |
## Development Guide
| Name | Link |
|---------------|--------------------|
| Video Tutorial | [https://www.bilibili.com/video/BV1eFUuYyEFj](https://www.bilibili.com/video/BV1eFUuYyEFj) |
| Project Setup | [Building a Backend Management System from Scratch with Vue3, Vite, TypeScript, and Element-Plus](https://blog.csdn.net/u013737132/article/details/130191394) |
| Official Documentation | [https://www.youlai.tech/vue3-element-admin/](https://www.youlai.tech/vue3-element-admin/) |
| Code Standards | [ESLint V9 + Prettier + Stylelint + EditorConfig for Standardized and Unified Frontend Code Style](https://youlai.blog.csdn.net/article/details/145608723) |
| Commit Standards | [Husky + Lint-staged + Commitlint + Commitizen + cz-git for Git Commit Standards](https://youlai.blog.csdn.net/article/details/145615236) |
| API Documentation | [https://www.apifox.cn/apidoc/shared-195e783f-4d85-4235-a038-eec696de4ea5](https://www.apifox.cn/apidoc/shared-195e783f-4d85-4235-a038-eec696de4ea5) |
| Name | Link |
| ---------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Video Tutorial | [https://www.bilibili.com/video/BV1eFUuYyEFj](https://www.bilibili.com/video/BV1eFUuYyEFj) |
| Project Setup | [Building a Backend Management System from Scratch with Vue3, Vite, TypeScript, and Element-Plus](https://blog.csdn.net/u013737132/article/details/130191394) |
| Official Documentation | [https://www.youlai.tech/vue3-element-admin/](https://www.youlai.tech/vue3-element-admin/) |
| Code Standards | [ESLint V9 + Prettier + Stylelint + EditorConfig for Standardized and Unified Frontend Code Style](https://youlai.blog.csdn.net/article/details/145608723) |
| Commit Standards | [Husky + Lint-staged + Commitlint + Commitizen + cz-git for Git Commit Standards](https://youlai.blog.csdn.net/article/details/145615236) |
| API Documentation | [https://www.apifox.cn/apidoc/shared-195e783f-4d85-4235-a038-eec696de4ea5](https://www.apifox.cn/apidoc/shared-195e783f-4d85-4235-a038-eec696de4ea5) |
## Project Setup
- **Environment Preparation**
| Environment Type | Name |
|----------------|-----------------------------|
| **Development Tool** | [Visual Studio Code](https://code.visualstudio.com/Download) |
| **Runtime Environment** | ^20.19.0 || >=22.12.0 |
| Type | Requirement | Notes |
| ------------------- | ------------------------------------------------------------ | ---------------------------------------- |
| **Node.js** | `^20.19.0` or `>=22.12.0` | LTS is recommended (even major versions) |
| **Package Manager** | `pnpm >= 8.0.0` | This project uses pnpm |
| **IDE** | [Visual Studio Code](https://code.visualstudio.com/Download) | Recommended Vue/TypeScript extensions |
- **Quick Start**
@@ -121,7 +118,6 @@ pnpm install
pnpm run dev
```
## Project Deployment
After executing the `pnpm run build` command, the project will be bundled and a `dist` directory will be generated. Next, upload the files from the `dist` directory to the `/usr/share/nginx/html` directory on your server and configure Nginx for reverse proxy.
@@ -164,7 +160,6 @@ The project supports both online and local Mock interfaces. By default, it uses
2. Follow the instructions in the backend project's README.md to [set up and run locally](https://gitee.com/youlaiorg/youlai-boot#%E9%A1%B9%E7%9B%AE%E8%BF%90%E8%A1%8C).
3. Modify the value of `VITE_APP_API_URL` in the `.env.development` file, changing it from https://api.youlai.tech to http://localhost:8989.
## Notes
- **Auto import plugin is disabled by default**
@@ -189,24 +184,21 @@ The project supports both online and local Mock interfaces. By default, it uses
If you have any other issues or suggestions, please open an [ISSUE](https://gitee.com/youlaiorg/vue3-element-admin/issues/new).
## Commit Conventions
Execute `pnpm run commit` to invoke interactive git commit and complete the information input and selection according to the prompts.
![](https://foruda.gitee.com/images/1687755823165218215/c1705416_716974.png)
## Project Statistics
![](https://repobeats.axiom.co/api/embed/aa7cca3d6fa9c308fc659fa6e09af9a1910506c3.svg "Repobeats analytics image")
Thanks to all the contributors!
感谢所有的贡献者！
[![contributors](https://contrib.rocks/image?repo=youlaitech/vue3-element-admin)](https://github.com/youlaitech/vue3-element-admin/graphs/contributors)
## Special Thanks
- Thanks to the [GitCode](https://gitcode.com/) official [G-Star](https://gitcode.com/g-star) certification
@@ -219,4 +211,3 @@ Thanks to all the contributors!
② Directly add WeChat **`haoxianrui`** with a note indicating "Frontend/Backend/Full Stack".
![Youlai Tech WeChat Official Account](https://foruda.gitee.com/images/1737108820762592766/3390ed0d_716974.png)

17
README.md
View File

@@ -3,17 +3,11 @@
## 🎉 正在参加 Gitee 2025 最受欢迎开源软件评选
<a href="https://gitee.com/activity/2025opensource?ident=I6VXEH" target="_blank">
<img src="https://img.shields.io/badge/🗳️_立即投票-支持本项目-ff6b35?style=for-the-badge&logo=gitee" alt="投票" height="50"/>
<img src="https://img.shields.io/badge/VUE3--ELEMENT--ADMIN-点击投票支持-f97316?style=for-the-badge&logo=gitee&logoColor=white&labelColor=111827" alt="投票" height="50"/>
</a>
<p>
<strong>一票就够，不用每天投 🙏 您的支持是我们持续更新的最大动力！</strong>
</p>
<p>
<a href="https://gitee.com/activity/2025opensource?ident=I6VXEH" target="_blank">
<strong>👉 点击徽章或这里投票 👈</strong>
</a>
<strong>📢 投票最后1天！恳请助力一票 🙏 无需重复投，您的支持是我们前行的最大动力！</strong>
</p>
</div>
@@ -25,8 +19,8 @@
<h1>vue3-element-admin</h1>
<img src="https://img.shields.io/badge/Vue-3.5.22-brightgreen.svg"/>
<img src="https://img.shields.io/badge/Vite-7.1.12-green.svg"/>
<img src="https://img.shields.io/badge/Element Plus-2.11.7-blue.svg"/>
<img src="https://img.shields.io/badge/Vite-7.3.0-green.svg"/>
<img src="https://img.shields.io/badge/Element Plus-2.3.2-blue.svg"/>
<img src="https://img.shields.io/badge/license-MIT-green.svg"/>
<a href="https://gitee.com/youlaiorg" target="_blank">
<img src="https://img.shields.io/badge/Author-有来开源组织-orange.svg"/>
@@ -42,6 +36,9 @@
<img alt="有来技术" src="https://gitcode.com/youlai/vue3-element-admin/star/badge.svg"/>
</a>
<a href="https://atomgit.com/youlai/vue3-element-admin" target="_blank">
<img alt="有来技术" src="https://atomgit.com/youlai/vue3-element-admin/star/2025top.svg"/>
</a>
</div>
![](https://foruda.gitee.com/images/1708618984641188532/a7cca095_716974.png "rainbow.png")

21
src/utils/request.ts
View File

@@ -15,21 +15,6 @@ const http = axios.create({
paramsSerializer: (params) => qs.stringify(params),
});
type PageMeta = { pageNum: number; pageSize: number; total: number };
type PagedApiResponse<T = any> = ApiResponse<T> & { page: PageMeta | null };
function isPagedApiResponse<T>(payload: ApiResponse<T>): payload is PagedApiResponse<T> {
// Treat as paged response only when `page` is a non-null object (contains pagination meta).
// Some APIs return `page: null` for non-paged endpoints; checking for the presence
// of the `page` property alone causes unintended branching (e.g. captcha endpoint).
return (
payload != null &&
typeof payload === "object" &&
payload.page != null &&
typeof (payload as any).page === "object"
);
}
// ============================================
// 请求拦截器
// ============================================
@@ -65,10 +50,8 @@ http.interceptors.response.use(
if (code === ApiCodeEnum.SUCCESS) {
// 分页接口需要同时返回 data 与 page 元信息
if (isPagedApiResponse(response.data)) {
const { page } = response.data;
return { data, page: page ?? null };
}
const page = (response.data as any)?.page;
if (page != null) return { data, page };
return data;
}

5
src/views/login/index.vue
View File

@@ -225,11 +225,6 @@ onBeforeUnmount(() => {
padding: clamp(1.5rem, 3vw, 3rem);
color: var(--el-text-color-primary);
animation: featureFade 0.8s ease-out;
@media (prefers-color-scheme: dark) {
/* use theme variable so dark mode colors follow theme variables */
color: var(--el-text-color-primary);
}
}
@media (max-width: 768px) {