如何使用ssm实现基于Web的学生宿舍维修服务平台的设计与实现+vue

@TOC

ssm463基于Web的学生宿舍维修服务平台的设计与实现+vue

第1章 绪论

1.1 课题研究背景

现在各行各业都开始采用计算机办公软件来进行协助工作，这样可以更好的提高工作效率，减轻办公人员的工作压力，通过计算机信息化管理，可以使信息长期保存，修改和查找起来更加的方便，对于信息资料的核对也更加的精准。虽然现在学校的宿舍维修管理已具规模，已形成流程化管理，但学校存储的宿舍维修量是非常大的，而且信息种类也是非常的多，如果还是传统的人工管理方式进行管理，那么首先对于宿舍维修的查找和安排管理就是一个很大的挑战，但是如果借助于计算机管理软件的出现，可以把学校的宿舍维修全部录入系统里，可以更精准的进行管理，对于故障上报和维修管理是非常方便的，比如直接输入故障编号就可以快速查找到该故障在什么位置。其次还额外加入了学生、维修员权限，学生可以直接通过登录系统就查询故障上报信息并进行故障上报，有问题可以及时沟通，这样就避免了更多问题的发生，同样可以更好的节省时间。维修员可以进行维修后信息的提交。所以说不管是针对学校的管理人员还是对于学生来说，都是非常具有开发价值的。

1.2课题研究现状

在我们国内使用最多的管理系统系列有金盘软件、汇文软件，在国外代表软件有ExLibris和Aleph500。随着人们要求的深入，学生宿舍维修服务平台加入了新的理念，更好的整合了代表管理系统的特点和加入自身特点。现代使用的学生宿舍维修管理平台可以实现信息的快速查找，方便用户寻找需要的信息，并且可以实现线上新闻发布，宿舍的故障上报信息实现信息化管理，防止纠纷的发生。但经过研究，现在的学生宿舍维修管理平台还存在一些问题，比如由于部门不同、负责工作内容不同的原因，很多的数据都是隔离保存的，不能实现共享，这就造成在工作中需要多个部门奔跑；再有现有的学生宿舍维修管理平台功能不完整不能实现宿舍维修的整体业务管理，不能实现宿舍维修管理的整个流程。想要解决这些问题就需要采用先进的理念进行设计，并且深入了解宿舍维修管理的工作内容，采用开放的思路进行设计，最后还需要吸取用户的建议。

1.3课题实现目的和意义

宿舍维修内存储的信息是非常多的，首先对于维修的安排来说就是非常的耗时耗力，对于管理人员来说也是一个非常大的挑战，其次宿舍的故障的数据也是非常的繁杂，而且频次也是非常的高，通过建设的数字化基于Web的学生宿舍维修服务平台解决这个难题，全部把故障上报信息存储到计算机里，实现智能化管理，可以更好的提高工作人员的工作效率。

优质的基于Web的学生宿舍维修服务平台不仅可以单纯的满足学校的日常工作需求，还可以满足学生的需求。可以降低学校工作人员的工作压力，提高效率，最重要的是可以实现学生参与，把工作人员的部分工作分担给学生，使工作人员的工作安排更加合理。本系统可以实现故障报修、维修管理的流程化、信息化，使必要信息实现共享。综合来说本系统可以减少工作人员的工作内容，充分体现网络的作用，实现网络资源的利用从而提高学校的档次和使学校的宿舍维修管理工作安排更合理，并且实现服务的多样化、人性化。

1.4课题实现内容

本系统包括管理员和维修员、学生三部分。学生的内容包括个人资料管理、故障上报管理以及浏览新闻。学生通过登录后可以在线报修。管理员负责新闻信息管理、故障上报信息管理、学生信息管理，维修员可以查询故障上报信息并完成维修。

1.5论文结构安排

