springboot流浪天使乐园管理系统

基于springboot+vue实现的流浪天使乐园管理系统（源码+L文+ppt）4-039

第4章　系统设计    

4.1　总体功能设计

一般个人用户和管理者都需要登录才能进入流浪天使乐园管理系统，使用者登录时会在后台判断使用的权限类型，包括一般使用者和管理者,一般使用者只能对流浪动物提供查阅和个别使用信息内容的查看，而管理者则能对多个信息内容提供使用。

整体系统的主要功能模块如图4-1：

图4-1　流浪天使乐园管理系统功能图

              

4.2　系统登录模块设计

用户在启动操作系统时会调用的一个模块。该模型通过用户输入的账号、密码来确定应用的类别，切换到该类应用的页面。

本模块的功能点包括：

1）确定账号与密码是否一致。

2）完全按照系统所规定使用权限的权限类型,，直接通过登陆进入到系统权限的制定管理页面中即可进行授权使用。

登录模块流程图如图4-2：

         

              

图4-2　登录模块流程图

4.3　数据库设计

管理静止网站时是由WEB客户端向Web传送静态页面，而Web客户端直接对所传送的静态页面进行管理。

实现动态网页数据库信息查询请求的最基本处理流程概括为：当一个WEB用户成功向动态网页服务器数据库发送信息请求成功后，对其动态页面库的一种主要的处理实现方法之一是，屏蔽掉其中所有动态HTML代码，只须使用一个动态的动态网页文件，由动态Web浏览器程序直接地在该数据库服务器上进行传递动态信息，然后再通过该数据库服务器的处理程序返回到信息集，由该Web应用服务器处理程序再一次将包含动态程序代码在内的动态页面，转化为一个静态页面信息并自动返回到网页浏览器。也就是网站在这个动态页里对网页信息自动进行检索并最终把这些信息自动返回传递到网站用户处的这个全自动化过程。

数据库查询示意图如图4-3：

图4-3　数据库查询示意图

数据库设计阶段目标表见表4-4：    

阶段	目标
概念设计	了解功能需求，通过分析系统功能定义出系统有哪些实体联系图(即E-R图)
逻辑设计	把E-R图转换成能处理的逻辑模型，检查是否满足第三范式的要求
物理设计	基于基本数据模型，生成适用于应用系统的物理结构

表4-4　数据库设计阶段目标表

4.3.1　E-R图设计

根据以上分析，本系统中包含多个实体，根据他们以及他们的关系绘制出E-R图如下：

(1)用户信息E-R图如下图4-5：

图4-5用户信息E-R图

(2)流浪动物E-R图如下图4-6：    

图4-6流浪动物E-R图

(3)收养信息E-R图如下图4-7：

图4-7收养信息E-R图

(4)领养信息E-R图如下图4-8：    

图4-8领养信息E-R图

(5)流浪天使乐园管理系统总体E-R图如下图4-9：

图4-9流浪天使乐园管理系统总体E-R图

4.3.2  数据库关系表设计（共18张表）

数据库关系表如下：    

表4-1：流浪动物评论表

字段名称	类型	长度	字段说明	主键	默认值
id	bigint		主键	主键
addtime	timestamp		创建时间		CURRENT_TIMESTAMP
refid	bigint		关联表id
userid	bigint		用户id
avatarurl	longtext	4294967295	头像
nickname	varchar	200	用户名
content	longtext	4294967295	评论内容
reply	longtext	4294967295	回复内容

表4-2：关于我们

字段名称	类型	长度	字段说明	主键	默认值
id	bigint		主键	主键
addtime	timestamp		创建时间		CURRENT_TIMESTAMP
title	varchar	200	标题
subtitle	varchar	200	副标题
content	longtext	4294967295	内容
picture1	longtext	4294967295	图片1
picture2	longtext	4294967295	图片2
picture3	longtext	4294967295	图片3

此处省略16张表。。。

表4-18：收养信息评论表

字段名称	类型	长度	字段说明	主键	默认值
id	bigint		主键	主键
addtime	timestamp		创建时间		CURRENT_TIMESTAMP
refid	bigint		关联表id
userid	bigint		用户id
avatarurl	longtext	4294967295	头像
nickname	varchar	200	用户名
content	longtext	4294967295	评论内容
reply	longtext	4294967295	回复内容

第5章　系统实现

5.1 用户前台系统功能模块实现

当游客打开系统的网址后，首先看到的就是首页界面。在这里，游客能够看到流浪天使乐园管理系统的导航条显示系统首页、流浪动物、收养信息、论坛交流、护养知识、在线客服、个人中心。系统首页界面如图5-1所示：    

图5-1系统首页界面

          

当用户进入前台系统进行相关操作前必须先注册登录，在注册页面填写用户账号、用户姓名、密码、确认密码、手机号、性别、年龄、头像等信息，前端将这些信息通过HTTP请求发送到Java后端。后端处理这些信息，检查用户名是否唯一，并将新用户数据存入MySQL数据库。完成后，后端向前端发送注册成功的确认，前端随后通知用户完成注册。这个过程实现了新用户的数据收集、验证和存储。如图5-2所示。    

图5-2用户注册界面图

