基于SpringBoot+vue的宠物领养系统

1. 演示地址

后台：http://chongwulingyangxitong.xiaobias.com/chongwulingyangxitong/admin/dist/index.html
前台：http://chongwulingyangxitong.xiaobias.com/chongwulingyangxitong/front/index.html
管理员：admin/admin
用户：111/123456、222/123456
资源：https://fifteen.xiaobias.com/source/143

2. 项目简介

宠物领养系统是一个基于Web的在线平台，旨在连接宠物寻找新家与爱心人士领养需求。系统主要包含两大核心功能：宠物领养（用户领养宠物）与宠物认领（用户为走失宠物寻找主人）。系统还辅以教学视频、感谢信、公告信息等功能模块，为用户提供一个全面、可信的宠物领养与关爱社区。

3. 技术栈

3.1. 后端技术

• 核心框架: Spring Boot 2.2.2.RELEASE
• 持久层框架: MyBatis-Plus 2.3
• 数据库: MySQL 5.7.32
• 权限控制: Apache Shiro 1.3.2
• 工具库: Hutool, Commons-lang3, FastJson
• 其他: 百度AI Java SDK（预留接口，可用于图像识别等）

3.2. 前端技术 (后台管理 Admin)

• 核心框架: Vue.js
• UI框架: Element-UI
• 构建工具: Vue CLI
• 路由: Vue Router
• HTTP客户端: Axios
• 地图组件: VueAMap（基于高德地图）

3.3. 前端技术 (用户前台 Front)

• UI框架: Layui
• 样式与组件: 自定义CSS (xznstatic)、jQuery、Swiper (轮播图)
• 架构: 原生JS与Vue.js混合开发

3.4. 开发环境与工具

• 项目管理: Maven
• 数据库连接池: Spring Boot JDBC
• 热部署: Spring Boot DevTools

4. 详细介绍

4.1. 系统架构

系统采用经典的前后端分离架构。后端提供统一的RESTful API接口，前台（用户端）和后台（管理端）分别使用不同的前端技术栈进行开发，通过HTTP请求与后端交互。

4.2. 功能模块

4.2.1. 核心业务模块

1. 宠物领养模块 (chongwulingyang)

   • 功能：展示待领养的宠物信息（标题、类型、图片、详情）。
   • 流程：用户浏览 -> 申请领养 -> 后台审核 (chongwulingyangshenhe) -> 审核通过后完成领养。

2. 宠物认领模块 (chongwurenling)

   • 功能：用户发布走失宠物的信息，等待主人认领。
   • 流程：用户发布 -> 他人申请认领 -> 发布者审核 (chongwurenlingshenhe) -> 审核通过后完成认领。

4.2.2. 内容与社区模块

1. 教学视频模块 (jiaoxueshipin)

   • 功能：发布宠物喂养、训练等教学视频。支持视频播放、点赞/踩、收藏、留言互动。

2. 感谢信模块 (ganxiexin)

   • 功能：用户成功领养或认领后，可以发布感谢信，分享故事。

3. 公告模块 (news)

   • 功能：发布系统公告、新闻等信息。

4.2.3. 基础与支撑模块

1. 用户模块 (yonghu,users)

   • 分为普通用户(yonghu)和管理员(users)两种角色。
   • 支持用户注册、登录、个人信息管理。

2. 权限管理

   • 基于Shiro和Token（token表）进行接口级权限控制。
   • 前后端菜单(menu.js)和按钮权限动态配置。

3. 数据字典 (dictionary)

   • 统一管理系统中所有的下拉选项数据（如：宠物类型、申请状态、性别等）。

4. 系统配置 (config)

   • 管理首页轮播图等可配置信息。

4.3. 数据库设计

数据库名为chongwulingyangxitong，包含多张表，核心表及其关系如下：

• yonghu->chongwulingyang->chongwulingyangshenhe
• yonghu->chongwurenling->chongwurenlingshenhe
• yonghu->jiaoxueshipin->jiaoxueshipin_collection/jiaoxueshipin_liuyan
• dictionary表为其他表提供类型字段的映射关系。

4.4. 特色功能

• 双重审核机制：领养和认领均需后台管理员或发布者审核，保证流程严谨。
• 交互式社区：视频可点赞、收藏、评论，增强用户粘性。
• 精细化权限管理：不同角色（管理员、用户）看到的菜单和操作权限完全不同。
• 响应式前端：用户前台使用Layui，兼容不同设备；管理后台使用Element-UI，体验现代流畅。

