SpringBoot+Vue构建烘焙O2O系统实战

1. 项目背景与核心价值

团子烘焙销售服务系统是一个典型的O2O电商平台，专为中小型烘焙店铺设计。我在实际开发中发现，传统烘焙店在数字化转型过程中面临三大痛点：订单管理混乱（微信接单容易遗漏）、库存损耗率高（人工记录误差大）、客户粘性低（缺乏会员体系）。这个系统正是为解决这些问题而生。

系统采用SpringBoot+Vue的主流技术栈，后端使用Spring Security做权限控制，前端通过Element UI实现响应式布局。特别值得一提的是，我们针对烘焙行业特性做了深度定制：

• 商品支持"按重量计价"（如蛋糕）和"按件计价"（如面包）混合模式
• 开发了原料反算功能（卖出一个6寸蛋糕自动扣除对应面粉、奶油用量）
• 集成微信支付+到店自提的本地化方案

提示：毕业设计选择这类"传统行业+互联网"的结合点特别容易获得高分，既能展示技术深度，又体现实际问题解决能力。

2. 系统架构设计解析

2.1 技术选型决策过程

后端选择SpringBoot而非SSM框架主要基于三点考量：

1. 自动配置特性大幅减少XML配置（对比SSM框架可节省40%配置代码）
2. 内嵌Tomcat方便演示（答辩时直接java -jar运行）
3. Starter生态完善（整合Redis缓存只要添加spring-boot-starter-data-redis依赖）

前端采用Vue+ElementUI组合是因为：

• 组件化开发效率高（一个商品卡片组件复用在首页/订单页/管理后台）
• Axios拦截器统一处理Token过期（401自动跳登录页）
• 相比React更易上手（适合毕业设计时间有限的情况）

2.2 数据库关键设计

商品表的特殊设计值得重点说明：

