【万字文档+源码】基于SpringBoot+Vue明星周边商城系统-可用于毕设-课程设计-练手学习-学习资料分享

一、项目概述

1.1 项目背景

随着追星文化不断普及，广大粉丝群体存在大量明星周边购买、交流需求，传统线下周边门店存在商品品类少、地域限制强、粉丝交流渠道缺失、商家管理分散等痛点。为整合明星周边售卖、商家入驻、粉丝互动、线上交易一体化服务，搭建明星周边线上商城平台，采用 SpringBoot+Vue 前后端分离架构开发。

系统划分三类角色：普通粉丝用户、入驻商家、平台管理员，分别对应前台购物端、商家后台、总管理后台；实现周边商品浏览选购、商家信息展示、粉丝论坛交流、公告资讯、订单全流程管控、数据可视化统计等完整电商业务，解决线下周边交易的各类短板，打造规范化线上明星周边交易社区。

1.2 开发目标

1. 多角色权限隔离：粉丝用户前台购物、商家后台自主管理商品、管理员总控全平台数据，三类账号权限相互隔离，防止越权操作。

2. 粉丝前台核心功能：账号注册登录、首页轮播推荐、周边分类筛选、商家查询浏览、周边商品详情查看、收藏商品、购物车、下单支付、论坛发帖评论、公告资讯查看、个人订单与资料管理。

3. 商家 / 管理员后台功能：

   • 管理员：可视化数据大屏、用户管理、商家审核管理、周边种类分类维护、全量周边商品管理、论坛帖子审核、公告管理、订单总览、系统配置、个人资料修改。

   • 商家：入驻管理、上架 / 编辑周边商品、管理自身订单、回复商品评论、修改店铺信息。

4. 通用基础功能：多条件模糊检索、分页展示、新增 / 编辑 / 批量删除、图片上传、收藏、评论管理、表单校验、角色鉴权、ECharts 数据统计。

5. 完整业务闭环：商家入驻上架明星周边→粉丝前台浏览、收藏、下单购买→后台生成订单，管理员管控全平台商品与社区内容，论坛实现粉丝交流互动。

1.3 系统角色划分

二、整体技术架构

2.1 架构模式

标准前后端分离架构，前端页面渲染、后端业务逻辑完全解耦：

1. 后端服务：SpringBoot 搭建 RESTful API 接口，处理业务逻辑、事务、权限校验、数据库 CRUD；

2. 粉丝前台：Vue3 + Element Plus 开发面向消费者的商城页面；

3. 管理后台（管理员 + 商家共用）：Vue3 + Element Plus 轻量化管理系统；

4. 数据存储：MySQL8.0 持久化用户、商家、周边商品、订单、论坛、公告全量业务数据；

5. 身份认证：JWT 无状态令牌，区分粉丝、商家、管理员三种角色，拦截非法越权访问。

2.2 后端技术栈

• 核心框架：SpringBoot 2.7.x，内置 Tomcat，简化 XML 配置，快速启动项目；

• Web 层：SpringMVC，负责请求分发、参数统一校验、统一结果封装返回；

• 持久层：MyBatis + MyBatis-Plus，封装通用 CRUD、分页插件、逻辑删除，简化数据库操作；

• 数据库：MySQL 8.0，使用事务保障下单扣库存、订单创建等核心业务数据一致性；

• 安全认证：JWT + 全局拦截器，登录鉴权、多角色权限区分；

• 工具类：Lombok 简化实体类、Hutool 实现图片上传、Validation 表单校验、SLF4J 日志记录；

• 分层规范：Controller 控制层、Service 业务层、Mapper 持久层、Entity 实体、DTO 传输对象、Config 配置、Common 公共工具包。

2.3 前端技术栈（前台 + 后台统一）

• 核心框架：Vue3 组合式 API + Vite 构建工具；

• 路由：Vue Router，路由守卫拦截未登录用户访问购物车、订单、发帖页面；

• 状态管理：Pinia，存储登录账号、角色、购物车临时数据；

• UI 组件库：Element Plus，表格、弹窗、图片上传、分页、搜索、图表等组件；

• 网络请求：Axios 统一封装请求拦截器，自动携带 Token、捕获异常弹窗提示；

• 可视化图表：ECharts，实现后台商家数量、周边商品、分类占比统计图表；

• 样式：SCSS + Flex 弹性布局，适配 PC 端主流浏览器。

2.4 开发与部署工具

• 后端开发：IDEA、Maven3.6、Navicat、Postman 接口调试；

• 前端开发：VS Code、Node.js 16、NPM 包管理器；

• 版本管理：Git；

• 部署方案：后端打包 Jar 包独立运行，Nginx 反向代理前端静态资源，支持 Windows、Linux CentOS 服务器部署。

三、系统功能模块详细设计

3.1 粉丝前台商城模块

3.1.1 登录注册模块

独立登录页面，支持账号密码登录；新粉丝跳转注册页面，填写账号、密码、姓名、年龄、性别并上传头像完成注册；未登录状态无法使用收藏、购物车、下单、论坛发帖功能。

3.1.2 商城首页模块

