基于Vue和SpringBoot的便利店仓库物资管理系统的设计与实现(二)

简介: 基于Vue和SpringBoot的便利店仓库物资管理系统的设计与实现

5 系统实现

根据对系统分析与设计,本章对系统中相关部分的实现情况做了详细的介绍。

5.1 客户端设计与实现

5.1.1 登录模块

用户首先进入的是便利店仓库物资信息管理系统的首页,输入自己的账号和密码进入系统。

当用户成功登陆后,进入到系统首页,如图5-2所示。

其中获取验证码的核心代码如下:

getCaptchaImg() {
    this.loadingCaptcha = true;
    initCaptcha().then(res => {
        this.loadingCaptcha = false;
        if (res.success) {
            this.captchaId = res.result;
            this.captchaImg = drawCodeImage + this.captchaId;
        }
    });

其中进行系统登陆的核心代码如下:

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();
    }
});

5.1.2 便利店管理员模块

进入系统后,便利店管理员可以查看用户管理模块,用户模块用于管理便利店的工作人员,如图5-3所示。

其中查询用户的核心代码如下:

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);
}

5.1.3 菜单权限模块

菜单权限模块用于管理每一个登陆角色拥有哪些菜单权限,如便利店管理员需要拥有全部菜单权限,而仓库管理员只需拥有进货菜单即可,无需看到用户管理模块。这个基于角色的访问控制,需要在菜单权限模块中设计和实现,操作界面如图5-4所示。

其中查询角色的核心代码如下:

@RequestMapping(value = "/getAllByPage", method = RequestMethod.GET)
@ApiOperation(value = "分页查询角色")
public Result<IPage<Role>> getRoleByPage(PageVo page) {
    IPage<Role> roleList = iRoleService.page(PageUtil.initMpPage(page));
    for(Role role : roleList.getRecords()){
        QueryWrapper<RolePermission> rpQw = new QueryWrapper<>();
        rpQw.eq("role_id",role.getId());
        role.setPermissions(iRolePermissionService.list(rpQw));
    }
    return new ResultUtil<IPage<Role>>().setData(roleList);
}

5.1.4 商品管理模块

商品管理模块用于管理便利店中全部商品类型,如方便面、火腿肠等等。这些商品类型需要为进货模块和出库模块提供基础数据支持,商品档案的字段应当包括商品ID、商品名称、商品类型、商品供应商、型号、商品单价、现有数量、总价等字段,在商品管理模块中,管理员可以对商品档案进行增加、删除、修改、更新操作,如图5-5所示,当库存量低于10时,系统会自动标黄预警。

其中查询商品的核心代码如下:

@RequestMapping(value = "/getByPage", method = RequestMethod.GET)
@ApiOperation(value = "查询商品")
public Result<IPage<Commodity>> getByPage(@ModelAttribute Commodity commodity ,@ModelAttribute PageVo page){
    QueryWrapper<Commodity> qw = new QueryWrapper<>();
    if(!ZwzNullUtils.isNull(commodity.getNature())) {
        qw.eq("nature",commodity.getNature());
    }
    if(!ZwzNullUtils.isNull(commodity.getAssetName())) {
        qw.like("asset_name",commodity.getAssetName());
    }
    IPage<Commodity> data = iCommodityService.page(PageUtil.initMpPage(page),qw);
    for (Commodity co : data.getRecords()) {
        if(!ZwzNullUtils.isNull(co.getSupplierId())) {
            Supplier supplier = iSupplierService.getById(co.getSupplierId());
            if(supplier != null) {
                co.setSupplierName(supplier.getName());
            }
        }
    }
    return new ResultUtil<IPage<Commodity>>().setData(data);
}

5.1.5 商品进货模块

在商品档案的建立之后,仓库管理员可以对商品进行进货登记,增加商品的库存。仓库员需要先选择商品类型,然后输入进货发票号和入库数量,如有需要还可以输入备注信息,完成进货登记。进货模块的字段需要包括商品ID、商品名称、发票单号、商品型号、单价、入库数量、总价、备注信息,如图5-6所示。

其中商品进货的核心代码如下:

@RequestMapping(value = "/insert", method = RequestMethod.POST)
@ApiOperation(value = "新增商品入库单")
public Result<CommodityIn> insert(CommodityIn commodityIn){
    CommodityIn oldWarehousing = iCommodityInService.getById(commodityIn.getId());
    double oldNumber = 0.0;
    if(oldWarehousing != null){
        oldNumber = oldWarehousing.getNumber() == null ? 0.0 : Double.parseDouble(oldWarehousing.getNumber());
    }
    // 入库,更新库存
    Commodity assetsType = iCommodityService.getById(commodityIn.getAssetId());
    if(assetsType != null){
        // number = 现在仓库总数量 + 该入库单现增加数量 - 该入库单原有增加数量
        double number = Double.parseDouble(assetsType.getNumber()) + Double.parseDouble(commodityIn.getNumber()) - oldNumber;
        assetsType.setNumber(number + "");
        assetsType.setTotalPrice((Double.parseDouble(assetsType.getUnitPrice()) * number) + "");
        // existNumber = 现在仓库存在数量 + 该入库单现增加数量 - 该入库单原有增加数量
        double existNumber = Double.parseDouble(assetsType.getExistingNumber()) + Double.parseDouble(commodityIn.getNumber()) - oldNumber;
        if(existNumber < 0)  {
            return ResultUtil.error("入库数量大于已出库数量!");
        }
        assetsType.setExistingNumber(existNumber + "");
        iCommodityService.saveOrUpdate(assetsType);
    }
    iCommodityInService.saveOrUpdate(commodityIn);
    return new ResultUtil<CommodityIn>().setData(commodityIn);
}

5.1.6 商品出库模块

商品入库之后,如果投入到便利店中,需要进行出库操作,出库也是由出库管理员完成。出库员先选择商品类型,此时可以看到商品剩余的库存量,接着从用户档案中选择出库领用人,最后输入出库数量,完成商品出库操作。出库单需要包括商品ID、商品名称、商品型号、商品单价、出库数量、总价、领用人、备注信息,如图5-7所示。

仓库管理员可以选择商品类型和领用人,完成出库操作,如图5-8所示。

其中商品出库的核心代码如下。

@RequestMapping(value = "/insert", method = RequestMethod.POST)
@ApiOperation(value = "新增商品出库单")
public Result<CommodityOut> insert(CommodityOut commodityOut){
    CommodityOut oldWarehouseOut = iCommodityOutService.getById(commodityOut.getId());
    double oldNumber = 0.0;
    if(oldWarehouseOut != null){
        oldNumber = Double.parseDouble(oldWarehouseOut.getNumber());
    }
    // outNumber 要出库的数量
    double outNumber = Double.parseDouble(commodityOut.getNumber());
    Commodity oldAssetsType = iCommodityService.getById(commodityOut.getAssetId());
    if(oldAssetsType != null){
        // newNumber 出库后还有的数量 = 仓库原本还有的数量 - 出库单的出库数量 + 原有出库单的出库数量
        Double newNumber = Double.parseDouble(oldAssetsType.getExistingNumber()) - outNumber + oldNumber;
        if(newNumber >= 0){
            oldAssetsType.setExistingNumber(newNumber + "");
            iCommodityService.saveOrUpdate(oldAssetsType);
        }else{
            return ResultUtil.error("手慢啦!库存不足!");
        }
    }
    iCommodityOutService.saveOrUpdate(commodityOut);
    return new ResultUtil<CommodityOut>().setData(commodityOut);
}

5.2 系统安全控制实现

未登录的用户只能访问登录页面,即使输入其他页面的网址也会跳转回登录页面。

图5-9描述的是过滤器过滤流程用户登录成功以后,系统会在用户对应的Session中添加用户名和用户密码的加密值。所以当用户请求其他的页面以及操作时,过滤器首先检测Session中是否存在用户名和用户密码信息。若不存在,表明用户还没有登录,返回给用户登录界面。如果存在,则将密码解密,验证用户是否是合法用户。

在本系统中,所有功能模块都采用了登陆控制。

关键代码如下:

<%    
User u = (User)session.getAttribute(“user”);
If(u == null || “”.equals(u)) {
Out.print(“<script>alert(‘请登陆’”; window.open(‘”+path+”/login.jsp”;<<script>’));
}
%>

6 系统测试

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

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

(1) 单元测试,单元测试对应于详细设计部分,从软件的详细设计中导出。软件的独立单元将在与程序的其他部分相隔离的情况下进行测试。

(2) 集成测试,集成测试对应于系统的概要设计,主要用来的是各个模块之间的接口的正确性。

(3) 系统测试,系统测试的目的是通过测试发现是否需求分析中的功能相符。

6.1 集成测试

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

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

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

6.2 系统测试

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

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

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

6.3 测试结论

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

结论

通过设计,我对管理信息系统(MIS)的概念有了一定的了解。管理信息作为一门新兴的、具有独特风格的边缘科学,随着计算机用信息科学的飞速发展,已经渗透并应用于各个领域。本次设计中,我设计的是人力资源管理系统。虽然设计得不是很完善,但是通过设计,我们对管理信息系统的历史、一般模式、系统分析与系统设计、开发工具用其功能等有一个较为全面深刻的认识。

在该项目的开发过程中遇到不少困难,如:数据库的设计中,如何处理多对多的关系和如何设计主键,是两个有着较大难度、需要重点考虑的问题。发现的问题非常多,就不一一描述了。

本次设计加强了我的实践精神,增强了我的自主学习能力。本系统设计对于我来说较为复杂,因此我进行了很多次的测试和修改,在编写系统的过程中,我虚心的请教了的老师和相关专业的师兄;通过和他们的交流,我获益良多;而且这样不仅加快了设计进程,也使我们长进了不少。这使我们明白,经验在完成任务的过程中有多么重要。

由于时间有限,加之管理信息系统对我们来说是一个全新的课题,因此本设计也有不足之处。

参考文献

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

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

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

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

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

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

[7]邵雨舟.便利店仓库系统的设计与实现[J].电脑知识与技术,2019,15(21):87-89.DOI:10.14004/j.cnki.ckt.2019.2336.

[8]熊瑛.便利店仓库系统的设计与实现[J].信息与电脑(理论版),2021,33(17):116-119.

[9]陈锟. 河南省便利店仓库系统设计与开发[D].大连理工大学,2021.

[10]魏燕. 便利店仓库调查系统的研究[D].浙江工业大学,2021.

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

[12]杨佳怿.便利店仓库系统研究[J].河南科技,2021(10):4-6.

[13]李文纯,刘天法.便利店仓库系统的设计与应用[J].教育信息化,2021(13):40-41.

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

[15]卢致伟. 基于Web的便利店仓库管理系统设计与实现[D].厦门大学,2021.

[16]赵瑛.美国便利店仓库现状及其启示[J].中国冶金教育,2020(01):35-37.DOI:10.16312/j.cnki.cn11-3775/g4.2020.01.011.

致谢

在此论文完成之际,我的心里感到特别高兴和激动,在这里,我打心里向我的导师和同学们表示衷心的感谢!因为有了老师的谆谆教导,才让我学到了很多知识和做人的道理,同时在重新温故了以前课堂所学的知识。在做毕业设计的过程中,遇到难解的问题,老师都会及时和我解释,那么仔细和认真,让后收益很多,我打心里感谢我的导师。

在相关的实际问题的讨论中,我的导师总是孜孜不倦的引导着我,帮助着我。每周一次的进度检查和问题讨论,促使我在正确的道路上大步前进,不仅工作的按时保质保量的完成得到了保证,我本人的研究能力,工作的态度也得到了充分的锻炼和提高。这些宝贵的品质影响着我,毫无疑问,它们对我以后的工作,学习,生活都会起到深远而长久的良好影响。也能为人生打下一个夯实地基础!在此致以教授我的导师深切感激和真挚感谢!

另外也感谢我的父母,朋友和同学们的帮助。在做设计感觉受挫,枯燥与迷茫时,是他们在悉心的为我释放压力,鼓励我不要气馁,勇敢面对。每周一次和父母的通话,与朋友和同学的长谈后都使我精神放松,斗志倍增,以饱满的热情重新投入到工作中去,感谢他们,正是他们的不懈支持和充分理解才能使我顺利完成毕业设计。


引用说明:

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

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

相关文章
|
7天前
|
存储 JavaScript 前端开发
基于 SpringBoot 和 Vue 开发校园点餐订餐外卖跑腿Java源码
一个非常实用的校园外卖系统,基于 SpringBoot 和 Vue 的开发。这一系统源于黑马的外卖案例项目 经过站长的进一步改进和优化,提供了更丰富的功能和更高的可用性。 这个项目的架构设计非常有趣。虽然它采用了SpringBoot和Vue的组合,但并不是一个完全分离的项目。 前端视图通过JS的方式引入了Vue和Element UI,既能利用Vue的快速开发优势,
52 13
|
14天前
|
JavaScript 安全 Java
java版药品不良反应智能监测系统源码,采用SpringBoot、Vue、MySQL技术开发
基于B/S架构,采用Java、SpringBoot、Vue、MySQL等技术自主研发的ADR智能监测系统,适用于三甲医院,支持二次开发。该系统能自动监测全院患者药物不良反应,通过移动端和PC端实时反馈,提升用药安全。系统涵盖规则管理、监测报告、系统管理三大模块,确保精准、高效地处理ADR事件。
|
1月前
|
XML Java 数据库连接
SpringBoot集成Flowable:打造强大的工作流管理系统
在企业级应用开发中,工作流管理是一个核心组件,它能够帮助我们定义、执行和管理业务流程。Flowable是一个开源的工作流和业务流程管理(BPM)平台,它提供了强大的工作流引擎和建模工具。结合SpringBoot,我们可以快速构建一个高效、灵活的工作流管理系统。本文将探讨如何将Flowable集成到SpringBoot应用中,并展示其强大的功能。
187 1
|
1月前
|
JavaScript 安全 Java
如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个前后端分离的应用框架,实现动态路由和菜单功能
本文介绍了如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个前后端分离的应用框架,实现动态路由和菜单功能。首先,确保开发环境已安装必要的工具,然后创建并配置 Spring Boot 项目,包括添加依赖和配置 Spring Security。接着,创建后端 API 和前端项目,配置动态路由和菜单。最后,运行项目并分享实践心得,帮助开发者提高开发效率和应用的可维护性。
80 2
|
1月前
|
JavaScript NoSQL Java
CC-ADMIN后台简介一个基于 Spring Boot 2.1.3 、SpringBootMybatis plus、JWT、Shiro、Redis、Vue quasar 的前后端分离的后台管理系统
CC-ADMIN后台简介一个基于 Spring Boot 2.1.3 、SpringBootMybatis plus、JWT、Shiro、Redis、Vue quasar 的前后端分离的后台管理系统
45 0
|
3月前
|
前端开发 JavaScript Java
基于Java+Springboot+Vue开发的服装商城管理系统
基于Java+Springboot+Vue开发的服装商城管理系统(前后端分离),这是一项为大学生课程设计作业而开发的项目。该系统旨在帮助大学生学习并掌握Java编程技能,同时锻炼他们的项目设计与开发能力。通过学习基于Java的服装商城管理系统项目,大学生可以在实践中学习和提升自己的能力,为以后的职业发展打下坚实基础。
181 2
基于Java+Springboot+Vue开发的服装商城管理系统
|
2月前
|
JavaScript 安全 Java
如何使用 Spring Boot 和 Ant Design Pro Vue 实现动态路由和菜单功能,快速搭建前后端分离的应用框架
本文介绍了如何使用 Spring Boot 和 Ant Design Pro Vue 实现动态路由和菜单功能,快速搭建前后端分离的应用框架。首先,确保开发环境已安装必要的工具,然后创建并配置 Spring Boot 项目,包括添加依赖和配置 Spring Security。接着,创建后端 API 和前端项目,配置动态路由和菜单。最后,运行项目并分享实践心得,包括版本兼容性、安全性、性能调优等方面。
176 1
|
3月前
|
前端开发 JavaScript Java
SpringBoot项目部署打包好的React、Vue项目刷新报错404
本文讨论了在SpringBoot项目中部署React或Vue打包好的前端项目时,刷新页面导致404错误的问题,并提供了两种解决方案:一是在SpringBoot启动类中配置错误页面重定向到index.html,二是将前端路由改为hash模式以避免刷新问题。
299 1
|
1月前
|
JavaScript 安全 Java
如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用。
本文介绍了如何使用 Spring Boot 和 Ant Design Pro Vue 构建一个具有动态路由和菜单功能的前后端分离应用。首先,创建并配置 Spring Boot 项目,实现后端 API;然后,使用 Ant Design Pro Vue 创建前端项目,配置动态路由和菜单。通过具体案例,展示了如何快速搭建高效、易维护的项目框架。
115 62
|
1月前
|
JavaScript Java 项目管理
Java毕设学习 基于SpringBoot + Vue 的医院管理系统 持续给大家寻找Java毕设学习项目(附源码)
基于SpringBoot + Vue的医院管理系统,涵盖医院、患者、挂号、药物、检查、病床、排班管理和数据分析等功能。开发工具为IDEA和HBuilder X,环境需配置jdk8、Node.js14、MySQL8。文末提供源码下载链接。
下一篇
DataWorks