SpringBoot+Vue汉服租赁系统开发实践

倩Sur

1. 项目概述

汉服作为中国传统服饰文化的瑰宝，近年来在年轻人群体中掀起了一股复兴热潮。随着汉服爱好者群体的不断扩大，汉服租赁市场也迎来了快速发展期。然而，传统的汉服租赁管理多依赖手工记录和线下交易，存在效率低下、管理混乱等问题。基于此背景，我们设计开发了这套基于SpringBoot的民族服饰汉服租赁管理系统。

这套系统采用B/S架构，前端使用Vue.js框架，后端基于SpringBoot+MyBatisPlus技术栈，数据库选用MySQL。系统实现了汉服租赁全流程的数字化管理，包括用户管理、服饰管理、订单管理、支付结算等核心功能模块。通过该系统，汉服租赁商家可以高效管理库存、处理订单、统计营收；用户则能便捷地浏览服饰、在线预约、完成支付。

2. 系统架构设计

2.1 技术选型解析

后端技术栈

我们选择SpringBoot作为后端框架主要基于以下考虑：

快速开发：SpringBoot的自动配置和起步依赖大大简化了项目搭建过程
微服务友好：便于后期扩展为微服务架构
生态丰富：整合了Spring生态系统的各种组件
内嵌Tomcat：简化部署流程

数据库访问层采用MyBatisPlus而非原生MyBatis，主要因为：

内置通用CRUD操作，减少重复代码
强大的条件构造器，简化复杂查询
支持Lambda表达式，类型安全的查询
分页插件开箱即用

前端技术栈

Vue.js作为前端框架的优势：

轻量级，学习曲线平缓
组件化开发，提高代码复用率
响应式数据绑定，简化DOM操作
丰富的生态系统（Vuex、Vue Router等）

数据库选型

MySQL关系型数据库的选择理由：

开源免费，降低项目成本
性能稳定，社区支持完善
适合结构化数据存储
与Java生态集成良好

2.2 系统架构设计

系统采用经典的三层架构：

表现层：Vue.js实现的前端界面
业务逻辑层：SpringBoot实现的后端服务
数据访问层：MyBatisPlus+MySQL

架构图如下：

code复制[前端] Vue.js 
    ↓ HTTP/HTTPS
[后端] SpringBoot (REST API)
    ↓ JDBC
[数据库] MySQL

这种分层架构的优势在于：

职责分离，便于维护
可独立扩展各层
前后端分离，提高开发效率
接口标准化，便于对接其他系统

3. 核心功能模块实现

3.1 用户管理模块

用户认证流程

注册阶段：
- 前端收集用户名、密码、联系方式等信息
- 后端进行数据校验（用户名唯一性、密码强度等）
- 密码使用BCrypt加密后存储
- 生成初始用户角色和权限
登录阶段：
- 用户提交凭证
- 后端验证凭证有效性
- 生成JWT令牌返回客户端
- 前端存储令牌用于后续请求认证

关键代码示例（Spring Security配置）：

java复制@Configuration
@EnableWebSecurity
public class SecurityConfig extends WebSecurityConfigurerAdapter {
    
    @Override
    protected void configure(HttpSecurity http) throws Exception {
        http.csrf().disable()
            .authorizeRequests()
            .antMatchers("/api/auth/**").permitAll()
            .anyRequest().authenticated()
            .and()
            .addFilter(new JwtAuthenticationFilter(authenticationManager()))
            .sessionManagement().sessionCreationPolicy(SessionCreationPolicy.STATELESS);
    }
    
    @Bean
    public PasswordEncoder passwordEncoder() {
        return new BCryptPasswordEncoder();
    }
}

权限管理设计

系统采用RBAC（基于角色的访问控制）模型：

用户-角色-权限三级结构
权限细粒度到API级别
前端根据权限动态渲染菜单

权限校验流程：

解析JWT获取用户身份
查询用户拥有的角色和权限
比对请求资源所需的权限
通过/拒绝访问

3.2 汉服管理模块

服饰信息设计

汉服实体包含以下关键属性：