本篇论文按照系统开发的生命周期进行撰写，详细描述了本系统从调研、分析、设计、实现、测试的过程。本论文从课题开发的背景、现状、目的意义开始，介绍了本课题开发的重要性；然后介绍了本课题开发所使用的相关技术和环境等；接着阐述本课题的分析，包括对课题的需求性、可行性、性能方面、功能方面的分析，紧接着设计了系统的功能和建立了系统的数据库，然后进行系统的实现和系统的测试。所以，本篇论文的结构安排为：

1. 绪论，本章包含课题开发背景、现状、目的和意义以及内容；
2. 系统实现的相关技术和环境，对JAVA语言和Mysql数据库进行描述，并对其它相关技术、环境进行描述；
3. 系统分析，针对系统需求分析、系统经济可行性、操作可行性、技术可行性分析，还包括系统的功能、性能、流程进行分析。本章包括各类流程图；
4. 总体设计，描述系统的功能结构和画出系统的功能结构图，描述数据库的设计和画出数据库ER图、数据库表；
5. 系统实现，描述系统的主要功能和进行实现界面的展示；
6. 系统测试，介绍测试的目的、意义、步骤等，着重描述系统的功能测试用例和进行测试总结；

总结

致谢

参考文献

第2章 系统实现的相关技术和环境

2.1UML建模语言介绍

UML建模语言是一个面向对象开发的标准化建模语言，目前作为一个统一的标注在执行，之前各种建模语言都是相互独立的，而通过UML把他们全部联系了起来，这样可以使技术灵活度很大的提高，减少了不必要的差异化。通过UML建模语言可以很大程度的扩宽系统的适用范围。建模语言的作用就是系统开发前期阶段进行可视化演练，先建立好一个动态的模型，这样就可以清晰的展示出来自己要做的系统大致是个什么类型，更能直观的通过图形化进行信息展示。UML建模工具包含很多图形，比如用例图，类图，时序图等各种图形，通过这些图形可以建立各种类之间的联系。UML的开发过程中首先是先对对象进行分析研究，然后进行文档化分析，然后在对面向对象的思想进行细化，然后设计建立设计模型，最后觉得就是通过之前建立的各种模型进行编程，UML已经是形成了一个行业内的工业标准，所以在面对UML的时候不要有任何负担，而且一种辅助工具，对于系统开发阶段是有很大益处的。而通过UML我们接触最多的就是用例图了，用例图主要就是描述出来你打算做什么系统，从而实现什么功能，然后通过用例加权限角色的形式用图形展现出来，而用例部分一般都是用一个椭圆的形状来表示，角色部分用一个人的符号表示，通过箭头的形式把他们进行联系起来。而类图主要就是用一个三层表格图来进行展示，里面内容包含类的名字，类的属性，还有类实现所需要的方法，而把这些类之间存在三种关系，就是关联，泛华和依赖。关联是通过一条实线表示，某个类里的属性引用到另个实体类里，这样就形成一种关联关系，而关联关系也分为两种不同的关系，就是聚合和组合，聚合是通过一个空心菱形框来表示，他的最大特性就是当A的实体部分，也可以当B的实体部分，而组合关系恰恰相反，当作为A的实体后就不能在作为B的实体部分了，组合关系一般是采用实心的菱形框表示，以此来进行他们之间的区别。泛华关系是用空心的三角形来标注，可以看成一种对接口的关联关系。依赖关系是如果建立的一个类进行了改动，那么跟他有关联的其他类都会进行相应的改动，会通过类信息进行发送给其他的类，作为另一个类的数据存储部分，然后进行参数变动。

2.2 Html语言介绍

Html是一种超文本标记语言，经过技术的不断发展，现在已经是html5版本了，html可以结合各种编程语言使用，比如像jsp ，Java等都可以嵌入使用，html的工作原理就是当用户进行信息访问时候，可以借助于浏览器把html代码进行可视化展示，然后显示在浏览器上，所以html主要是网页界面中使用，可以通过div+css等设计界面样式等。因为html是一个静态的网页技术，所以现在一般都不是单独使用，都要结合javascript脚本语言形成动态技术，这样才能实现跟用户的交互，才能满足现代化的需求。

