SCI论文（www.lunwensci.com）:
摘要：随着信息化技术和网络技术的发展,数字档案管理系统己经广泛应用于档案管理工作中[1]。基于线下管理的传统管理模式已经无法满足当前社会的需求和操作。本文针对这一问题设计出基于Vue框架的高校档案管理系统,其采用SpringBoot+Vue+MyBatis-Plus进行实现与部署。本系统的应用提高了高校的信息共享与无纸化办公,为各大高校的学生管理工作提供了便捷可行的思路。
关键词：SpringBoot；JavaEE；档案管理；系统设计
University Archives Management System Based on Vue.js
LIU Bing1,JIA Ziyan1,SUN Hualin2
(1.Jiangsu Institute of Technology,Changzhou Jiangsu 213001;2.Changzhou Electromechanical Vocational and Technical College,Changzhou Jiangsu 213164)
【Abstract】：With the development of information technology and network technology,digital archives management system has been widely used in archives management.The traditional management mode based on offline management can no longer meet the needs and operations of the current society.Aiming at this problem,this paper designs a college archives management system based on Vue framework,which is implemented and deployed by SpringBoot+Vue+MyBatis-Plus.The application of this system improves the information sharing and paperless office in Colleges and universities,and provides a convenient and feasible way of thinking for the management of students in Colleges and universities.
【Key words】：SpringBoot;JavaEE;archives management;system design
0引言
在当今的互联网发展过程中,软件开发飞速前进与创新,各种各样的管理系统应用到了人们生活的方方面面。然而对于当今高校档案管理系统而言,高校对学生档案的管理效率是非常的低,甚至无法进行全面的管理。这不仅会影响高校的学生工作效率,还会降低高校行政部门的资源利用率。因此本文设计一款基于Vue.js的高校档案管理系统,其具有课程信息管理、学生信息管理、奖罚信息管理、成绩信息管理等。通过本系统的应用,实现高校学生档案的精准部署。基于Vue.js的高校档案管理系统有望改变传统纸质档案管理的弊端,以满足日益增长的高校档案数据保护与共享的需求[2]。
1高校档案管理系统技术介绍
1.1 SpringBoot框架介绍
SpringBoot框架是Pivotal团队于2013年提出的一种全新框架模式,其最初设计目的是为了简化Spring应用的初始化搭建与开发过程。该框架内部使用yml配置文件方式进行项目部署,从而简化开发人员的样板化配置。SpringBoot不仅继承了Spring框架原有的特性,还通过集成大量的框架来降低版本的冲突与性能问题。SpringBoot具有的特征有：(1)简化开发人员编码量：通过pom文件中添加相应依赖即可集成相应框架。(2)配置文件简单化：SpringBoot与Spring不同的是,其采用Java Config的方式进行配置文件的管理。(3)部署方式快速化：SpringBoot内部集成Tomact插件,仅需项目打包后既可一键启动服务。(4)监控过程便捷化：其内部虽然没有提供服务发现与注册的配套功能,但与Spring Cloud一起配合使用具有相得益彰的效果。此外SpringBoot中具有自动化配置的注解,例如Configuration、Conditional OnBean、EnableConfigurationProperties等,其大大降低开发的难易程度,加快项目的成型进度。
1.2 Vue介绍
Vue是一套用于构建用户前端页面的渐进式体系架构,JS是其开发的灵感来源[3]。与其他架构不同的是,其设计的过程是可以自底向上逐层增量开发。Vue的核心是处理视图层,不仅容易上手操作,还便捷的与第三方库进行整合。在Vue内部采用响应式数据绑定进行页面渲染,双向数据同步后利用ES6的代理数据对其进行监控操作。Vue具有的特点有：(1)模板简洁化：其采用HTML+JSON数据的形式进行页面展现。(2)以数据为驱动：自动追踪依赖的模板表达式与属性值。(3)页面组件化：以解耦合、可复用的组件类型渲染界面。(4)快速响应：精确且有效进行异步操作DOM更新处理。此外内部具有的可扩展数据绑定机制、原生对象模型、组件化UI构建和多轻量库的组合使用深受开发人员的喜爱。
2高校档案管理系统的设计
该系统采用了B/S模式的三层整体架构,有效实现了网络化的无纸化办公[4]。其主要有前端页面与后台服务所组成。本系统前端页面功能有用户注册、用户登录、学生基本信息展现、课程学业信息展现、竞赛活动信息展现、档案归档与入库查看等基本页面。后台服务具有对学生档案、就业与发展、归档档案等增删改查操作与登录验证。
本系统设计过程中严格按照MVC设计模式进行部署。MVC模式通过业务逻辑、数据、界面显示分离的方法组织代码,将业务逻辑聚集到一个部件里面,在改进和个性化定制界面及用户交互的同时,不需要重新编写业务逻辑[5]。前端页面使用Vue架构,当访问页面的同时发出回调函数以获取用户数据。后台服务使用SpringBoot架构集成多个插件进行整合,在yml配置文件中设置相应配置。其中Controller层中放置控制器,用于Vue前端Ajax回调函数的数据传递；Service作为服务层对需要完成的业务逻辑进行控制；Mapper层则为数据持久层,完成Service层分配的相应任务并返回数据以响应页面操作。
本次基于Vue.js的高校档案管理系统实现流程如下：用户访问页面后先通过Ajax发送响应请求,后台服务器检测到请求路径后通过核心控制器进行路径校验,校验通过后调用请求解析器对请求路径进行解析,通过SpringBoot的RrestController注解匹配符合Restful风格的路径,后调用Spring中Bean对象的业务层,实现数据持久层的数据操作,最后按照响应的结果跳转到相应页面。
3高校档案管理系统主要功能的实现
3.1学生模块实现
(1)用户登录功能。学生通过URL进入本系统的登录页面,如图1所示,在登录页面中需要使用高校已录入的学生信息进行账号登录。学生输入账号和密码后首先进行JS验证,通过后Vue调用Ajax的Post请求对账号密码进行验证。Controller层扫描到login.action请求后进行相应数据处理,最终返回信息。
若登录账号与密码正确则进入所属学生页面,否则返回登录页面并提示错误信息。登录后方可修改个人信息及登录密码。在后台管理系统中可进入基本信息页面、课程学业信息页面、活动竞赛信息页面、就业与发展页面、档案建目页面、奖惩信息页面与投诉和建议。学生可根据自身需求选择不同的模块进行业务申请操作。
(2)档案查阅功能。档案功能是高校档案管理系统的核心功能,学生模块中主要分为档案建目、档案查询、档案借阅、生成借阅报表、申请借阅档案以及下载档案。当学生在顶岗实习时期,有些企业需要查阅学生的相关档案信息,因此学生可登录本系统点击申请借阅档案进入页面进行档案申请。进入申请页面需填写申请人手机号、证件号、申请理由以及申请时间,如图2所示。
学生填写档案点击提交后,Ajax调用方法将学生填写的数据封装成对象进行数据传输。后台SpringBoot使用RequestBody注解对数据接收,调用Service层的SaveApplication方法进行业务层操作。当数据成功写入到数据库后则返回R对象进行对话框提示。如下所示是本功能Controller层代码：
PostMapping()
public R<String>saveinfo(HttpServletRequest request,RequestBody info infos){
infos.setCreateTime(LocalDateTime.now());
Long userid=(Long)request.getSession().getAttribute("user");
infos.setUserid(empId);
//mybatis-plus提供的新增方法
employeeService.save(infos);
return R.success("档案申请成功！");
}
3.2老师模块实现
(1)班级学生档案管理功能。在老师管理模块中可对老师所带的学生档案进行管理。老师进入后台管理系统后可查阅班级学生的档案信息、成绩信息、修学信息、奖惩信息等。通过下划老师的管理可减轻管理员的工作量。当老师点击班级某一学生的档案后将跳转进入某一学生的档案页面。页面中显示某一学生的修学、成绩、奖惩等信息,如图3所示。
(2)就业与发展信息查看功能。老师可查看所带班级学生的就业与发展信息,更好的了解学生毕业的去向以及发展情况。老师点击就业与发展信息按钮后将跳转进入页面,Vue在默认情况下调用钩子函数发送Ajax请求以获取数据。后台服务器通过LongCheckFilter拦截器获取请求信息并验证用户是否非法访问,当验证无误后按照findAction.action的访问路径映射到对应的控制层。控制层调用业务层的方法查询班级学生信息。核心代码如下所示：
RequestMapping(value="/list",method=RequestMethod.POST)
ResponseBody
public Map<String,Object>getList(Page page,RequestParam(project="project",required=false,defaultValue="")String project){
Map<String,Object>r=new HashMap<String,Object>();
Map<String,Object>q=new HashMap<String,Object>();
q.put("project",project);
q.put("offset",page.getOffset());
q.put("pageSize",page.getRows());
r.put("rows",rubbishCategoryService.
findList(q));
r.put("total",rubbishCategoryService.getTotal(q));
return r;
}
3.3管理员模块实现
(1)档案管理功能。管理员通过正确的账号和密码进入管理员后台,可以对本高校所有学生的基本档案信息进行审核、添加编辑和删除活档案信息、创建和管理课程学业信息、档案归档与入库操作。在档案管理功能中最为主要的是档案归档功能。管理员可以对档案的归档进行审核、档案建目以及提交入库操作,每个功能的实现均需要确保数据的准确性。如图4所示是档案归档页面效果图。
(2)数据统计。管理员作为系统超级用户,可以对当前高校内学生的档案信息进行统计。通过数据统计可以详细了解当前高校的档案情况,更好的为学院的各个管理部门和领导开展学生对口工作。对于档案统计而言将展现高校全日制和非全日制在校人数、档案数据、档案借阅次数、学生发展去向、档案申请情况等。当管理员进入数据统计页面后,Vue将发送Ajax的Get请求进行数据获取。数据持久层获取到数据后将数据进行全面的计算再返回给SpringBoot封装到HttpSession中以响应页面。如图5所示是本次数据统计页面展示图。
4结论
SpringBoot+Vue是现阶段JavaWeb的主流设计,通过本次基于Vue.js的高校档案管理系统的研究和设计能够为各个高校提供一个清晰的档案管理思路。本系统分为老师管理模块、学生模块以及管理员管理模块,可以分层次解决档案管理中存在的问题,更好的服务高校,提高管理层和各领导部门的决策效率,推动我国系统集成化的发展和进步。
参考文献
[1]赵哲.基于区块链的档案管理系统的研究与设计[D].合肥:中国科学技术大学,2018.
[2]王辉,陈博,刘玉祥.基于区块链的人事档案管理系统研究[J].计算机科学,2021,48(S2):713-718.
[3]陈亚军,肖海斌,徐小坤,等.基于Spring Boot和Vue框架的水库水雨情监测系统设计与实现[J].软件,2021,42(9):29-31+41.[
4]李欣.基于数字水印技术的医院电子档案管理系统设计[J].现代电子技术,2020,43(5):78-81.
[5]赵泽云,张弛,张金玉.基于SSM框架的特殊时期学生返校系统的设计与实现[J].软件,2020,41(10):168-170.
关注SCI论文创作发表，寻求SCI论文修改润色、SCI论文代发表等服务支撑，请锁定SCI论文网！
文章出自SCI论文网转载请注明出处：https://www.lunwensci.com/jisuanjilunwen/49206.html