sql复制CREATE TABLE `product` (
  `id` bigint NOT NULL AUTO_INCREMENT,
  `name` varchar(100) NOT NULL COMMENT '商品名',
  `price_type` tinyint NOT NULL COMMENT '1-按重量 2-按件数',
  `base_price` decimal(10,2) COMMENT '基准价（元/克或元/件）',
  `min_weight` int DEFAULT NULL COMMENT '最低起售克数',
  `cover_img` varchar(255) NOT NULL COMMENT '封面图URL',
  `status` tinyint DEFAULT '1' COMMENT '0-下架 1-上架',
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

这种设计实现了：

• 同一套逻辑处理称重商品和计件商品
• 前端根据price_type动态切换价格展示方式（显示"元/50g"或"元/个"）
• 后台统计时统一按base_price计算营收

3. 核心功能实现细节

3.1 原料反算算法

烘焙行业特有的原料成本控制模块，业务逻辑如下：

java复制public void deductMaterial(Long productId, BigDecimal amount) {
    // 1. 查询商品对应的原料组成
    List<Recipe> recipes = recipeMapper.selectByProductId(productId);
    
    // 2. 遍历每种原料进行扣减
    for (Recipe recipe : recipes) {
        // 按重量计价：amount是克数 
        // 按件数计价：amount是件数×单个产品用量
        BigDecimal used = recipe.getPerAmount().multiply(amount);
        
        // 3. 更新库存（带乐观锁防止超卖）
        materialMapper.updateStock(
            recipe.getMaterialId(), 
            used.negate(), 
            LocalDateTime.now()
        );
    }
}

注意：这里必须用BigDecimal做精确计算，使用double会导致分润误差。实际测试中发现，用double计算100次交易后会出现0.3元左右的资金误差。

3.2 微信支付集成方案

采用官方JSAPI支付流程，关键步骤包括：

1. 后端生成预付单（需配置微信商户证书）

bash复制# 证书存放建议路径
resources/
├── cert/
│   ├── apiclient_cert.p12
│   ├── apiclient_key.pem
│   └── apiclient_cert.pem

2. 前端调用wx.chooseWXPay唤起支付

javascript复制wx.chooseWXPay({
    timestamp: res.data.timeStamp, 
    nonceStr: res.data.nonceStr,
    package: 'prepay_id=' + res.data.prepayId,
    signType: 'MD5',
    paySign: res.data.paySign,
    success: function () {
        // 跳转到订单完成页
    }
});

3. 支付结果异步通知处理（必须做签名验证）

java复制@PostMapping("/notify")
public String payNotify(HttpServletRequest request) {
    // 1. 将request.getParameterMap()转换为SortedMap
    // 2. 验证签名（防止伪造通知）
    // 3. 处理业务逻辑（修改订单状态）
    // 4. 返回success或fail（微信会重试失败的通知）
}

4. 毕业设计加分技巧

4.1 答辩演示准备

建议按这个流程演示能拿高分：

1. 管理员账号登录 → 添加虚拟商品（展示按重量/按件设置）
2. 手机扫码预览H5页面 → 下单支付完整流程
3. 后台查看订单 → 展示原料自动扣减效果
4. 数据统计页 → 用ECharts展示近7天销售曲线

准备两套数据：

• 正常数据用于展示功能
• 边缘案例数据用于提问环节（如库存不足时的处理）

4.2 文档编写要点

除了常规的绪论、需求分析外，建议增加：

• 性能优化章节（用JMeter压测接口响应时间）
• 安全防护措施（XSS过滤、SQL注入防护）
• 本地化部署指南（包括微信支付证书配置）

特别提醒：系统流程图建议用PlantUML绘制，比Visio更专业：

plantuml复制@startuml
skinparam monochrome true
actor 用户 as user
participant "微信小程序" as wx
participant "后端服务" as server
database "MySQL" as db

user -> wx : 浏览商品
wx -> server : GET /api/products
server -> db : 查询商品列表
db --> server : 返回数据
server --> wx : JSON响应
wx -> user : 渲染页面
@enduml

5. 常见问题解决方案

5.1 跨域问题处理

开发阶段常见跨域报错，解决方案是在SpringBoot中添加配置类：

java复制@Configuration
public class CorsConfig implements WebMvcConfigurer {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
            .allowedOrigins("*")
            .allowedMethods("GET", "POST")
            .allowCredentials(true)
            .maxAge(3600);
    }
}

生产环境建议：

• Nginx反向代理解决跨域
• 启用HTTPS（微信小程序强制要求）

5.2 订单超卖问题

采用Redis分布式锁+数据库乐观锁双重保障：

java复制public boolean placeOrder(OrderDTO dto) {
    String lockKey = "order:" + dto.getProductId();
    // 获取Redis锁（设置3秒过期防止死锁）
    boolean locked = redisTemplate.opsForValue()
        .setIfAbsent(lockKey, "1", 3, TimeUnit.SECONDS);
    
    if (!locked) {
        throw new BusinessException("操作太频繁");
    }
    
    try {
        // 查询商品库存（带版本号）
        Product product = productMapper.selectWithLock(dto.getProductId());
        if (product.getStock() < dto.getQuantity()) {
            throw new BusinessException("库存不足");
        }
        
        // 更新库存（版本号校验）
        int rows = productMapper.updateStock(
            dto.getProductId(), 
            product.getVersion(), 
            dto.getQuantity()
        );
        
        return rows > 0;
    } finally {
        redisTemplate.delete(lockKey);
    }
}

6. 扩展方向建议

如果想进一步提升项目档次，可以考虑：

1. 增加智能推荐功能（基于用户历史购买记录推荐商品）
2. 开发微信小程序端（使用uni-app跨平台方案）
3. 接入第三方配送API（如达达、闪送）
4. 实现自动化报表（每日凌晨生成销售统计邮件）

我在实际开发中最大的体会是：烘焙行业的数字化不是简单照搬电商模式，需要深入理解"前店后厂"的运营特点。比如设置"今日现做"商品截止时间、处理客户自定糖度等个性化需求，这些细节往往决定系统的实用价值。