项目1 物流仓库管理系统

一、项目概述

本项目旨在开发一个功能全面的物流仓库管理系统,以数字化手段优化仓库作业流程,提高管理效率。系统集成了前端用户交互界面与后端数据处理逻辑,涵盖了从用户注册登录、订单管理、货单跟踪到用户信息维护等多个核心业务模块。通过数据库技术实现数据的增删改查、条件查询及分页显示,为用户提供一个直观、便捷的操作平台。该系统专注于提升仓库管理效率和快递处理速度,主要服务对象为仓库管理员和操作员等后台用户。


二、数据库设计

参考我的另一篇文章:MySQL基础-CSDN博客

数据库设计是项目开发的关键环节之一,它直接影响到系统的性能和可扩展性。以下是针对本项目的数据库设计,使用Navicat连接MySQL数据库:

1.用户表(users)

ID、编号、姓名、用户名、密码、角色、电话、注册时间、头像

2.物流订单表(logisticsorders)

ID、订单号、尺寸、公司、状态、发件人姓名、发件人电话、收件人姓名、收件人电话、收件地址、订单类型

3.站点表(station)

ID、站点编号、站点名、站点地址

4.配送货单表(delivery)

ID、配送货单号、站点编号、配送时间、车牌号、司机、手机号、状态

5.配送明细表(deliverydetail)

ID、配送货单号、订单号

6.接收货单表(receipt)

ID、接收货单号、站点编号、接收时间、车牌号、司机、手机号、状态

7.接收明细表(receiptdetail)

ID、接收货单号、订单号


三、Spring Boot 后端项目搭建

具体步骤参考我的另一篇文章:Spring框架和Maven项目搭建-CSDN博客

1.配置Maven

IDEA创建Maven项目并配置Maven相关路径

2.依赖项导入

在pom.xml导入Spring Boot起步依赖项及MyBatis依赖库并创建项目启动类

3.数据源配置

具体步骤参考我的另一篇文章:MyBatis搭建-CSDN博客

在application.yml配置MyBatis数据源和mapper的xml文件位置

4.项目包结构

后端项目分三层架构创建访问层控制类Controller、服务层Service、数据访问层Dao

创建实体对象类bean、配置类config、工具类util等


四、Vue3 前端项目搭建

具体步骤参考我的另一篇文章:Vue3项目创建及相关配置-CSDN博客

1.初始化项目并安装依赖

使用npm初始化一个Vue项目并用VS Code打开

打开终端安装依赖包、安装vue-router路由组件、安装axios、安装element-plu等...

2.创建基本页并定义路由

创建项目所需的Vue页面,定义相关路由并配置api

前端项目包含页面:基本布局页、登录页、首页、订单管理页、配送货单页、接收货单页、站点详情页、用户管理页

3.引入Element Plus组件

Element Plus

引入Element Plus组件:用布局容器确定系统的基本布局

涉及组件:布局容器、菜单、按钮、表格、表单、对话框、输入框、下拉框、复选框、日期时间选择器、通知、确认消息、头像、图片、走马灯、抽屉、上传以及多种图标样式


五、项目功能模块

项目大致分为五个功能模块,包含以下功能:

1.登录注册模块

页面样式参考:详解5款高级的前端登录页面-CSDN博客

验证码生成参考:vue3 实现登录验证码-CSDN博客

输入用户名、密码并正确输入字符验证码后点击登录发送登录请求,系统后端验证用户信息的正确性,包括用户名是否存在、密码是否匹配,并比对验证码。这里的密码使用md5加密存入数据库,验证成功后服务器将生成携带账户信息的token返回到前端,并在登录后使用拦截器验证token是否有效。

注册页使用表单检验实现密码二次确认,如果后端比对数据库发现用户已经存在,系统将提示注册失败,注册成功则自动切换到登录页。

这里密码使用MD5加密存入数据库,登录前在vue中使用路由的前置守卫组织访问内部页面,token不存在或失效时会自动跳转到登录页。登录可以选中记住密码,将当前账号密码保存在浏览器,以便在下次进入登录页时自动填入账号密码,并在token有效时自动登录。


2.个人中心模块

登录成功后进入首页,浏览器同时发送请求到后端将当前登录的token解码,获取到当前登录的账户信息同步到个人中心。这里可以上传或更换头像以及编辑个人信息。

点击修改密码并输入原密码和新密码,若原密码和数据库比对成功,则提示密码修改成功,同时,清空token,退出当前登录状态到登录页要求重新登录。


3.订单管理模块

这里获取数据库订单表的数据并在前台展示,支持新增、编辑、删除和批量删除,这里的删除为软删除,即只是变更删除字段isdel为已删除状态1,允许通过数据库恢复,新增和编辑信息实现了通过正则表达式进行的表单规则验证,用下拉框选项规范用户输入,支持条件查询指定数据。

另外,根据订单表的尺寸和订单状态的统计数据,这里使用ECharts生成了统计尺寸数量的柱状图和反映订单状态比例的饼状图,图中内容会根据表中数据动态更新。


4.货单管理模块

货单管理模块在满足了对配送和接收货单表进行增删改查的基础上,还加入了分页查询,根据查询数据总数进行分页展示,通过多表联查从站点表获取站点编号对应的站点名。点击货单明细会展示当前货单对应的所有订单编号,同样允许对明细增删操作,并设置了表单验证规范输入格式。


5.用户管理模块

用户管理模块从后台获取除密码之外的用户数据进行展示,同样实现了基本的增删改查,可以同时进行条件查询和分页查询,可以新增和修改用户信息以及头像的上传和更换,支持通过下拉框选择用户角色,并在录入新用户后会自动添加当前时间为注册时间。

另外,用户管理页还实现了上传Excel文件批量导入用户信息,通过后台阿里的EasyExcel解析数据为User对象并传到前台供系统使用者选择性批量导入。

相关推荐
曾经的三心草24 分钟前
Mysql之约束与事件
android·数据库·mysql·事件·约束
宋发元27 分钟前
如何使用正则表达式验证域名
python·mysql·正则表达式
张某布响丸辣38 分钟前
SQL中的时间类型:深入解析与应用
java·数据库·sql·mysql·oracle
开心工作室_kaic1 小时前
ssm111基于MVC的舞蹈网站的设计与实现+vue(论文+源码)_kaic
前端·vue.js·mvc
路遇晚风1 小时前
力扣=Mysql-3322- 英超积分榜排名 III(中等)
mysql·算法·leetcode·职场和发展
李少兄2 小时前
解决 Spring Boot 中 `Ambiguous mapping. Cannot map ‘xxxController‘ method` 错误
java·spring boot·后端
荆州克莱2 小时前
Big Data for AI实践:面向AI大模型开发和应用的大规模数据处理套件
spring boot·spring·spring cloud·css3·技术
bug爱好者2 小时前
如何解决sourcetree 一打开就闪退问题
前端·javascript·vue.js
代码小鑫2 小时前
A031-基于SpringBoot的健身房管理系统设计与实现
java·开发语言·数据库·spring boot·后端
迂 幵2 小时前
vue el-table 超出隐藏移入弹窗显示
javascript·vue.js·elementui