顶部轮播 banner 展示平台活动；「周边信息推荐」区域提供全部分类快捷筛选标签，展示热门明星周边商品卡片；顶部导航栏包含首页、商家、周边信息、论坛、公告信息五大入口。

3.1.3 商家浏览模块

支持按商家号、商家名称关键词检索；卡片展示商家封面、名称、入驻时间，点击可进入商家店铺查看该商家全部明星周边商品。

3.1.4 周边信息商品模块

1. 分类筛选栏：顶部展示全部周边种类标签，一键筛选对应品类周边；支持按价格、点击量排序；

2. 商品卡片：展示周边配图、名称、所属分类、所属商家、售价、发布时间；

3. 商品详情页：展示多图预览、规格、库存、价格、商家联系方式、商品介绍；支持收藏、加入购物车、立即购买、查看其他用户评论。

3.1.5 论坛交流模块

粉丝交流板块，提供帖子标题检索功能；可查看全部粉丝发布的讨论帖，支持点击「发布帖子」分享追星心得、周边测评；每条帖子展示标题、发布人、发布时间，支持评论互动。

3.1.6 公告信息模块

平台官方资讯页面，展示上新活动、优惠活动、平台规则公告，支持关键词检索公告标题与简介。

3.1.7 购物车 & 订单模块

购物车存放意向周边，支持修改购买数量、批量勾选结算；提交订单校验库存，完成支付生成订单；个人中心可查看全部待支付、已发货、已完成订单。

3.1.8 个人中心模块

修改账号头像、姓名、登录密码；查看我的收藏、我的订单、我的发帖与评论记录。

3.2 管理员总后台管理模块

管理员登录页区分管理员 / 商家两种角色单选框，登录后进入系统数据可视化首页。

3.2.1 数据可视化首页

欢迎面板展示商家总数、周边信息总数；搭配三类 ECharts 图表：商家数量柱状统计图、周边商品横向柱状统计图、周边种类占比饼图，直观展示平台运营数据。

3.2.2 用户管理

管理全部注册粉丝账号，支持多条件检索、新增、编辑、禁用、删除用户，查看用户订单、收藏、发帖记录。

3.2.3 商家管理

管控所有入驻商家，支持检索、审核商家资质、修改店铺信息、下架违规商家，查看商家上架的全部周边商品。

3.2.4 周边种类管理

维护明星周边一级分类字典，列表展示分类名称、分类配图；提供搜索、新增、批量移除、单条浏览 / 更新 / 删除操作，分类数据同步至前台筛选栏。

3.2.5 周边信息管理

全平台所有明星周边商品数据列表，展示周边名称、分类、商品图、商家信息、价格、点击量、评论数、收藏数；支持浏览详情、更新商品、查看用户评论、移除下架违规周边，支持多条件联合检索分页展示。

3.2.6 论坛管理

审核、删除粉丝发布的违规帖子，管理所有帖子下用户评论，维护社区交流环境。

3.2.7 公告管理

发布、编辑、删除平台活动、规则公告，上传公告封面，管控前台展示的全部资讯内容。

3.2.8 订单管理

汇总平台所有粉丝下单记录，查看订单状态、购买周边、收货信息、支付金额，处理售后、发货审核操作。

3.2.9 系统管理 & 个人资料

系统基础参数、轮播图配置；管理员修改后台登录密码、头像，退出登录。

四、核心数据库表设计

1. admin 管理员表
   id、用户名、密码、头像、姓名、创建时间、逻辑删除标识

2. merchant 商家表
   id、商家号、商家名称、账号、密码、联系电话、商家地址、店铺封面、入驻时间、审核状态、删除标识

3. user 粉丝用户表
   id、账号、密码、姓名、年龄、性别、头像、注册时间、账号状态

4. goods_type 周边种类表
   id、分类名称、分类配图、排序、创建时间

5. goods 明星周边商品表
   id、周边名称、分类 id、商品配图、商家 id、商家号、商家名称、联系电话、商家地址、价格、点击次数、评论数、收藏数、商品详情、上架时间、库存、状态

6. goods_collect 商品收藏表
   id、用户 id、商品 id、收藏时间

7. cart 购物车表
   id、用户 id、商品 id、购买数量、创建时间

8. orders 订单表
   id、订单编号、用户 id、商品 id、购买数量、实付金额、订单状态、下单时间、收货地址

9. goods_comment 商品评论表
   id、商品 id、用户 id、评论内容、评论时间

10. forum_post 论坛帖子表
    id、用户 id、帖子标题、帖子内容、配图、发布时间、状态

11. forum_comment 论坛评论表
    id、帖子 id、用户 id、评论内容、评论时间

12. notice 平台公告表
    id、标题、简介、封面图、正文、发布时间、点击量

五、核心业务流程

5.1 商家入驻 & 商品上架流程

1. 商家在后台登录页选择商家身份，注册提交店铺信息；

2. 管理员后台审核商家，审核通过后商家获得上架商品权限；

3. 商家登录后台，选择周边分类，填写周边名称、价格、图文详情、上传商品图片，新增周边；

4. 商品自动同步至前台商城，粉丝可筛选、浏览、收藏、下单。

