☰
基于多角色权限隔离与聚合支付集成的宠物寄养平台
2026/10/14 1:10:57 网站建设 项目流程

基于 Vue 2 与 Spring Boot 3 的宠物寄养系统 PC 用户端与管理后台的设计与实现

本文围绕宠物寄养业务场景,介绍一套包含 PC 用户端、商家后台与管理员后台的宠物寄养系统的设计与实现。

一、项目背景

随着宠物寄养需求的增长,用户需要一个可以浏览寄养套餐、管理宠物档案、在线预约下单、完成真实支付并与商家实时沟通的线上平台。

同时商家需要掌握本店经营数据、处理寄养订单、维护套餐与照料日志、回复用户评价;平台管理员需要对全平台订单、套餐、日志、评价、商家与账号进行统一监管。

本系统面向上述使用场景,解决多端身份隔离、真实支付接入、实时聊天、AI 辅助咨询以及多角色数据范围隔离等问题。

二、功能模块介绍

系统分为 PC 用户端、商家后台和管理员后台三个端。

角色所属端
用户PC 用户端
商家商家后台
管理员管理员后台

三、技术栈说明

前端:Vue 2.6、Vue Router 3、Vuex 3、Element UI 2、Axios、ECharts、QRCode

后端:Java 17、Spring Boot 3、MyBatis-Plus、JWT

数据库与中间件:MySQL,保存用户、店铺、套餐、订单、评价、行为、AI 会话和聊天消息等数据;实时能力采用 WebSocket 聊天与 SSE 大模型流式回答;外部能力对接兼容 OpenAI Chat Completions 协议的大模型服务,以及微信与支付宝支付

四、核心模块介绍

PC 用户端
用户
功能模块功能说明
账号与个人中心注册、登录、退出,查看并修改昵称、手机号、头像等资料,修改密码,PC 用户 Token 与后台 Token 分开保存
首页与套餐浏览展示平台服务介绍与推荐套餐,按套餐名称、商家等条件查询,查看套餐图片、价格、适用宠物、可预约数量、评分、服务内容与预约须知,查看关联评价并区分匿名评价
店铺详情查看店铺名称、图片、地址、联系电话、营业状态与店铺介绍,查看该店铺已公开套餐,进入在线咨询建立会话
宠物档案新增、编辑、删除和查看本人宠物,维护宠物名称、类型、品种、性别、年龄、体重、健康状况与备注,上传真实宠物照片,未上传时使用占位
预约、订单与真实支付选择套餐、宠物、寄养起止日期并填写联系人和寄养要求,按天数和单价计算金额,查看订单、支付状态、处理进度与照料日志,取消未支付且未确认订单,接入微信 Native 与支付宝 PC 网页支付,复用待支付记录,服务完成后按服务、环境、照料三个维度评分
在线咨询查看会话列表与历史消息,通过 WebSocket 与商家实时收发消息,支持消息持久化、未读数量、已读状态、心跳、断线重连与幂等去重
AI 寄养助手通过 SSE 流式接收大模型回答,解答寄养流程、宠物照料、套餐选择、订单操作与注意事项等问题,优先依据平台上下文回答
界面展示

注册页:填写信息,完成宠物寄养平台用户账号注册

登录页:用户填写账号信息登录宠物寄养系统

首页:展示平台寄养服务介绍和推荐寄养套餐

套餐列表页:展示各类宠物寄养套餐供用户浏览选择

套餐详情页:查看猫咪寄养套餐详情与用户评价

宠物档案页:管理您的宠物档案,可新增编辑删除宠物信息

订单页:查看个人寄养订单的状态和相关信息

订单页:查看个人订单,对待支付订单发起支付

AI寄养助手页:向AI寄养助手咨询宠物寄养相关问题

在线咨询页:查看会话列表,和商家实时聊天咨询

个人资料页:查看并修改个人资料,支持修改账号密码

