使用Vue和SpringBoot开发实验室耗材智能运维系统

作者主页：Designer 小郑
作者简介：浙江某公司软件工程师，负责开发管理公司OA、CRM业务系统，全栈领域优质创作者，CSDN学院、蓝桥云课认证讲师，开发过20余个前后端分离实战项目，主要发展方向为Vue、SpringBoot、微信小程序，期待你我共同成长！
主打方向：Vue、SpringBoot、微信小程序
项目ID：A22010
文末获取源码

一、项目简介

本项目是基于 Vue 和 Spring Boot 的实验室耗材智能运维系统，包括了耗材档案、耗材采购入库、耗材领用出库三大核心业务，另外还支持申请耗材、审核申请单、用户管理、文件云盘、组织架构、日志、数据字典、修改密码、个人中心等扩展功能。本系统主要面向高校实验室管理日常耗材所用，降低实验室管理人员的工作量，提高耗材库存的管理水平。

在这里插入图片描述

二、功能明细

耗材档案：实验室管理者可自由增删改查耗材的数据。
耗材采购入库：实验室耗材采购人员可将采购的耗材入库至系统。
耗材领用出库：学生可按需申请耗材，实验室管理员审核；或者实验室管理员直接分配给学生。
用户权限管控：基于角色的权限控制，可维护每位用户的菜单权限和用户信息。
组织架构维护：对实验室的组织架构进行维护，如教师层、20级、21级等。
文件云盘：统一化管理系统所用到的全部文件，封装了 Vue 组件供其他模块表单调用。
系统日志：根据用户操作，自动化记录日志。
数据字典：管理员可视化修改其他模块的下拉框数据，无需修改前端代码。
个人中心：登陆注册、修改密码、维护自己账号的数据等。

三、使用对象

实验室管理员：管理员可以发布耗材、删改耗材数据、维护实验室人员档案等全部功能。
耗材采购员：可对管理员发布的耗材品类，进行入库操作、对指定学生进行出库领用或审核学生的申请单。
学生：可查看实验室现有耗材的库存情况、申请耗材、查看自己的申请状态。

四、技术选型

前端

Vue：Vue 是构建前端界面的核心框架，本系统采用 2.6.14 版本。

View UI：基于 Vue.js2.0 的组件库，本系统采用 4.7.0 版本。

后端

Spring Boot：构建系统核心逻辑的后端框架，本系统采用 2.7.4 版本。

MyBatis / MyBatis Plus：后端连接数据库的框架，本系统采用 3.5.2 版本。

数据库

MySQL：本项目的主数据库，本系统采用 8.0.30 版本。

Redis：本系统采用基于 Windows 版本的 Redis，用于图形验证码和用户菜单权限的临时存储，采用了 5.0.14.1 版本。

开发环境

VsCode：项目前端的开发工具，使用版本为 1.68.0。

IntelliJ IDEA ：项目后端的开发工具，使用版本为 2022.2.2。

Jdk：Java 的开发环境，使用版本为 17.0.4.1。

Maven：后端项目的打包工具，使用版本为 3.6.2。

NodeJs：前端项目的开发环境，使用版本为 16.13.0。

五、系统展示

登录页

用户可使用账号 + 密码 + 图形验证码的方式进行登录，如下图所示。
在这里插入图片描述

注册页

如果用户没有账号，也可以根据手机号、姓名、密码和图形验证码进行注册，如下图所示。
在这里插入图片描述

主页

用户登录成功后，默认进入主页，如下图所示。
在这里插入图片描述
当然不同的用户拥有不同的菜单权限，实验室耗材智能运维系统采用基于角色的访问控制模式，采用同学们可以自定义角色，再分配指定的菜单权限，如下图所示。

耗材档案

实验室管理员可以在这里维护耗材的数据，其中耗材包括大的耗材（固定资产）和小的耗材（耗材），如下图所示。
在这里插入图片描述

新增编辑耗材

新增耗材的操作界面如下图所示。
在这里插入图片描述

删除耗材

用户可以选择一定数量的耗材，点击删除按钮，进行删除，系统会给与二次确认弹框，如下图所示。
在这里插入图片描述

耗材入库

耗材的来源是采购员买来之后入库，所以采购员可以在这个模块操作入库，如下图所示。
在这里插入图片描述