5.2 粉丝购买下单流程

1. 粉丝前台浏览明星周边，筛选分类或搜索商品，查看详情；

2. 调整购买数量，加入购物车或直接立即购买；

3. 填写收货地址，核对商品与金额提交订单；

4. 系统校验商品库存，完成支付后订单状态更新为「待发货」；

5. 商家后台查看本店待发货订单，确认发货；

6. 粉丝个人中心查看物流，确认收货完成交易。

5.3 论坛粉丝互动流程

1. 登录粉丝进入论坛页面，点击发布帖子，填写标题、内容、上传配图提交；

2. 全部粉丝可浏览帖子并发表评论；

3. 管理员后台审核所有帖子，删除违规、无关追星内容，规范社区环境。

5.4 平台公告发布流程

1. 管理员后台新增公告，填写标题、简介、正文并上传宣传封面；

2. 公告同步至前台公告页面，粉丝可检索查看平台上新、优惠活动资讯。

六、核心技术难点与解决方案

6.1 三类角色权限隔离（粉丝 / 商家 / 管理员）

难点：粉丝不能访问商家、管理员后台；商家仅能操作自家商品，不能修改其他商家数据；管理员拥有全平台权限。
方案：登录 JWT 令牌携带角色标识，后端拦截器校验接口访问权限；前端根据登录角色隐藏无权限菜单与按钮，非法接口直接拦截返回提示。

6.2 下单并发库存超卖问题

难点：多名粉丝同时抢购同一款周边，易出现库存负数、超卖订单。
方案：下单业务添加@Transactional事务注解，扣减库存、生成订单同步执行，出现异常自动回滚；增加分布式库存锁控制并发请求。

6.3 多图统一上传（商品图、公告封面、头像、商家封面）

难点：多张图片上传重名覆盖、前台图片加载 404 失效。
方案：Hutool 工具生成唯一随机文件名，统一静态资源存储目录，Nginx 配置图片访问映射，支持多图批量上传、实时预览。

6.4 多条件复合分页查询

难点：后台商品、商家、用户数据量大，需要名称、价格、分类、时间多维度筛选。
方案：基于 MyBatis-Plus 动态拼接 SQL 查询条件，集成分页插件，高效实现模糊检索、分页加载，适配大数据量运维场景。

6.5 ECharts 可视化数据渲染

难点：后台统计图表需要实时聚合数据库商家、商品、分类数据并渲染。
方案：后端封装统计接口，聚合各类运营数据返回 JSON；前端 ECharts 接收数据自动渲染柱状图、饼图，实时展示平台数据。

6.6 全局统一异常处理

难点：库存不足、参数为空、未登录、商品下架、商家未审核等业务异常提示杂乱。
方案：使用@RestControllerAdvice全局捕获所有异常，区分业务异常与系统异常，返回标准化友好提示，前端弹窗展示给用户。

6.7 前后端跨域问题

难点：前后端分离端口不一致，浏览器同源策略拦截接口请求。
方案：后端全局配置 CORS 跨域规则，允许前端域名、Token 请求头跨域访问，适配开发环境与线上部署。

七、系统运行环境

7.1 后端环境

• JDK 1.8 及以上

• Maven 3.6+

• MySQL 8.0

• 内置 Tomcat 容器，Jar 包直接运行

7.2 前端环境

• Node.js 14/16

• NPM 包管理器

• 适配 Chrome、Edge、360 等主流 PC 浏览器

7.3 服务器部署

支持 Windows Server、Linux CentOS 部署；后端打包 Jar 后台常驻运行，Nginx 托管前端静态页面，可用于毕业设计演示或二次开发商用。

八、系统拓展优化方向

1. 集成微信 / 支付宝真实支付接口，替换模拟支付，实现完整线上交易链路；

2. 新增明星专区模块，按明星分组展示对应周边商品；

3. 完善实名认证，商家资质上传审核，提升平台交易可信度；

4. 支持订单、商品台账、用户数据 Excel 批量导出，方便商家对账、平台统计；

5. 新增短信通知，下单、发货、论坛回复推送短信提醒粉丝；

6. 新增会员积分体系，消费积分可抵扣周边购买金额；

7. 增加直播带货模块，商家线上直播售卖明星周边；

8. 定时任务自动下架长期零库存周边、归档过期平台公告。

九、项目总结

本明星周边商城系统基于 SpringBoot+Vue 前后端分离架构开发，面向追星粉丝与周边入驻商家，打通明星周边展示、线上购买、商家入驻、粉丝社区交流、平台管控完整电商业务链路。系统分为粉丝前台、商家后台、管理员总后台三类权限端，角色划分清晰，覆盖周边分类、商品管理、商家审核、订单交易、论坛互动、数据可视化、公告资讯全维度功能，解决传统线下明星周边门店地域受限、交流缺失、管理分散的行业痛点。

十、项目资料

👇🏻 精彩专栏推荐订阅👇🏻 在下方专栏👇🏻不然下次找不到哟
《Java精品推荐项目》
《springboot+vue项目100套》
《ssm项目100套》
《微信小程序合集》