【2024 DigiKey 创意大赛】基于Raspberry Pi 5的植物生长监管系统—3、Web页面

Wenyou

【2024 DigiKey 创意大赛】基于Raspberry Pi 5的植物生长监管系统—3、Web页面 [复制链接]

 

时隔近一月，今天我来分享Web管理页面部分的内容。Web页面采用Flask框架，通过flask_login实现登录与权限验证，通过flask_sqlalchemy管理数据库，通过dash将数据绘制为图表……这部分内容太多，且为纯Web开发相关。因此代码便不详细一一介绍，感兴趣可以获取后续上传的源代码。下面直接看成果吧。

登录页：

首页：

 

统计页：

设置页：

主要讲解一下各个页面的功能，登录页顾名思义，用于登录系统，输入正确账号密码即可进入系统。

登录成功后进入首页，首页为系统的主要展示页。最上方是提示信息，接着是头像和系统名称。

绿色一行为导航栏，用于切换系统页面。

三个蓝色框分别为数据展示、指示灯和开关，鼠标悬停即可查看对应图标的注释。

数据展示框中展示当前ESP32通过传感器获取到的温度、湿度和光照强度数据、每隔数秒自动刷新。

指示灯框中为当前模块的实时状态，如果有状态变化，相应指示灯会变亮。

开关用于改变对应模块状态，可以控制水阀和补光灯的开启和关闭。

最下面是视频监控部分，红色方框为摄像头的开关，同时摄像头会每隔一定时间自动保存一张图片，可用于生成延时GIF图片。

切换到统计页。这里可以查看指定时间段内选中字段的数据统计图。

设置页可以修改用户名，并且可以对系统变量进行一些简单设置，例如补光灯和水阀总开关，补光灯阈值，数据展示时从数据库中取值的间隔，首页传感器数据更新间隔等。

Web页面部分的功能暂时就这么多，由于时间关系，先将系统搭建好再开发新的功能。

 

 

 

 

 

 

 

 

Jacktang

结果确实不错，期待续上传的源代码哈

chejm

楼主分享的技术内容确实精彩，希望楼主能提供更详细的相关内容

CoderX9527

楼主，啥时候上传代码捏

Wenyou

CoderX9527 发表于 2024-10-29 19:23 楼主，啥时候上传代码捏

就这两天，发总结帖的时候