三天完成简易移动端成绩管理系统
张*
web前端，jdbc，MySQL，vue
项目描述
使用vue，vant框架 jdbc链接数据库，实现不同角色的成员管理，成绩录入，查询，修改系统
上传时间
2020.09.30
浏览人数
1505人
张*
天津市河东区
Hot:9376
开发项目：web前端
开发环境：WebStorm
开发者：汐ゆゆ
项目详情：
1.界面展示
这次创作的是一个移动端的学生成绩管理系统
分为教师管理端和学生查询端
首页预留了空间 方便替换新闻
模拟真实情况中的管理系统 实现相应的功能
2.功能介绍
应用角色对应教师身份和学生身份
首先是教师身份的介绍
教师进入时选择对应的教师登录界面
进入后需要正确输入信息 才能成功登录
首先先输入一个错误的验证码
这是会弹出验证码错误的提示
再输入一个不存在的用户名
这时显示用户不存在
如果输入错误的密码
显示密码错误
这时再输入正确的信息
登陆成功会显示登陆成功 并跳转到列表管理界面
这里会显示所有学生的成绩信息
教师的功能包括查询，增加，删除，更改学生信息
更改功能
比如现在我们要修改“谢宇”同学的信息
点击对应条目的更改 这时会弹出侧边栏 可以按需修改信息
这是数据库修改之前的数据
我们按需执行修改
修改成功后这条数据已经更新了
同时页面显示的也是最新的数据
新增功能
假如这时转入了新同学 “刘晴”
我们需要增加一条新的数据
点击新增按钮 弹出信息录入界面
然后点击确认
已经显示新增成功了
这时我们再看一眼数据库
这一条新数据已经添加上了
查询功能
查询功能其实一开始进来页面就算是查询了
查询功能和修改整合在一起了
这时我们点一下修改就可以看到刚才“刘晴”同学的详细信息
因为新增的时候为了安全性考虑 密码是随机生成的
这时可以看到密码是7svzdc和刚才的数据库密码是一致的
删除功能
假如这时“老八”同学转学了
需要在管理系统删除这位同学
这时我们点击对应条目的删除按钮
会弹出确认信息 防止误操作
这时页面显示删除成功了
我们再看一眼数据库
在“猪猪”和“刘晴”同学之间的“老八”同学已经被删除了
至此就是完整的教师端管理系统
下面介绍学生端系统
首先学生登录和老师是一样的操作
这里不再赘述
这里以“谢宇”同学为例进行登录操作
正确录入后会跳转到该同学的信息界面
这里只显示该同学自己的成绩以及其他信息
学生角色只能修改密码 不能进行其他操作
我们将密码修改成000000
数据库已经更新成功了
3.功能介绍
这里介绍一下学生端的手机注册功能
注册需要调用阿里云的短信接口
这时手机会受到短信 按短信提示的验证码输入信息
就可以成功注册了
注册成功会跳转到登录界面
数据库已经更新进去了
再介绍一下动态生成验证码
验证码是后台动态生成的 不同的身份
生成的时机不同 存在数据库中 安全系数高
前端则是使用了canvas生成图像
防止复制粘贴和机器人恶意注册
点击验证码时会生成新的验证码
4.总结
这次独立完成了一个简单的javaweb项目
对于前后端的配合 数据库表的设计有了更深的理解
感谢阅读
张*
