完成

README.md

@@ -2,22 +2,22 @@
 
 本次建设的动物信息分为以下功能：
 
-1. 数据录入与管理（前端基本完成，未接入后端）
+1. 数据录入与管理（前端基本完成，已接入后端）
    系统应提供数据录入功能，允许用户输入动物的基本信息，如种类、年龄、性别、体重、健康状况等。同时，系统应具备数据管理功能，包括数据的查询、修改、删除等操作，以便用户能够方便地管理和维护动物信息。
 
-2. 动物档案管理（前端基本完成，未接入后端）
+2. 动物档案管理（前端基本完成，已接入后端）
    系统应建立动物档案，记录动物的整个生命周期，包括出生日期、疫苗接种记录、疾病治疗记录、饲养记录等。这有助于跟踪动物的健康状况和饲养情况，为动物提供更好的管理和照顾。
 
-3. 饲养管理（前端基本完成，未接入后端）
+3. 饲养管理（前端基本完成，已接入后端）
    系统应提供饲养管理功能，包括饲养计划的制定、饲养任务的分配、饲养记录的管理等。这有助于确保动物获得适当的饲料和营养，保持健康生长。
 
-4. 健康监测与预警（前端基本完成，未接入后端）
+4. 健康监测与预警（前端基本完成，已接入后端）
    系统应具备健康监测功能，定期收集和分析动物的健康数据，如体温、心率、呼吸频率等。同时，系统应提供预警功能，当动物的健康数据出现异常时，及时提醒管理人员采取相应措施。
 
 5. 统计分析（前端基本完成，无需后端）
    系统应提供统计分析功能，对动物信息、饲养记录、健康数据等进行统计分析，生成各类报表和图表。这有助于管理人员了解动物的整体状况和饲养效果，为决策提供支持。
 
-6. 用户权限管理（前端基本完成，未接入后端）
+6. 用户权限管理（前端基本完成，已接入后端）
    系统应建立用户权限管理机制，对不同用户设置不同的权限，如管理员、饲养员、兽医等。这有助于确保系统的安全性和数据的保密性。
 
 使用的技术/资源：
@@ -26,6 +26,10 @@
 - ElementUI
 - axios
 
+# 说明
+首页统计面板没有对接后端，无法操作，只做观赏作用
+其余界面均实现基本的增删改查，健康监测等复杂的功能没有实现
+
 # 需要后端提供的数据
 
 一切以最终实现的接口为准，你需要前端提供什么数据就什么数据