基础信息：名称、朝代、款式、尺码
媒体信息：主图、详情图、视频
库存信息：总数量、可租数量
租赁信息：租金、押金、最短租期

数据库表设计：

sql复制CREATE TABLE `hanfu` (
  `id` bigint NOT NULL AUTO_INCREMENT,
  `name` varchar(100) NOT NULL COMMENT '汉服名称',
  `dynasty` varchar(50) NOT NULL COMMENT '朝代',
  `style` varchar(50) NOT NULL COMMENT '款式',
  `main_image` varchar(255) NOT NULL COMMENT '主图URL',
  `price_per_day` decimal(10,2) NOT NULL COMMENT '日租金',
  `deposit` decimal(10,2) NOT NULL COMMENT '押金',
  `total_stock` int NOT NULL COMMENT '总库存',
  `available_stock` int NOT NULL COMMENT '可租数量',
  `status` tinyint NOT NULL DEFAULT '1' COMMENT '状态：1-上架 0-下架',
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

服饰检索实现

支持多条件组合查询：

基础搜索：关键词模糊匹配名称和描述
高级筛选：按朝代、款式、价格区间等
排序：按热度、价格、上架时间等

使用MyBatisPlus的条件构造器实现复杂查询：

java复制public Page<HanfuVO> searchHanfu(HanfuQuery query, Pageable pageable) {
    QueryWrapper<Hanfu> wrapper = new QueryWrapper<>();
    
    if (StringUtils.isNotBlank(query.getKeyword())) {
        wrapper.like("name", query.getKeyword())
               .or().like("description", query.getKeyword());
    }
    
    if (query.getDynasty() != null) {
        wrapper.eq("dynasty", query.getDynasty());
    }
    
    if (query.getMinPrice() != null) {
        wrapper.ge("price_per_day", query.getMinPrice());
    }
    
    if (query.getMaxPrice() != null) {
        wrapper.le("price_per_day", query.getMaxPrice());
    }
    
    wrapper.eq("status", 1);
    
    return hanfuMapper.selectPage(new Page<>(pageable.getPageNumber(), pageable.getPageSize()), wrapper)
           .convert(this::convertToVO);
}

3.3 租赁订单模块

订单业务流程

用户选择汉服和租期
系统计算租金和押金总额
用户确认订单并支付押金
商家备货并确认订单
用户取衣/商家发货
用户归还服饰
系统结算租金，退还剩余押金

状态机设计：

code复制待支付 → 已支付 → 待确认 → 已确认 → 租赁中 → 已归还 → 已完成
           ↓             ↓
        取消订单      取消订单

库存控制方案

采用乐观锁解决并发问题：

查询时获取当前版本号
更新时校验版本号是否变化
版本号一致才执行更新

关键SQL：

sql复制UPDATE hanfu 
SET available_stock = available_stock - 1, 
    version = version + 1 
WHERE id = ? AND version = ?

3.4 支付结算模块

支付流程设计

前端发起支付请求
后端创建支付记录
调用第三方支付接口
接收支付结果回调
更新订单状态

支付状态处理：

轮询前端查询支付状态
同时处理异步回调通知
设置支付超时时间（通常30分钟）

资金安全保障

敏感操作记录详细日志
关键业务流程添加事务
金额计算使用BigDecimal避免精度问题
定期对账确保数据一致性

4. 系统特色与创新点

4.1 汉服特色功能设计

朝代款式分类体系

系统建立了专业的汉服分类体系：

按朝代：汉、唐、宋、明等
按款式：曲裾、直裾、襦裙、道袍等
按场合：日常、婚庆、礼仪等

分类数据使用字典表管理，便于扩展：

sql复制CREATE TABLE `hanfu_category` (
  `id` int NOT NULL AUTO_INCREMENT,
  `type` varchar(20) NOT NULL COMMENT '分类类型',
  `code` varchar(50) NOT NULL COMMENT '分类编码',
  `name` varchar(100) NOT NULL COMMENT '分类名称',
  `sort` int DEFAULT '0' COMMENT '排序',
  PRIMARY KEY (`id`),
  UNIQUE KEY `idx_type_code` (`type`,`code`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;