新增入库

新增入库时，资产是由耗材模块中进行选择，如下图所示。
在这里插入图片描述
新增之后还可以编辑，编辑功能如下图所示。

耗材领用（管理员）

管理员可以主动将耗材分配给实验室学生，如下图所示。
在这里插入图片描述

新增耗材领用分配

在这里插入图片描述
其中表单的资产名称和领用人可导入选择，资产导入后，型号、单价自动带出，用户只需填写数量和备注即可，如下图所示。

耗材领用（用户）

除了管理员主动分配耗材给学生，学生也可以主动去申请耗材，如下图所示。
在这里插入图片描述

领用审核

学生主动申请耗材后，实验室管理员可以对其进行审核，如下图所示。
在这里插入图片描述

审核通过即可完成正常领用，如下图所示。
在这里插入图片描述

用户管理

管理员管理学生，在这里维护，如下图所示。
在这里插入图片描述

云盘（文件管理）

实验室耗材智能运维系统的所有文件都在这里维护，如下图所示。
在这里插入图片描述

系统日志

用户的指定操作（后端代码匹配）可以自动化记录日志，汇总在日志模块，如下图所示。
在这里插入图片描述

修改密码

用户可以修改自己的密码，如下图所示。
在这里插入图片描述

个人门户

用户可以在个人门户中编辑自己的信息，如下图所示。
在这里插入图片描述

图表

系统还支持 ANTV 图表，同学们可以根据自己需要，进行二次开发。
在这里插入图片描述

在这里插入图片描述

六、项目总结

智能化人事系统的作用，就是为公司人事事务提供便捷性支持，方便公司对自己人事组织层次，人事数据进行修改、维护、检索信息。本软件是基于 Vue 和 SpringBoot 的智能化人事系统，包含了员工模块、请假模块、通告模块、留言模块、薪资模块、职位职称这六个功能核心模块。

开发本系统的目的，就是为了帮助中小企业提高人事管理效率，降低人力成本，让中小企业获得更多的经济效益。

七、核心代码实例

实体类定义

@Data
@Entity
@DynamicInsert
@DynamicUpdate
@Table(name = "a_assets_type")
@TableName("a_assets_type")
@ApiModel(value = "资产种类")
public class AssetsType extends ZwzBaseEntity {private static final long serialVersionUID = 1L;@ApiModelProperty(value = "资产名称")private String assetName;@ApiModelProperty(value = "性质")private String nature;@ApiModelProperty(value = "型号")private String model;@ApiModelProperty(value = "数量")private String number;@ApiModelProperty(value = "现有数量")private String existingNumber;@ApiModelProperty(value = "单价")private String unitPrice;@ApiModelProperty(value = "总价")private String totalPrice;@ApiModelProperty(value = "备注")private String remarks;
}

资产出库

@ApiOperation(value = "资产出库")
@RequestMapping(value = "/outpdate", method = RequestMethod.POST)
public Result<WarehouseOut> outpdate(WarehouseOut warehouseOut){WarehouseOut oldWarehouseOut = iWarehouseOutService.getById(warehouseOut.getId());double oldNumber = 0.0;if(oldWarehouseOut != null){oldNumber = Double.parseDouble(oldWarehouseOut.getNumber());}// outNumber 要出库的数量double outNumber = Double.parseDouble(warehouseOut.getNumber());AssetsType oldAssetsType = iAssetsTypeService.getById(warehouseOut.getAssetId());if(oldAssetsType != null){// newNumber 出库后还有的数量 = 仓库原本还有的数量 - 出库单的出库数量 + 原有出库单的出库数量Double newNumber = Double.parseDouble(oldAssetsType.getExistingNumber()) - outNumber + oldNumber;if(newNumber >= 0){oldAssetsType.setExistingNumber(newNumber + "");iAssetsTypeService.saveOrUpdate(oldAssetsType);}else{return ResultUtil.error("手慢啦!库存不足!");}}if(ZwzNullUtils.isNull(warehouseOut.getId())) {warehouseOut.setAuditStatus(0);warehouseOut.setAuditTime("");}if(iWarehouseOutService.saveOrUpdate(warehouseOut)){return new ResultUtil<WarehouseOut>().setData(warehouseOut);}return ResultUtil.error();
}