基于Vue和SpringBoot的毕业生追踪系统的设计和实现(二)

简介: 基于Vue和SpringBoot的毕业生追踪系统的设计和实现

5.5.2 系统逻辑结构设计

本系统重要数据表的主要逻辑结构设计如下文所示。

6系统实现

6.1登陆注册模块的设计和实现

进入到毕业生追踪管理系统,首先到系统的登录页,用户需要输入登陆账号和登陆密码,并输入图形验证码完成系统登陆。当账户密码错误,或者图形验证码输入错误时,系统将给与相应的错误提示,并拒绝登陆系统,如图6-1所示。

系统也保留了手机验证码登陆的操作界面,但因为手机验证码有经济成本,所以没有实装验证码登陆的功能,手机号登录界面如图6-2所示。

若用户没有账号,可以点击左侧账号的绿色超链接,跳转到注册界面,如图6-3所示。

用户输入正确的账号密码,即可进入到系统首页,如图6-4所示。

登陆核心代码如下:

login({
    username: this.form.username,
    password: this.form.password,
    code: this.form.imgCode,
    captchaId: this.captchaId,
    saveLogin: this.saveLogin
}).then(res => {
    if (res.success) {
        this.afterLogin(res);
    } else {
        this.loading = false;
        this.getCaptchaImg();
    }
});

6.2学生基本配置模块的设计和实现

用户进入系统后,可以进入学生管理模块,可以查看学生的具体列表,如图6-5所示。

用户可以点击添加用户按钮,输入学生信息完成学生的添加,也可以点击编辑按钮更新学生的信息,也可以点击删除按钮,删除学生的信息。

学生管理模块查询核心代码如下:

@RequestMapping(value = "/getByCondition", method = RequestMethod.GET)
@ApiOperation(value = "查询用户")
public Result<IPage<User>> getByCondition(@ModelAttribute User user, @ModelAttribute PageVo page) {
    QueryWrapper<User> userQw = new QueryWrapper<>();
    if(!ZwzNullUtils.isNull(user.getUsername())) {
        userQw.like("username",user.getUsername());
    }
    if(!ZwzNullUtils.isNull(user.getNickname())) {
        userQw.like("nickname",user.getNickname());
    }
    if(!ZwzNullUtils.isNull(user.getMobile())) {
        userQw.like("mobile",user.getMobile());
    }
    if(!ZwzNullUtils.isNull(user.getDepartmentId())) {
        userQw.eq("department_id",user.getDepartmentId());
    }
    if(user.getType() != null) {
        userQw.eq("type",user.getType());
    }
    if(user.getStatus() != null) {
        userQw.eq("status",user.getStatus());
    }
    if(!ZwzNullUtils.isNull(user.getSex())) {
        userQw.eq("sex",user.getSex());
    }
    IPage<User> userData = iUserService.page(PageUtil.initMpPage(page),userQw);
    for(User u: userData.getRecords()) {
        List<Role> list = iUserRoleService.findByUserId(u.getId());
        List<RoleDTO> roleDTOList = list.stream().map(e->{
            return new RoleDTO().setId(e.getId()).setName(e.getName()).setDescription(e.getDescription());
        }).collect(Collectors.toList());
        u.setRoles(roleDTOList);
        entityManager.detach(u);
        u.setPassword(null);
    }
    return new ResultUtil<IPage<User>>().setData(userData);
}

6.3就业状况模块的设计和实现

高校管理员可以进入毕业去向统计页面,查看毕业生的就业去向明细。

在这个模块中,可以预览每位毕业生的毕业去向,比如正常就业、升学等等,如图6-6所示。

点击每一行的查看详细按钮,即可查看详细数据,如图6-7所示。

作为学生,也可以在毕业去向模块中填报自己的去向内容,以便于高校做数据分析,如图6-8所示。

就业去向查询核心代码如下:

@RequestMapping(value = "/getByPage", method = RequestMethod.GET)
@ApiOperation(value = "查询就业状况")
public Result<IPage<EmploymentStatus>> getByPage(@ModelAttribute EmploymentStatus employmentStatus ,@ModelAttribute PageVo page){
    initWork();
    QueryWrapper<EmploymentStatus> qw = new QueryWrapper<>();
    if(employmentStatus.getStatus() != null && employmentStatus.getStatus() > 0) {
        qw.eq("status",employmentStatus.getStatus());
    }
    if(!ZwzNullUtils.isNull(employmentStatus.getUserName())) {
        qw.inSql("id","select id in a_user where nickname like '%" + employmentStatus.getUserName() + "%'");
    }
    IPage<EmploymentStatus> data = iEmploymentStatusService.page(PageUtil.initMpPage(page),qw);
    for (EmploymentStatus status : data.getRecords()) {
        if(!ZwzNullUtils.isNull(status.getUserId())) {
            User user = iUserService.getById(status.getUserId());
            if(user != null) {
                status.setUserName(user.getNickname());
                status.setUserNumber(user.getUsername());
                status.setUserMobile(user.getMobile());
            } else {
                status.setUserName("无");
                status.setUserNumber("无");
                status.setUserMobile("无");
            }
        }
    }
    return new ResultUtil<IPage<EmploymentStatus>>().setData(data);
}

