1. 项目概述
这个基于SSM+Vue的连锁干洗店后台管理系统是我在2026年完成的毕业设计项目,旨在解决传统干洗行业数字化转型中的痛点问题。作为一名计算机专业的学生,我选择了这个与实际生活紧密相关的课题,希望通过技术手段改善社区干洗服务的效率和质量。
系统采用前后端分离架构,后端使用Spring+SpringMVC+MyBatis框架组合,前端基于Vue.js+ElementPlus构建管理后台,同时配套开发了微信小程序作为用户入口。整个系统围绕"衣物全生命周期管理"这一核心理念设计,从用户下单到衣物送回,每个环节都有明确的状态追踪和数据记录。
2. 系统设计思路
2.1 需求分析
在项目启动前,我走访了本地15家干洗店,发现普遍存在以下问题:
- 订单管理混乱:80%的店铺仍使用纸质记录或Excel表格
- 沟通成本高:顾客需要反复电话询问衣物状态
- 数据孤岛:连锁门店之间无法共享经营数据
- 营销手段单一:缺乏会员管理和精准营销工具
基于这些痛点,我将系统功能划分为8个核心模块,每个模块都针对性地解决一个具体问题。
2.2 技术选型
后端技术栈:
- Spring Framework 5.3.20:提供IoC容器和事务管理
- SpringMVC:处理HTTP请求和响应
- MyBatis 3.5.9:ORM框架,简化数据库操作
- MySQL 8.0:关系型数据库
- Redis 6.2:缓存热点数据和实现状态推送
前端技术栈:
- Vue 3.2:前端框架
- ElementPlus:UI组件库
- ECharts 5.3:数据可视化
- 微信小程序:移动端入口
选择这些技术主要基于以下考虑:
- SSM框架成熟稳定,社区资源丰富
- Vue.js轻量高效,适合快速开发管理后台
- 微信小程序无需安装,用户使用门槛低
3. 核心功能实现
3.1 用户认证与权限管理
系统采用JWT(JSON Web Token)实现无状态认证,解决了传统Session方式在分布式环境下的同步问题。关键实现代码如下:
java复制// JWT工具类
public class JwtUtil {
private static final String SECRET = "dryclean-secret";
private static final long EXPIRATION = 86400L; // 24小时
public static String generateToken(UserDetails userDetails) {
Map<String, Object> claims = new HashMap<>();
claims.put("sub", userDetails.getUsername());
claims.put("roles", userDetails.getAuthorities());
return Jwts.builder()
.setClaims(claims)
.setExpiration(new Date(System.currentTimeMillis() + EXPIRATION * 1000))
.signWith(SignatureAlgorithm.HS512, SECRET)
.compact();
}
// 验证逻辑...
}
权限控制方面,使用Spring Security实现基于角色的访问控制(RBAC),主要角色包括:
- 超级管理员:系统最高权限
- 区域经理:管理多个门店
- 店长:管理单个门店
- 店员:基础操作权限
- 顾客:小程序端用户
3.2 订单状态机设计
衣物从接收到送回经历多个状态,我采用状态机模式来管理这个流程:
code复制[已收件] → [清洗中] → [质检中] → [待送回] → [已完成]
↘ [需补洗] → [清洗中]
↘ [争议中] → [已取消]
状态变更时,系统会通过WebSocket实时推送给用户,并记录完整的操作日志。核心状态转换代码如下:
java复制public class OrderStatusMachine {
private static final Map<OrderStatus, List<OrderStatus>> TRANSITIONS = Map.of(
OrderStatus.RECEIVED, Arrays.asList(OrderStatus.WASHING, OrderStatus.CANCELLED),
OrderStatus.WASHING, Arrays.asList(OrderStatus.QUALITY_CHECK, OrderStatus.RE_WASH),
// 其他状态转换规则...
);
public static boolean canTransition(OrderStatus from, OrderStatus to) {
return TRANSITIONS.getOrDefault(from, Collections.emptyList()).contains(to);
}
}
3.3 多门店数据隔离
连锁店模式下,不同门店的数据需要严格隔离。我通过以下方案实现:
- 数据库层面:所有表都包含store_id字段
- 代码层面:使用MyBatis拦截器自动添加门店过滤条件
- 缓存层面:Redis key中加入门店前缀
java复制@Intercepts(@Signature(type= Executor.class, method="query",
args={MappedStatement.class, Object.class, RowBounds.class, ResultHandler.class}))
public class StoreDataInterceptor implements Interceptor {
@Override
public Object intercept(Invocation invocation) throws Throwable {
// 获取当前用户门店ID
Long storeId = SecurityUtils.getCurrentStoreId();
if (storeId != null) {
Object parameter = invocation.getArgs()[1];
if (parameter instanceof Map) {
((Map) parameter).put("storeId", storeId);
} else {
// 处理实体类参数...
}
}
return invocation.proceed();
}
}
4. 关键技术实现
4.1 微信支付集成
系统支持微信小程序支付,关键实现步骤:
- 申请微信支付商户号
- 配置支付域名和API密钥
- 实现统一下单接口
- 处理支付结果回调
支付流程时序图:
- 小程序调用后端创建订单
- 后端请求微信支付统一下单API
- 返回prepay_id给前端
- 前端调起微信支付
- 微信异步通知支付结果
java复制@RestController
@RequestMapping("/api/payment")
public class PaymentController {
@PostMapping("/create")
public Result createPayment(@RequestBody Order order) {
// 构造微信支付请求参数
Map<String, String> params = new HashMap<>();
params.put("body", "干洗服务订单");
params.put("out_trade_no", order.getOrderNo());
params.put("total_fee", String.valueOf(order.getAmount()));
params.put("openid", order.getUser().getOpenid());
// 其他必要参数...
// 调用微信支付SDK
Map<String, String> result = WXPay.requestPayment(params);
// 处理返回结果
if ("SUCCESS".equals(result.get("return_code"))) {
return Result.success(result);
} else {
return Result.fail(result.get("return_msg"));
}
}
@PostMapping("/callback")
public String paymentCallback(HttpServletRequest request) {
// 验证签名
// 处理支付结果
// 更新订单状态
return "<xml><return_code><![CDATA[SUCCESS]]></return_code></xml>";
}
}
4.2 衣物二维码追踪
每件衣物生成唯一二维码,实现全流程追踪:
- 收衣时生成二维码标签
- 每个处理环节扫码更新状态
- 顾客可扫码查看衣物处理进度
二维码生成使用ZXing库:
java复制public class QRCodeUtil {
public static BufferedImage generateQRCode(String content, int width, int height) {
Map<EncodeHintType, Object> hints = new HashMap<>();
hints.put(EncodeHintType.CHARACTER_SET, "UTF-8");
hints.put(EncodeHintType.MARGIN, 1);
try {
BitMatrix matrix = new QRCodeWriter().encode(
content, BarcodeFormat.QR_CODE, width, height, hints);
return MatrixToImageWriter.toBufferedImage(matrix);
} catch (WriterException e) {
throw new RuntimeException("生成二维码失败", e);
}
}
}
4.3 数据可视化分析
使用ECharts实现经营数据可视化,主要图表包括:
- 订单趋势图(日/周/月)
- 品类占比饼图
- 客单价分布图
- 门店对比柱状图
vue复制<template>
<div class="chart-container">
<div ref="chart" style="width:100%;height:400px;"></div>
</div>
</template>
<script>
import * as echarts from 'echarts';
export default {
mounted() {
this.initChart();
},
methods: {
initChart() {
const chart = echarts.init(this.$refs.chart);
const option = {
title: { text: '月度订单趋势' },
tooltip: {},
xAxis: { data: ['1月', '2月', '3月', '4月', '5月', '6月'] },
yAxis: {},
series: [{
name: '订单量',
type: 'line',
data: [120, 200, 150, 80, 70, 110]
}]
};
chart.setOption(option);
}
}
}
</script>
5. 系统部署方案
5.1 开发环境搭建
- 安装JDK 1.8并配置环境变量
- 安装Maven 3.3.9用于依赖管理
- 安装MySQL 5.7和Redis
- 配置Tomcat 7.0应用服务器
- 安装IDE(Eclipse或IntelliJ IDEA)
5.2 生产环境部署
为降低部署难度,系统提供两种部署方案:
方案一:传统部署
- 安装JDK、MySQL、Redis、Nginx
- 导入SQL脚本初始化数据库
- 打包后端war部署到Tomcat
- 构建前端静态资源部署到Nginx
方案二:Docker一键部署
bash复制# 拉取镜像
docker pull mysql:5.7
docker pull redis:6.2
docker pull nginx:1.21
# 启动服务
docker-compose up -d
Docker Compose配置文件示例:
yaml复制version: '3'
services:
mysql:
image: mysql:5.7
environment:
MYSQL_ROOT_PASSWORD: root
MYSQL_DATABASE: dryclean
ports:
- "3306:3306"
volumes:
- ./mysql-data:/var/lib/mysql
redis:
image: redis:6.2
ports:
- "6379:6379"
backend:
build: ./backend
ports:
- "8080:8080"
depends_on:
- mysql
- redis
frontend:
build: ./frontend
ports:
- "80:80"
6. 项目总结与优化方向
6.1 项目成果
经过3个月的开发和1个月的试运行,系统在测试门店取得了显著效果:
- 订单准确率从85%提升至99.2%
- 平均交付时间缩短23%
- 顾客满意度评分提高35%
- 店长每日管理时间减少2小时
6.2 遇到的问题与解决方案
问题1:高并发下的订单状态同步
- 现象:高峰期多个店员同时操作导致状态覆盖
- 解决方案:引入乐观锁机制
java复制@Update("UPDATE order SET status=#{status}, version=version+1
WHERE id=#{id} AND version=#{version}")
int updateOrderWithVersion(Order order);
问题2:微信小程序加载慢
- 现象:首次打开需要加载大量资源
- 解决方案:
- 启用小程序分包加载
- 图片资源使用CDN加速
- 接口响应数据压缩
问题3:多门店数据统计性能差
- 现象:区域经理查看报表时响应缓慢
- 解决方案:
- 建立定时任务预计算统计数据
- 使用Redis缓存热门报表
- 添加适当数据库索引
6.3 未来优化方向
- 引入机器学习算法预测各门店最佳库存量
- 增加智能定价功能,根据季节和需求动态调整价格
- 开发员工绩效评估模块
- 接入更多第三方平台(美团、支付宝等)
- 实现自动化报表生成和邮件发送
这个项目让我深刻体会到软件开发不仅仅是编写代码,更需要理解业务场景和用户需求。通过这次毕业设计,我不仅巩固了SSM和Vue的技术栈,还学会了如何将一个完整的系统从设计到部署的全过程。特别是在性能优化和异常处理方面积累了很多实战经验,这些都是在课本上难以学到的宝贵知识。