文田AI 250622

admin · 发表于 2025-6-22 11:25:08

马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。

您需要登录才可以下载或查看，没有账号？立即注册

x

我是一个软件工程师，帮我用python的flask、bootstrap和MQTT等技术编写一个MQTT物联网通讯的网站，程序文件名为：AI_FJMQTT621.py：UI界面设计带有科技感多色彩适合少年儿童使用的风格，字体稍可爱和大一点，互动体验感强的响应式界面，可以让用户直观感受到科技的魅力，。具体结构组成如下：
一、标题：AI赋能_MQTT网站，居中用彩色字体显示，双击标题内容本程序窗口居中弹窗可以进行内容修改。
二、标题下方用竖向tab标签页分开：1、配置参数区域，2、发布操作区域，3、接送区域，4、遥控区域，可以更好的管理界面。
1、服务器配置参数区：输入框4个，名字后面冒号的内容为默认值：
服务器：i.37ck.cn、端口：1883、用户名：37ck、密码：20200808。
把服务器和端口合并为一行；用户名和密码也合并为一行。
连接服务器按钮：点击连接按钮后，程序自动连接MQTT服务器，连接成功后，显示连接成功提示。
断开连接按钮：点击断开按钮后，程序自动断开MQTT服务器，连接断开后，显示连接断开提示。
配置参数开关按钮：点击按钮隐藏配置参数区内容，再次点击按钮则显示各项配置参数区，默认状态为隐藏配置参数区。
2、发布操作区：有2个可编辑的下拉框，名字后面冒号的内容为默认值：
主题：37ck/37创客，该项为下拉框，下拉内容有：37ck/仓门小学、37ck/富教小学、37ck/文田中学、37ck/莘村中学。
指令：AI赋能WEB，该项为下拉框，下拉内容有：上课啦、开灯、关灯、红灯、绿灯、黄灯、喇叭、下课啦、放学啦、课间休息、紧急通知、到安全等待区、正赶往等待车位。
订阅主题按钮：点击按钮订阅服务器的对应主题，订阅成功后显示订阅主题的状态信息在返回框。
发送按钮：点击发送指令信息到服务器的主题上。
3、接送区域有如下内容：
接送下拉框：默认值为：下课啦，下拉框内容项有：上课啦、下课啦、放学啦、课间休息、紧急通知、到安全等待区、正赶往等待车位。
接送区为学生卡片方式横向排列显示学生数据，用不同卡片背景颜色标出男生或女生，随机生成30个学生的数据；不同班级学生用不同背景颜色分组显示；点击卡片任意位置时发送指令到服务器的主题上，发送指令格式为：卡片上班级+学生名字+指令框内容。
4、遥控区域有如下内容：
界面模拟遥控器格式显示，需要有控制按钮：前进、后退、左转、右转、停止、开灯、关灯、红灯、绿灯、黄灯、喇叭、上课啦、下课啦、放学啦、课间休息、紧急通知；点击按钮时以按钮名称为指令发送到物联网服务器的对应主题上。
三、最底部状态区域为发送和返回情况区域，各占50%的宽度，具体如下：
返回框：显示物联网通讯的记录信息，并一直记录下去，最新记录在第一行显示，直到用户点击清空按钮。
发送框：记录发送过的指令，并一直记录下去，最新记录在第一行显示，直到用户点击清空按钮。
四、实时接收弹窗：居中弹窗用来显示当前主题实时接收到信息是的内容，用可爱点的字体和背景颜色显示，加入一个输入框设置显示秒数后自动关闭窗口，默认时间为5秒后自动关闭弹窗。

复制代码

		自动登录	找回密码
密码			立即注册