2.3Mysql数据库的介绍

数据库分为很多种，一般有网状型数据库，层次型数据库，关系型数据库和面向对象数据库，而我们经常使用的就都是面向对象的数据库，比如像Mysql ，sql server或者Oracleog。这些数据库可以说是大同小异，采用的都是标准的sql语句格式，可以应用于各种关系型数据库。开发本系统我选用Mysql数据库作为存储方式，因为Mysql数据库体积更小，对硬件要求不高，最重要的还是免费的，直接就可以下载使用。Mysql分为服务端和学生端两部分，可以直接通过学生端Navicat工具进行数据库的管理，数据可以直接进行可视化图形展示，操作起来非常的方便，简单易学，所以非常适合一些中小系统的开发和使用。

第3章 系统分析

3.1系统需求分析

宿舍维修管理是保证学生住宿环境的重要手段，现在学校在管理宿舍维修时通常使用传统方式。传统宿舍维修管理的方式多为手动或者手动加入管理系统，这类管理系统功能单一，需要管理员操作，学生无法参与。这就需要管理员长期站在电脑前，工作效率低下。而本系统可以解放管理员，想要查询维修详情的学生可以自主操作，减少排队，更加满足用户的需求。所以本系统的开发非常需要。

3.2系统可行性分析

3.2.1技术可行性

本系统对硬件和软件方面的要求都不高，目前市场上常见的计算机硬件设备都可以满足开发本系统的需求，而且操作系统win7，win10都可以，也有很好的兼容性，通过Java语言，结合Html等生成动态网页技术，来实现本系统需要的所有功能。Mysql数据库作为系统的数据存储，安全性有足够的保障，而且有好的管理效率，可以直接对数据进行结构化关系化管理，所以开发本系统所采用的所有技术都是可行的。

3.2.2经济可行性

经过前期的考察调研后，本人认为开发本系统不需要有什么大的支出费用，开发本系统只需要有个计算机就可以，而开发过程中所用到的编程软件和画图软件，还有数据库都是直接从官网就行免费下载的，都属于开源的软件，可以免费使用，而且本系统采用的是Mysql数据库，可以直接自己电脑进行维护更新，不需要额外的维护费用，所以在经济上也是可行的。

3.2.3法律可行性

本系统的主题内容是积极向上的，而且开发成功以后还能对社会带来很好经济效益，对社会是有用的，开发本系统的过程中所编写的代码全部是由自己原创的，知识由老师上课所教授的，没有抄袭和借鉴任何别人的系统，所以也不存在侵权行为，所以开发本系统在法律方面也是可行的。

3.2.4操作可行性

开发的时候已经考虑到了，本系统要面向所有的人群，不管是懂计算机操作的，还是不懂的，所以采用的界面设计，简单美观，每个功能按钮都有文字提示，任何人都可以轻松掌握，熟练使用。而且采用的是B/S架构模式，可以直接借助浏览器运行，用户不需要额外安装各种繁琐的软件，直接就能在网页里进行访问，非常的方便，所以本系统在操作上也是可行的。

3.3系统性能分析

性能分析同样重要，系统的性能质量关系着系统的生命周期和受欢迎程度。对于系统的性能分析主要从以下几点来研究：

1. 在系统开发的过程中要用长远的目光看待问题，不能只看当下而减少工作量，考虑系统在未来可能遇到的工作强度，在现阶段尽量提高系统的处理事务的能力和进行信息处理的响应时间；
2. 系统要做到开放性，在设计数据库时要充分考虑到用户信息查询的多样性和变化性，需要对查询条件不断的进行升级、优化。加入简单的扩展配置，使后期系统在升级中可以通过扩展配置进行补充；
3. 在系统开发中尽可能使用熟悉的语法并进行简单标记、注释，方便今后系统的修改和完善，减少后期修改系统时熟悉的时间；
4. 除此之外要注意系统中数据的完整性、准确性和一致性，数据要实现必要的共享和独立。