商家后台
商家
功能模块功能说明
经营分析首页及经营分析页展示本店订单、收入、套餐和服务趋势
寄养订单只查看本店订单,处理已支付订单,推进确认、服务中和完成等状态
订单详情查看预约信息、宠物信息、支付信息及服务进度
套餐管理新增、编辑、上下架和维护本店套餐
照料日志为本店履约订单记录宠物照料情况
服务评价查看本店评价并进行商家回复
在线咨询只查看咨询本店的会话并实时回复用户
我的店铺维护本店资料、图片、地址、联系方式和营业状态

商家数据范围由后端根据当前登录账号绑定的 shopId 决定,不依赖前端自行传入店铺编号。

界面展示

首页:展示本店经营概况与订单相关统计数据

店铺信息管理:商家维护本店对外展示的店铺信息

套餐管理:商家维护本店寄养套餐,支持增删改操作

订单管理页:查看并处理本店所有寄养订单

订单详情页:查看寄养订单详情,可确认或拒绝接单

在线咨询页:商家实时回复用户的寄养咨询需求

服务评价管理:查看本店用户评价,可回复或删除评价

管理员后台
管理员
功能模块功能说明
数据分析查看平台核心业务数据及 ECharts 图形分析
订单管理查看和监管全平台寄养订单及处理进度
套餐管理与审核维护套餐并处理套餐审核
日志管理与审核查看照料日志并执行平台审核
评价管理与审核查看服务评价并执行审核管理
宠物管理查看和管理平台宠物档案
商家与店铺管理管理商家账号、店铺资料和审核状态
账号管理维护管理员和商家后台账号

管理员拥有平台视角,商家后台与管理员后台复用整体布局,但通过角色路由和后端权限校验展示不同菜单及数据范围。

界面展示

登录页:管理员登录宠物寄养管理后台

首页:展示平台核心业务数据与统计分析

数据分析页:展示平台核心业务数据的可视化分析

订单管理页:查看处理全平台待确认的寄养订单

订单管理页:查看监管全平台寄养订单信息与处理进度

套餐管理:查看全平台寄养套餐,支持编辑与上下架管控

日志管理页:管理员浏览平台全部宠物照料日志记录

评价列表页:查看全平台用户评价,可管控显示隐藏状态

宠物管理页:查看并管理平台所有用户的宠物档案

商家列表页:查看平台所有商家账号信息

商家店铺管理:管理员审核管理平台的商家店铺信息

账号管理页:维护管理员与商家后台的登录账号

五、主要业务流程

  1. 用户注册并登录 PC 用户端,进入个人中心维护个人资料。
  2. 用户在首页或店铺详情浏览寄养套餐,查看套餐详情与关联评价。
  3. 用户维护本人宠物档案,上传宠物照片并保存健康信息。
  4. 用户选择套餐、宠物、寄养起止日期,填写联系人和寄养要求,生成订单并计算金额。
  5. 用户通过微信 Native 或支付宝 PC 网页支付完成真实支付,系统更新订单支付状态。
  6. 商家在商家后台查看本店已支付订单,推进确认、服务中和完成状态。
  7. 商家为履约订单记录照料日志,平台管理员对日志进行审核。
  8. 用户通过 WebSocket 与商家在线咨询,或通过 AI 寄养助手获取流式回答。
  9. 服务完成后用户按服务、环境、照料三个维度评分并可选择匿名。
  10. 商家查看并回复本店评价,管理员对评价执行审核管理。

六、项目拓展性

套餐检索与经营分析可进一步引入更细粒度的统计维度,提升用户筛选与商家运营能力。

在线咨询可扩展图片与文件消息能力,并加强消息推送的稳定性。

AI 寄养助手可在现有兼容 OpenAI Chat Completions 协议的大模型服务基础上,扩展更多平台上下文与多轮对话能力。

支付环节可继续扩展更多支付渠道,并完善订单支付的异常补偿机制。

数据范围隔离机制可沿用到更多业务模块,支撑多商家、多角色的持续扩张。

源码获取说明

本文内容整理自本人项目/毕业设计实践,仅用于学习与技术交流。如需项目功能说明或系统交流,可通过文末微信二维码联系备注:CSDN。

需要专业的网站建设服务?

联系我们获取免费的网站建设咨询和方案报价,让我们帮助您实现业务目标

立即咨询