README.md 2.6 KB
Newer Older
P
refine  
Pan 已提交
1 2
##vue-element-admin
vue+element+axios 的管理后台 [线上地址](http://panjiachen.github.io/vue-element-admin)
P
update  
Pan 已提交
3

P
refine  
Pan 已提交
4
这半年来一直在用vue写管理后台,目前后台已经有七十多个页面,十几种权限,但维护成本依然很低,效率依然很高。这半年来积累了不少的后台开发经验,所以准备开源分享一下。
P
Pan 已提交
5 6

### 功能
P
refine  
Pan 已提交
7 8
- [x] 登录/注销
- [x] 权限验证
P
refine  
Pan 已提交
9 10
- [x] 侧边栏
- [x] 面包屑
P
refine  
Pan 已提交
11 12 13 14 15 16 17 18 19 20 21 22 23 24 25
- [x] 富文本编辑器
- [x] Markdown编辑器
- [x] JSON编辑器
- [x] 列表拖拽
- [x] SplitPane
- [x] Dropzone
- [x] Sticky
- [x] CountTo
- [x] echarts图表
- [x] 401,401错误页面
- [x] 错误日志
- [x] 导出excel
- [x] table example
- [x] form example
- [x] 多环境发布
P
refine  
Pan 已提交
26 27 28
- [x] dashboard
- [x] 二次登录
- [x] 动态侧边栏
P
Pan 已提交
29
- [x] mock
P
refine  
Pan 已提交
30

P
refine  
Pan 已提交
31

P
Pan 已提交
32
### 开发
P
refine  
Pan 已提交
33
```bash
P
Pan 已提交
34 35 36 37 38 39 40 41
    # 克隆项目
    git clone https://github.com/PanJiaChen/vue-element-admin.git   
    
    # 安装依赖
    npm install
    
    # 本地开发 开启服务,浏览器访问 http://localhost:9527
    npm run build
P
refine  
Pan 已提交
42
```
P
Pan 已提交
43 44
### 发布
```bash
P
Pan 已提交
45 46 47 48 49
    # 发布测试环境 带webpack ananalyzer
    npm run build:sit-preview
    
    # 构建生成环境
    npm run build:prod
P
Pan 已提交
50 51 52
```

## 效果图
P
update  
Pan 已提交
53

P
update  
Pan 已提交
54
#### 两步验证登录 支持微信和qq
P
update  
Pan 已提交
55

P
Pan 已提交
56 57
![两步验证 here](https://github.com/PanJiaChen/vue-element-admin/blob/master/gifs/2login.gif)

P
update  
Pan 已提交
58
#### 真正的动态换肤
P
update  
Pan 已提交
59

P
Pan 已提交
60 61 62
![真正的动态换肤](https://github.com/PanJiaChen/vue-element-admin/blob/master/gifs/theme.gif)<br />


P
Pan 已提交
63

P
update  
Pan 已提交
64
#### 可收起侧边栏
P
update  
Pan 已提交
65

P
Pan 已提交
66 67
![enter image description here](https://github.com/PanJiaChen/vue-element-admin/blob/master/gifs/leftmenu.gif)

P
update  
Pan 已提交
68
#### 拖拽排序
P
update  
Pan 已提交
69

P
Pan 已提交
70 71
![enter image description here](https://github.com/PanJiaChen/vue-element-admin/blob/master/gifs/order.gif)

P
Pan 已提交
72 73


P
update  
Pan 已提交
74
#### 上传裁剪头像
P
update  
Pan 已提交
75

P
Pan 已提交
76 77
![enter image description here](https://github.com/PanJiaChen/vue-element-admin/blob/master/gifs/uploadAvatar.gif)

P
Pan 已提交
78 79


P
Pan 已提交
80 81
#### 错误统计

P
Pan 已提交
82
![enter image description here](https://github.com/PanJiaChen/vue-element-admin/blob/master/gifs/errorlog.gif)
P
Pan 已提交
83

P
update  
Pan 已提交
84
#### 富文本(整合七牛 打水印等个性化功能)
P
update  
Pan 已提交
85

P
Pan 已提交
86 87
![enter image description here](https://github.com/PanJiaChen/vue-element-admin/blob/master/gifs/editor.gif)

P
update  
Pan 已提交
88
#### 封装table组件
P
update  
Pan 已提交
89

P
Pan 已提交
90 91 92
![enter image description here](https://github.com/PanJiaChen/vue-element-admin/blob/master/gifs/table.gif)

#### 图表
P
update  
Pan 已提交
93

P
Pan 已提交
94 95
![enter image description here](https://github.com/PanJiaChen/vue-element-admin/blob/master/gifs/echarts.gif)

P
update  
Pan 已提交
96
#### 导出excel
P
update  
Pan 已提交
97

P
Pan 已提交
98 99 100
![enter image description here](https://github.com/PanJiaChen/vue-element-admin/blob/master/gifs/excel.png)

等等很多,尽请期待!