3.4系统功能分析

本系统的界面分为学生界面和管理员后台界面、维修员界面。维修员界面、管理员界面和学生后台界面需要符合身份的用户通过登录验证后才可以使用。学生可以查询故障上报信息并进行故障上报，可以浏览新闻信息。维修员可以进行故障的维修，管理员负责审核故障上报信息和发布新闻信息以及管理维修员、学生的资料。

学生用例图如下图3.1所示：

图3.1学生用例图

管理员用例图如下图3.2所示：

图3.2管理员用例图

维修员用例图如下图3.3所示：

图3.3维修员用例图

3.5系统流程分析

　　本系统所有的功能使用都基于用户登录后，用户登录时数据流会从登录界面流向用户信息表中，然后数据库进行验证，如果可以找到用户输入的数据则界面就会跳转到登录成功界面，用户就可以在系统里进行操作。操作的数据会流向对应的数据库表中，完成用户的指令，最后将数据流入界面展示给用户。本系统的1层流程图如下图3.4所示：

图3.4系统流程1层图

对系统中信息的流动进行抽象就可以得到数据流程图。数据流程图表达了信息的逻辑模型，用来开发人员和用户进行交流。本系统的流程2层图如下图3.5所示：

图3.5系统流程2层图

对管理员的功能进行分析，得出管理员的信息流动，管理员可以管理故障上报信息、新闻信息、学生信息和维修员信息等。管理员的流程3层图如下图3.6所示：

　　　　　　　　　　　　图3.6管理员数据流程3层图

对学生的功能进行分析，得出学生的信息流动。学生可以管理个人信息和进行故障上报等。学生的数据流程3层图如下图3.7所示：

图3.7学生数据流程3层图

第4章 总体设计

4.1系统目标

本系统旨在达到宿舍维修管理、新闻管理、学生管理、维修员管理、故障上报管理等为一体，为学生和管理员、维修员提供服务。使管理员、维修员更加轻松的进行工作，使学生更加快速的进行信息查询和故障上报。本系统的设计界面丰富，各个模块和按钮明确展示，使所有使用者都可以一目了然，达到人机交互、功能齐全、可扩展的目的。

4.2系统功能设计

根据第三章的功能分析设计出本系统的功能为学生管理、故障上报管理、基础数据管理、教师管理、新闻管理等。本系统的权限分为学生和管理员、维修员三种。界面分为管理员界面和学生界面、维修员界面。本系统的功能结构图如下图4.1所示：

图4.1系统功能结构图

4.3数据库设计

4.3.1数据库概念模型

数据库概念模型表达了数据实体和数据实体的关系等信息，在数据库的概念模型中记录了每个数据库表的字段，通过数据库概念模型可以轻松设计数据库。对系统中的数据信息进行抽象并建模可以完成数据库的概念模型，而数据库的概念模型用ER图来表达。

本系统的主要数据为管理员、学生、故障上报、新闻信息、维修员等。管理员ER图如下图4.2所示：

图4.2管理员ER图

学生数据由管理员和个人管理。学生数据ER图如下图4.3所示：

图4.3学生ER图

故障上报数据由学生发出，维修员维修、管理员审核，故障上报数据ER图如下图4.4所示：

图4.4故障上报ER图

新闻数据由管理员管理，学生和维修员浏览。新闻数据ER图如下图4.5所示：

图4.5新闻ER图

类型信息由管理员管理，类型信息ER图如下图4.6所示：

图4.6类型信息ER图

系统关系ER图如下图4.7所示：

　图4.7系统关系ER图

4.3.2数据库表设计