@@ -224,123 +228,3 @@ health: {
 ## 统计分析
 ---
 无需后端
-
-## 需求分析
-
-一、引言
-
-动物园信息管理系统旨在为动物园内部人员（如系统管理员、饲养员、兽医等）提供一个便捷、高效的管理工具，以记录动物数据、提高管理效率、保障动物健康和福利。通过该系统，可以实时监控动物的各项体征数据，判断动物是否健康，并根据数据优化动物的生活环境，确保动物处于相对健康的状态。
-
-二、系统用户
-
-1. 系统管理员
-
-- 用户与权限管理：负责创建、修改和删除用户账户，分配不同角色的权限，确保系统数据的安全性和完整性。（用户管理，重要）
-- 系统设置与维护：进行系统参数配置，如数据备份策略、系统日志管理等，确保系统的稳定运行。（不重要）
-- 数据监控与报告：实时监控动物数据异常情况，生成各类统计报告，为动物园管理层提供决策支持。（统计分析，一般）
-
-3. 饲养员
-
-- 动物日常饲养记录：录入动物的饮食、行为、活动等日常饲养信息，确保数据的准确性和完整性。（饲养管理，重要）
-- 饲养计划制定与执行：根据动物种类、年龄、健康状况等因素，制定合理的饲养计划，并监控计划的执行情况。（饲养管理，一般）
-- 食物库存管理：预估食物库存情况，及时补充库存，避免食物短缺或浪费。（不重要）
-- 报警系统响应：接收系统发出的异常报警，及时处理异常情况，保障动物健康与安全。（不重要）
-
-5. 兽医
-
-- 动物体检数据录入与分析：录入动物的体重、体温、心跳等体征数据，进行健康评估，并生成诊断报告。（动物档案、健康检测，重要）
-- 疾病治疗与记录：制定治疗方案，记录治疗过程及效果，为动物健康提供有力保障。（动物档案，重要）
-- 报警系统响应：根据系统发出的异常报警，及时对患病动物进行诊断和治疗。（不重要）
-
-三、功能需求
-
-1. 数据管理（重要）
-
-- 信息录入：动物基本信息的录入和管理，包括种类、年龄、性别、体重、健康状况等。（重要）
-- 动物日常记录：饲养员可以记录动物的饮食、行为、活动等情况。
-- 动物体检数据录入：兽医可以实时更新动物的体重、体温、心跳、呼吸等体征数据，并上传相关诊断报告。
-- 动物档案管理：系统应该能够完整记录动物的生命周期信息，如出生日期、疫苗接种记录、疾病治疗记录、饲养记录等，确保数据的完整性和准确性。
-
-3. 数据查询与统计（重要）
-
-- 提供多种查询方式，如按动物种类、年龄、性别等条件查询动物信息。
-- 统计动物数量、饲养成本、疾病发生率等数据，为动物园管理提供决策支持。
-
-5. 健康与福利管理（一般）
-
-- 实时监控动物体征数据，设置异常数据阈值，当数据超过阈值时自动报警。
-- 提供动物健康评估功能，根据体征数据判断动物健康状态，并给出相应建议。
-- 记录动物福利措施实施情况，如改善动物生活环境、增加娱乐设施等。
-
-7. 权限管理（重要）
-
-- 为不同用户角色分配不同的权限，只有授权的用户能够访问系统的特定功能和数据确保系统数据的安全性和完整性。
-- 实现用户登录、注销功能，记录用户操作日志，便于追踪和审计。
-
-9. 系统维护与优化（不重要）
-
-- 提供数据备份与恢复功能，确保系统数据的安全可靠。定期备份系统数据，以防止数据丢失或系统故障。
-- 支持系统升级和扩展，以适应动物园管理需求的变化。
-
-四、报警系统分级（不一定来得及开发）
-
-报警系统应采用分级制度，根据紧急程度逐级递增决定响应策略。例如，可以设置以下报警级别：
-
-1. 一级报警：涉及动物生命安全或重大疾病的紧急情况，需立即处理。系统可根据预留手机号拨打电话提醒相关人员。
-2. 二级报警：动物体征数据异常但未造成严重危害或饲养计划执行不到位等情况，需尽快处理。系统可发送邮件或短信提醒相关人员。
-3. 三级报警：日常饲养记录缺失或数据录入错误等较小问题，可安排定期处理。
-
-报警系统闭环管理的流程：
-
-1.**报警触发：**报警系统根据预设的规则和条件，监测动物的健康状况、饲养记录等信息，当发现异常情况符合报警规则时，自动触发相应级别的报警。
-
-2.**通知相关人员：**报警系统根据报警级别选择适的通知方式，通知相关责任人员，如饲养管理员、兽医等。通知方式可以包括电话呼叫、短信、邮件等。
-
-3.**接收报警信息：**相关责任人员接收到报警信息后，需要及时查看并了解报警的具体内容和情况。系统应提供清晰明了的报警信息，包括动物种类、具体问题、位置等。
-
-4.**处理报警：**相关责任人员根据报警信息采取相应的处理措施，针对不同级别的报警，制定相应的应对策略。一级报警需要立即处理，二级报警需要尽快处理，三级报警可以安排定期处理。
-
-5.**解决问题：**相关责任人员在处理报警过程中，需要确保问题得到有效解决。对于一级报警和二级报警，需及时采取措施保障动物的健康和安全；对于三级报警，需要及时查明原因并采取相应措施，避免问题的再次发生。
-
-6.**反馈和记录：**处理报警后，相关责任人员需要向系统反馈处理结果，并在系统中记录处理过程和结果。系统应提供相应的反馈和记录功能，方便责任人员进行操作。
-
-7.**系统优化：**管理人员定期对报警系统的性能进行评估和分析，根据实际情况和反馈信息，对系统进行优化和改进。可以针对报警规则、通知方式、处理流程等方面进行调整，提高报警系统的准确性和效率。
-
-五、饲养计划闭环系统（不一定来得及开发）
-
-饲养计划的闭环是指在动物园信息管理系统中，通过制定、执行、监控和反馈的过程，实现对动物饲养的全面管理和持续优化。以下是饲养计划的闭环流程：
-
-1. **计划制定：**饲养管理员根据动物的种类、年龄、健康状况等因素，制定饲养计划。计划包括每日、每周或每月的饲养任务安排，确定每种动物的饲料类型、数量和喂养时间等。
-   如果动物患有疾病或健康问题，兽医可以在饲养计划中考虑到这些特殊情况，对饲养计划和管理流程进行调整和优化
-
-2. **任务分配：**系统根据制定的饲养计划，自动将任务分配给相应的饲养员。任务分配考虑到饲养员的工作时间、技能水平和工作负荷等因素，确保任务合理分配。
-
-3. **执行监控：**饲养员执行任务时，实时记录饲养过程中的关键信息，如喂养时间、饲料用量、动物反应等。同时，系统监控饲养过程中的异常情况，如动物健康状况异常、饲料不足等。
-
-4. **数据采集与分析：**系统定期采集和分析动物的健康数据和饲养记录，包括体重变化、食欲情况、疾病发生率等。通过数据分析，及时发现饲养过程中存在的问题和改进空间。
-
-5. **问题反馈与调整：**根据数据分析结果，系统生成饲养效果报告和健康预警信息。管理人员和饲养员根据报告和预警信息，及时调整饲养计划和执行策略，解决存在的问题，并优化饲养过程。
-
-六、饲料库存自动化管理系统（不一定来得及开发）
-
-针对动物园饲料库存管理，建立自动化管理系统同样能够提高效率、降低成本并确保饲料供应的及时性。以下是动物园饲料库存自动化管理的主要内容和流程：
-
-1. **自动化库存登记：**建立自动化系统，对动物园所有饲料进行自动化登记和识别，包括名称、规格、数量、购买日期、供应商信息等，实现饲料信息的自动采集和录入。
-
-2. **库存监控：**实时监测饲料库存的数量、质量和保质期等信息。如有即将过期的饲料，系统会自动发送通知提醒相关人员。通过自动化系统，管理人员可以随时查看库存情况，并及时采取补货或调拨等措施。
-
-3. **智能化补货策略：**根据库存监控数据和需求预测模型，制定智能化的补货策略。系统可以自动分析库存变化趋势和消耗情况，智能生成补货计划，并自动向供应商下订单，实现自动化补货流程。
-
-4. **库存记录和报告：**系统可以自动生成库存记录和报告，包括库存量、成本、动物饲养需求等数据。管理人员可以通过系统查看和分析库存数据，优化饲料库存结构和管理策略。
-
-七、非功能需求（略）
-
-1. 易用性：系统界面简洁明了，操作流程简单易懂，方便用户快速上手。
-2. 稳定性：系统应具有高可靠性，能够长时间稳定运行，减少故障率。
-3. 安全性：系统应采取必要的安全措施，保护用户数据和系统免受攻击和破坏。
-4. 可扩展性：系统应具备良好的可扩展性，以便在未来添加新的功能模块或集成其他系统。
-
-八、总结（略）
-
-动物园信息管理系统旨在提高动物园内部人员的管理效率，保障动物健康和福利。通过实现动物数据管理、数据查询与统计、健康与福利管理等功能，可以优化动物园管理流程，提升动物生活质量。同时，系统还应满足易用性、稳定性、安全性和可扩展性等非功能需求，确保系统的稳定运行和持续发展。
-

src/components/ZooArchiveFormDialog.vue

@@ -36,6 +36,10 @@ export default {
     // 给表单填充传递的数据
     if (this.data) {
       this.form = copy(this.data)
+    } else {
+      const newDate = new Date();
+      this.form.date = newDate.getFullYear() + '-' + (newDate.getMonth()+1).toString().padStart(2, '0') + '-' + newDate.getDate().toString().padStart(2, '0')
+      this.form.time = newDate.getHours().toString().padStart(2, '0') + ':' + newDate.getMinutes().toString().padStart(2, '0') + ':' + newDate.getSeconds().toString().padStart(2, '0')
     }
   },
   beforeUnmount() {

src/components/ZooArchiveTimeline.vue

@@ -9,6 +9,11 @@ export default {
       order:0
     }
   },
+  watch:{
+    order(){
+      this.timeSort()
+    }
+  },
   props: {
     data: {
       type: Object,
@@ -16,20 +21,24 @@ export default {
     },
   },
   methods: {
-    sort(){
+    //按时间排序
-      //降序
+    timeSort() {
-      if (this.order===0){
+      //0降序
-        this.order++
+      if (this.order === 0) {
-        sortByDateTime(this.archives)
+        this.archives = sortByDateTime(copy(this.archives))
         return
       }
-      //升序
+      //1升序
-      if (this.order===1){
+      if (this.order === 1) {
-        this.order--
+        this.archives = sortByDateTime(copy(this.archives)).reverse()
-        sortByDateTime(this.archives)
+        return;
-        this.archives.reverse()
       }
     },
+    changeOrder(){
+      if (this.order===0)
+        this.order++
+      else this.order--
+    },
     nodeType(type) {
       if (type === '日常饲养') {
         return 'success'
@@ -50,13 +59,19 @@ export default {
       }
     }
   },
-
   mounted() {
-    // 给表单填充传递的数据
+    // 给填充传递的数据
     if (this.data) {
       this.archives = copy(this.data)
       //默认按照时间降序
-      this.sort()
+      this.timeSort()
+    }
+  },
+  updated() {
+    if (this.data) {
+      this.archives = copy(this.data)
+      //默认按照时间降序
+      this.timeSort()
     }
   },
   beforeUnmount() {
@@ -67,7 +82,7 @@ export default {
 
 <template>
   <div class="relative" style="height: 40px">
-    <el-button type="primary" class="right" @click="sort()">按时间升 / 降序</el-button>
+    <el-button type="primary" class="right" @click="changeOrder()">按时间升 / 降序</el-button>
   </div>
   <el-scrollbar height="500px">
     <el-timeline style="max-width: 600px">

src/components/ZooAside.vue

@@ -19,7 +19,7 @@ export default {
     }
   },
   mounted() {
-    // console.log('auth', this.loginUser)
+
   }
 
 }

src/components/ZooBreedingPlanFormDialog.vue

@@ -6,7 +6,7 @@ export default {
   data() {
     return {
       form: {
-        id: '',//int 饲养计划id
+        id: null,//int 饲养计划id
         name: '',//字符 饲养计划名称
         species: '',//字符 种类
         sex: '雄性',//字符 饲养动物性别

src/components/ZooHealthFormDialog.vue

@@ -37,6 +37,10 @@ export default {
     // 给表单填充传递的数据
     if (this.data) {
       this.form = copy(this.data)
+    }else {
+      const newDate = new Date();
+      this.form.date = newDate.getFullYear() + '-' + (newDate.getMonth()+1).toString().padStart(2, '0') + '-' + newDate.getDate().toString().padStart(2, '0')
+      this.form.time = newDate.getHours().toString().padStart(2, '0') + ':' + newDate.getMinutes().toString().padStart(2, '0') + ':' + newDate.getSeconds().toString().padStart(2, '0')
     }
   },
   beforeUnmount() {

src/components/ZooHealthTimeline.vue

@@ -9,6 +9,11 @@ export default {
       order: 0
     }
   },
+  watch:{
+    order(){
+      this.timeSort()
+    }
+  },
   props: {
     data: {
       type: Object,
@@ -16,20 +21,24 @@ export default {
     },
   },
   methods: {
-    sort() {
+    //按时间排序
-      //降序
+    timeSort() {
+      //0降序
       if (this.order === 0) {
-        this.order++
+        this.healths = sortByDateTime(copy(this.healths))
-        sortByDateTime(this.healths)
         return
       }
-      //升序
+      //1升序
       if (this.order === 1) {
-        this.order--
+        this.healths = sortByDateTime(copy(this.healths)).reverse()
-        sortByDateTime(this.healths)
+        return;
-        this.healths.reverse()
       }
     },
+    changeOrder(){
+      if (this.order===0)
+        this.order++
+      else this.order--
+    },
     nodeType(type) {
       if (type === 0) {
         return 'success'
@@ -45,7 +54,15 @@ export default {
     if (this.data) {
       this.healths = copy(this.data)
       //默认按照时间降序
-      this.sort()
+      this.timeSort()
+    }
+  },
+  updated() {
+    // 给表单填充传递的数据
+    if (this.data) {
+      this.healths = copy(this.data)
+      //默认按照时间降序
+      this.timeSort()
     }
   },
   beforeUnmount() {
@@ -56,7 +73,7 @@ export default {
 
 <template>
   <div class="relative" style="height: 40px">
-    <el-button type="primary" class="right" @click="sort()">按时间升 / 降序</el-button>
+    <el-button type="primary" class="right" @click="changeOrder()">按时间升 / 降序</el-button>
   </div>
   <el-scrollbar height="500px">
     <el-timeline style="max-width: 600px">

src/pages/ZooAnimal.vue

@@ -4,7 +4,7 @@ import {Delete, Document, DocumentAdd, Edit, Search, Tickets} from "@element-plu
 import ZooAnimalFormDialog from "@/components/ZooAnimalFormDialog.vue";
 import {mapMutations, mapState} from "vuex";
 import ZooArchiveTimeline from "@/components/ZooArchiveTimeline.vue";
-import request, {frontendAnimal, frontendAnimals} from "@/utils/request.js";
+import request, {frontendAnimal, frontendAnimals, frontendArchives} from "@/utils/request.js";
 
 export default {
   name: "ZooAnimal",
@@ -118,23 +118,35 @@ export default {
       }
 
       //这里将数据传给后端进行数据更新
-      request.updateAnimalRequest(data).then(response => {
+      //从后端获取需要查询的数据，防止数据前后不一致
-        if (response.data.code===1){
+      request.queryAnimalRequest(data.id).then(response => {
-          // 编辑成功
+        if (response.data.data===null){
-          // 刷新数据
+          this.refresh();
-          this.refresh()
+          this.dialog.editDialogVisible = false;
-
-          this.dialog.editDialogVisible = false//关闭窗口
-
           return ElMessage({
-            message: '编辑成功',
+            message: '该动物不存在，请刷新',
-            type: 'success',
-          })
-        }else {
-          return ElMessage({
-            message: '编辑失败',
             type: 'warning',
           })
+        } else {
+          request.updateAnimalRequest(data).then(response => {
+            if (response.data.code===1){
+              // 编辑成功
+              // 刷新数据
+              this.refresh()
+
+              this.dialog.editDialogVisible = false//关闭窗口
+
+              return ElMessage({
+                message: '编辑成功',
+                type: 'success',
+              })
+            }else {
+              return ElMessage({
+                message: '编辑失败',
+                type: 'warning',
+              })
+            }
+          })
         }
       })
     },
@@ -198,7 +210,7 @@ export default {
 
       request.addAnimalRequest(data).then(response => {
         if (response.data.code===1){
-          //添加成功
+          // 添加成功
           // 刷新数据
           this.refresh()
 
@@ -221,21 +233,26 @@ export default {
     showTimeline(data) {
       console.log('显示时间线记录', data)
 
-      //从后端获取需要查询的数据，防止数据前后不一致
+      this.dialog.dialogData = data
-      //这里先用假数据代替一下
-      this.dialog.dialogData = this.animals.find(e => e.id === data.id)
 
-      this.dialog.timelineData = []
       //从后端获取需要查询的数据，防止数据前后不一致
-      //这里先用假数据代替一下
+      request.queryAnimalRequest(data.id).then(response => {
-      this.archives.forEach(e => {
+        if (response.data.data===null){
-        if (e.animalId === data.id) {
+          this.refresh();
-          this.dialog.timelineData.push(copy(e))
+          return ElMessage({
+            message: '该动物不存在，请刷新',
+            type: 'warning',
+          })
+        } else {
+          request.queryArchiveRequest(null,data.id).then(response => {
+            if (response.data.code===1){
+              this.dialog.timelineData = frontendArchives(response.data.data)
+              //显示弹窗
+              this.dialog.timelineDialogVisible = true
+            }
+          })
         }
       })
-
-      //显示弹窗
-      this.dialog.timelineDialogVisible = true
     },
 
     // 判断表单是否为空
@@ -401,7 +418,8 @@ export default {
   </div>
 
   <!--  添加动物对话框-->
-  <el-dialog v-model="dialog.addDialogVisible" title="添加动物" width="500" align-center draggable overflow destroy-on-close>
+  <el-dialog v-model="dialog.addDialogVisible" title="添加动物" width="500" align-center draggable overflow
+             destroy-on-close>
     <ZooAnimalFormDialog>
       <template #default="scope">
         <el-button @click="dialog.addDialogVisible = false">
@@ -442,9 +460,8 @@ export default {
   </el-dialog>
 
   <!--查看动物所有记录-->
-  <el-dialog v-model="dialog.timelineDialogVisible" :title="'动物档案：'+dialog.dialogData.id" width="600" align-center
+  <el-dialog v-model="dialog.timelineDialogVisible" :title="'生命周期档案：'+dialog.dialogData.id" width="600" align-center
-             draggable overflow
+             draggable overflow destroy-on-close>
-             destroy-on-close>
     <ZooArchiveTimeline :data="dialog.timelineData">
       <!--      <template #operate="scope">-->
       <!--        <el-button type="primary" link @click="showEdit(scope.archive)">编辑</el-button>-->

src/pages/ZooArchive.vue

@@ -4,6 +4,7 @@ import {Delete, DocumentAdd, Document, Edit, Search, Tickets, Timer} from "@elem
 import {mapState, mapActions, mapMutations} from "vuex";
 import {copy, splitKeyWords, fuzzyMatching, sortByDateTime} from "@/utils/common.js";
 import ZooArchiveTimeline from "@/components/ZooArchiveTimeline.vue";
+import request, {frontendArchive, frontendArchives} from "@/utils/request.js";
 
 export default {
   name: "ZooArchive",
@@ -74,19 +75,26 @@ export default {
     }
   },
   methods: {
-    ...mapActions(["getArchives"]),
+    ...mapMutations(['updateArchives','updateArchivesTableData']),
-    ...mapMutations(['updateArchivesTableData']),
 
     // 显示详情弹窗
     showDetail(data) {
       console.log('显示详情', data)
 
       //从后端获取需要查询的数据，防止数据前后不一致
-      //这里先用假数据代替一下
+      request.queryArchiveRequest(data.id,null).then(response => {
-      this.dialog.dialogData = this.archives.find(e => e.id === data.id)
+        if (response.data.data === null) {
-
+          this.refresh()
-      //显示弹窗
+          return ElMessage({
-      this.dialog.detailDialogVisible = true
+            message: '该档案记录不存在，请刷新',
+            type: 'warning',
+          })
+        }else {
+          this.dialog.dialogData = frontendArchive(response.data.data)
+          //显示弹窗
+          this.dialog.detailDialogVisible = true
+        }
+      })
     },
 
     //显示编辑弹窗
@@ -94,45 +102,66 @@ export default {
       console.log('显示编辑', data)
 
       //从后端获取需要查询的数据，防止数据前后不一致
-      //这里先用假数据代替一下
+      request.queryArchiveRequest(data.id,null).then(response => {
-      this.dialog.dialogData = this.archives.find(e => e.id === data.id)
+        if (response.data.data === null) {
-
+          this.refresh()
-      //显示弹窗
+          return ElMessage({
-      this.dialog.editDialogVisible = true
+            message: '该记录不存在，请刷新',
+            type: 'warning',
+          })
+        }else {
+          this.dialog.dialogData = frontendArchive(response.data.data)
+          //显示弹窗
+          this.dialog.editDialogVisible = true
+        }
+      })
     },
 
     edit(data) {
       console.log('编辑', data)
 
       //判断表单是否为空
-      return this.isEmpty(data);
+      if (this.isEmpty(data)) {
+        return;
+      }
 
       //这里将数据传给后端进行数据更新
-      //编辑失败
+      //从后端获取需要查询的数据，防止数据前后不一致
-      if (false) {
+      request.queryArchiveRequest(data.id,null).then(response => {
-        return ElMessage({
+        if (response.data.data === null) {
-          message: '编辑失败',
+          this.refresh()
-          type: 'warning',
+          this.dialog.editDialogVisible = false;
-        })
+          return ElMessage({
-      }
+            message: '该档案记录不存在，请刷新',
+            type: 'warning',
+          })
+        }else {
+          request.updateArchiveRequest(data).then(response => {
+            if (response.data.code===1){
+              // 编辑成功
+              // 刷新数据
+              this.refresh()
+              request.queryArchiveRequest(null,this.dialog.dialogData.animalId).then(response => {
+                if (response.data.code===1){
+                  this.dialog.timelineData = frontendArchives(response.data.data)
+                }
+              })
 
-      //编辑成功
+              this.dialog.editDialogVisible = false//关闭窗口
-      if (false) {
-        return ElMessage({
-          message: '编辑成功',
-          type: 'success',
-        })
-      }
 
-      // //从后端重新拉取数据
+              return ElMessage({
-      // this.getArchives()
+                message: '编辑成功',
-      // this.search()
+                type: 'success',
-
+              })
-      // 刷新数据
+            }else {
-      this.refresh()
+              return ElMessage({
-
+                message: '编辑失败',
-      //关闭窗口
+                type: 'warning',
-      this.dialog.editDialogVisible = false
+              })
+            }
+          })
+        }
+      })
     },
 
     delete_(data) {
@@ -147,19 +176,38 @@ export default {
             type: 'warning',
           }
       ).then(() => {
-        //进行删除操作
+        //从后端获取需要查询的数据，防止数据前后不一致
+        request.queryArchiveRequest(data.id,null).then(response => {
+          if (response.data.data === null) {
+            this.refresh()
+            return ElMessage({
+              message: '该档案记录不存在，请刷新',
+              type: 'warning',
+            })
+          }else {
+            //进行删除操作
+            request.deleteArchiveRequest(data.id).then(response => {
+              if (response.data.code===1){
+                // 刷新数据
+                this.refresh()
+                request.queryArchiveRequest(null,this.dialog.dialogData.animalId).then(response => {
+                  if (response.data.code===1){
+                    this.dialog.timelineData = frontendArchives(response.data.data)
+                  }
+                })
 
-        // //从后端重新拉取数据
+                return ElMessage({
-        // this.getArchives()
+                  message: '删除成功',
-        // this.search()
+                  type: 'success',
-
+                })
-        // 刷新数据
+              }else {
-        this.refresh()
+                return ElMessage({
-
+                  message: '删除失败',
-        // 返回提示
+                  type: 'warning',
-        ElMessage({
+                })
-          type: 'success',
+              }
-          message: '删除成功',
+            })
+          }
         })
       }).catch(() => {
         ElMessage({
@@ -173,61 +221,53 @@ export default {
       console.log('添加', data)
 
       //验证是否为空
-      return this.isEmpty(data);
+      if (this.isEmpty(data)) {
-
+        return;
-      //先查询用户是否存在
-
-      //添加失败
-      if (false) {
-        return ElMessage({
-          message: '该记录已存在',
-          type: 'warning',
-        })
       }
-      //添加成功
-      if (false) {
-        return ElMessage({
-          message: '添加成功',
-          type: 'success',
-        })
-      }
-      // //从后端重新拉取数据
-      // this.getArchives()
-      // this.search()
 
-      // 刷新数据
+      request.addArchiveRequest(data).then(response => {
-      this.refresh()
+        if (response.data.code===1){
+          // 添加成功
+          // 刷新数据
+          this.refresh()
 
-      this.dialog.addDialogVisible = false//添加成功关闭窗口
+          this.dialog.addDialogVisible = false//关闭窗口
+
+          return ElMessage({
+            message: '添加成功',
+            type: 'success',
+          })
+        }else {
+          return ElMessage({
+            message: '添加失败',
+            type: 'warning',
+          })
+        }
+      })
     },
 
     //以时间线的形式查看该动物的所有档案记录
     showTimeline(data) {
       console.log('显示时间线记录', data)
 
-      //从后端获取需要查询的数据，防止数据前后不一致
+      this.dialog.dialogData = data
-      //这里先用假数据代替一下
-      this.dialog.dialogData = this.archives.find(e => e.id === data.id)
 
-      this.dialog.timelineData = []
+      //从后端获取需要查询的数据
-      //从后端获取需要查询的数据，防止数据前后不一致
+      request.queryArchiveRequest(null,data.animalId).then(response => {
-      //这里先用假数据代替一下
+        if (response.data.code===1){
-      this.archives.forEach(e => {
+          this.dialog.timelineData = frontendArchives(response.data.data)
-        if (e.animalId === data.animalId) {
+          //显示弹窗
-          this.dialog.timelineData.push(copy(e))
+          this.dialog.timelineDialogVisible = true
         }
       })
-
-      //显示弹窗
-      this.dialog.timelineDialogVisible = true
     },
 
     // 判断表单是否为空
     isEmpty(form) {
-      if (!form.animalId) {
+      if (!form.animalId||!form.animalName) {
         //返回提示
         return ElMessage({
-          message: '记录的动物ID不能为空',
+          message: '动物ID或动物名称不能为空',
           type: 'warning',
         })
       }
@@ -310,16 +350,19 @@ export default {
       console.log('刷新数据')
 
       //先拉取一遍数据
-      this.getArchives()
+      request.queryArchiveRequest().then(response=>{
+        if (response.data.code === 1){
+          this.updateArchives(frontendArchives(response.data.data))
+        }
+        //可能输入了搜索关键字，故执行一次搜索
+        this.search()
 
-      //可能输入了搜索关键字，故执行一次搜索
+        //排序
-      this.search()
+        this.timeSort(this.order)
 
-      //排序
+        //获取结果的分页
-      this.timeSort(this.order)
+        this.getPagesData()
-
+      })
-      //获取结果的分页
-      this.getPagesData()
     }
   },
   mounted() {
@@ -404,7 +447,8 @@ export default {
   </div>
 
   <!--  添加记录对话框-->
-  <el-dialog v-model="dialog.addDialogVisible" title="添加记录" width="500" align-center draggable overflow>
+  <el-dialog v-model="dialog.addDialogVisible" title="添加记录" width="500" align-center draggable overflow
+             destroy-on-close>
     <ZooArchiveFormDialog>
       <template #default="scope">
         <el-button @click="dialog.addDialogVisible = false">
@@ -446,8 +490,7 @@ export default {
 
   <!--查看动物所有记录-->
   <el-dialog v-model="dialog.timelineDialogVisible" :title="'生命周期档案：'+dialog.dialogData.animalId" width="600"
-             align-center draggable overflow
+             align-center draggable overflow destroy-on-close>
-             destroy-on-close>
     <ZooArchiveTimeline :data="dialog.timelineData">
       <template #operate="scope">
         <el-button type="primary" link @click="showEdit(scope.archive)">编辑</el-button>

src/pages/ZooBreeding.vue

@@ -1,8 +1,9 @@
 <script>
 import ZooBreedingPlanFormDialog from "@/components/ZooBreedingPlanFormDialog.vue";
 import {mapState, mapActions, mapMutations} from "vuex";
-import {Delete, DocumentAdd, Document,Edit, Search} from "@element-plus/icons-vue";
+import {Delete, DocumentAdd, Document, Edit, Search} from "@element-plus/icons-vue";
-import {copy, splitKeyWords,fuzzyMatching} from "@/utils/common.js";
+import {copy, splitKeyWords, fuzzyMatching} from "@/utils/common.js";
+import request, {frontendBreeding, frontendBreedingPlans} from "@/utils/request.js";
 
 export default {
   name: "ZooBreeding",
@@ -25,7 +26,7 @@ export default {
         dialogData: {},
         addDialogVisible: false,//添加饲养计划对话框
         editDialogVisible: false,//编辑饲养计划对话框
-        detailDialogVisible:false//查询饲养计划对话框
+        detailDialogVisible: false//查询饲养计划对话框
       }
     }
   },
@@ -48,32 +49,38 @@ export default {
       return Document
     },
     //endregion
-    ...mapState(["breedingPlans",'breedingPlansTableData'])
+    ...mapState(["breedingPlans", 'breedingPlansTableData'])
   },
   watch: {
     // 搜索框存在输入，自动调用搜索(刷新数据包含搜索)
     searchInput: {
       deep: true,
       handler(val) {
-        // this.search()
         this.refresh();
       }
     }
   },
   methods: {
-    ...mapActions(["getBreedingPlans"]),
+    ...mapMutations(['updateBreedingPlans','updateBreedingPlansTableData']),
-    ...mapMutations(['updateBreedingPlansTableData']),
 
     //显示详情弹窗
     showDetail(data) {
       console.log('显示详情', data)
 
       //从后端获取需要查询的数据，防止数据前后不一致
-      //这里先用假数据代替一下
+      request.queryBreedingPlanRequest(data.id).then(response => {
-      this.dialog.dialogData = this.breedingPlans.find(e => e.id === data.id)
+        if (response.data.data === null) {
-
+          this.refresh();
-      //显示弹窗
+          return ElMessage({
-      this.dialog.detailDialogVisible = true
+            message: '该计划不存在，请刷新',
+            type: 'warning',
+          })
+        } else {
+          this.dialog.dialogData = frontendBreeding(response.data.data)
+          //显示弹窗
+          this.dialog.detailDialogVisible = true
+        }
+      })
     },
 
     //显示编辑弹窗
@@ -81,45 +88,61 @@ export default {
       console.log('显示编辑', data)
 
       //从后端获取需要查询的数据，防止数据前后不一致
-      //这里先用假数据代替一下
+      request.queryBreedingPlanRequest(data.id).then(response => {
-      this.dialog.dialogData = this.breedingPlans.find(e => e.id === data.id)
+        if (response.data.data === null) {
-
+          this.refresh();
-      //显示弹窗
+          return ElMessage({
-      this.dialog.editDialogVisible = true
+            message: '该计划不存在，请刷新',
+            type: 'warning',
+          })
+        } else {
+          this.dialog.dialogData = frontendBreeding(response.data.data)
+          //显示弹窗
+          this.dialog.editDialogVisible = true
+        }
+      })
     },
 
     edit(data) {
       console.log('编辑', data)
 
       //判断表单是否为空
-      return this.isEmpty(data);
+      if (this.isEmpty(data)) {
+        return;
+      }
 
       //这里将数据传给后端进行数据更新
-      //编辑失败
+      //从后端获取需要查询的数据，防止数据前后不一致
-      if (false) {
+      request.queryBreedingPlanRequest(data.id).then(response => {
-        return ElMessage({
+        if (response.data.data === null) {
-          message: '编辑失败',
+          this.refresh();
-          type: 'warning',
+          this.dialog.editDialogVisible = false;
-        })
+          return ElMessage({
-      }
+            message: '该计划不存在，请刷新',
+            type: 'warning',
+          })
+        } else {
+          request.updateBreedingPlanRequest(data).then(response => {
+            if (response.data.code === 1) {
+              // 编辑成功
+              // 刷新数据
+              this.refresh()
 
-      //编辑成功
+              this.dialog.editDialogVisible = false//关闭窗口
-      if (false) {
-        return ElMessage({
-          message: '编辑成功',
-          type: 'success',
-        })
-      }
 
-      // //从后端重新拉取数据
+              return ElMessage({
-      // this.getBreedingPlans()
+                message: '编辑成功',
-      // this.search()
+                type: 'success',
-
+              })
-      // 刷新数据
+            } else {
-      this.refresh()
+              return ElMessage({
-
+                message: '编辑失败',
-      //关闭窗口
+                type: 'warning',
-      this.dialog.editDialogVisible = false
+              })
+            }
+          })
+        }
+      })
     },
 
     delete_(data) {
@@ -127,26 +150,40 @@ export default {
 
       return ElMessageBox.confirm(
           '该操作不可撤销，是否继续？',
-          '删除计划：' + data.name + '（'+data.id+'）',
+          '删除计划：' + data.name + '（' + data.id + '）',
           {
             confirmButtonText: '确定',
             cancelButtonText: '取消',
             type: 'warning',
           }
       ).then(() => {
-        //进行删除操作
+        //从后端获取需要查询的数据，防止数据前后不一致
+        request.queryBreedingPlanRequest(data.id).then(response => {
+          if (response.data.data === null) {
+            this.refresh();
+            return ElMessage({
+              message: '该计划不存在，请刷新',
+              type: 'warning',
+            })
+          } else {
+            //进行删除操作
+            request.deleteBreedingPlanRequest(data.id).then(response => {
+              if (response.data.code === 1) {
+                // 刷新数据
+                this.refresh()
 
-        // //从后端重新拉取数据
+                return ElMessage({
-        // this.getBreedingPlans()
+                  message: '删除成功',
-        // this.search()
+                  type: 'success',
-
+                })
-        // 刷新数据
+              } else {
-        this.refresh()
+                return ElMessage({
-
+                  message: '删除失败',
-        // 返回提示
+                  type: 'warning',
-        ElMessage({
+                })
-          type: 'success',
+              }
-          message: '删除成功',
+            })
+          }
         })
       }).catch(() => {
         ElMessage({
@@ -160,40 +197,37 @@ export default {
       console.log('添加', data)
 
       //验证是否为空
-      return this.isEmpty(data);
+      if (this.isEmpty(data)) {
-
+        return;
-      //先查询用户是否存在
-
-      //添加失败
-      if (false) {
-        return ElMessage({
-          message: '该计划已存在',
-          type: 'warning',
-        })
       }
-      //添加成功
-      if (false) {
-        return ElMessage({
-          message: '添加成功',
-          type: 'success',
-        })
-      }
-      // //从后端重新拉取数据
-      // this.getBreedingPlans()
-      // this.search()
 
-      // 刷新数据
+      request.addBreedingPlanRequest(data).then(response => {
-      this.refresh()
+        if (response.data.code===1){
+          // 添加成功
+          // 刷新数据
+          this.refresh()
 
-      this.dialog.addDialogVisible = false//添加成功关闭窗口
+          this.dialog.addDialogVisible = false//添加成功关闭窗口
+
+          return ElMessage({
+            message: '添加成功',
+            type: 'success',
+          })
+        }else {
+          return ElMessage({
+            message: '添加失败',
+            type: 'warning',
+          })
+        }
+      })
     },
 
     // 判断表单是否为空
     isEmpty(form) {
-      if (!form.name) {
+      if (!form.name || !form.species) {
         //返回提示
         return ElMessage({
-          message: '计划名不能为空',
+          message: '计划名称或物种不能为空',
           type: 'warning',
         })
       }
@@ -236,7 +270,7 @@ export default {
 
     //当前页切换时触发
     handleCurrentChange(val) {
-      console.log('分页被切换',val)
+      console.log('分页被切换', val)
       this.currentPage = val
       this.getPagesData()
     },
@@ -249,27 +283,24 @@ export default {
     },
 
     //刷新数据的方法
-    refresh(){
+    refresh() {
       console.log('刷新数据')
 
       //先拉取一遍数据
-      this.getBreedingPlans()
+      request.queryBreedingPlanRequest().then(response => {
+        if (response.data.code === 1) {
+          this.updateBreedingPlans(frontendBreedingPlans(response.data.data))
+        }
+        //可能输入了搜索关键字，故执行一次搜索
+        this.search()
 
-      //可能输入了搜索关键字，故执行一次搜索
+        //获取结果的分页
-      this.search()
+        this.getPagesData()
-
+      })
-      //获取结果的分页
-      this.getPagesData()
     }
-
   },
   mounted() {
-    // // 加载完成后拉取数据
+    // 加载完成后拉取数据
-    // this.getBreedingPlans()
-    //
-    // //获取分页后显示的数据
-    // this.getPagesData()
-
     this.refresh()
   }
 }
@@ -302,7 +333,8 @@ export default {
     </div>
 
     <div class="table">
-      <el-table :data="pagesData" style="width: 100%;height: 100%" border stripe :row-style="{height: '40px'}" :cell-style="{padding:'0'}">
+      <el-table :data="pagesData" style="width: 100%;height: 100%" border stripe :row-style="{height: '40px'}"
+                :cell-style="{padding:'0'}">
         <el-table-column fixed prop="id" label="计划ID" width="70"/>
         <el-table-column fixed prop="name" label="计划名称" width="150"/>
         <el-table-column prop="roleId" label="执行饲养员" width="100"/>
@@ -343,7 +375,8 @@ export default {
   </div>
 
   <!--  添加饲养计划对话框-->
-  <el-dialog v-model="dialog.addDialogVisible" title="添加饲养计划" width="500" align-center draggable overflow>
+  <el-dialog v-model="dialog.addDialogVisible" title="添加饲养计划" width="500" align-center draggable overflow
+             destroy-on-close>
     <ZooBreedingPlanFormDialog>
       <template #default="scope">
         <el-button @click="dialog.addDialogVisible = false">

src/pages/ZooHealth.vue

@@ -4,6 +4,7 @@ import {mapActions, mapMutations, mapState} from "vuex";
 import {copy, fuzzyMatching, sortByDateTime, splitKeyWords} from "@/utils/common.js";
 import ZooHealthFormDialog from "@/components/ZooHealthFormDialog.vue";
 import ZooHealthTimeline from "@/components/ZooHealthTimeline.vue";
+import request, {frontendHealth, frontendHealths} from "@/utils/request.js";
 
 export default {
   name: "ZooHealth",
@@ -75,19 +76,26 @@ export default {
     }
   },
   methods: {
-    ...mapActions(["getHealths"]),
+    ...mapMutations(['updateHealths','updateHealthsTableData']),
-    ...mapMutations(['updateHealthsTableData']),
 
     // 显示详情弹窗
     showDetail(data) {
       console.log('显示详情', data)
 
       //从后端获取需要查询的数据，防止数据前后不一致
-      //这里先用假数据代替一下
+      request.queryHealthRequest(data.id,null).then(response => {
-      this.dialog.dialogData = this.healths.find(e => e.id === data.id)
+        if (response.data.data === null) {
-
+          this.refresh();
-      //显示弹窗
+          return ElMessage({
-      this.dialog.detailDialogVisible = true
+            message: '该监测记录不存在，请刷新',
+            type: 'warning',
+          })
+        }else {
+          this.dialog.dialogData = frontendHealth(response.data.data)
+          //显示弹窗
+          this.dialog.detailDialogVisible = true
+        }
+      })
     },
 
     //显示编辑弹窗
@@ -95,45 +103,66 @@ export default {
       console.log('显示编辑', data)
 
       //从后端获取需要查询的数据，防止数据前后不一致
-      //这里先用假数据代替一下
+      request.queryHealthRequest(data.id,null).then(response => {
-      this.dialog.dialogData = this.healths.find(e => e.id === data.id)
+        if (response.data.data === null) {
-
+          this.refresh();
-      //显示弹窗
+          return ElMessage({
-      this.dialog.editDialogVisible = true
+            message: '该监测记录不存在，请刷新',
+            type: 'warning',
+          })
+        }else {
+          this.dialog.dialogData = frontendHealth(response.data.data)
+          //显示弹窗
+          this.dialog.editDialogVisible = true
+        }
+      })
     },
 
     edit(data) {
       console.log('编辑', data)
 
       //判断表单是否为空
-      return this.isEmpty(data);
+      if (this.isEmpty(data)) {
+        return;
+      }
 
       //这里将数据传给后端进行数据更新
-      //编辑失败
+      //从后端获取需要查询的数据，防止数据前后不一致
-      if (false) {
+      request.queryHealthRequest(data.id,null).then(response => {
-        return ElMessage({
+        if (response.data.data === null) {
-          message: '编辑失败',
+          this.refresh();
-          type: 'warning',
+          this.dialog.editDialogVisible = false;
-        })
+          return ElMessage({
-      }
+            message: '该监测记录不存在，请刷新',
+            type: 'warning',
+          })
+        }else {
+          request.updateHealthRequest(data).then(response => {
+            if (response.data.code === 1) {
+              //编辑成功
+              //刷新数据
+              this.refresh()
+              request.queryHealthRequest(null,this.dialog.dialogData.animalId).then(response => {
+                if (response.data.code===1){
+                  this.dialog.timelineData = frontendHealths(response.data.data)
+                }
+              })
 
-      //编辑成功
+              this.dialog.editDialogVisible = false//关闭窗口
-      if (false) {
-        return ElMessage({
-          message: '编辑成功',
-          type: 'success',
-        })
-      }
 
-      // //从后端重新拉取数据
+              return ElMessage({
-      // this.getHealths()
+                message: '编辑成功',
-      // this.search()
+                type: 'success',
-
+              })
-      // 刷新数据
+            } else {
-      this.refresh()
+              return ElMessage({
-
+                message: '编辑失败',
-      //关闭窗口
+                type: 'warning',
-      this.dialog.editDialogVisible = false
+              })
+            }
+          })
+        }
+      })
     },
 
     delete_(data) {
@@ -149,18 +178,38 @@ export default {
           }
       ).then(() => {
         //进行删除操作
+        //从后端获取需要查询的数据，防止数据前后不一致
+        request.queryHealthRequest(data.id,null).then(response => {
+          if (response.data.data === null) {
+            this.refresh();
+            return ElMessage({
+              message: '该监测记录不存在，请刷新',
+              type: 'warning',
+            })
+          }else {
+            request.deleteHealthRequest(data.id).then(response => {
+              if (response.data.code === 1) {
+                //编辑成功
+                //刷新数据
+                this.refresh()
+                request.queryHealthRequest(null,this.dialog.dialogData.animalId).then(response => {
+                  if (response.data.code===1){
+                    this.dialog.timelineData = frontendHealths(response.data.data)
+                  }
+                })
 
-        // //从后端重新拉取数据
+                return ElMessage({
-        // this.getHealths()
+                  message: '删除成功',
-        // this.search()
+                  type: 'success',
-
+                })
-        // 刷新数据
+              } else {
-        this.refresh()
+                return ElMessage({
-
+                  message: '删除失败',
-        // 返回提示
+                  type: 'warning',
-        ElMessage({
+                })
-          type: 'success',
+              }
-          message: '删除成功',
+            })
+          }
         })
       }).catch(() => {
         ElMessage({
@@ -174,61 +223,53 @@ export default {
       console.log('添加', data)
 
       //验证是否为空
-      return this.isEmpty(data);
+      if (this.isEmpty(data)) {
-
+        return;
-      //先查询用户是否存在
-
-      //添加失败
-      if (false) {
-        return ElMessage({
-          message: '该记录已存在',
-          type: 'warning',
-        })
       }
-      //添加成功
-      if (false) {
-        return ElMessage({
-          message: '添加成功',
-          type: 'success',
-        })
-      }
-      // //从后端重新拉取数据
-      // this.getHealths()
-      // this.search()
 
-      // 刷新数据
+      request.addHealthRequest(data).then(response => {
-      this.refresh()
+        if (response.data.code === 1) {
+          //添加成功
+          //刷新数据
+          this.refresh()
 
-      this.dialog.addDialogVisible = false//添加成功关闭窗口
+          this.dialog.addDialogVisible = false//关闭窗口
+
+          return ElMessage({
+            message: '添加成功',
+            type: 'success',
+          })
+        } else {
+          return ElMessage({
+            message: '添加失败',
+            type: 'warning',
+          })
+        }
+      })
     },
 
     //以时间线的形式查看该动物的所有档案记录
     showTimeline(data) {
       console.log('显示时间线记录', data)
 
-      //从后端获取需要查询的数据，防止数据前后不一致
+      this.dialog.dialogData = data
-      //这里先用假数据代替一下
-      this.dialog.dialogData = this.healths.find(e => e.id === data.id)
 
-      this.dialog.timelineData = []
+      //从后端获取需要查询的数据
-      //从后端获取需要查询的数据，防止数据前后不一致
+      request.queryHealthRequest(null,data.animalId).then(response=>{
-      //这里先用假数据代替一下
+        if (response.data.code === 1) {
-      this.healths.forEach(e => {
+          this.dialog.timelineData = frontendHealths(response.data.data)
-        if (e.animalId === data.animalId) {
+          //显示弹窗
-          this.dialog.timelineData.push(copy(e))
+          this.dialog.timelineDialogVisible = true
         }
       })
-
-      //显示弹窗
-      this.dialog.timelineDialogVisible = true
     },
 
     // 判断表单是否为空
     isEmpty(form) {
-      if (!form.animalId) {
+      if (!form.animalId||!form.animalName) {
         //返回提示
         return ElMessage({
-          message: '记录的动物ID不能为空',
+          message: '动物ID或动物名称不能为空',
           type: 'warning',
         })
       }
@@ -311,16 +352,19 @@ export default {
       console.log('刷新数据')
 
       //先拉取一遍数据
-      this.getHealths()
+      request.queryHealthRequest().then(response=>{
+        if (response.data.code===1){
+          this.updateHealths(frontendHealths(response.data.data))
+        }
+        //可能输入了搜索关键字，故执行一次搜索
+        this.search()
 
-      //可能输入了搜索关键字，故执行一次搜索
+        //排序
-      this.search()
+        this.timeSort(this.order)
 
-      //排序
+        //获取结果的分页
-      this.timeSort(this.order)
+        this.getPagesData()
-
+      })
-      //获取结果的分页
-      this.getPagesData()
     }
   },
   mounted() {
@@ -430,7 +474,8 @@ export default {
   </div>
 
   <!--  添加记录对话框-->
-  <el-dialog v-model="dialog.addDialogVisible" title="添加记录" width="500" align-center draggable overflow>
+  <el-dialog v-model="dialog.addDialogVisible" title="添加记录" width="500" align-center draggable overflow
+             destroy-on-close>
     <ZooHealthFormDialog>
       <template #default="scope">
         <el-button @click="dialog.addDialogVisible = false">
@@ -471,7 +516,7 @@ export default {
   </el-dialog>
 
 <!--  查看动物所有记录-->
-    <el-dialog v-model="dialog.timelineDialogVisible" :title="'健康监测档案：'+dialog.dialogData.animalId" width="600" align-center draggable overflow
+    <el-dialog v-model="dialog.timelineDialogVisible" :title="'健康监测追踪：'+dialog.dialogData.animalId" width="600" align-center draggable overflow
                destroy-on-close>
       <ZooHealthTimeline :data="dialog.timelineData">
         <template #operate="scope">

src/pages/ZooLogin.vue

@@ -8,8 +8,8 @@ export default {
     return {
       // 登录表单数据
       form: {
-        username: 'admin',
+        username: '',
-        password: '123',
+        password: '',
       },
       picture: [
         'https://www4.bing.com//th?id=OHR.BambooPanda_ZH-CN8455481760_1920x1080.jpg&rf=LaDigue_1920x1080.jpg&pid=hp',

src/pages/ZooUser.vue

@@ -3,7 +3,7 @@ import {Delete, Edit, Search, User, Document} from "@element-plus/icons-vue";
 import {mapState, mapActions, mapMutations} from "vuex";
 import ZooUserFormDialog from "@/components/ZooUserFormDialog.vue";
 import {copy, fuzzyMatching, splitKeyWords, showPassword, hidePassword} from "@/utils/common.js";
-import request, {frontendUsers} from "@/utils/request.js";
+import request, {frontendUser, frontendUsers} from "@/utils/request.js";
 
 
 export default {
@@ -73,11 +73,19 @@ export default {
       console.log('显示详情', data)
 
       //从后端获取需要查询的数据，防止数据前后不一致
-      //这里先用假数据代替一下
+      request.queryUserRequest(data.username).then(response => {
-      this.dialog.dialogData = this.users.find(e => e.username === data.username)
+        if (response.data.data === null) {
-
+          this.refresh()
-      //显示详情弹窗
+          return ElMessage({
-      this.dialog.detailDialogVisible = true
+            message: '该用户不存在，请刷新',
+            type: 'warning',
+          })
+        }else {
+          this.dialog.dialogData = frontendUser(response.data.data)
+          // 显示编辑弹窗
+          this.dialog.detailDialogVisible = true
+        }
+      })
     },
 
     // 显示编辑弹窗
@@ -85,45 +93,61 @@ export default {
       console.log('编辑弹窗', data)
 
       //从后端获取需要查询的数据，防止数据前后不一致
-      //这里先用假数据代替一下
+      request.queryUserRequest(data.username).then(response => {
-      this.dialog.dialogData = this.users.find(e => e.id === data.id)
+        if (response.data.data === null) {
-
+          this.refresh()
-      // 显示编辑弹窗
+          return ElMessage({
-      this.dialog.editDialogVisible = true
+            message: '该用户不存在，请刷新',
+            type: 'warning',
+          })
+        }else {
+          this.dialog.dialogData = frontendUser(response.data.data)
+          // 显示编辑弹窗
+          this.dialog.editDialogVisible = true
+        }
+      })
     },
 
     edit(data) {
       console.log('编辑', data)
 
       //判断表单是否为空
-      return this.isEmpty(data);
+      if (this.isEmpty(data)) {
+        return;
+      }
 
       //这里将数据传给后端进行数据更新
-      //编辑失败
+      //从后端获取需要查询的数据，防止数据前后不一致
-      if (false) {
+      request.queryUserRequest(data.username).then(response => {
-        return ElMessage({
+        if (response.data.data === null) {
-          message: '编辑失败',
+          this.refresh()
-          type: 'warning',
+          this.dialog.editDialogVisible = false;
-        })
+          return ElMessage({
-      }
+            message: '该用户不存在，请刷新',
+            type: 'warning',
+          })
+        }else {
+          request.updateUserRequest(data).then(response => {
+            if (response.data.code===1){
+              // 编辑成功
+              // 刷新数据
+              this.refresh()
 
-      //编辑成功
+              this.dialog.editDialogVisible = false//关闭窗口
-      if (false) {
-        return ElMessage({
-          message: '编辑成功',
-          type: 'success',
-        })
-      }
 
-      // //从后端重新拉取数据
+              return ElMessage({
-      // this.getUsers()
+                message: '编辑成功',
-      // this.search()
+                type: 'success',
-
+              })
-      // 刷新数据
+            }else {
-      this.refresh()
+              return ElMessage({
-
+                message: '编辑失败',
-      //关闭窗口
+                type: 'warning',
-      this.dialog.editDialogVisible = false
+              })
+            }
+          })
+        }
+      })
     },
 
     delete_(data) {
@@ -138,19 +162,34 @@ export default {
             type: 'warning',
           }
       ).then(() => {
-        //进行删除操作
+        //从后端获取需要查询的数据，防止数据前后不一致
+        request.queryUserRequest(data.username).then(response => {
+          if (response.data.data===null){
+            this.refresh();
+            return ElMessage({
+              message: '该用户不存在，请刷新',
+              type: 'warning',
+            })
+          }else {
+            //进行删除操作
+            request.deleteUserRequest(data.id).then(response => {
+              if (response.data.code===1){
+                // 刷新数据
+                this.refresh()
 
-        // //重新拉取数据
+                //返回提示
-        // this.getUsers()
+                return ElMessage({
-        // this.search()
+                  message: '删除成功',
-
+                  type: 'success',
-        // 刷新数据
+                })
-        this.refresh()
+              }else {
-
+                return ElMessage({
-        // 返回提示
+                  message: '删除失败',
-        ElMessage({
+                  type: 'warning',
-          type: 'success',
+                })
-          message: '删除成功',
+              }
+            })
+          }
         })
       }).catch(() => {
         ElMessage({
@@ -169,27 +208,31 @@ export default {
       }
 
       //先查询用户是否存在
-      request.queryUserRequest(data.id).then(response => {
+      request.queryUserRequest(data.username).then(response => {
-        console.log(response.data.data,"aaaaaaaaaaaaaaaaaa")
+        if (response.data.data!==null){
-        if (response.data.data!=null){
           return ElMessage({
-            message: '该用户ID已存在',
+            message: '用户名重复',
             type: 'warning',
           })
-        }
+        }else {
-      })
+          //添加成功
+          request.addUserRequest(data).then(response => {
+            if (response.data.code===1){
+              // 刷新数据
+              this.refresh()
 
-      //添加成功
+              this.dialog.addDialogVisible = false//添加成功关闭窗口
-      request.addUserRequest(data).then(response => {
-        if (response.data.code===1){
-          // 刷新数据
-          this.refresh()
 
-          this.dialog.addDialogVisible = false//添加成功关闭窗口
+              return ElMessage({
-
+                message: '添加成功',
-          return ElMessage({
+                type: 'success',
-            message: '添加成功',
+              })
-            type: 'success',
+            }else {
+              return ElMessage({
+                message: '添加失败',
+                type: 'warning',
+              })
+            }
           })
         }
       })
@@ -352,7 +395,8 @@ export default {
 
 
   <!--  添加用户对话框-->
-  <el-dialog v-model="dialog.addDialogVisible" title="添加用户" width="400" align-center draggable overflow>
+  <el-dialog v-model="dialog.addDialogVisible" title="添加用户" width="400" align-center draggable overflow
+             destroy-on-close>
     <ZooUserFormDialog>
       <template #default="scope">
         <el-button @click="dialog.addDialogVisible = false">

src/pages/data.vue

@@ -13,35 +13,35 @@ export default {
   methods: {
     ...mapMutations(['updateUsers', 'updateAnimals', 'updateBreedingPlans', 'updateArchives','updateHealths']),
     usersData() {
-      this.updateUsers(generateUsers())
+      generateUsers()
       return ElMessage({
         message: '成功',
         type: 'success',
       })
     },
     animalsData() {
-      this.updateAnimals(generateAnimals())
+      generateAnimals()
       return ElMessage({
         message: '成功',
         type: 'success',
       })
     },
     breedingPlansData() {
-      this.updateBreedingPlans(generateBreedingPlans())
+      generateBreedingPlans()
       return ElMessage({
         message: '成功',
         type: 'success',
       })
     },
     archiveData() {
-      this.updateArchives(generateArchives())
+      generateArchives()
       return ElMessage({
         message: '成功',
         type: 'success',
       })
     },
     healthData() {
-      this.updateHealths(generateHealths())
+      generateHealths()
       return ElMessage({
         message: '成功',
         type: 'success',

src/router/index.js

@@ -76,7 +76,9 @@ router.beforeEach((to, from, next) => {
     //不是登录界面都需要权限。。。
     // console.log(to, from, next);
     if (to.path !== '/login') {
-        if (!store.state.loginUser.username) {
+        if (to.path==='/data'){
+            next()
+        }else if (!store.state.loginUser.username) {
             router.replace({
                 path: '/login',
             })

src/store/index.js

@@ -1,7 +1,12 @@
 import {createStore} from "vuex";
-import {copy, generateAnimals, generateArchives, generateBreedingPlans, generateUsers} from "@/utils/common.js";
+import {copy} from "@/utils/common.js";
-import request, {frontendAnimals, frontendUsers} from "@/utils/request.js";
+import request, {
-import router from "@/router/index.js";
+    frontendAnimals,
+    frontendArchives,
+    frontendBreedingPlans,
+    frontendHealths,
+    frontendUsers
+} from "@/utils/request.js";
 
 const actions = {
     //获取用户数据
@@ -13,8 +18,6 @@ const actions = {
                 context.commit('updateUsers', frontendUsers(response.data.data));
             }
         })
-        // // context.commit('updateUsers', generateUsers())
-        // context.commit('updateUsers', context.state.users);
     },
     //获取动物数据
     getAnimals(context) {
@@ -25,30 +28,37 @@ const actions = {
                 context.commit('updateAnimals', frontendAnimals(response.data.data));
             }
         })
-        // context.commit('updateAnimals', generateAnimals())
-        // context.commit('updateAnimals', context.state.animals);
     },
     //获取饲养计划
     getBreedingPlans(context) {
         console.log('getBreedingPlans')
         // 通过后端获取数据
-        // context.commit('updateBreedingPlans',generateBreedingPlans())
+        request.queryBreedingPlanRequest().then(response => {
-        context.commit('updateBreedingPlans',context.state.breedingPlans);
+            if (response.data.code === 1) {
+                context.commit('updateBreedingPlans',frontendBreedingPlans(response.data.data));
+            }
+        })
     },
     //获取动物档案
     getArchives(context) {
         console.log('getArchives')
         // 通过后端获取数据
-        // context.commit('updateArchives', generateArchives())
+        request.queryArchiveRequest().then(response => {
-        context.commit('updateArchives',context.state.archives);
+            if (response.data.code === 1) {
+                context.commit('updateArchives',frontendArchives(response.data.data));
+            }
+        })
     },
 
     //获取监控检测数据
     getHealths(context) {
         console.log('getHealths')
         // 通过后端获取数据
-        // context.commit('updateHealths', generateHealths())
+        request.queryHealthRequest().then(response => {
-        context.commit('updateHealths',context.state.healths);
+            if (response.data.code === 1) {
+                context.commit('updateHealths',frontendHealths(response.data.data));
+            }
+        })
     }
 }
 
@@ -120,14 +130,6 @@ const state = {
         username: '',
         auth: 0
     },
-    // //用户数据
-    // users: [],
-    // //动物数据
-    // animals: [],
-    // //饲养计划
-    // breedingPlans:[],
-    // //动物档案
-    // archives:[],
     //用户数据
     users: [],
     usersTableData:[],//用户表格数据

src/utils/common.js

@@ -1,20 +1,22 @@
 //生成用户数据
 import store from "@/store/index.js";
+import request from "@/utils/request.js";
 
 // 生成用户数据
 export function generateUsers() {
     const users = []
-    // 随机生成40-100条用户数据
+    // 随机生成20-40条用户数据
-    const n = Math.floor(Math.random() * 60) + 40;
+    const n = Math.floor(Math.random() * 20) + 20;
     for (let i = 0; i < n; i++) {
         const a = generateAuth()
         let user = {
-            id: i,
+            id: i+2,
-            username: 'user' + (i + 1),
+            username: 'user' + (i + 2),
             password: '123456',
             auth: a,
         }
         users.push(user)
+        request.addUserRequest(user)
         if (a === 1) {
             keeper.push(user)
         } else if (a === 2) {
@@ -42,11 +44,11 @@ function generateAuth() {
 //生成动物数据
 export function generateAnimals() {
     const animals = []
-    //随机生成100-200只动物
+    //随机生成40-60只动物
-    const n = Math.floor(Math.random() * 100) + 100;
+    const n = Math.floor(Math.random() * 20) + 40;
     for (let i = 0; i < n; i++) {
         let animal = {
-            id: i,
+            id: i+3,
             name: 'animal' + (i + 1),
             sex: Math.floor(Math.random() * 2) === 0 ? '雌性' : '雄性',
             species: '种类' + Math.ceil(Math.random() * 20).toString(),//种类
@@ -58,9 +60,11 @@ export function generateAnimals() {
             features: 'test animal' + (i + 1) + ' features',//特征
             phase: generatePhase()
         }
+        request.addAnimalRequest(animal)
         animals.push(animal)
     }
     console.log('动物', animals)
+    store.state.animals = animals
     return animals
 }
 
@@ -129,8 +133,8 @@ function generateNewColor() {
 export function generateBreedingPlans() {
     const breedingPlans = []
 
-    //随机生成20种类动物的饲养计划
+    //随机生成5种类动物的饲养计划
-    const n = 20;
+    const n = 5;
     for (let i = 0; i < n; i++) {
         //分别生成2种性别的
         for (let j = 0; j < 2; j++) {
@@ -139,7 +143,7 @@ export function generateBreedingPlans() {
                 //分别生成2种状态的
                 for (let l = 0; l < 2; l++) {
                     let breedingPlan = {
-                        id: i + '' + j + '' + k + '' + l,
+                        // id: i + '' + j + '' + k + '' + l,
                         name: 'breeding' + (i + 1),
                         species: '种类' + i.toString(),
                         sex: j === 0 ? '雌性' : '雄性',
@@ -148,6 +152,7 @@ export function generateBreedingPlans() {
                         roleId: generateKeeperId(),
                         description: 'test breeding' + i + '' + j + '' + k + '' + l + ' description',
                     }
+                    request.addBreedingPlanRequest(breedingPlan)
                     breedingPlans.push(breedingPlan)
                 }
             }
@@ -180,21 +185,21 @@ export function generateArchives() {
         for (let i = 0; i < 4; i++) {
             let n;
             if (i === 0) {
-                //幼年期5-10条档案
+                //幼年期5条档案
-                n = Math.floor(Math.random() * 5) + 5
+                n = 5
             } else if (i === 1) {
-                //成长期10-20条档案
+                //成长期10条档案
-                n = Math.floor(Math.random() * 10) + 10
+                n = 10
             } else if (i === 2) {
-                //成年期30-60条档案
+                //成年期30条档案
-                n = Math.floor(Math.random() * 30) + 30
+                n = 30
             } else {
-                //老年期5-10条档案
+                //老年期5条档案
-                n = Math.floor(Math.random() * 5) + 5
+                n = 5
             }
             for (let j = 0; j < n; j++) {
                 let archive = {
-                    id: aid,//档案号
+                    // id: aid,//档案号
                     animalId: e.id,//该档案记录的动物id
                     animalName: e.name,//该档案记录的动物名称
                     phase: i === 0 ? '幼年期' : i === 1 ? '成长期' : i === 2 ? '成年期' : '老年期',
@@ -205,11 +210,12 @@ export function generateArchives() {
                     roleId: generateVeterinaryId(),//负责录入档案的人的id，身份不限
                     description: 'test archive' + i + '' + j + ' description',
                 }
+                request.addArchiveRequest(archive)
                 archives.push(archive)
 
                 //同时获取一条健康记录
                 let health = {
-                    id: aid,//int 健康检测数据号
+                    // id: aid,//int 健康检测数据号
                     animalId: archive.animalId,//int 记录的动物id
                     animalName: archive.animalName,//字符 记录的动物名称
                     state: archive.state,//int 动物状态 0正常，1异常
@@ -235,6 +241,7 @@ export function generateArchives() {
                         Math.floor(Math.random()*health.bloodPressure*0.5):-Math.floor(Math.random()*health.bloodPressure*0.5)
 
                 }
+                request.addHealthRequest(health)
                 healths.push(health)
                 aid++
             }

src/utils/request.js

@@ -1,5 +1,4 @@
 import axios from "axios";
-import {id} from "element-plus/es/locale/index";
 
 const instance = axios.create({
     baseURL: 'http://localhost:8888',
@@ -23,8 +22,8 @@ export default {
     updateUserRequest(user) {
         return instance.post("/zoo/account/update", backendUser(user));
     },
-    queryUserRequest(id) {
+    queryUserRequest(username) {
-        return instance.get("/zoo/account/info", id)
+        return instance.get("/zoo/account/info", {params: {username}})
     },
 
     //动物请求
@@ -57,39 +56,33 @@ export default {
 
     //档案请求
     addArchiveRequest(archive) {
-        return instance.post("/com/zoo/archive/add", backendArchive(archive));
+        return instance.post("/zoo/archive/add", backendArchive(archive));
     },
     deleteArchiveRequest(id) {
-        return instance.get("/com/zoo/archive/delete", {params: {id}})
+        return instance.get("/zoo/archive/delete", {params: {id}})
     },
     updateArchiveRequest(archive) {
-        return instance.post("/com/zoo/archive/update", backendArchive(archive));
+        return instance.post("/zoo/archive/update", backendArchive(archive));
     },
-    queryArchiveRequest(id) {
+    queryArchiveRequest(id, animallId) {
-        return instance.get("/com/zoo/archive/info", {params: {id}})
+        return instance.get("/zoo/archive/info", {params: {id, animallId}})
     },
 
     //健康记录请求
     addHealthRequest(health) {
-        return instance.post("/com/zoo/health/add", backendHealth(health));
+        return instance.post("/zoo/health/add", backendHealth(health));
     },
     deleteHealthRequest(id) {
-        return instance.get("/com/zoo/health/delete", {params: {id}})
+        return instance.get("/zoo/health/delete", {params: {id}})
     },
     updateHealthRequest(health) {
-        return instance.post("/com/zoo/health/update", backendHealth(health));
+        return instance.post("/zoo/health/update", backendHealth(health));
     },
-    queryHealthRequest(id) {
+    queryHealthRequest(id,animalId) {
-        return instance.get("/com/zoo/health/info", {params: {id}})
+        return instance.get("/zoo/health/info", {params: {id,animalId}})
     }
 }
 
-// export function getUserById(id) {
-//     const data = store.state.users.find(e => e.id === id);
-//
-//     return data;
-// }
-
 // 将后端对象转化为符合前端需求的对象
 export function frontendLoginUser(data) {
     return {
@@ -99,7 +92,7 @@ export function frontendLoginUser(data) {
     };
 }
 
-export function frontendUsers(users){
+export function frontendUsers(users) {
     const newUsers = []
     users.forEach(user => {
         newUsers.push(frontendUser(user));
@@ -107,7 +100,7 @@ export function frontendUsers(users){
     return newUsers
 }
 
-export function frontendUser(user){
+export function frontendUser(user) {
     return {
         id: user.id,
         username: user.username,
@@ -140,6 +133,74 @@ export function frontendAnimal(animal) {
     }
 }
 
+export function frontendBreedingPlans(breedings) {
+    const newBreedingPlans = []
+    breedings.forEach(breedingPlan => {
+        newBreedingPlans.push(frontendBreeding(breedingPlan))
+    })
+    return newBreedingPlans
+}
+
+export function frontendBreeding(breeding) {
+    return {
+        id: breeding.id,
+        name: breeding.name,
+        species: breeding.species,
+        sex: breeding.sex,
+        phase: breeding.phase,
+        state: breeding.state,
+        roleId: breeding.roleid,
+        description: breeding.describe1,
+    }
+}
+
+export function frontendArchives(archives) {
+    const newArchives = []
+    archives.forEach(a => {
+        newArchives.push(frontendArchive(a))
+    })
+    return newArchives
+}
+
+export function frontendArchive(archive) {
+    return {
+        id: archive.id,
+        animalId: archive.animallId,
+        animalName: archive.animalName,
+        phase: archive.phase,
+        state: archive.state,
+        type: archive.type,
+        date: archive.date,
+        time: archive.time,
+        roleId: archive.roleId,
+        description: archive.description,
+    }
+}
+
+export function frontendHealths(healths) {
+    const newHealths = []
+    healths.forEach(h => {
+        newHealths.push(frontendHealth(h))
+    })
+    return newHealths
+}
+
+export function frontendHealth(health) {
+    return {
+        id: health.id,
+        animalId: health.animalId,
+        animalName: health.animalName,
+        state: health.state,
+        temperature: health.temperature,
+        breathRate: health.breathRete,
+        heartRate: health.heartRete,
+        bloodPressure: health.bloodPressure,
+        date: health.date,
+        time: health.time,
+        description: health.description
+    }
+}
+
 // 将前端对象的属性转为能和后端对应上属性的对象
 export function backendUser(user) {
     return {
@@ -175,7 +236,7 @@ export function backendBreeding(breeding) {
         phase: breeding.phase,
         state: breeding.state,
         roleid: breeding.roleId,
-        description: breeding.description,
+        describe1: breeding.description,
     }
 }
 
@@ -201,8 +262,8 @@ export function backendHealth(health) {
         animalName: health.animalName,
         state: health.state,
         temperature: health.temperature,
-        breathRate: health.breathRate,
+        breathRete: health.breathRate,
-        heartRate: health.heartRate,
+        heartRete: health.heartRate,
         bloodPressure: health.bloodPressure,
         date: health.date,
         time: health.time,