6.4学历深造模块的设计和实现

部分学生在毕业之后选择了升学,所以对这一类学生需要额外分析管理,分析出各个班级、各个专业的考研率、升学率等等,为高校决策出谋划策,如图6-9所示。

设置学历深造模块代码如下:

@RequestMapping(value = "/insert", method = RequestMethod.POST)
@ApiOperation(value = "新增学历生造")
public Result<EmploymentStatus> insert(EmploymentStatus employmentStatus){
    iEmploymentStatusService.saveOrUpdate(employmentStatus);
    return new ResultUtil<EmploymentStatus>().setData(employmentStatus);
}
@RequestMapping(value = "/update", method = RequestMethod.POST)
@ApiOperation(value = "编辑学历生造")
public Result<EmploymentStatus> update(EmploymentStatus employmentStatus){
    iEmploymentStatusService.saveOrUpdate(employmentStatus);
    return new ResultUtil<EmploymentStatus>().setData(employmentStatus);
}

6.5信息汇总分析模块的设计和实现

信息汇总分析模块放置了若干图表,用于对毕业生的去向进行图表分析,可以给管理员更加直观的数据展示,如图6-10、6-11、6-12、6-13所示。

图表核心代码如下:

initAntvFx() {
    var data = this.userData;
    this.stackedBarPlot = new Bar('container', {
        data,
        isGroup: true,
        xField: 'value',
        yField: 'title',
        seriesField: 'type',
        dodgePadding: 4,
        label: {
            position: 'middle', // 'left', 'middle', 'right'
            layout: [
                {
                    type: 'interval-adjust-position'
                },
                {
                    type: 'interval-hide-overlap'
                },
                {
                    type: 'adjust-color'
                },
            ],
        },
    });
    this.stackedBarPlot.render();
},

6.6校友论坛模块的设计和实现

校友论坛模块提供了留言板的功能,毕业生可以在这个模块进行留言互动,增加毕业生之间的联系。

学生可以进入校友论坛模块,进行新增留言,如图6-14所示。

高校管理员可以对学生的评论进行回复,如图6-15所示。

新增留言核心代码如下:

@RequestMapping(value = "/insert", method = RequestMethod.POST)
@ApiOperation(value = "新增留言")
public Result<MessageBoard> insert(@RequestParam String content){
    if(ZwzNullUtils.isNull(content)) {
        return ResultUtil.error("留言不能为空");
    }
    User currUser = securityUtil.getCurrUser();
    MessageBoard messageBoard = new MessageBoard();
    messageBoard.setUserId(currUser.getId());
    messageBoard.setUserName(currUser.getNickname());
    messageBoard.setContent(content);
    messageBoard.setDate(getZwzNowTime());
    messageBoard.setReplyId("");
    if(iMessageBoardService.saveOrUpdate(messageBoard)){
        return new ResultUtil<MessageBoard>().setData(messageBoard);
    }
    return ResultUtil.error();
}

7 系统测试

由于软件开发复杂性的原因,软件开发过程中不可避免的会产生各种错误。为了在软件开发的顺利完成以及在软件投入实际运营之前,尽可能多地发现软件当中的错误,需要尽可能全面地对软件进行测试。目前软件测试仍然是保证软件质量的关键步骤,它是对软件需求分析、设计以及编码的最后的检查。

对应于软件开发的各个过程,软件测试也分为几种不同的层次。每一个层次都是下一层次的继续。

  1. 单元测试,单元测试对应于详细设计部分,从软件的详细设计中导出。软件的独立单元将在与程序的其他部分相隔离的情况下进行测试。
  2. 集成测试,集成测试对应于系统的概要设计,主要用来的是各个模块之间的接口的正确性。
  3. 系统测试,系统测试的目的是通过测试发现是否需求分析中的功能相符。

7.1集成测试

