# Vue+Element-ui+node后台管理

**Repository Path**: tzqqq/manager

## Basic Information

- **Project Name**: Vue+Element-ui+node后台管理
- **Description**: 使用Vue+Element-ui+node(express框架)完成的后台管理系统
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 3
- **Forks**: 3
- **Created**: 2022-04-26
- **Last Updated**: 2024-02-21

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Vue+Element-ui+node后台管理

#### 介绍
使用Vue+Element-ui+node(express框架)完成的后台资金管理系统，具有基本的增删改查功能，后续还会不断添加功能。
另外注册时可选择老板或员工两种角色，根据角色不同，后台管理系统所展示的页面也有差别。

#### 页面效果
注册页
![输入图片说明](client/src/assets/%E6%B3%A8%E5%86%8C%E9%A1%B5.png)

登录页
![输入图片说明](client/src/assets/%E7%99%BB%E5%BD%95%E9%A1%B5.png)

首页
![输入图片说明](client/src/assets/%E9%A6%96%E9%A1%B5.png)

资金管理页
![输入图片说明](client/src/assets/%E8%B5%84%E9%87%91%E7%AE%A1%E7%90%86%E9%A1%B5.png)

修改资金信息页
![输入图片说明](client/src/assets/%E4%BF%AE%E6%94%B9%E8%B5%84%E9%87%91%E4%BF%A1%E6%81%AF%E9%A1%B5.png)

个人上传图片
![输入图片说明](client/src/assets/%E4%B8%AA%E4%BA%BA%E4%BF%A1%E6%81%AF%E9%A1%B5.png)


#### 安装教程

1.  clone下来后使用 npm init -y 初始化 
2.  接着，npm intall / npm i 下载依赖包
3.  然后在config文件夹下面的key.js修改你的mysql密码和数据库名称（数据库文件可以私信找我要）
4.  最后npm run serve启动（前后台都开启了）


#### 特技

1.使用 bcrypt 对密码进行加密处理。（为了保证密码的安全性，不建议在数据库以明文的形式保存用户密码，推荐对密码进行加密存储）
2、在node端使用cors进行跨域处理。
3、在处理函数中，需要多次调用 res.send() 向客户端响应处理失败的结果，为了简化代码，手动封装一个 res.cc() 处理失败信息函数。
4、使用jsonwebtoken包生成token字符串，将生成的 token 字符串响应给客户端，前端收到token后将token放在header中，使每次请求带上token。
5、在分页显示资金数据时，手动封装一个分页的方法，使得显示分页数据条数更加灵活。