软件工程02组软件工程组队项目——课程管理小助手界面设计文档

Posted 2020-11-14 bshtdxgb

一、    登录界面

1、界面布局说明：

登录界面

图 1  登录界面

2、使用界面说明

说明：在选择菜单区域进行选择后会在子界面区域显示对应子界面。

图2  使用界面

3、登录界面设计

说明：打开系统所看见的第一个界面。

表1  登录界面设计

信息类型	信息内容	控件类型	备注
输入信息	用户名	文本输入框
输入信息	密码	文本输入框
输入信息	角色	可选下拉栏	有学生，教师，管理员三种身份
人机交互	登录	按钮	若用户名，密码正确，且与角色对应，将跳至对应角色的菜单中。 若不正确，将报错
人机交互	退出	按钮	点击将退出程序

二、    管理员界面设计

1、管理员界面说明

说明：管理员角色使用的界面，通过点击选项可以在界面右侧打开对应子界面，子界面包括添加管理员信息子界面，修改管理员信息子界面，添加学生信息子界面，改学生信息子界面，添加教师信息子界面，修改教师信息子界面。

表2  管理员界面设计

信息类型	信息内容	控件类型	备注
人机交互	用户管理	按钮	打开用户管理二级菜单
人机交互	管理员信息管理	按钮	打开管理员信息管理三级菜单
人机交互	添加管理员信息	按钮	在右侧panel上打开添加管理员信息子界面
人机交互	修改管理员信息	按钮	在右侧panel上打开修改管理员信息子界面
人机交互	学生信息管理	按钮	打开学生信息管理三级菜单
人机交互	添加学生信息	按钮	在右侧panel上打开添加学生信息子界面
人机交互	修改学生信息	按钮	在右侧panel上打开修改学生信息子界面
人机交互	教师信息管理	按钮	打开教师信息管理三级菜单
人机交互	添加教师信息	按钮	在右侧panel上打开添加教师信息子界面
人机交互	修改教师信息	按钮	在右侧panel上打开修改教师信息子界面
人机交互	课程管理	按钮	打开课程管理二级菜单
人机交互	审核课程	按钮	在右侧panel上打开审核课程子界面
人机交互	修改密码	按钮	在右侧panel上打开修改密码子界面
人机交互	关于	按钮	打开关于子界面
人机交互	退出系统	按钮	结束程序

2、子界面说明

2.1添加管理员信息子界面

表3  添加管理员信息子界面

信息类型	信息内容	控件类型	备注
输入信息	用户名	文本输入框
输入信息	密码	文本输入框
输入信息	验证密码	文本输入框	需与密码保持一致，一确保密码输入争取
人机交互	添加	按钮	若各项输入均正确，添加用户进入数据库，并将角色设为管理员
人机交互	取消	按钮	结束此次添加

2.2修改管理员信息子界面

表4  修改管理员信息子界面

信息类型	信息内容	控件类型	备注
输出信息	管理员信息	表格	显示已有的管理员信息，可以点选
输出信息	用户ID	文本标签	显示被选择的管理员ID
输入信息	用户名	文本输入框	初始显示被选择的管理员用户名，可以修改
输入信息	密码	文本输入框	初始显示被选择的管理员密码，可以修改
人机交互	修改	按钮	将已选中的管理员信息修改为输入信息
人机交互	取消	按钮	结束此次修改

2.3添加学生信息子界面

表5  添加学生信息子界面

信息类型	信息内容	控件类型	备注
输入信息	学生姓名	文本输入框
输入信息	学号	文本输入框
输入信息	密码	文本输入框
输入信息	年级	文本输入框
输入信息	专业	文本输入框
输入信息	性别	单选框
输入信息	出生日期	日期选择框
输入信息	籍贯	文本输入框
人机交互	添加	按钮	若各项输入均正确，添加用户进入数据库，并将角色设为学生
人机交互	取消	按钮	结束此次添加

2.3修改学生信息子界面

表6  修改学生信息子界面

