计算机毕业设计Node.js+uniapp安卓和悦少年文明礼仪监管APP(源码+程序+lw+远程调试)

项目运行

环境配置：

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毕设帮助，指导，本源码(见文末)，调试部署

5.1.1 学生登录

本系统和大部分系统一样都需要登录才能进入系统进行后续操作，用户输入账号和密码点击进行登录，进入到APP首页，具体的实现效果如图5.1所示：

图5.1 登录界面

5.1.2 APP首页

学生登录到和悦少年文明礼仪监管APP后，可以查看首页、文章信息、活动信息、我的等内容，并进行相应操作。具体的实现效果如图5.2所示：

图5.2 首页界面

5.1.3文章信息

点击文章信息，用户可以看到文章封面、文章标题、学号、学生姓名、发布时间、点击次数、文章简介、文章内容、审核回复等内容，并进行收藏、赞、踩、评论等操作，具体的实现效果如图5.3所示：

图5.3 文章信息界面

5.1.4公告信息

在公告信息页面，用户可以查看标题、封面、简介、内容，公告信息效果如图5.4所示：

图5.4公告信息界面

5.1.5我的

   在我的页面，用户可以对用户信息、文章信息、积分申请、活动参与、我的收藏管理、留言板等内容进行相应的操作，具体的实现效果如图5.5所示：

图5.5我的界面

5.1.6用户信息

在用户信息页面，学生可以对学号、密码、学生姓名、性别、邮箱、手机号码、积分、相片等进行修改，也能点击退出登录退出APP。具体的实现效果如图5.6所示：

图5.6用户信息界面

5.1.7活动信息

在活动信息页面，学生可以查看活动图片、活动名称、活动地点、活动日期、发布日期、注意事项、活动内容等信息，并进行收藏、评论或参与等操作，具体的实现效果如图5.7所示：

图5.7 活动信息界面

5.1.8活动参与

在活动信息页面，点击参与的按钮，通过输入活动名称、活动封面、活动地点、活动日期、学号、学生姓名、申请日期、申请备注等信息进行活动参与的申请，具体的实现效果如图5.8所示：

图5.8活动参与界面

5.1.8留言板

在留言板页面，学生可以查看其他用户的留言内容；点击留言的按钮，通过输入内容和图片进行留言，具体的实现效果如图5.9所示：

图5.9留言板界面

5.2 Web端后台——管理员功能模块

Web后台端是管理员进行登录，能够在这里看到学生的信息，对活动信息、请假信息、文章信息、考勤信息、轮播图、留言板、公告信息等进行相关的操作。

5.2.1管理员登录

管理员输入用户名、密码，选择登录角色后可以今天后台系统，进行相应操作，如图5.10所示

图5.10管理员登录

5.2.2管理员功能

    管理员登录到文明礼仪监管系统后台后，可以对个人中心、学生管理、文章信息管理、积分申请管理、活动信息管理、活动参与管理、通知信息管理、留言板管理、系统管理等进行操作，效果如图5.11所示。

图5.11管理员功能界面

5.2.3学生管理

   在学生管理页面，可以对学号、学生姓名、性别、邮箱、手机号码、积分、相片等进行详情、通知。修改、删除或新增等操作；点击通知的按钮，通过输入通知标题、学号、学生姓名、发生日期、通知内容等进行通知，具体的实现效果如图5.12所示。

图5.12学生管理及信息通知界面

5.2.4文章信息管理

   在文章信息管理页面，可以对文章标题、文章封面、学号、学生姓名、发布日期、审核回复、审核状态、审核等进行审核、详情、查看评论、修改、删除或审核等操作，具体的实现效果如图5.13所示。

图5.13 文章信息管理界面

5.2.5积分申请管理

   在积分申请管理页面，可以对文章标题、文章封面、申请分数、申请日期、学号、学生姓名、审核回复、审核状态、审核等进行详情、删除、审核等操作，具体的实现效果如图5.14所示。

图5.14 积分申请管理界面

5.2.6活动信息管理

   在活动信息管理页面，可以对活动名称、活动封面、活动地点、活动日期、发布日期等进行详情、修改、查看评论、删除或新增等操作，具体的实现效果如图5.15所示。

图5.15活动信息管理界面

5.2.7活动参与管理

   在活动参与管理页面，管理员可以对活动名称、活动封面、活动地点、活动日期、学号、学生姓名、申请日期、审核回复、审核状态、等进行审核、详情、删除等操作，具体的实现效果如图5.16所示。

图5.16活动参与管理界面

5.2.8系统管理

    在系统管理页面，管理员可以对轮播图和公告信息进行相应操作，效果如图5.17所示。

图5.17系统管理界面

Node.js毕设帮助，指导，源码获取，调试部署