用户登录，用户在登录页面通过填写账号、密码，完成登录，在登录流程中，用户首先在Vue前端界面输入用户名和密码。这些信息通过HTTP请求发送到Java后端。后端接收请求，通过与MySQL数据库交互验证用户凭证。如果认证成功，后端生成一个令牌（如JWT）并返回给前端，允许用户访问系统。这个过程涵盖了从用户输入到系统验证和响应的全过程。如图5-3所示。

    

图5-3用户登录界面图

          

用户点击流浪动物，在流浪动物页面的搜索栏输入动物昵称、品种、性别、状态，进行查询，还可以查看动物种类、品种、动物图片、性别、动物年龄、性情、体重kg、状态、发布时间、点击次数、评论数、收藏数等信息，如有需要可以进行领养申请或者收藏等操作；如图5-4所示。

          

图5-4流浪动物页面

          

用户点击收养信息，在收养信息页面的搜索栏输入标题、动物种类、性别、收养状态、姓名等信息，进行查询，还可以查看动物种类、动物图片、品种、性别、动物年龄、性情、收养状态、收养须知、账号、姓名、手机号码、收养状态等信息，如有需要可以进行评论或者收藏等操作如图5-5所示：    

图5-5收养信息页面

          

用户点击个人中心，在个人中心页面可以修改个人信息、密码修改等，还可以对修改密码、领养信息、收养信息、我的发布、我的收藏进行详细操作，如图5-6所示。

              

图5-6个人中心界面图

5.2管理员功能模块实现

本模块主要是使用者可以通过流浪天使乐园管理系统的首页进入该系统。用户输入正确的账号名和密码，一旦输入信息有错，将在系统显示错误提示，同时严禁系统用户做出其他动作。如果注册信息正确无误，系统就会按照使用者的身份信息做出有关权利的判定，用户进入前台系统，管理者则进入后台系统。管理员登录主页面如图5-7所示：

图5-7　管理员登录主页面          

管理员进入主页面，主要功能包括对系统首页、个人中心、用户管理、动物种类管理、流浪动物管理、领养信息管理、收养信息管理、论坛交流、系统管理等进行操作。管理员主页面如图5-8所示：

图5-8管理员主界面

用户信息功能在视图层（view层)进行交互，比如点击“添加”按钮或填写用户信息表单。这些用户信息动作被视图层捕获并作为请求发送给相应的控制器层(control1er层)。控制器接收到这些请求后，调用服务层(service层)以执行相关的业务逻辑，例如验证输入数据的有效性和与数据库的交互。服务层处理完这些逻辑后，进一步与数据访问对象层（DAO层)交互，后者负责具体的数据操作如查询、添加、修改或删除用户信息，并将操作结果返回给控制器。最终，控制器根据这些结果更新视图层，以便用户信息功能可以看到最新的信息或相应的操作反馈。在用户信息页面的输入栏中输入用户账号、用户姓名进行查询，可以查看到用户详细信息，并根据需要进行添加、修改或者删除等操作；如图5-9所示：

    

图5-9用户管理界面

   

流浪动物功能在视图层（view层)进行交互，比如点击“添加”按钮或填写流浪动物信息表单。这些流浪动物动作被视图层捕获并作为请求发送给相应的控制器层(control1er层)。控制器接收到这些请求后，调用服务层(service层)以执行相关的业务逻辑，例如验证输入数据的有效性和与数据库的交互。服务层处理完这些逻辑后，进一步与数据访问对象层（DAO层)交互，后者负责具体的数据操作如查询、添加、修改或删除流浪动物，并将操作结果返回给控制器。最终，控制器根据这些结果更新视图层，以便流浪动物功能可以看到最新的信息或相应的操作反馈。在流浪动物页面的输入 动物昵称、品种、性别、状态进行查询，可以查看到流浪动物详细信息，并根据需要进行添加、修改或者删除等操作。如图5-10所示：    

图5-10流浪动物管理界面

          

管理员点击动物种类管理，在动物种类管理页面输入动物种类等信息，可以查询或者添加、删除动物种类等操作。如图5-11所示：

图5-11动物种类管理界面

              

          

管理员点击领养信息管理，在领养信息管理页面对领养编号、动物昵称、动物种类、动物图片、品种、性别、动物年龄、性情、账号、姓名、手机号码、领养日期、审核回复、审核状态等信息，可以查询、审核或删除领养信息等操作。如图5-12所示：

图5-12领养信息管理界面

          

管理员点击收养信息管理，在收养信息管理页面对标题、动物种类、封面、品种、性别、动物年龄、性情、收养状态、账号、姓名、手机号码、评论数、收藏数等信息，可以查询或删除收养信息等操作。如图5-13所示：    

图5-13收养信息管理界面

          

管理员点击交流论坛，在交流论坛页面对贴子标题、用户名、状态、是否置顶、置顶时间等信息，可以查询或删除交流论坛等操作。如图5-14所示：

图5-14交流论坛界面    

          

管理员点击护养知识，在护养知识页面对标题、分类名称、发布人、点击次数、收藏数、图片等信息，可以查询、添加或删除护养知识等操作。如图5-15所示：

图5-15护养知识界面