项目运行
环境配置:
Node.js最新版+ Vscode + Mysql5.7 + HBuilderX+Navicat11+Vue。
项目技术:
Express框架 + Node.js+ Vue 等等组成,B/S模式 +Vscode管理+前后端分离等等。
环境需要
1.运行环境:最好是Nodejs最新版,我们在这个版本上开发的。其他版本理论上也可以。
2.开发环境:Vscode或HbuilderX都可以。推荐HbuilderX;
3.mysql环境:建议是用5.7版本均可
4.硬件环境:windows 7/8/10 1G内存以上;或者 Mac OS;
6.Navcat11:这个版本不限10/11/14/15都可以。;
Node.js毕设帮助,指导,本源码(见文末),调试部署
4.2 管理员功能模块
管理员登录,管理员通过输入用户名、密码进行登录进入系统,如图4-1所示。
![50142f9a715040f7af2e2b6197f169f3.png](https://i-blog.csdnimg.cn/direct/50142f9a715040f7af2e2b6197f169f3.png)
图4-1管理员登录界面图
管理员通过登录进入校园闲置物品管理系统可查看个人中心、用户管理、闲置物品管理、物品类型管理、留言板管理、系统管理、订单管理等内容,如图4-2所示。
![8f95b53ef2db41ab892ddee69be193aa.png](https://i-blog.csdnimg.cn/direct/8f95b53ef2db41ab892ddee69be193aa.png)
图4-2管理员功能界面图
用户管理,管理员可在用户管理页面查看用户账号、用户姓名、手机号码、头像、性别、邮箱等内容,还可进行新增、修改或删除等操作,如图4-3所示。
![6c0a1d1cd12b47148dc318cedcc6e019.png](https://i-blog.csdnimg.cn/direct/6c0a1d1cd12b47148dc318cedcc6e019.png)
图4-3用户管理界面图
闲置物品管理,管理员可在闲置物品管理页面查看物品名称、封面、物品类型、包装规格、用户账号、用户姓名、手机号码、价格、单限、库存、审核回复、审核状态等内容,还可进行新增、修改、审核或删除等操作,如图4-4所示。
![95d2795b47e347be9834125d6f62e880.png](https://i-blog.csdnimg.cn/direct/95d2795b47e347be9834125d6f62e880.png)
图4-4闲置物品管理界面图
物品类型管理,管理员可在物品类型管理页面进行查询、新增、修改或删除等操作,如图4-5所示。
![28c3ff911150410daa6f9e2b66a37509.png](https://i-blog.csdnimg.cn/direct/28c3ff911150410daa6f9e2b66a37509.png)
图4-5物品类型管理界面图
留言板管理,管理员可在留言板管理页面查看用户名、留言内容、留言图片、回复内容、回复图片等内容,还可进行回复、修改或删除等操作,如图4-6所示。
![ece90c5f5bd5492b81c538c25e722525.png](https://i-blog.csdnimg.cn/direct/ece90c5f5bd5492b81c538c25e722525.png)
图4-6留言板管理界面图
业内公告,管理员可在业内公告页面查看标题、图片等内容,还可进行新增、修改或删除等操作,如图4-7所示。
![e34606043469487c812bc868f9512e86.png](https://i-blog.csdnimg.cn/direct/e34606043469487c812bc868f9512e86.png)
图4-7业内公告界面图
4.3系统功能模块
校园闲置物品管理系统,在系统首页可查看首页、闲置物品、业内公告、留言板、个人中心、后台管理、购物车、在线客服等内容,如图4-8所示。
![3f1ffebecc2a4ec0a1fa29ff709e3005.png](https://i-blog.csdnimg.cn/direct/3f1ffebecc2a4ec0a1fa29ff709e3005.png)
图4-8系统首页界面图
用户注册,用户通过输入用户账号、密码、用户姓名、手机号码、邮箱等内容,如图4-9所示。
![a479e4a3c4cd45a6bfb466ab0a78c3f1.png](https://i-blog.csdnimg.cn/direct/a479e4a3c4cd45a6bfb466ab0a78c3f1.png)
图4-9用户注册界面图
留言板,用户可在留言板页面通过输入留言、图片等内容进行提交等操作,如图4-10所示。
![66023ad1c50f4257a0b59d8d1c85d851.png](https://i-blog.csdnimg.cn/direct/66023ad1c50f4257a0b59d8d1c85d851.png)
图4-10留言板界面图
闲置物品,用户可在闲置物品页面查看物品名称、物品图片、价格、单次购买、库存、物品类型、包装规格、用户账号、用户姓名、手机号码、商品详情等内容,还可进行添加到购物车、立即购买或收藏等操作,如图4-11所示。
![59ef982a64444850b8384c0f15aeb8e8.png](https://i-blog.csdnimg.cn/direct/59ef982a64444850b8384c0f15aeb8e8.png)
图4-11闲置物品界面图
购物车,用户可在购物车页面查看购买商品、价格、数量、总价等内容,还可进行删除或购买等操作,如图4-12所示。
![7eea3f9562de4a5696d94a31df974a6c.png](https://i-blog.csdnimg.cn/direct/7eea3f9562de4a5696d94a31df974a6c.png)
图4-12购物车界面图
我的地址,用户可通过输入联系人、手机号码、地址等内容进行添加或重置等操作,如图4-13所示。
![dc6179f615a240fea6abc30701facf40.png](https://i-blog.csdnimg.cn/direct/dc6179f615a240fea6abc30701facf40.png)
图4-13我的地址界面图
后台管理,用户可在后台管理页面查看个人中心、闲置物品管理、订单管理等内容,如图4-14所示。
![6879c833cca8410eaa6eeb31ecea6671.png](https://i-blog.csdnimg.cn/direct/6879c833cca8410eaa6eeb31ecea6671.png)
图4-14用户后台功能界面图
闲置物品管理,用户可在闲置物品管理页面查看物品名称、封面、物品类型、包装规格、用户账号、用户姓名、手机号码、价格、单限、库存、审核回复、审核状态等内容,还可进行新增、修改、查看评论或删除等操作,如图4-15所示。
![52aae579092e4eb8974f0a88a823378a.png](https://i-blog.csdnimg.cn/direct/52aae579092e4eb8974f0a88a823378a.png)
图4-15闲置物品管理界面图
订单管理,用户可在订单管理页面查看订单编号、商品名称、商品图片、购买数量、价格、折扣价格、总价格、折扣总价格、支付类型、状态、地址、电话、收货人、商户名称、下单时间等内容,如图4-16所示。
![e5e41ebf06d041aca2b688e10032441c.png](https://i-blog.csdnimg.cn/direct/e5e41ebf06d041aca2b688e10032441c.png)
图4-16订单管理界面图