大佬教程收集整理的这篇文章主要介绍了资金管理系统(带权限),大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
项目地址:https://github.com/Allenem/CapitalManagementSystem.git
git clone https://github.com/ALLENem/CapitalManagementSystem.git npm install cd client npm install cd ../ npm run dev
服务端地址:http://localhost:5000,客户端地址:http://localhost:8080
根目录下打开cmd
或powersHell
运行tree /f
命令生成
. │ package-lock.json │ package.json │ README.md │ server.js │ ├─client │ │ .gitignore │ │ babel.config.js │ │ package-lock.json │ │ package.json │ │ README.md │ │ vue.config.js │ │ │ ├─public │ │ │ favicon.ico │ │ │ index.html │ │ │ │ │ └─css │ │ reset.css │ │ │ └─src │ │ App.vue │ │ http.js │ │ main.js │ │ router.js │ │ store.js │ │ │ ├─assets │ │ 403.png │ │ 404.gif │ │ bg.jpg │ │ coin.png │ │ showcase.jpg │ │ │ ├─components │ │ Dialog.vue │ │ HeadNav.vue │ │ LeftMenu.vue │ │ │ └─views │ 404.vue │ changelist.vue │ FundList.vue │ Home.vue │ Index.vue │ InfoShow.vue │ Login.vue │ Register.vue │ UserList.vue │ ├─config │ keys.js │ passport.js │ ├─effectimg │ …… │ ├─models │ Profile.js │ User.js │ └─routers └─api profiles.js users.js
主文件
server.js
两个模型
@H_640_33@models/Profile.js
@H_640_33@models/User.js
路由配置
routers/api/profiles.js
routers/api/users.js
常量和token验证
config/key
config/passport
vue默认配置
client/vue.config.js
入口文件
client/public/index.html
根组件
client/src/App.vue
路由配置
client/src/router.js
库的引用
client/src/main.js
client/src/http.js
vuex存储
client/src/store.js
静态文件夹
client/src/assets
client/src/views
组件文件夹
client/src/components
test无身份,all为管理员
主页,非管理员资金流水页
接口地址:http://localhost:5000/api/users/test 请求方式:get 请求示例:Examples 接口参数: 1.请求参数说明: { } 2.返回参数说明: { "msg":"users test api works" }@H_419_237@2.用户注册
接口地址:http://localhost:5000/api/users/register 请求方式:post 请求示例:Examples 接口参数: 1.请求参数说明: { "name": "test","email": "[email protected]","password": "123456","identity": "manager" } 2.返回参数说明: { "name": "test","email": "[email protected]","avatar": "xxx","identity": "manager" }
接口地址:http://localhost:5000/api/users/login 请求方式:post 请求示例:Examples 接口参数: 返回参数说明: 1.请求参数说明: { "email": "[email protected]",} 2.返回参数说明: { "success": true,"token": "'Bearer' + token" }
接口地址:http://localhost:5000/api/users/current 请求方式:get 请求示例:Examples 接口参数: 返回参数说明: 1.请求参数说明: { } 2.返回参数说明: { "id": "qwertyuiopasdfghjklcvbnm","name": "test","email": "[email protected]","identity": "manager" }
接口地址:http://localhost:5000/api/users/ 请求方式:get 请求示例:Examples 接口参数: 返回参数说明: 1.请求参数说明: { } 2.返回参数说明: { "user": [ { "_id": "5d320d3bb77a763724d503d9","email": "[email protected]","avatar": "//www.gravatar.com/avatar/1aedb8d9dc4751e229a335e371db8058?s=200&r=pg&d=mm","password": "$2b$10$TBjcpQBI2hsXfZMB5DKzXuQBeevJI7mc7GuootkbwscUT9A/wiI6S","date": "2019-07-19T18:34:35.489Z","__v": 0 },{ "_id": "5d32b28ae6b23dcb8dd4f727","name": "abc","email": "[email protected]","avatar": "//www.gravatar.com/avatar/4adcca49b3b1e5a08ac202f5d5a9e688?s=200&r=pg&d=mm","password": "$2b$10$TFjKmx0vtwbDjQMr6R0kNeQ/jQvDLzCksDPXebDBJyykahun7Cnhi","identity": "employee","date": "2019-07-20T06:19:54.158Z","__v": 0 } ] }
接口地址:http://localhost:5000/api/profiles/test 请求方式:get 请求示例:Examples 接口参数: 1.请求参数说明: { } 2.返回参数说明: { "msg":"profiles test api works" }
接口地址:http://localhost:5000/api/profiles/add 请求方式:post 请求示例:Examples 接口参数: 返回参数说明: 1.请求参数说明: { "type":"优惠券","describe":"买书","income":"30","expend":"20","cash":"10","REMARK":"开心" } 2.返回参数说明: { "type":"优惠券","REMARK":"开心" }
接口地址:http://localhost:5000/api/profiles/ 请求方式:get 请求示例:Examples 接口参数: 返回参数说明: 1.请求参数说明: { } 2.返回参数说明: { "profile": [ { "type":"优惠券","REMARK":"开心" },{ "type":"礼券","describe":"充值","income":"50","cash":"30","REMARK":"好开心" } ] }
接口地址:http://localhost:5000/api/profiles/id 请求方式:get 请求示例:Examples 接口参数: 返回参数说明: 1.请求参数说明: { "id":"5d320d3bb77a763724d503d9" } 2.返回参数说明: { "_id":"5d320d3bb77a763724d503d9","type":"优惠券","REMARK":"开心" }
接口地址:http://localhost:5000/api/profiles/edit/id 请求方式:post 请求示例:Examples 接口参数: 返回参数说明: 1.请求参数说明: { "type":"优惠券","REMARK":"开心" }
接口地址:http://localhost:5000/api/profiles/delete/id 请求方式:delete 请求示例:Examples 接口参数: 返回参数说明: 1.请求参数说明: { "id":"5d320d3bb77a763724d503d9" } 2.返回参数说明: { "_id":"5d320d3bb77a763724d503d9","REMARK":"开心" } //已删除的信息
npm install nodemon -g
全局安装nodemon避免重复启动服务器
npm i mongoose
安装mangooose
MongoDB Atlas 官网免费注册申请 MongoDB Atlas 云数据库
postman 下载安装软件进行接口测试
npm i body-parser
安装body-parser发post请求
npm i bcrypt
加密
npm i gravatar
头像,可到https://en.gravatar.com/注册上传头像
npm i jsonwebtoken
登录成功返回token,token可以理解为一个令牌或者一个钥匙
npm install passport-jwt passport
验证token
npm install -g @vue/cli-service-global
全局安装最新的vue-cli
总文件目录下运行 npm i concurrently
前后端连载,不用分步开启服务,配置如下:
配置前端 client/package.json
的 "scripts"
"scripts": { "serve": "vue-cli-service serve","build": "vue-cli-service build","start": "npm run serve" },
配置总文件 package.json
的 "scripts"
"scripts": { "client-install": "npm install --prefix client","client": "npm start --prefix client","start": "node server.js","server": "nodemon server.js","dev": "concurrently \"npm run server\" \"npm run client\"" },
总文件目录下运行 npm run dev
实现前后端服务同时开启
npm i jwt-decode -S
解析token模块
npm i axios -S
请求工具axios
npm i element-ui -S
安装element-ui组件
用到其
等等
引入 font-awesome
图库
<link href="//cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet"> <!-- 示例 --> <i class="fa fa-margin fa-server fa-2x"></i>
以上是大佬教程为你收集整理的资金管理系统(带权限)全部内容,希望文章能够帮你解决资金管理系统(带权限)所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。