- Web UI Framework:[element-ui](https://github.com/ElemeFE/element)
- Server Franmework:[gin](https://github.com/gin-gonic/gin)
- 使用redis实现记录当前活跃用户的jwt令牌并实现多点登录限制
- 使用swagger构建自动化文档
- 使用fsnotify和viper实现json格式配置文件
- 使用logrus实现日志记录
- 使用gorm实现对数据库的基本操作
## 3. 项目目录
## 1. Basic Introduction
[Online Demo](http://qmplus.henrongyi.top/)
> Gin-vue-admin is a full-stack (frontend and backend separation) framework designed for management system.
> It integrates multiple functions, such as JWT authentication, dynamic routing, dynamic menu, casbin authentication, form generator, code generator, etc. So that you can focus more time on your business Requirements.
## 2. Getting started
```
├─erver (后端文件夹)
│ ├─api (API)
│ ├─config (配置包)
│ ├─core (內核)
│ ├─db (数据库脚本)
│ ├─docs (swagger文档目录)
│ ├─global (全局对象)
│ ├─initialiaze (初始化)
│ ├─middleware (中间件)
│ ├─model (结构体层)
│ ├─resource (资源)
│ ├─router (路层)
│ └─urtils (公共功能)
└─web (前端文件)
├─public (发布模板)
└─src (源码包)
├─api (向后台发送ajax的封装层)
├─assets (静态文件)
├─components(组件)
├─router (前端路由)
├─store (vuex 状态管理仓)
├─style (通用样式文件)
├─utils (前端工具库)
└─view (前端页面)
- node version > v8.6.0
- golang version >= v1.11
- IDE recommendation: Goland
- After you clone the project, use the scripts in directory db to create your own database.
- We recommend you to apply for your own cloud service in QINIU. Replace the public key, private key, warehouse name and default url address with your own, so as not to mess up the test database.
After executing the above command,`docs` will show in `server/`,then open your browser, jump into `http://localhost:8888/swagger/index.html` to see the swagger APIs.
- 工作流,任务交接功能开发
### 2.4 docker image
- 单独前端使用模式以及数据模拟
## 6. 使用说明
- golang api server 基于go.mod 如果golang版本低于1.11 请自行升级golang版本
Thanks [@chenlinzhong](https://github.com/chenlinzhong) for providing docker image.
```
# start docker
docker run -itd --net=host --name=go_container shareclz/go_node /bin/bash;
vi /data1/www/htdocs/go/admin/QMPlusServer/static/dbconfig/config.json;
- 到前端项目目录下运行 npm i 安装所需依赖
# run server
cd /data1/www/htdocs/go/admin/QMPlusServer;z
go run main.go;
```
- 依赖安装完成直接运行 npm run serve即可启动项目
## 3. technical selection
### 6.1 生成swagger自动化API文档
- Frontend: using `Element-UI` based on vue,to code the page.
- Backend: using `Gin` to quickly build basic RESTful API. `Gin` is a web framework written in Go (Golang).
- DB: `MySql`(5.6.44),using `gorm` to implement data manipulation.
- Cache: using `Redis` to implement the recording of the JWT token of the currently active user and implement the multi-login restriction.
- API: using Swagger to auto generate APIs docs。
- Config: using `fsnotify` and `viper` to implement `yaml` config file。
- Log: using `logrus` record logs。
#### 6.1.1 安装 swagger
## 4. project layout
- (1)可以翻墙
```
├─erver (backend)
│ ├─api (API entrance)
│ ├─config (config file)
│ ├─core (core code)
│ ├─db (db scripts)
│ ├─docs (swagger APIs docs)
│ ├─global (global objet)
│ ├─initialiaze (initialiazation)
│ ├─middleware (middle ware)
│ ├─model (model and services)
│ ├─resource (resources, such as static pages, templates)
│ ├─router (routers)
│ └─urtils (common utilities)
└─web (frontend)
├─public (deploy templates)
└─src (source code)
├─api (frontend APIs)
├─assets (static files)
├─components(components)
├─router (frontend routers)
├─store (vuex state management)
├─style (common styles)
├─utils (frontend common utilitie)
└─view (pages)
````
go get -u github.com/swaggo/swag/cmd/swag
````
- (2)无法翻墙
```
由于国内没法安装 go.org/x 包下面的东西,需要先安装gopm
## 5. Features
- Authority management: Authority management based on `jwt` and `casbin`.
- File upload & download: File upload operation based on Qiniu Cloud (In order to make it easier for everyone to test, I have provided various important tokens of my Qiniu test number, and I urge you not to make things a mess).
- Pagination Encapsulation:The frontend uses mixins to encapsulate paging, and the paging method can call mixins
- User management: The system administrator assigns user roles and role permissions.
- Role management: Create the main object of permission control, and then assign different API permissions and menu permissions to the role.
- Menu management: User dynamic menu configuration implementation, assigning different menus to different roles.
- API management: Different users can call different API permissions.
- Configuration management: The configuration file can be modified in the web page (the test environment does not provide this function).
- Rich text editor: Embed MarkDown editor function.
- Conditional search: Add an example of conditional search.
- Multi-login restriction: Change `userMultipoint` to true in `system` in `config.yaml` (You need to configure redis and redis parameters yourself. During the test period, please report in time if there is a bug).
- Upload file by chunk:Provides examples of file upload and large file upload by chunk.
- Form Builder:With the help of [@form-generator](https://github.com/JakHuang/form-generator).
- Code generator: Providing backend with basic logic and simple curd code generator.
|2020/01/07| Added data resource function to Role, added the return of data resource association, the demo code was synchronized, and the multi-point login interception has been turned on, which may prevent being crowded out by others |
|2020/01/13| Added configuration management function. This function is not published to the test environment. The test environment will not be published until the protection mechanism and the service restart mechanism are released. Please clone and import the sql scripts into your own database |
|2020/02/21| Modified `casbin` custom authentication method to fully support `/:params and?Query=` interface modes in RESTful API |
|2020/03/17| Added verification code function with [@dchest/captcha](https://github.com/dchest/captcha) |
|2020/03/30| Code generator implementation, form generator implementation with[@form-generator](https://github.com/JakHuang/form-generator) |
|2020/04/01| Add frontend history tab function, add (modify) condition query example, and change the frontend background to white. (If you don't need this feature, you can change `background` in `&.el-main` to shield background color of `HistoryComponent`, which is located at line 260 of the code `web/src/view/layout/index.vue`) |
|2020/04/04| Starting version 2.x, standardize the project documentation, reconstructing the log function, and adding English comments to all methods |
````
go install
````
## 8. Team blog
#### 6.1.2 生成API文档
- 安装完成过后在项目目录下运行
> https://blog.henrongyi.top
>
>
There are video courses about frontend framework in our blo. If you think the project is helpful to you, you can add my personal WeChat:shouzi_1994,your comments is welcomed。