该项目含有源码、文档、程序、数据库、配套开发软件、软件安装教程。欢迎交流
项目运行
环境配置:
Node.js+ Vscode +Mysql5.7 + HBuilderX+Navicat11+Vue+Express。
项目技术:
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.1系统功能设计
系统的功能设计是整个系统的运行基础,是一个把设计需求替换成以计算机系统的形式表示出来。通过对天气预警系统APP的调查、分析和研究,得出了该网站的总体规划,这是开发设计系统的初步核心。
系统功能结构图如图4-1所示。
![](https://i-blog.csdnimg.cn/blog_migrate/dd5a974cedcabab468cc089d0112ad1c.png)
图4-1系统功能结构图
4.2数据库设计
在整个系统来说,数据库的设计是相当重要的,需要非常仔细去设计。
本系统中涉及的各级权限分别是:
(1)用户登录权限,可以查看系统前台的天气预警信息,修改查看自己的信息,并能修改个人资料,查看给个人收藏信息,还可以看到网站的公告等。
(2)管理员权限,管理员有系统的所有权限,包括用户的管理,可以添加、修改和删除任意权限的用户;还包括发布网站的天气预警信息、网站公告等等。
4.2.1概念结构设计
根据分析系统的数据需求,得到系统的实体属性图。
(1)用户注册E-R图,如图4-2所示:
![](https://i-blog.csdnimg.cn/blog_migrate/bcef5f6e796e60ae017ee2d043c63ef8.png)
图4-2用户注册E-R图
(2)公告信息E-R图,如图4-3所示:
![](https://i-blog.csdnimg.cn/blog_migrate/7d79b567a125d2a56cab321ce9a758fe.png)
图4-3公告信息E-R图
5.1 APP端(用户功能)
用户登录,用户进入app,输入自己的账号和密码进行系统登录操作,如图5-1所示。
![](https://i-blog.csdnimg.cn/blog_migrate/55a88563e7bcf457d0ad1c5b47d36ad4.png)
图5-1登录界面图
用户注册,进入用户注册页面,通过填写用户账号、密码、确认密码、用户姓名、性别、联系方式等信息进行注册操作,如图5-2所示。
![](https://i-blog.csdnimg.cn/blog_migrate/285cf36ac113459ad93415cbe3fe0650.png)
图5-2用户注册界面图
用户登录系统后,可以对首页、天气、我的等内容进行详细操作,如图5-3所示。
![](https://i-blog.csdnimg.cn/blog_migrate/7c280e108812c467571ffd4a1eee6c78.png)
图5-3 app首页界面图
公告信息,在公告信息页面可以查看图片、标题、发布时间、简介、内容等信息,可根据需要进行收藏操作,如图5-4所示。
![](https://i-blog.csdnimg.cn/blog_migrate/1c1230089c9828fe69dd8ac0f3584fb6.png)
图5-4公告信息界面图
用户,在我的页面可以对公告信息、我的收藏管理等详细信息进行操作,如图5-5所示。
![](https://i-blog.csdnimg.cn/blog_migrate/97ce4788d5e80a04465df0cdbfb95927.png)
图5-5用户功能界面图
用户信息,在用户信息页面通过填写用户账号、密码、用户姓名、性别、联系方式、头像等信息进行保存或退出登录操作,如图5-6所示。
![](https://i-blog.csdnimg.cn/blog_migrate/c21fecfd7b7411ddeeb53d3ea5e59828.png)
图5-6用户信息界面图
5.2后端管理员功能模块
管理员登录,管理员通过输入用户名,密码,点击登录进入系统操作进行操作,如图5-7所示。
![](https://i-blog.csdnimg.cn/blog_migrate/8f56b905a884565450d14661f5f2254c.png)
图5-7管理员登录界面图
管理员登录系统后,可以查看首页、个人中心、用户管理、公告信息管理、系统管理等功能,还能对每个功能逐一进行相应操作,如图5-8所示。
![](https://i-blog.csdnimg.cn/blog_migrate/f31fad30a299f11b61be919cb652588c.png)
图5-8管理员功能界面图
用户管理,在用户管理页面可以对索引、用户账号、用户姓名、性别、联系方式、头像等内容进行详情,修改或删除等操作,如图5-9所示。
![](https://i-blog.csdnimg.cn/blog_migrate/e3f90f0aafe411716a6133673cd31c9a.png)
图5-9用户管理界面图