信息类型	信息内容	控件类型	备注
输出信息	学生信息	表格	显示已有的学生信息，可以点选
输出信息	用户ID	文本标签	显示被选择的学生ID
输入信息	学生姓名	文本输入框	初始显示被选择的学生姓名，可以修改
输入信息	学号	文本输入框	初始显示被选择的学生学号，可以修改
输入信息	密码	文本输入框	初始显示被选择的学生密码，可以修改
输入信息	年级	文本输入框	初始显示被选择的学生年级，可以修改
输入信息	专业	文本输入框	初始显示被选择的学生专业，可以修改
输入信息	性别	单选框	初始显示被选择的学生性别，可以修改
输入信息	出生日期	日期选择框	初始显示被选择的学生出生日期，可以修改
输入信息	籍贯	文本输入框	初始显示被选择的学生籍贯，可以修改
人机交互	修改	按钮	将已选中的学生信息修改为输入信息
人机交互	取消	按钮	结束此次修改

2.4添加教师信息子界面

表7  添加教师信息子界面

信息类型	信息内容	控件类型	备注
输入信息	教师姓名	文本输入框
输入信息	用户名	文本输入框
输入信息	密码	文本输入框
输入信息	Email	文本输入框
输入信息	所在院系	文本输入框
输入信息	性别	单选框
人机交互	添加	按钮	若各项输入均正确，添加用户进入数据库，并将角色设为教师
人机交互	取消	按钮	结束此次添加

2.5修改教师信息子界面

表8  修改教师信息子界面

信息类型	信息内容	控件类型	备注
输出信息	教师信息	表格	显示已有的教师信息，可以点选
输入信息	教师姓名	文本输入框	初始显示被选择的教师姓名，可以修改
输入信息	用户名	文本输入框	初始显示被选择的教师用户名，可以修改
输入信息	密码	文本输入框	初始显示被选择的教师密码，可以修改
输入信息	Email	文本输入框	初始显示被选择的教师Email，可以修改
输入信息	所在院系	文本输入框	初始显示被选择的教师所在院系，可以修改
输入信息	性别	单选框	初始显示被选择的教师性别，可以修改
人机交互	修改	按钮	将已选中的教师信息修改为输入信息
人机交互	取消	按钮	结束此次修改

2.6课程管理界面

表9  课程管理界面

信息类型	信息内容	控件类型	备注
输入信息	课程名称	文本输入框
输入信息	上课周次	文本输入框
输入信息	课程简介	文本输入框
人机交互	添加	按钮	添加该课程到系统中，经由管理员审核
人机交互	取消	按钮	结束此次添加操作

2.7修改密码

表10  修改密码界面

信息类型	信息内容	控件类型	备注
输入信息	用户名	文本输入框
输入信息	原密码	文本输入框
输入信息	新密码	文本输入框
人机交互	修改	按钮	若各项输入均正确，修改用户账号密码，并将修改后的密码存入数据库
人机交互	取消	按钮	结束此次添加操作

2.8关于

表11  关于界面

信息类型	信息内容	控件类型	备注
输出信息	系统相关	文本标签	包含软件相关内容，如版本号，制作人员等，供用户阅读
人机交互	关闭	按钮	关闭当前页面，返回上一级

三、    学生界面设计

1、学生界面设计

表13  学生界面设计

信息类型	信息内容	控件类型	备注
输入信息	无
输出信息	无
人机交互	课程管理	按钮	打开课程管理二级菜单
人机交互	选择/退选课程	按钮	展示已选课表、待加入课程
人机交互	查询课程	按钮	展示课表、可选择课程
人机交互	成绩管理	按钮	打开成绩管理二级菜单
人机交互	我的成绩单	按钮	显示已选课程成绩单
人机交互	修改密码	按钮	跳转账户管理界面改密码
人机交互	关于	按钮	展示软件版本信息
人机交互	退出系统	按钮	关闭系统

四、    教师界面设计

1、教师界面设计

表14  教师界面设计

信息类型	信息内容	控件类型	备注
输出信息	无
输入信息	无
人机交互	课程管理	按钮	打开课程管理二级菜单
人机交互	开设课程	按钮	开设一门新课程
人机交互	查询课程	按钮	展示已有课程
人机交互	成绩管理	按钮	打开成绩管理二级菜单
人机交互	录入成绩	按钮	输入学生考试成绩
人机交互	修改成绩	按钮	修改学生考试成绩
人机交互	查询成绩	按钮	展示开设课程成绩单
人机交互	修改密码	按钮	跳转账户管理界面改密码
人机交互	关于	按钮	展示相关信息
人机交互	退出系统	按钮	关闭系统