# layui-vue-admin

**Repository Path**: nkdit/layui-vue-admin

## Basic Information

- **Project Name**: layui-vue-admin
- **Description**: 利用layui-vue制作的企业级中台后台管理模板
- **Primary Language**: JavaScript
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 1
- **Created**: 2025-04-29
- **Last Updated**: 2025-04-29

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# layui-vue制作的企业级中台后台管理模板

采用最新layui-vue + vue3开发，支持多种主题模板布局，易上手，颗粒度化权限认证。


demo如下
![模板一](public/1.png)
![模板二](public/2.png)
![模板三](public/3.png)
![模板三](public/4.png)

## 服务端

### php版本
[layui-vue-admin-php](https://gitee.com/return-com/layui-vue-admin-php.git)

### Java版本 
后续推出

### node版本 
后续推出

### golang版本 
后续推出


## 使用步骤

### 第一步 安装环境依赖
```
yarn install
```

### 第二步 开发调试
```
yarn serve
```

### 第三步 上线打包
```
yarn build
```

### 整理和修复文件
```
yarn lint
```

### 环境要求
```
node v18+
yarn
```

## 自己开发应用思路
1、先修改网络请求地址。 在public/config.js中。

2、定义网络请求函数。在src/api中定义您的网络请求路径，统一工厂格式出厂。

3、开发项目。在src/views中开发您自己的项目模板

4、恭喜您，基本的开发流程大功告成！


## 功能特色

1、采用最新layui-vue + vue3开发

2、支持细化颗粒度权限，满足精细的权限认证要求

3、采用前端权限认证 + 后端权限双认证模式，前端页面绑定多个API的特点

4、后端定义路径，动态注册路由，免去时刻都在修改路由的烦恼

5、更多需要您自己去探索...

## 目录介绍
```
public/config.js    // ----- 项目上线地址修改（网络请求地址）配置。

src // ----- 项目
src/api      // ----- 网络请求Api出厂。可以在这里新增的网络请求
src/assets   // ----- 静态资源文件夹。
src/assets/svgIcon   // ----- svg图标。存放进去后，可以使用全局组件<SvgIcon :type="svg名称" />使用

src/components/global   // ----- 存放全局组件。新增后，记得在index.js注册
src/components/config   // ----- 项目配置文件。
src/components/config/index.js  // ----- 项目基本配置。如修改当前布局模板、布局间距、底部版权等
src/components/config/menu.js   // ----- 项目菜单与路由模拟数据。正式环境可删除
src/components/config/theme.css // ----- 项目全局样式配置。

src/directive   // ----- 自定义vue指令配置。
src/directive/index.js  // ----- 自定义vue指令配置。默认包含v-auth="'权限名称'"、v-scrollBar（滚动条），禁止删除默认

src/exception   // ----- 错误页面自定义目录。

src/extend  // ----- 自定义扩展目录。
src/extend/excel.js     // ----- 自定义扩展目录。excel扩展

src/layouts     // ----- 布局模板目录，不建议动它。
src/layouts/public  // ----- 布局模板公共目录，不建议动它。
src/layouts/theme   // ----- 布局模板主题目录，不建议动它。
src/layouts/BaseView.vue    // ----- 布局模板基础文件，不建议动它。

src/router  // ----- 项目路由，已经做成了动态路由，不建议动它。

src/store   // ----- 状态管理目录。利用reactive实现状态管理

src/utils   // ----- 自定义工具箱目录。已有的禁止删除

src/views   // ----- 项目模板目录。您可以在此开发你自己应用
```


## 欢迎加入QQ交流群：824294194
<img src="public/qq.png" width="100px">


## 常见问题

1、我想切换后台模板，在哪里修改？
```
在src/components/config/index.js中修改布局方式layout_mode的值即可，目前支持：mode1、mode2、mode3三种主题布局
```

2、在页面中，想控制某个节点，咋办？
```
在要显示/隐藏的组件上加入权限节点指令 v-auth="您后端定义的权限名称" 即可
```

3、相关技术文档有哪些？

[layui-vue](http://www.layui-vue.com/zh-CN/index)

[vue](https://cn.vuejs.org/)

## 免责声明
本项目是基于麻省理工学院MIT协议开源、且免费。请使用者遵守当地国家/地区法律法规、人文风俗。且使用者不得用于违法、与当地国家/地区法律法规、人文风俗所违背。否则由使用者承担一切相关后果。与本项目无关。