按照高内聚、低耦合的原则，并考虑到系统后期的扩展问题设计出本系统的数据库表。本系统的数据库表为管理员信息表，学生信息表、故障上报信息表、维修员信息表、新闻信息表等。本基于Web的学生宿舍维修服务平台的数据库表结构如下表4.1-4.9所示：

表4.1 config

表4.2 dictionary

表4.3 forum

表4.4 guzhangshangbao

表4.5 news

表4.6 token

表4.7 users

表4.8 weixiuyuan

表4.9 xuesheng

第5章 系统实现

5.1 JAVA与Mysql数据库连接

数据库建立好后需要和系统连接才可以使系统运行。本系统采用Mysql数据库，在连接时需要设置数据库的服务器名和密码。数据库连接的原理如下图5.1所示：

图5.1 JAVA连接数据库原理

5.2学生身份界面的功能实现

5.2.1用户登录功能的实现界面

　　登录功能是识别身份的唯一途径，本系统中的用户为学生、管理员、维修员。用户在登录时输入的信息需要流入数据库中进行对比。如管理员输入admin admin，数据库则需要对比管理员信息表中是否有admin admin的数据。存在该条数据才可以登录成功，不存在该条数据时会提示错误。用户登录界面的设计效果如下图5.2所示：

图5.2系统用户的登录运行界面

5.2.2 首页功能的实现界面

首页是给人的第一印象，一个好的首页才可以吸引用户。在首页里包括导航栏、相关文字等信息。首页功能的实现界面如下图5.3所示：

图5.3首页展示的效果界面

5.2.3个人资料管理功能的实现界面

学生登录后可以管理自己的资料，学生的资料由注册时设置，后期学生可以自己修改个人资料。学生修改个人资料功能的实现界面如下图5.4所示：

图5.4学生修改个人资料功能的运行界面

5.2.4故障上报功能的实现界面

学生可以查询故障上报详情并可以新增故障上报，还可以输入关键字搜索故障上报详情。故障上报查询功能的实现界面如下图5.5所示：

图5.5故障上报查询功能的实现界面

5.2.5新闻信息功能的实现界面

学生可以查询新闻信息。新闻信息浏览功能的实现界面如下图5.6所示：

图5.6查询新闻信息功能的实现界面

5.3系统后台管理员功能实现

5.3.1学生管理功能的实现界面

　　本功能包括学生用户信息查询、学生用户信息添加和学生用户信息的管理。本功能的设计目的是登记学生信息，方便学生可以使用本系统。查询学生信息功能的实现界面如下图5.7所示：

图5.7查询学生信息功能界面的实现

5.3.2维修员管理功能的实现界面

本功能包括对维修员的添加、删除、修改、查询。添加维修员时填写维修员详情就可以完成，查询维修员时填写查询条件即可以查询出来相对应的维修员。查询维修员信息功能的实现界面如下图5.8所示：

图5.8查询维修员信息功能的实现界面

5.3.3故障上报管理功能的实现

　管理员可以审核故障上报信息并查看维修情况。查询故障上报信息功能的实现界面如下图5.9所示：

图5.9查询故障上报信息功能的实现界面

5.3.4管理员管理功能的实现界面

　　管理员可以审核管理员的信息和添加管理员。管理员查询管理员信息的实现界面如下图5.10所示：

图5.10管理员查询管理员信息功能的实现界面

5.3.5基础数据管理功能的实现界面

基础数据包括故障类型、所在区域类型和新闻类型。管理员可以针对这些信息进行添加和查询、修改。基础数据管理功能的实现界面如下图5.11所示：

图5.11查询基础数据管理功能的实现界面

5.3.6新闻信息管理功能的实现界面

管理员负责新闻信息的发布和删除，管理员查询新闻信息的实现界面如下图5.12所示：

图5.12管理员查询新闻信息的实现界面

5.4维修员功能的实现

维修员可以管理个人信息和进行维修以及浏览新闻。维修员功能的实现界面如下图5.13所示：

图5.13维修员的功能实现界面

WeixiuyuanServiceImpl.java

