添加了获取数据的后台

README.md

@@ -2,22 +2,22 @@
 
 本次建设的动物信息分为以下功能：
 
-1. 数据录入与管理（基本完成）
+1. 数据录入与管理（前端基本完成，未接入后端）
    系统应提供数据录入功能，允许用户输入动物的基本信息，如种类、年龄、性别、体重、健康状况等。同时，系统应具备数据管理功能，包括数据的查询、修改、删除等操作，以便用户能够方便地管理和维护动物信息。
 
-2. 动物档案管理（进行中）
+2. 动物档案管理（前端基本完成，未接入后端）
    系统应建立动物档案，记录动物的整个生命周期，包括出生日期、疫苗接种记录、疾病治疗记录、饲养记录等。这有助于跟踪动物的健康状况和饲养情况，为动物提供更好的管理和照顾。
 
-3. 饲养管理（基本完成）
+3. 饲养管理（前端基本完成，未接入后端）
    系统应提供饲养管理功能，包括饲养计划的制定、饲养任务的分配、饲养记录的管理等。这有助于确保动物获得适当的饲料和营养，保持健康生长。
 
-4. 健康监测与预警（未开始）
+4. 健康监测与预警（前端进行中，未接入后端）
    系统应具备健康监测功能，定期收集和分析动物的健康数据，如体温、心率、呼吸频率等。同时，系统应提供预警功能，当动物的健康数据出现异常时，及时提醒管理人员采取相应措施。
 
 5. 统计分析（未开始）
    系统应提供统计分析功能，对动物信息、饲养记录、健康数据等进行统计分析，生成各类报表和图表。这有助于管理人员了解动物的整体状况和饲养效果，为决策提供支持。
 
-6. 用户权限管理（基本完成）
+6. 用户权限管理（前端基本完成，未接入后端）
    系统应建立用户权限管理机制，对不同用户设置不同的权限，如管理员、饲养员、兽医等。这有助于确保系统的安全性和数据的保密性。
 
 使用的技术/资源：

src/components/ZooHealthFormDialog.vue

@@ -0,0 +1,13 @@
+<script>
+export default {
+  name: "ZooHealthFormDialog"
+}
+</script>
+
+<template>
+
+</template>
+
+<style scoped>
+
+</style>

src/components/ZooHealthTimeline.vue

@@ -0,0 +1,13 @@
+<script>
+export default {
+  name: "ZooHealthTimeline"
+}
+</script>
+
+<template>
+
+</template>
+
+<style scoped>
+
+</style>

src/pages/ZooAnimal.vue

