APP下载

基于微信小程序的课堂选座系统的设计与实现

2023-05-08魏蒙蔚王芳梁思荷杨焕蔚罗佳龙

电脑知识与技术 2023年9期
关键词:微信小程序课堂

魏蒙蔚 王芳 梁思荷 杨焕蔚 罗佳龙

关键词:微信小程序;课堂;选座;课堂选座;选座系统

0 引言

随着移动通信技术的日渐成熟和智能手机的普及,微信小程序受到大众青睐并且广泛运用到众多领域[1-2]。本文提出一种利用微信小程序进行课堂选座的方案,学生通过微信小程序自主选择课堂座位,教师可获取学生在课堂上的座位表。教师点击座位表上的位置就能看到对应学生的名字,便于教师在授课时与学生进行精确的互动。教师通过课堂座位表認识学生,学生得到关注,从心理上提升了双方的教学体验。

1 系统需求分析

1.1 需求分析

为了更好地设计课堂选座系统,项目团队采用访谈法收集了学生和教师的需求。教师需要导入课程和班级信息,生成课堂,查看学生的课堂座位表,统计历史课堂入座信息。学生根据教师提供的课堂编号进入课堂进行选座,学生能够查看自己的历史课堂信息。

1.2 功能模块划分

通过需求分析可知,课堂选座系统的用户可分为教师和学生两种不同的角色。不同角色的用户将在系统登录模块按照不同的要求进行用户绑定。教师的功能有:1) 设置课程和班级信息,2) 创建课堂,3) 查看实时课堂,4) 查看历史课堂信息。学生的功能有:1) 进入课堂,2) 选座,3) 查看个人历史入座信息。

2 系统设计与实现

2.1 技术选型

微信小程序提供基于微信的表单、导航、地图、媒体和位置等开发组件,使开发者在微信的网页里构建一个HTML5 应用。同时还可以使用微信小程序云开发中提供的许多云函数[3-4]。本系统分为以下3 个部分:

1) 客户端。客户端采用微信小程序,主要结构为WXML+WXSS+JavaScript,其中WXML用来描述页面结构,WXSS用来描述页面的样式和页面的显示。这两者结合在一起实现页面显示,为用户提供良好的体验效果。JavaScript 负责声明并处理数据,响应页面交互事件,对业务进行逻辑处理[5]。

2) 服务器端。后端采用Spring Boot 框架,使用Redis作为缓存。为便于前后端分离的接口测试,还使用了Swagger作为接口文档开发工具。

3) 数据库。为了能让系统更便捷,采用了云上MySQL数据库。

2.2 数据库设计

根据需求分析和功能模块,为本系统的数据库设计了如下7个表,表与表之间的关系见图1。

学生信息表(stu_account表),包含的属性有:用户登录的微信账号stu_wx_id ,学生姓名stu_name ,学生学号stu_id。

教师信息表(teacher_ac⁃count表),包含的属性有:用户登录的微信账号teacher_wx_id,教师姓名teacher_name,教师教职工号teacher_id。

学生班级表(classes) ,包含的属性有:班级名称class_name,课程名称course_name,教师teacher_wx_id,行政班标识符class_id, 学生专业stu_speciality,学生学号stu_id,学生姓名stu_name , 学生序号stu_num。

教师创建的课堂表(class_room_list表),包含的属性有:课程class_id,教室密码class_password,教师名称class_name,课程开启时间start_time,课程结束时间end_time,教室标识符class⁃room_id,教室尺寸classroom_size,教师的teacher_open_id,课程的行政班class_administrative,过道pas⁃sage1,过道passage2,过道passage3,入座时长seat⁃ing_time。

过期的课堂表(class_room_list_expire表),结构和class_room_list表一样,用于历史数据迁移。

学生课堂入座表(seating_record表),包含的属性有:课程编号class_id,教室编号classroom_id,课程名称class_name,学生名字stu_name,学生学号stu_id,学生座位的横坐标x,学生座位的纵坐标y,学生入座时间join_time,学生表现分数performance_score,学生表现良好次数good,学生表现不佳次数bad。