package com.service.impl;

import com.utils.StringUtil;
import org.springframework.stereotype.Service;
import java.lang.reflect.Field;
import java.util.*;
import com.baomidou.mybatisplus.plugins.Page;
import com.baomidou.mybatisplus.service.impl.ServiceImpl;
import org.springframework.transaction.annotation.Transactional;
import com.utils.PageUtils;
import com.utils.Query;
import org.springframework.web.context.ContextLoader;
import javax.servlet.ServletContext;
import javax.servlet.http.HttpServletRequest;
import com.dao.WeixiuyuanDao;
import com.entity.WeixiuyuanEntity;
import com.service.WeixiuyuanService;
import com.entity.view.WeixiuyuanView;

/**
 * 维修人员 服务实现类
 */
@Service("weixiuyuanService")
@Transactional
public class WeixiuyuanServiceImpl extends ServiceImpl<WeixiuyuanDao, WeixiuyuanEntity> implements WeixiuyuanService {

    @Override
    public PageUtils queryPage(Map<String,Object> params) {
        if(params != null && (params.get("limit") == null || params.get("page") == null)){
            params.put("page","1");
            params.put("limit","10");
        }
        Page<WeixiuyuanView> page =new Query<WeixiuyuanView>(params).getPage();
        page.setRecords(baseMapper.selectListView(page,params));
        return new PageUtils(page);
    }


}

XueshengServiceImpl.java

package com.service.impl;

import com.utils.StringUtil;
import org.springframework.stereotype.Service;
import java.lang.reflect.Field;
import java.util.*;
import com.baomidou.mybatisplus.plugins.Page;
import com.baomidou.mybatisplus.service.impl.ServiceImpl;
import org.springframework.transaction.annotation.Transactional;
import com.utils.PageUtils;
import com.utils.Query;
import org.springframework.web.context.ContextLoader;
import javax.servlet.ServletContext;
import javax.servlet.http.HttpServletRequest;
import com.dao.XueshengDao;
import com.entity.XueshengEntity;
import com.service.XueshengService;
import com.entity.view.XueshengView;

/**
 * 学生 服务实现类
 */
@Service("xueshengService")
@Transactional
public class XueshengServiceImpl extends ServiceImpl<XueshengDao, XueshengEntity> implements XueshengService {

    @Override
    public PageUtils queryPage(Map<String,Object> params) {
        if(params != null && (params.get("limit") == null || params.get("page") == null)){
            params.put("page","1");
            params.put("limit","10");
        }
        Page<XueshengView> page =new Query<XueshengView>(params).getPage();
        page.setRecords(baseMapper.selectListView(page,params));
        return new PageUtils(page);
    }


}

StringUtil.java

package com.utils;

public class StringUtil {

    public  static boolean isEmpty(String s){
        if(s==null || s.equals("") || s.equals("null")){
            return true;
        }
        return false;
    }

    public  static boolean isNotEmpty(String s){
        return !StringUtil.isEmpty(s);
    }
}

http.js

import axios from 'axios'
import router from '@/router/router-static'
import storage from '@/utils/storage'

const http = axios.create({
    timeout: 1000 * 86400,
    withCredentials: true,
    baseURL: '/xueshengshusheweixui',
    headers: {
        'Content-Type': 'application/json; charset=utf-8'
    }
})
// 请求拦截
http.interceptors.request.use(config => {
    config.headers['Token'] = storage.get('Token') // 请求头带上token
    return config
}, error => {
    return Promise.reject(error)
})
// 响应拦截
http.interceptors.response.use(response => {
    if (response.data && response.data.code === 401) { // 401, token失效
        router.push({ name: 'login' })
    }
    return response
}, error => {
    return Promise.reject(error)
})
export default http

声明

本博客适用于广泛的学术和教育用途，包括但不限于个人学习、开发设计，产品设计。仅供学习参考，旨在为读者提供深入理解和学术研究的材料。