集成测试,也叫组装测试或联合测试。它是在单元测试的基础上,将所有模块按照设计要求组装成为子系统或系统,进行的测试。集成测试应该考虑以下问题有:数据在模块接口之间穿越时是否会丢失;各个子功能组合起来,能否达到预计要求的父功能;模块之间是否会有不良的影响;单个模块中的误差是否会在其他模块中进行放大。合理地组织集成测试,直接影响到模块测试用例的形式、所用测试工具的类型、模块编号和测试的次序、生成测试用例和调试的费用。通常,有两种不同的组装方式:一次性组装方式和增量式组装方式。

本系统中采用 Spring 框架的IOC功能,对相关的模块进行增量式的组装,进行集成测试。首先利用能够实现简单功能的替代类对主流程进行测试,然后用已经开发和测试完成的每一个实际类将替代类替换掉。看看新开发的类是否能够达到预期的目的,有没有什么冲突。对于客户端的 Javascript 页面的测试,采用Firefox浏览器所带的 JavaScript 调试器 Firebug 完成。

解决方法:在相关类中设置一个消息队列进行消息的缓冲,并且将类设置为线程类,这样即使在繁忙时也不会影响到其他操作。

7.2系统测试

系统测试是将已经确认的软件、计算机硬件、外设、网络等其他元素结合在一起,进行信息系统的各种组装测试和确认测试,其目的是通过与系统的需求相比较,发现所开发的系统与用户需求不符或矛盾的地方

系统测试的过程中,由于使用实际车辆进行测试的费用很大,所以利用模拟软件根据通信协议与系统进行通信。这种情况还可以测试大通信量情况下的系统的稳定性。客户端在IE和Firefox下进行分别测试。其测试内容如表7-1所示。

输入服务器的URL地址,自动返回了登录界面。根据测试,利用不同公司账号登录系统,Web客户端只显示和处理被授权管理的资源。图6.1所示为用户进入页面以后的截图。页面的左边显示的是当前能看到的系统资源,其中有背景图等。页面右边利用 JavaScript 生成了几个内置窗口来显示系统信息,当前显示的是一个站点信息。页面右下角有操作的按钮,这里没有显示出来。

7.3测试结论

我采用了黑盒测试和白盒测试的方法,对毕业生追踪管理系统的各大功能模块进行了测试,其中查看毕业生列表当数据量超过1万时加载时间大于3秒,影响了用户的正常使用,还需要进一步完善搜索算法,其他模块的功能能够正常实现,总之毕业生追踪管理系统符合上线要求。

结论

本文提出并设计了毕业生追踪系统,从系统整体结构设计出发,提出了毕业生追踪系统的六大功能模块。最后实现了毕业生追踪系统的开发。

在设计该系统时,主要包括了以下几个工作部分。在设计的初期,搜集比对大量的国内外文献对毕业生追踪系统的现状做了分析,阐述了研究背景和意义,并具体分析了国内外现状的优缺点,同时确立了本次开发所使用的具体技术,阐述了所使用技术的优缺点。

对毕业生追踪系统进行系统需求和功能需求等分析,确定了本系统所具备的功能,同时对系统开发进行可行性分析,确定了本次系统开发的可行性,在此基础上完成了数据库的创建。

在编码实现阶段,使用Idea开发工具完成了编码实现,引入Spring Boot框架简化了WEB的开发,在数据层,使用了MyBatis框架、MySQL,并利用Maven进行管理,前端使用VUE框架进行开发。

本文设计的毕业生追踪系统能够有效满足毕业生的相关需求,流程合理,操作简单,界面简洁美观,适合邮件相关人员的使用,但因个人水平的不足及其他因素,研究仍存在许多问题及不足之处,例如:论文所设计的毕业生追踪系统使用MySQL对系统产出的数据进行存储,但随着后期信息量的不断加大,在性能方面可能会受一定的影响,后期考虑增加缓存来增强数据存储能力。其次,保障毕业生的信息安全也是一重大关键点,毕业生信息安全性问题是极其重要的,本文未对信息的安全性问题展开讨论,要完善该系统,还需要对信息安全问题进行深入探讨,并且,由于系统本身并没有链接到实体高校,所以无法进行现有高校毕业生信息的查询。

参考文献

[1] 齐治昌, 谭庆平, 宁洪. 软件工程[M]. 北京:高等教育出版社, 2004, 04.

[2] 王德永, 张佰慧. 数据库原理与应用----SQL Server版(项目式)[M]. 人民邮电

版社, 2011, 05.

[3] 李武, 刘清梅. 基于B/S模式的大学生就业指导信息系统设计[J]. 2008.

[4] 常中华. 基于WEB的SQL数据库管理系统的设计[J]. 2006.

