基于springboot vue在线学籍管理系统设计与实现

博主介绍:专注于Java(springboot ssm 等开发框架) vue .net php python(flask Django) 小程序 等诸多技术领域和毕业项目实战、企业信息化系统建设,从业十五余年开发设计教学工作

☆☆☆ 精彩专栏推荐订阅☆☆☆☆☆不然下次找不到哟

我的博客空间发布了1400+毕设题目 方便大家学习使用

感兴趣的可以先收藏起来,还有大家在毕设选题,项目以及论文编写等相关问题都可以给我留言咨询,希望帮助更多的人

系统实现预览

系统设计

4.1系统总体设计

在线学籍管理系统的建设可以为在线学籍管理提供帮助,通过对一些基础信息管理实现针对性的安排,可以按照用户的角色权限使不同用户角色看到不一样的信息界面。现根据需求阶段的分析,我们可以大致确定系统需要包含的功能如下图所示:

系统总体结构图如下,见图4-1。

图4-1系统总体结构图

4.2数据库设计

数据库能直观反映表现系统的需求,数据库的设计能否切实符合系统的需求关系到整个系统最终的呈现结果。通过之前的分析梳理,明确了系统中需要包含的功能和要求。系统中除了涉及对数据库的增加、删除、查寻、修改的基础操作较多,还要理清实体间的对应关系,据此完成表结构的设计与实现。

4.2.1 数据库逻辑设计

为了更直观阐明数据库的设计,使用 Vision 绘制的在线学籍管理系统数据模型E-R实体属性图。根据系统需求设计了以下几个主要实体。

课程信息实体属性图,如图4-2所示。

图4-2课程信息实体属性图

班级信息实体属性图,如图4-3所示。

图4-3班级信息实体属性图

学生学籍实体属性图,如图4-4所示。

图4-4学生学籍实体属性图

学生成绩实体属性图,如图4-5所示。

图4-5学生成绩实体属性图

4.2.2数据库表设计

在关系数据E-R图中,分析并创建数据表,数据表用来记录信息,数据表关系由多个数据表组成,下面介绍的是数据表各个字段信息如下表所示。

表4-1:token表

|---------------|-----------|-----|------|----|-------------------|
| 字段名称 | 类型 | 长度 | 字段说明 | 主键 | 默认值 |
| id | bigint | | 主键 | 主键 | |
| userid | bigint | | 用户id | | |
| username | varchar | 100 | 用户名 | | |
| tablename | varchar | 100 | 表名 | | |
| role | varchar | 100 | 角色 | | |
| token | varchar | 200 | 密码 | | |
| addtime | timestamp | | 新增时间 | | CURRENT_TIMESTAMP |
| expiratedtime | timestamp | | 过期时间 | | CURRENT_TIMESTAMP |

表4-2:课程信息

|------------------|-----------|------------|------|----|-------------------|
| 字段名称 | 类型 | 长度 | 字段说明 | 主键 | 默认值 |
| id | bigint | | 主键 | 主键 | |
| addtime | timestamp | | 创建时间 | | CURRENT_TIMESTAMP |
| kechengmingcheng | varchar | 200 | 课程名称 | | |
| fengmian | longtext | 4294967295 | 封面 | | |
| keshi | varchar | 200 | 课时 | | |
| banji | varchar | 200 | 班级 | | |
| zhuanye | varchar | 200 | 专业 | | |
| shangkedidian | varchar | 200 | 上课地点 | | |
| shangkeshijian | longtext | 4294967295 | 上课时间 | | |
| xueqi | varchar | 200 | 学期 | | |
| nianxian | varchar | 200 | 年限 | | |
| kechengxiangqing | longtext | 4294967295 | 课程详情 | | |
| jiaoshigonghao | varchar | 200 | 教师工号 | | |
| jiaoshixingming | varchar | 200 | 教师姓名 | | |

表4-3:教师

|-----------------|-----------|------------|------|----|-------------------|
| 字段名称 | 类型 | 长度 | 字段说明 | 主键 | 默认值 |
| id | bigint | | 主键 | 主键 | |
| addtime | timestamp | | 创建时间 | | CURRENT_TIMESTAMP |
| jiaoshigonghao | varchar | 200 | 教师工号 | | |
| mima | varchar | 200 | 密码 | | |
| touxiang | longtext | 4294967295 | 头像 | | |
| jiaoshixingming | varchar | 200 | 教师姓名 | | |
| xingbie | varchar | 200 | 性别 | | |
| lianxidianhua | varchar | 200 | 联系电话 | | |
| youxiang | varchar | 200 | 邮箱 | | |

