基于Vue+Nodejs实现宿舍管理系统

?
作者主页:

?简介:Java领域优质创作者、CSDN博客专家? Java项目、简历模板、学习资料、面试题库、技术互助

文末获取源码

?

项目编号:BS-QD-002

主要需求:

  • 学生信息录入、修改、删除、查询
  • 宿舍管理评分
  • 学生早起率、懒床率
  • 学生宿舍打扫频率
  • 学生晚归情况
  • 楼层管理

考虑到实用性,该系统需要拆分为两大子系统,一个是学生端系统,一个是后台管理端系统。学生端系统主要提供给学生使用,负责一些宿舍记录及个人信息记录的基本操作;后台管理模块则是主要负责对所有学生信息的整理,提供宿舍管理、楼层管理、数据查看等权限,提供给宿舍管理员使用的。

学生登陆

学生系统拥有以下功能:

  • 创建账户
  • 分配宿舍
  • 填写个人信息
  • 修改个人信息
  • 起床打卡(用于统计懒床率)
  • 归宿登记(用于统计晚归情况)
  • 打扫记录(用于统计宿舍打扫频率)
  • 查看宿日常数据

管理员登陆

管理系统拥有以下功能:

  • 楼层管理
  • 宿舍评价
  • 宿舍信息管理
  • 学生信息查看
  • 保洁人员管理
  • 统计学生早起率
  • 统计学生宿舍打扫频率
  • 统计学生晚归

超级管理员在享有上述管理员同等权限的同时额外拥有如下功能:

  • 创建管理员
  • 创建宿舍楼
  • 为宿舍楼分配管理员
  • 为宿舍楼分配保洁人员

前端:

  • Vue 作为基础框架
  • vue-router 控制路由(hash 模式)
  • vuex 状态管理
  • axios 接入数据
  • Vue-element-admin 作为基础框架

后台(Nodejs):

  • Koa 作为基础框架
  • koa-router —— 服务端路由控制
  • koa-static —— 读取静态文件
  • koa-jwt —— JWT 登录校验
  • koa-body —— http body 数据处理
  • koa-compress —— Gzip 压缩
  • koa-cors —— CORS 解决跨域问题
  • sequelize —— ORM

数据库:

  • MySQL

数据库设计一览:

下面展示一下系统的部分功能:

仪表盘概揽:选择不同的宿舍楼查看相关信息

管理员管理:

宿舍楼管理

楼层管理

宿舍信息

宿舍入住学生信息

查看学生起床记录

查看学生归宿信息

查看学生宿舍打扫信息

查看个人信息

学生注册

注册后登陆系统

入住宿舍

起床打卡

归宿记录

打扫记录

后端工程:

  • 1
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
宿舍管理系统是一个比较综合的系统,需要涉及到前端、后端、数据库等多个方面。下面是一个基于Vue和Springboot的宿舍管理系统的搭建步骤: 1. 环境搭建 首先需要安装好Node.js和Java开发环境,以及MySQL数据库。 2. 前端搭建 使用Vue-cli创建一个Vue项目,安装Vue-router和Axios等必要的依赖。在src目录下创建components、views、router、store等文件夹,分别存放组件、页面、路由和状态管理相关文件。 3. 后端搭建 使用Spring Initializr创建一个Springboot项目,选择必要的依赖,如Spring Web、Spring Data JPA、MySQL Driver等。在src目录下创建entity、repository、service、controller等文件夹,分别存放实体类、数据访问层、服务层和控制层相关文件。 4. 数据库设计 根据宿舍管理系统的需求,设计数据库表结构,如宿舍楼信息表、宿舍信息表、学生信息表等。 5. 前后端交互 使用Axios在前端与后端进行数据交互,使用Vue-router实现页面跳转。 6. 前端界面设计 根据需求设计前端页面,如登录页面、宿舍楼信息管理页面、宿舍信息管理页面、学生信息管理页面等。 7. 后端接口设计 设计后端接口,如登录接口、宿舍楼信息管理接口、宿舍信息管理接口、学生信息管理接口等。使用@RestController注解实现控制层,使用@Service注解实现服务层,使用@Repository注解实现数据访问层。 8. 系统测试 完成前后端搭建后,进行系统测试,测试系统的功能是否正常。 以上是一个基于Vue和Springboot的宿舍管理系统的搭建步骤,具体实现还需根据需求进行具体开发。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值