[5] 屈辉立, 陈可明, 石武信. JSP网站编程教程[M]. 北京希望电子出版社, 2002.

[6] 柏亚军,等. JSP编程基础及应用实例集锦[M]. 人民邮电出版社, 2001.

[7] 邵雨舟. 毕业生就业跟踪系统的设计与实现[J]. 电脑知识与技术, 2019, 15(21):87-89.DOI:10.14004/j.cnki.ckt.2019.2336.

[8] 熊瑛. 高校毕业生就业跟踪调查系统的设计与实现[J]. 信息与电脑(理论版), 2021, 33(17):116-119.

[9] 陈锟. 河南省高校毕业生就业跟踪调查系统设计与开发[D]. 大连理工大学, 2015.

[10] 魏燕. 高校毕业生就业跟踪调查系统的研究[D]. 浙江工业大学, 2012.

[11] 傅伟, 王浩, 蒋道霞, 庄小将. 基于B/S的毕业生就业跟踪系统的设计与实现[J]. 兰州石化职业技术学院学报, 2014, 14(02):32-34.

[12] 杨佳怿. 高校毕业生就业跟踪调查系统研究[J]. 河南科技, 2015(10):4-6.

[13] 李文纯, 刘天法. 高校大学毕业生追踪调查系统的设计与应用[J]. 教育信息, 2005(13):40-41.

[14] 郭剑毅, 申立中, 马桂芳, 温琪, 张世华, 车文刚. 基于C/S与B/S的高校科研管理信息系统的设计与实现[J]. 计算机工程与应用, 2003(01):212-214.

[15] 卢致伟. 基于Web的高校毕业生就业信息管理系统设计与实现[D]. 厦门大学, 2014.

[16] 赵瑛. 美国高校毕业生就业现状及其启示[J]. 中国冶金教育, 1999(01):35-37.DOI:10.16312/j.cnki.cn11-3775/g4.1999.01.011.


引用说明:

引用以上内容的用户,必须同意以下内容,否则请勿引用!

  1. 出于自愿而使用本文,了解引用本文的风险,且同意自己承担引用本文的风险。
  2. 利用本文内容构建的任何信息内容以及导致的任何版权纠纷和法律争议及后果和作者无关,作者对此不承担任何责任。
  3. 在任何情况下,对于因引用本文而导致的任何难以合理预估的损失(包括但不仅限于商业利润损失、业务中断与业务信息丢失),作者概不承担任何责任。
  4. 必须了解使用本文内容的风险,作者不对其提供二次维护服务,也不提供任何有关资料。

相关文章
|
1天前
|
监控 数据管理 Java
智慧城管源码,基于微服务+java+springboot+vue+uniapp开发的城管综合执法系统源码
智慧城管执法系统利用微服务和Java技术提升城市管理水平,涵盖事件处理、投诉、处罚等功能,包含PC和APP源码。系统支持执法APP,便于领导随时随地审批,具备文书模板、地图定位、法规查询等功能。此外,执法办案系统通过监控视频分析事件,实现案件全程闭环管理,包括组织、案件、信用和执法队伍管理,以及法规库等基础支撑。系统旨在优化流程,提高数据管理和效率。
智慧城管源码,基于微服务+java+springboot+vue+uniapp开发的城管综合执法系统源码
|
1天前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp小程序的居民健康监测系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp小程序的居民健康监测系统附带文章源码部署视频讲解等
5 1
|
1天前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp小程序的网上花店附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp小程序的网上花店附带文章源码部署视频讲解等
7 1
|
1天前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp小程序的铁路订票平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp小程序的铁路订票平台附带文章源码部署视频讲解等
5 1
|
1天前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp小程序的开放实验室预约管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp小程序的开放实验室预约管理系统附带文章源码部署视频讲解等
6 1
|
1天前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp小程序的公考学习平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp小程序的公考学习平台附带文章源码部署视频讲解等
5 1
基于springboot+vue.js+uniapp小程序的公考学习平台附带文章源码部署视频讲解等
|
1天前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp小程序的高校就业招聘系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp小程序的高校就业招聘系统附带文章源码部署视频讲解等
6 1
基于springboot+vue.js+uniapp小程序的高校就业招聘系统附带文章源码部署视频讲解等
|
1天前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp小程序的短文写作竞赛管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp小程序的短文写作竞赛管理系统附带文章源码部署视频讲解等
5 1
|
1天前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp小程序的超市购物系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp小程序的超市购物系统附带文章源码部署视频讲解等
5 1
|
1天前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp小程序的经济新闻资讯附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp小程序的经济新闻资讯附带文章源码部署视频讲解等
5 1