表4-4:配置文件

|-------|---------|-----|--------|----|-----|
| 字段名称 | 类型 | 长度 | 字段说明 | 主键 | 默认值 |
| id | bigint | | 主键 | 主键 | |
| name | varchar | 100 | 配置参数名称 | | |
| value | varchar | 100 | 配置参数值 | | |

表4-5:班级信息

|-----------------|-----------|-----|------|----|-------------------|
| 字段名称 | 类型 | 长度 | 字段说明 | 主键 | 默认值 |
| id | bigint | | 主键 | 主键 | |
| addtime | timestamp | | 创建时间 | | CURRENT_TIMESTAMP |
| banjimingcheng | varchar | 200 | 班级名称 | | |
| banjirenshu | varchar | 200 | 班级人数 | | |
| yuanxiao | varchar | 200 | 院校 | | |
| zhuanye | varchar | 200 | 专业 | | |
| jiaoshigonghao | varchar | 200 | 教师工号 | | |
| jiaoshixingming | varchar | 200 | 教师姓名 | | |

表4-6:专业

|---------|-----------|-----|------|----|-------------------|
| 字段名称 | 类型 | 长度 | 字段说明 | 主键 | 默认值 |
| id | bigint | | 主键 | 主键 | |
| addtime | timestamp | | 创建时间 | | CURRENT_TIMESTAMP |
| zhuanye | varchar | 200 | 专业 | | |

表4-7:院校

|----------|-----------|-----|------|----|-------------------|
| 字段名称 | 类型 | 长度 | 字段说明 | 主键 | 默认值 |
| id | bigint | | 主键 | 主键 | |
| addtime | timestamp | | 创建时间 | | CURRENT_TIMESTAMP |
| yuanxiao | varchar | 200 | 院校 | | |

表4-8:学生学籍

|------------------|-----------|------------|------|----|-------------------|
| 字段名称 | 类型 | 长度 | 字段说明 | 主键 | 默认值 |
| id | bigint | | 主键 | 主键 | |
| addtime | timestamp | | 创建时间 | | CURRENT_TIMESTAMP |
| xuehao | varchar | 200 | 学号 | | |
| xueshengxingming | varchar | 200 | 学生姓名 | | |
| xingbie | varchar | 200 | 性别 | | |
| banji | varchar | 200 | 班级 | | |
| zhuanye | varchar | 200 | 专业 | | |
| shoujihaoma | varchar | 200 | 手机号码 | | |
| zhuzhi | varchar | 200 | 住址 | | |
| jiguan | varchar | 200 | 籍贯 | | |
| zhengzhimianmao | varchar | 200 | 政治面貌 | | |
| ruxueriqi | date | | 入学日期 | | |
| danganwenjian | longtext | 4294967295 | 档案文件 | | |
| gerenjianjie | longtext | 4294967295 | 个人简介 | | |
| jiaoshigonghao | varchar | 200 | 教师工号 | | |

表4-9:学生成绩

|------------------|-----------|-----|------|----|-------------------|
| 字段名称 | 类型 | 长度 | 字段说明 | 主键 | 默认值 |
| id | bigint | | 主键 | 主键 | |
| addtime | timestamp | | 创建时间 | | CURRENT_TIMESTAMP |
| kechengmingcheng | varchar | 200 | 课程名称 | | |
| xueqi | varchar | 200 | 学期 | | |
| nianxian | varchar | 200 | 年限 | | |
| chengji | float | | 成绩 | | |
| xuehao | varchar | 200 | 学号 | | |
| xueshengxingming | varchar | 200 | 学生姓名 | | |
| jiaoshigonghao | varchar | 200 | 教师工号 | | |
| jiaoshixingming | varchar | 200 | 教师姓名 | | |

表4-10:学生