过期的学生课堂入座表(seating_record_expired表),结构和seating_record 表一样,用于历史数据迁移。

2.3 模块设计与实现

1) 用户登录模块。当用户通过微信小程序进入系统时,系统调用云函数getOpenId()登录,获取用户的openId、姓名、token、用户类型等属性值并将其保存在本地缓存中,以方便后续模块的调用。如用户是第一次登录,则跳转到绑定个人信息页面,若不是则跳转到学生主页或教师主页。

2) 用户绑定信息模块。当用户第一次登录时会进入到该模块,用户进入到该模块需要填相应的表单信息。学生用户填入自己的学号和姓名便可绑定;用户教师需经过邮箱验证,教师通过输入教职工邮箱获取验证码并提交验证码方可绑定。用户绑定后跳转到相应的学生主页或教师主页。用户绑定功能流程如图2所示,用户绑定页面如图3所示。

3) 教师导入班级模块。此模块用于教师第一次创建某个课程班级。教师首先填写要创建的课程名称和班级名称,然后导入该课程班级的学生名单。在选择文件时系统首先会判断所选择的文件是不是Ex⁃cel文件,如果是则把所选的文件渲染在页面上,否则弹出选择文件格式错误的警告。在设置好课程班级并导入学生名单后,教师便可从已有的课程班级创建课堂了。选择要创建课堂的课程班级,点击创建按钮,系统会以表单的形式把数据发送给后端,同时会记录创建本次课堂的教师wx_id。在成功创建课程班级之后会向后端再发一次请求,根据教师的wx_id请求创建的对应课堂,然后存入缓存方便后续使用。教师导入班级后点击创建按钮的具体流程如图4所示,教师导入班级页面如图5所示。

4) 教师创建课堂模块。在创建课堂页面可以选择课堂的主题、课程、班级、开始/结束时间、教室类型、教室过道位置、学生入座时间以及课堂密码等信息,选择好之后点击创建。创建成功之后后端就把该教师创建的课堂信息存入数据库。教师创建课堂功能流程如图6所示,教师创建课堂页面如图7所示。

5) 学生加入课堂模块。教师创建课堂并公布课堂ID和密码后,学生便可根据教师提供的课堂ID和密码加入课堂。若学生第一次加入课堂则会提醒学生确认课堂信息,确认无误后跳转到课堂页面。若学生已加入该课堂则直接进入课堂页面。学生加入课堂及确认课堂信息页面如图8所示。

6) 学生入座模块。学生入座模块是在学生加入课堂后进行的。学生应在规定的时间内进入课堂选座(入座),若超出规定时间将无法进入课堂。学生根据自己所坐座位在课堂页面选择对应座位,灰色表示已有其他同学入座,绿色表示可选座位,橙色表示学生已标记自己的座位。图9为学生入座功能流程图,图10为学生入座页面。

7) 教师查看座位表模块。教师可以在课堂页面看到学生入座的实时情况。绿色表示已有同学入座,灰色表示空座位。教师可点击绿色座位查看学生信息,被点击后座位变成橙色,并弹出该学生的详细信息,教师还可在上课过程中对学生的行为进行标记,如图11。

3 结束语

学生课堂选座系统便于教师通过座位表认识课堂上在座的学生。教师还可以根据班级、课程、课堂查看历史选座数据,可以对学生的课堂表现信息进行统计,为课程平时成绩提供参考。在这款学生课堂选座系统的帮助下,教师更加了解学生,学生受到教师关注后更加自信,学生学习的主动性增强。实践表明,学生课堂选座系统能提高师生双方的课堂积极性,使师生关系更加融洽,进而间接地提高教学效果[6-7]。

猜你喜欢

微信小程序课堂
甜蜜的烘焙课堂
美在课堂花开
嘻游课堂
嘻游课堂
当图书馆遇上微信小程序