@@ -178,6 +178,10 @@ export default {
     showArchives(data) {
       console.log('显示档案', data)
 
+      //从后端获取需要查询的数据，防止数据前后不一致
+      //这里先用假数据代替一下
+      this.dialog.dialogData = this.animals.find(e => e.id === data.id)
+
       this.dialog.timelineData = []
       //从后端获取需要查询的数据，防止数据前后不一致
       //这里先用假数据代替一下
@@ -356,7 +360,7 @@ export default {
   </el-dialog>
 
   <!--查看动物所有记录-->
-  <el-dialog v-model="dialog.timelineDialogVisible" :title="'动物档案'" width="600" align-center draggable overflow
+  <el-dialog v-model="dialog.timelineDialogVisible" :title="'动物档案：'+dialog.dialogData.id" width="600" align-center draggable overflow
              destroy-on-close>
     <ZooArchiveTimeline :data="dialog.timelineData">
 <!--      <template #operate="scope">-->
@@ -364,6 +368,9 @@ export default {
 <!--        <el-button type="danger" link @click="delete_(scope.archive)">删除</el-button>-->
 <!--      </template>-->
       <template #footer>
+        <el-button type="primary" @click="$router.push('/panel/archive')">
+          跳转至动物档案
+        </el-button>
         <el-button @click="dialog.timelineDialogVisible = false">
           关闭
         </el-button>

src/pages/ZooArchive.vue

@@ -252,7 +252,6 @@ export default {
     <div class="select">
       <div class="left">
         <el-button type="primary" :icon="DocumentAdd" @click="dialog.addDialogVisible = true">添加记录</el-button>
-<!--        <el-button type="primary" :icon="DocumentAdd" @click="getArchives();console.log('刷新了',archives)">刷新vuex数据</el-button>-->
       </div>
       <div class="right">
         <el-input

src/pages/ZooHealth.vue

@@ -0,0 +1,13 @@
+<script>
+export default {
+  name: "ZooHealth"
+}
+</script>
+
+<template>
+
+</template>
+
+<style scoped>
+
+</style>

src/pages/data.vue

@@ -0,0 +1,50 @@
+<script>
+import {mapMutations} from "vuex";
+import {generateAnimals, generateArchives, generateBreedingPlans, generateUsers} from "@/utils/common.js";
+
+export default {
+  name: "ZooData",
+  methods: {
+    ...mapMutations(['updateUsers', 'updateAnimals', 'updateBreedingPlans', 'updateArchives']),
+    usersData() {
+      this.updateUsers(generateUsers())
+      return ElMessage({
+        message: '成功',
+        type: 'success',
+      })
+    },
+    animalsData() {
+      this.updateAnimals(generateAnimals())
+      return ElMessage({
+        message: '成功',
+        type: 'success',
+      })
+    },
+    breedingPlansData() {
+      this.updateBreedingPlans(generateBreedingPlans())
+      return ElMessage({
+        message: '成功',
+        type: 'success',
+      })
+    },
+    archiveData() {
+      this.updateArchives(generateArchives())
+      return ElMessage({
+        message: '成功',
+        type: 'success',
+      })
+    }
+  }
+}
+</script>
+
+<template>
+  <el-button type="primary" @click="usersData">生成用户信息</el-button>
+  <el-button type="primary" @click="animalsData">生成动物信息</el-button>
+  <el-button type="primary" @click="breedingPlansData">生成饲养计划信息</el-button>
+  <el-button type="primary" @click="archiveData">生成档案信息</el-button>
+</template>
+
+<style scoped>
+
+</style>

src/router/index.js

@@ -1,14 +1,15 @@
 import { createRouter } from "vue-router";
 import { createWebHashHistory } from "vue-router";
 
-import ZooLogin from '../pages/ZooLogin.vue'
+import ZooLogin from '@/pages/ZooLogin.vue'
 import ZooPanel from "@/pages/ZooPanel.vue";
-import ZooHome from '../pages/ZooHome.vue'
+import ZooHome from '@/pages/ZooHome.vue'
 import ZooUser from "@/pages/ZooUser.vue";
 import ZooAnimal from "@/pages/ZooAnimal.vue";
 import store from "@/store/index.js";
 import ZooBreeding from "@/pages/ZooBreeding.vue";
 import ZooArchive from "@/pages/ZooArchive.vue";
+import ZooData from "@/pages/data.vue";
 
 const router = createRouter({
     history: createWebHashHistory(),
@@ -57,6 +58,10 @@ const router = createRouter({
                 }
             ]
         },
+        {
+            path:'/data',
+            component:ZooData
+        }
 
     ]
 })

src/store/index.js

@@ -17,19 +17,27 @@ const actions = {
     },
     //获取用户数据
     getUsers(context) {
-        context.commit('updateUsers', generateUsers())
+        //通过后端获取数据
+        // context.commit('updateUsers', generateUsers())
+        context.commit('updateUsers', context.state.users);
     },
     //获取动物数据
     getAnimals(context) {
-        context.commit('updateAnimals', generateAnimals())
+        // 通过后端获取数据
+        // context.commit('updateAnimals', generateAnimals())
+        context.commit('updateAnimals', context.state.animals);
     },
     //获取饲养计划
     getBreedingPlans(context) {
-        context.commit('updateBreedingPlans',generateBreedingPlans())
+        // 通过后端获取数据
+        // context.commit('updateBreedingPlans',generateBreedingPlans())
+        context.commit('updateBreedingPlans',context.state.breedingPlans);
     },
     //获取动物档案
     getArchives(context) {
-        context.commit('updateArchives', generateArchives())
+        // 通过后端获取数据
+        // context.commit('updateArchives', generateArchives())
+        context.commit('updateArchives',context.state.archives);
     }
 }
 
@@ -84,16 +92,16 @@ const state = {
     // //动物档案
     // archives:[],
     //用户数据
-    users: generateUsers(),
+    users: [],
     usersTableData:[],//用户表格数据
     //动物数据
-    animals: generateAnimals(),
+    animals: [],
     animalsTableData:[],//动物表格数据
     //饲养计划
-    breedingPlans:generateBreedingPlans(),
+    breedingPlans:[],
     breedingPlansTableData:[],//饲养计划表格数据
     //动物档案
-    archives:generateArchives(),
+    archives:[],
     archivesTableData:[],//动物档案表格数据
 }
 

src/utils/common.js

@@ -1,42 +1,119 @@
 //生成用户数据
+import store from "@/store/index.js";
+
+// 生成用户数据
 export function generateUsers() {
     const users = []
-    //数据生成器
-    for (let i = 0; i < 100; i++) {
+    // 随机生成40-100条用户数据
+    const n = Math.floor(Math.random() * 60) + 40;
+    for (let i = 0; i < n; i++) {
+        const a = generateAuth()
         let user = {
             id: i,
-            username: 'user' + (i + 3),
+            username: 'user' + (i + 1),
             password: '123456',
-            auth: Math.floor(Math.random() * 3),
+            auth: a,
         }
         users.push(user)
+        if (a===1) {
+            keeper.push(user)
+        }
+        else if (a===2) {
+            veterinary.push(user)
+        }
     }
+    console.log('用户',users,keeper,veterinary)
     return users
 }
 
+//生成用户的比例为管理员2：饲养员6：兽医2
+function generateAuth() {
+    const n = Math.floor(Math.random() * 100);
+    if (n < 20) {
+        return 0
+    }
+    if (n < 80) {
+        return 1
+    }
+    if (n < 100) {
+        return 2
+    }
+}
+
 //生成动物数据
 export function generateAnimals() {
     const animals = []
-    //数据生成器
-    for (let i = 0; i < 100; i++) {
+    //随机生成100-200只动物
+    const n = Math.floor(Math.random() * 100) + 100;
+    for (let i = 0; i < n; i++) {
         let animal = {
             id: i,
-            name: 'animal' + (i + 3),
+            name: 'animal' + (i + 1),
             sex: Math.floor(Math.random() * 2) === 0 ? '雌性' : '雄性',
-            species: Math.floor(Math.random() * 10).toString(),//种类
+            species: '种类'+Math.ceil(Math.random() * 20).toString(),//种类
             weight: Number((Math.random() * 2000).toFixed(2)),
             height: Number((Math.random() * 10).toFixed(2)),
-            state: Math.floor(Math.random() * 2),//状态（0正常 1异常）
-            roleId: Math.floor(Math.random() * 100),//饲养员id
-            color: '',//Math.floor(Math.random() * 255),//颜色
-            features: Math.floor(Math.random() * 40).toString(),//特征
+            state: generateState(),//状态（0正常 1异常）
+            roleId: generateKeeperId(),//饲养员id
+            color: generateNewColor(),//颜色
+            features: 'test animal' + (i + 1)+' features',//特征
             phase: generatePhase()
         }
         animals.push(animal)
     }
+    console.log('动物',animals)
     return animals
 }
 
+//生成动物状态，正常9，异常1
+function generateState() {
+    const n = Math.floor(Math.random() * 100);
+    if (n < 10) {
+        return 1
+    }
+    if (n < 100) {
+        return 0
+    }
+}
+
+//生成已有的饲养员id
+//region
+const keeper = []
+
+function generateKeeperId() {
+    const n = Math.floor(Math.random() * keeper.length);
+    return keeper[n].id
+}
+//endregion
+
+//生成已有的兽医id
+//region
+const veterinary = []
+
+function generateVeterinaryId() {
+    const n = Math.floor(Math.random() * veterinary.length);
+    return veterinary[n].id
+}
+//endregion
+
+//生成颜色
+//region
+const hexCharacters = [0,1,2,3,4,5,6,7,8,9,"A","B","C","D","E","F"]
+
+function getCharacter(index) {
+    return hexCharacters[index]
+}
+function generateNewColor() {
+    let hexColorRep = "#"
+
+    for (let index = 0; index < 6; index++){
+        const randomPosition = Math.floor ( Math.random() * hexCharacters.length )
+        hexColorRep += getCharacter( randomPosition )
+    }
+    return hexColorRep
+}
+//endregion
+
 // id: '',//int 饲养计划id
 //     name: '',//字符 饲养计划名称
 //     species: '',//字符 种类
@@ -45,64 +122,104 @@ export function generateAnimals() {
 //     state: 0,//int 状态（0正常 1异常）
 //     describe: ''//字符 饲养计划的描述
 
+//生成饲养计划
 export function generateBreedingPlans() {
     const breedingPlans = []
-    for (let i = 0; i < 100; i++) {
-        let breedingPlan = {
-            id: i,
-            name: 'breeding' + (i + 3),
-            species: Math.floor(Math.random() * 10).toString(),
-            sex: Math.floor(Math.random() * 2) === 0 ? '雌性' : '雄性',
-            phase:generatePhase(),
-            state: Math.floor(Math.random() * 2),
-            roleId: Math.floor(Math.random() * 100),
-            description: Math.floor(Math.random() * 500).toString(),
+
+    //随机生成20种类动物的饲养计划
+    const n = 20;
+    for (let i = 0; i < n; i++) {
+        //分别生成2种性别的
+        for (let j = 0; j<2;j++){
+            //分别生成4种生命阶段的
+            for (let k=0; k<4;k++){
+                //分别生成2种状态的
+                for (let l=0; l<2;l++){
+                    let breedingPlan = {
+                        id: i+''+j+''+k+''+l,
+                        name: 'breeding' + (i + 1),
+                        species: '种类'+i.toString(),
+                        sex: j === 0 ? '雌性' : '雄性',
+                        phase: k===0?'幼年期':k===1?'成长期':k===2?'成年期':'老年期',
+                        state: l,
+                        roleId: generateKeeperId(),
+                        description: 'test breeding'+i+''+j+''+k+''+l+' description',
+                    }
+                    breedingPlans.push(breedingPlan)
+                }
+            }
         }
-        breedingPlans.push(breedingPlan)
     }
+    console.log('饲养计划',breedingPlans)
     return breedingPlans
 }
 
+//生成动物生命阶段1幼年，2成长，6成年，1老年
 function generatePhase() {
-    const phase = Math.floor(Math.random() * 4)
-    if (phase===0)
+    const phase = Math.floor(Math.random() * 100)
+    if (phase <10)
         return '幼年期'
-    if (phase===1)
+    if (phase <30)
         return '成长期'
-    if (phase===2)
+    if (phase <90)
         return '成年期'
-    if (phase===3)
+    if (phase <100)
         return '老年期'
 }
 
+//生成档案
 export function generateArchives() {
     const archives = []
-    for (let i = 0;i<100;i++){
-        let archive={
-            id: i,//档案号
-            animalId: Math.floor(Math.random()*100),//该档案记录的动物id
-            animalName: 'animal' + (i + 3),//该档案记录的动物名称
-            phase:generatePhase(),
-            state:Math.floor(Math.random() * 2),
-            type:generateType(),
-            date:'2024-'+Math.ceil(Math.random()*11).toString().padStart(2,'0')+'-'+Math.ceil(Math.random()*30).toString().padStart(2,'0'),//字符 档案记录日期
-            time:Math.floor(Math.random() * 24).toString().padStart(2,'0')+':'+Math.floor(Math.random()*60).toString().padStart(2,'0')+':'+Math.floor(Math.random()*60).toString().padStart(2,'0'),//记录时间
-            roleId: Math.floor(Math.random() * 100),//负责录入档案的人的id，身份不限
-            description: Math.floor(Math.random() * 500).toString(),
+
+    store.state.animals.forEach(e => {
+        //分为四个周期的档案
+        for (let i = 0; i < 4; i++) {
+            let n;
+            if (i===0){
+                //幼年期5-10条档案
+                n = Math.floor(Math.random() * 5)+5
+            }else if (i===1){
+                //成长期10-20条档案
+                n = Math.floor(Math.random() * 10)+10
+            }else if (i===2){
+                //成年期30-60条档案
+                n = Math.floor(Math.random() * 30)+30
+            }else{
+                //老年期5-10条档案
+                n = Math.floor(Math.random() * 5)+5
+            }
+            for (let j = 0; j<n;j++) {
+                let archive = {
+                    id: i+''+j,//档案号
+                    animalId: e.id,//该档案记录的动物id
+                    animalName: e.name,//该档案记录的动物名称
+                    phase: i===0?'幼年期':i===1?'成长期':i===2?'成年期':'老年期',
+                    state: generateState(),
+                    type: generateType(),
+                    date: '202'+i+'-' + Math.ceil(Math.random() * 11).toString().padStart(2, '0') + '-' + Math.ceil(Math.random() * 30).toString().padStart(2, '0'),//字符 档案记录日期
+                    time: Math.floor(Math.random() * 24).toString().padStart(2, '0') + ':' + Math.floor(Math.random() * 60).toString().padStart(2, '0') + ':' + Math.floor(Math.random() * 60).toString().padStart(2, '0'),//记录时间
+                    roleId: generateVeterinaryId(),//负责录入档案的人的id，身份不限
+                    description: 'test archive'+i+''+j+' description',
+                }
+                archives.push(archive)
+            }
+
         }
-        archives.push(archive)
-    }
+    })
+    console.log('档案',archives)
     return archives
 }
+
 function generateType() {
-    const type = Math.floor(Math.random() * 3)
-    if (type===0){
+    //疫苗接种1，疾病治疗1，日常饲养8
+    const type = Math.floor(Math.random() * 100)
+    if (type < 10) {
         return '疫苗接种'
     }
-    if (type===1){
+    if (type < 20) {
         return '疾病治疗'
     }
-    if (type===2){
+    if (type < 100) {
         return '日常饲养'
     }
 }
@@ -115,13 +232,14 @@ export function copy(value) {
 
 //鼠标悬浮显示密码
 //region
-export function showPassword(event,password){
+export function showPassword(event, password) {
     event.target.innerText = password
 }
 
 export function hidePassword(event) {
     event.target.innerText = '••••••••'
 }
+
 //endregion
 
 //模糊查询
@@ -155,16 +273,17 @@ function keywordMatching(object, keyword) {
         return (object[key] + '').includes(keyword)
     })
 }
+
 //endregion
 
 //日期时间降序排序
 export function sortByDateTime(archives) {
     archives.sort((a, b) => {
-        return Number(b.date.split('-').join(''))-Number(a.date.split('-').join(''))
+        return Number(b.date.split('-').join('')) - Number(a.date.split('-').join(''))
     })
     archives.sort((a, b) => {
         //日期相同再按时间排序
-        if (a.date===b.date) {
+        if (a.date === b.date) {
             return Number(b.time.split(':').join('')) - Number(a.time.split(':').join(''))
         }
     })