|------------------|-----------|------------|------|----|-------------------|
| 字段名称 | 类型 | 长度 | 字段说明 | 主键 | 默认值 |
| id | bigint | | 主键 | 主键 | |
| addtime | timestamp | | 创建时间 | | CURRENT_TIMESTAMP |
| xuehao | varchar | 200 | 学号 | | |
| mima | varchar | 200 | 密码 | | |
| xueshengxingming | varchar | 200 | 学生姓名 | | |
| touxiang | longtext | 4294967295 | 头像 | | |
| xingbie | varchar | 200 | 性别 | | |
| shoujihaoma | varchar | 200 | 手机号码 | | |
| jiguan | varchar | 200 | 籍贯 | | |
| zhuzhi | varchar | 200 | 住址 | | |
| banji | varchar | 200 | 班级 | | |
| zhuanye | varchar | 200 | 专业 | | |

表4-11:用户表

|----------|-----------|-----|------|----|-------------------|
| 字段名称 | 类型 | 长度 | 字段说明 | 主键 | 默认值 |
| id | bigint | | 主键 | 主键 | |
| username | varchar | 100 | 用户名 | | |
| password | varchar | 100 | 密码 | | |
| role | varchar | 100 | 角色 | | 管理员 |
| addtime | timestamp | | 新增时间 | | CURRENT_TIMESTAMP |

4.3本章小结

这一章着重介绍了整个系统的设计流程。确定了系统的功能结构,并在此基础上完成了数据库的设计。

第五章 详细设计与实现

系统用户登录,在登录页面选择需要登录的角色,在正确输入用户名和密码后,进入操作系统进行操作;如图5-1所示。

图5-1系统登录界面

5.1管理员模块实现

管理员进入主页面,主要功能包括对首页、个人中心、学生管理、教师管理、院校管理、专业管理、班级信息管理、课程信息管理、学生成绩管理、学生学籍管理等进行相应操作。管理员主页面如图5-2所示:

图5-2管理员主界面

管理员点击学生管理。在学生页面输入学号和学生姓名进行查询学生列表,并根据需要对学生详情信息进行详情、修改或删除操作;如图5-3所示:

图5-3学生管理界面

管理员点击教师管理。在教师页面输入教师工号和教师姓名进行查询教师列表,并根据需要对教师详情信息进行详情、修改或删除操作;如图5-4所示:

图5-4教师管理界面

管理员点击院校管理。在院校页面输入院校进行查询院校列表,并根据需要对院校详情信息进行详情、修改或删除操作;如图5-5所示:

图5-5院校管理界面

管理员点击专业管理。在专业页面输入专业进行查询专业列表,并根据需要对专业详情信息进行详情、修改或删除操作;如图5-6所示:

图5-6专业管理界面

管理员点击班级信息管理。在班级信息页面输入班级名称、院校和选择专业进行查询班级信息列表,并根据需要对班级详情信息进行详情、修改或删除操作;如图5-7所示:

图5-7班级信息管理界面

管理员点击课程信息管理。在课程信息页面输入课程名称、班级和专业进行查询课程信息列表,并根据需要对课程详情信息进行详情、修改或删除操作;如图5-8所示:

图5-8课程信息管理界面

管理员点击学生成绩管理。在学生成绩页面输入课程名称和学生姓名进行查询学生成绩列表,并根据需要对学生成绩详情信息进行详情、修改或删除操作;如图5-9所示:

图5-9学生成绩管理界面

大家点赞、收藏、关注、评论啦 其他的定制服务 下方联系卡片↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ 或者私信作者

相关推荐
Backstroke fish2 分钟前
Token刷新机制
前端·javascript·vue.js·typescript·vue
临枫5413 分钟前
Nuxt3封装网络请求 useFetch & $fetch
前端·javascript·vue.js·typescript
RAY_CHEN.4 分钟前
vue3 pinia 中actions修改状态不生效
vue.js·typescript·npm
酷酷的威朗普4 分钟前
医院绩效考核系统
javascript·css·vue.js·typescript·node.js·echarts·html5
_Legend_King13 分钟前
vue3 + elementPlus 日期时间选择器禁用未来及过去时间
javascript·vue.js·elementui
凡人的AI工具箱18 分钟前
15分钟学 Go 第 60 天 :综合项目展示 - 构建微服务电商平台(完整示例25000字)
开发语言·后端·微服务·架构·golang
小码的头发丝、21 分钟前
Spring Boot 注解
java·spring boot
午觉千万别睡过24 分钟前
RuoYI分页不准确问题解决
spring boot
java亮小白199726 分钟前
Spring循环依赖如何解决的?
java·后端·spring
景天科技苑28 分钟前
【vue3+vite】新一代vue脚手架工具vite,助力前端开发更快捷更高效
前端·javascript·vue.js·vite·vue项目·脚手架工具