校猫日记 PawprintDiaries-H5 前端

校猫日记是一个基于 Vue3 和 uni-app 开发的校园猫咪管理平台。一个结合校园流浪猫救助管理和社交分享的社区平台，通过记录和分享学校流浪猫的信息，连接爱猫人士，共同为猫猫创造更好的生活环境，帮助校园内的猫咪志愿者更好地管理和关爱流浪猫，为救助工作提供信息支持，为学校管理提供数据参考。

目前校园流浪猫信息展示与交流平台原定功能任务实现（完成度约90%）基本完成。并且在服务器上完成测试部署，正处于已有功能测试和附加功能实现阶段。

后端代码也已开源，地址：https://github.com/vikis77/PawprintDiaries-SpringBoot

同时，欢迎大家来我的个人博客学习交流：https://luckyiur.com

体验入口地址：https://pawprintdiaries.luckyiur.com/

实际页面效果如下（图片更新于2024/12，最新版已对部分页面重新优化）

主要功能

• 记录和管理流浪猫的基本信息，如照片、健康状况和活动范围。
• “小猫时间轴”功能，记录管理每个小猫发生的关键事件。
• 提供便捷的界面，方便用户查看以上信息信息，方便管理方记录管理。
• AI智能问答助手，可以快速回答校猫相关问题。
• 用户可以发布自己的帖子，可以分享和查看猫咪的照片和日常故事。
• 类似于社交平台的分享模式，增强用户之间的互动。
• 支持用户之间的评论点赞功能。
• 支持给小猫、帖子进行点赞，促进用户之间的社交互动。
• 支持用户发起领养申请，提供爱心捐赠入口。
• 通过地图功能跟踪和记录流浪猫的活动路径，支持用户上传跟踪记录。
• 提供流浪猫数量和分布等数据的可视化分析。
• 提供爱心救助组织资金管理功能，包括资金数据的记录和可视化数据分析。
• 目前已实现猫猫品种的拍照识别功能（由于缺少校园猫猫图像数据集，校猫识别功能将会被搁置或取消）。
• 内容审核：因为平台支持用户发布内容，为了平台内容安全考虑，新增对用户发布的帖子和评论（包括小猫评论和帖子评论）审核功能，只有审核通过的内容才会公开展示。
• 角色管理：平台拥有多个功能和接口，有些功能是只有登录用户或管理员（工作人员）才能使用的，为了做区分限制，加入可以对用户赋予角色的功能，不同角色拥有不同权限。
• 内容搜索：支持了对平台的公开帖子和校猫进行搜索，方便用户快速定位感兴趣的小猫及其相关联的用户帖子。

部分技术栈及说明

• AI 智能问答助手：基于 Dify（生成式 AI 应用创新引擎）搭建 AI Workflow 编排，支持 RAG 检索，并集成 ChatGPT 4o mini、DeepSeek-V3、DeepSeek-R1 等多种模型 API，结合知识库优化问答效果。
• Vue.js
• uni-app 跨端开发框架
• uView UI 组件库
• 高德地图 JS SDK API
• Pinia状态管理

运行环境

• Node.js
• npm/yarn 包管理器

开发命令

npm run dev

或者 将项目使用 HbuilderX 打开，运行H5至浏览器（推荐）。

项目结构（旧版结构，未更新）

PawPrint Diaries/ ├── src/ # 源代码目录 │ ├── api/ # API 接口定义 │ │ ├── user.js # 用户相关接口 │ │ ├── post.js # 帖子相关接口 │ │ └── ... │ ├── components/ # 全局通用组件 │ │ ├── common/ # 基础组件 │ │ │ ├── NavBar.vue # 导航栏组件 │ │ │ └── ... │ │ └── business/ # 业务组件 │ ├── composables/ # 组合式函数 │ │ ├── useUser.js # 用户相关逻辑 │ │ └── ... │ ├── config/ # 配置文件 │ │ ├── env.js # 环境配置 │ │ └── constants.js # 常量配置 │ ├── pages/ # 页面文件 │ │ ├── index/ # 首页 │ │ ├── user/ # 用户相关页面 │ │ └── ... │ ├── router/ # 路由配置 │ ├── store/ # 状态管理 │ │ ├── modules/ # 模块化的状态 │ │ └── index.js │ ├── styles/ # 全局样式 │ │ ├── variables.scss # 变量 │ │ ├── mixins.scss # 混入 │ │ └── global.scss # 全局样式 │ ├── utils/ # 工具函数 │ │ ├── request.js # 请求封装 │ │ ├── storage.js # 存储工具 │ │ └── ... │ ├── App.vue # 根组件 │ └── main.js # 入口文件 ├── static/ # 静态资源 │ ├── images/ # 图片资源 │ ├── icons/ # 图标资源 │ └── fonts/ # 字体资源 ├── uni_modules/ # uni-app 插件 ├── .env.development # 开发环境变量 ├── .env.production # 生产环境变量 ├── manifest.json # uni-app 配置 ├── pages.json # 页面配置 ├── vite.config.js # Vite 配置 └── package.json # 项目配置