5. 部分代码

5.1. 后端 SQL 建表语句（节选）

CREATETABLE`chongwulingyang`(`id`int(11)NOTNULLAUTO_INCREMENTCOMMENT'主键',`chongwulingyang_name`varchar(200)DEFAULTNULLCOMMENT'标题',`chongwulingyang_types`int(11)DEFAULTNULLCOMMENT'类型',`chongwulingyang_photo`varchar(200)DEFAULTNULLCOMMENT'宠物图片',`jieshu_types`int(11)DEFAULTNULLCOMMENT'是否被认领',`chongwulingyang_content`textCOMMENT'宠物详情',`create_time`timestampNULLDEFAULTNULLCOMMENT'创建时间',PRIMARYKEY(`id`))ENGINE=InnoDBAUTO_INCREMENT=3DEFAULTCHARSET=utf8COMMENT='宠物领养';CREATETABLE`chongwulingyangshenhe`(`id`int(11)NOTNULLAUTO_INCREMENTCOMMENT'主键',`chongwulingyang_id`int(11)DEFAULTNULLCOMMENT'宠物领养',`yonghu_id`int(11)DEFAULTNULLCOMMENT'领养用户',`chongwurenlingshenhe_text`textCOMMENT'认领凭据',`chongwulingyangshenhe_yesno_types`int(11)DEFAULTNULLCOMMENT'申请状态',`create_time`timestampNULLDEFAULTNULLCOMMENT'创建时间',PRIMARYKEY(`id`))ENGINE=InnoDBAUTO_INCREMENT=17DEFAULTCHARSET=utf8COMMENT='宠物领养审核';

5.2. 后端 Spring Boot 主配置 (application.yml)

server:port:11148servlet:context-path:/chongwulingyangxitongspring:datasource:driverClassName:com.mysql.cj.jdbc.Driverurl:jdbc:mysql://localhost:3306/chongwulingyangxitong?useUnicode=true&characterEncoding=utf-8&useJDBCCompliantTimezoneShift=true&useLegacyDatetimeCode=false&serverTimezone=GMT%2B8username:rootpassword:root

5.3. 前端 Vue (后台) 路由配置 (router-static.js节选)

{path:'/chongwulingyang',name:'宠物领养',component:chongwulingyang},{path:'/chongwulingyangshenhe',name:'宠物领养审核',component:chongwulingyangshenhe},{path:'/chongwurenling',name:'宠物认领',component:chongwurenling}

5.4. 前端 JS (前台) 权限判断函数 (config.js)

varisAuth=function(tableName,key){letrole=localStorage.getItem("userTable");letmenus=menu;for(leti=0;i<menus.length;i++){if(menus[i].tableName==role){for(letj=0;j<menus[i].backMenu.length;j++){for(letk=0;k<menus[i].backMenu[j].child.length;k++){if(tableName==menus[i].backMenu[j].child[k].tableName){letbuttons=menus[i].backMenu[j].child[k].buttons.join(',');returnbuttons.indexOf(key)!==-1||false}}}}}returnfalse;}

6. 部分截图

7. 项目总结

宠物领养系统是一个功能完整、设计清晰的Web应用程序。

1. 技术选型合理：项目采用了成熟且流行的技术栈组合（Spring Boot + Vue/Element-UI + Layui），兼顾了管理后台的现代化开发体验和用户前台的快速开发与兼容性。
2. 业务逻辑清晰：核心的领养与认领流程设计巧妙，通过审核机制保证了交易的可靠性和安全性。
3. 代码结构规范：前后端分离架构明确，数据库设计有据可循，SQL文件、实体类、Mapper、控制器等层次分明。
4. 功能丰富实用：不仅完成了核心业务，还引入了教学视频、社区互动（感谢信、评论）等元素，提升了平台的活跃度和用户价值。
5. 可扩展性强：预留了百度AI接口，为未来引入宠物图片智能识别（如品种识别）等功能提供了可能。细致的权限系统也为未来添加更多角色和功能打下了良好基础。

综上所述，该项目是一个优秀的、可用于实际部署运营的宠物领养平台原型，具有良好的实用性和进一步开发的潜力。