kxq/zoo-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

按要求修改v1.1

Browse Source
This commit is contained in:
bicey 2024-06-23 02:29:41 +08:00
parent 1ae3f8b035
commit 353c99eca9
18 changed files with 487 additions and 103 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.env.development Normal file
View File

@ -0,0 +1 @@
VITE_BASE_URL='http://localhost:8888'

1
.env.production Normal file
View File

@ -0,0 +1 @@
VITE_BASE_URL='http://alb-116396619.us-east-1.elb.amazonaws.com:80'

139
src/components/ZooAnimalFormDialog.vue
View File

@ -1,5 +1,6 @@
<script>
import {copy} from "@/utils/common.js";
import {mapGetters} from "vuex";
export default {
name: "ZooAnimalFormDialog",
@ -18,6 +19,102 @@ export default {
features: '',//特征
phase: '幼年期'//生长阶段
},
selectSpecies:true,
speciesData:[
{
value: '哺乳动物',
label: '哺乳动物',
children: [
{ value: '老虎', label: '老虎' },
{ value: '狮子', label: '狮子' },
{ value: '熊', label: '熊' },
{ value: '大象', label: '大象' },
{ value: '猴子', label: '猴子' },
{ value: '长颈鹿', label: '长颈鹿' },
{ value: '斑马', label: '斑马' },
{ value: '河马', label: '河马' },
{ value: '袋鼠', label: '袋鼠' },
{ value: '狼', label: '狼' },
{ value: '狐猴', label: '狐猴' },
],
},
{
value: '鸟类',
label: '鸟类',
children: [
{ value: '鸵鸟', label: '鸵鸟' },
{ value: '鹦鹉', label: '鹦鹉' },
{ value: '企鹅', label: '企鹅' },
{ value: '孔雀', label: '孔雀' },
{ value: '鹰', label: '鹰' },
{ value: '猫头鹰', label: '猫头鹰' },
{ value: '火烈鸟', label: '火烈鸟' },
{ value: '鹈鹕', label: '鹈鹕' },
],
},
{
value: '爬行动物',
label: '爬行动物',
children: [
{ value: '龟', label: '龟' },
{ value: '蜥蜴', label: '蜥蜴' },
{ value: '蛇', label: '蛇' },
{ value: '鳄鱼', label: '鳄鱼' },
{ value: '变色龙', label: '变色龙' },
{ value: '科莫多龙', label: '科莫多龙' },
],
},
{
value: '两栖动物',
label: '两栖动物',
children: [
{ value: '青蛙', label: '青蛙' },
{ value: '蟾蜍', label: '蟾蜍' },
{ value: '蝾螈', label: '蝾螈' },
{ value: '牛蛙', label: '牛蛙' },
{ value: '树蛙', label: '树蛙' },
],
},
{
value: '鱼类',
label: '鱼类',
children: [
{ value: '鲨鱼', label: '鲨鱼' },
{ value: '鳗鱼', label: '鳗鱼' },
{ value: '热带鱼', label: '热带鱼' },
{ value: '鲸鱼', label: '鲸鱼' },
{ value: '海豚', label: '海豚' },
{ value: '海马', label: '海马' },
{ value: '魔鬼鱼', label: '魔鬼鱼' },
],
},
{
value: '昆虫',
label: '昆虫',
children: [
{ value: '蝴蝶', label: '蝴蝶' },
{ value: '甲虫', label: '甲虫' },
{ value: '蜻蜓', label: '蜻蜓' },
],
},
{
value: '甲壳类',
label: '甲壳类',
children: [
{ value: '螃蟹', label: '螃蟹' },
{ value: '龙虾', label: '龙虾' },
{ value: '虾', label: '虾' },
],
},
{
value: '软体动物',
label: '软体动物',
children: [
{ value: '章鱼', label: '章鱼' },
{ value: '乌贼', label: '乌贼' },
],
},
],
}
},
props: {
@ -33,6 +130,9 @@ export default {
default: false
}
},
computed:{
...mapGetters(["getKeepers"])
},
mounted() {
// 给表单填充传递的数据
if (this.data) {
@ -60,7 +160,25 @@ export default {
</el-radio-group>
</el-form-item>
<el-form-item label="动物种类">
<el-col :span="16" v-if="selectSpecies">
<el-tree-select
v-model="form.species"
:data="speciesData"
:render-after-expand="false"
clearable :disabled="detail"
/>
</el-col>
<el-col :span="16" v-else>
<el-input v-model="form.species" placeholder="动物种类" :disabled="detail"/>
</el-col>
<el-col :span="1">
</el-col>
<el-col :span="6" justify="end">
<el-button @click="selectSpecies = !selectSpecies" :disabled="detail">自定义种类</el-button>
</el-col>
</el-form-item>
<el-form-item label="体重（KG）">
<el-input-number v-model.number="form.weight" :precision="2" :step="0.1" :min="0" :disabled="detail"/>
@ -75,7 +193,26 @@ export default {
</el-radio-group>
</el-form-item>
<el-form-item label="饲养员ID">
<el-input v-model="form.roleId" type="number" placeholder="饲养员ID" :disabled="detail"/>
<!-- <el-input v-model="form.roleId" type="number" placeholder="饲养员ID" :disabled="detail"/>-->
<el-select v-model="form.roleId" placeholder="饲养员" clearable :disabled="detail">
<el-option
v-for="item in getKeepers"
:key="item.id"
:value="item.id"
>
<span style="float: left">{{ item.username }}</span>
<span
style="
float: right;
color: var(--el-text-color-secondary);
font-size: 13px;
"
>
roleId ：{{ item.id }}
</span>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="动物颜色">
<el-color-picker v-model="form.color" :disabled="detail"/>

32
src/components/ZooArchiveFormDialog.vue
View File

@ -1,5 +1,6 @@
<script>
import {copy} from "@/utils/common.js";
import {mapState} from "vuex";
export default {
name: "ZooArchiveFormDialog",
@ -32,6 +33,17 @@ export default {
default: false
}
},
watch:{
'form.animalId':{
handler(newValue){
// console.log(newValue)
this.form.animalName = this.animals.find(e=>e.id===this.form.animalId).name
}
}
},
computed:{
...mapState(['loginUser','animals'])
},
mounted() {
// 给表单填充传递的数据
if (this.data) {
@ -54,7 +66,25 @@ export default {
<el-input v-model.number="form.id" type="number" placeholder="系统自动生成记录号" :disabled="edit || detail || true"/>
</el-form-item>
<el-form-item label="动物ID">
<el-input v-model.number="form.animalId" type="number" placeholder="动物ID" :disabled="detail"/>
<!-- <el-input v-model.number="form.animalId" type="number" placeholder="动物ID" :disabled="detail"/>-->
<el-select v-model="form.animalId" placeholder="动物ID" clearable :disabled="detail">
<el-option
v-for="item in animals"
:key="item.id"
:value="item.id"
>
<span style="float: left">{{ item.name }}</span>
<span
style="
float: right;
color: var(--el-text-color-secondary);
font-size: 13px;
"
>
animalId ：{{ item.id }}
</span>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="动物名称">
<el-input v-model="form.animalName" placeholder="动物名称" :disabled="detail"/>

34
src/components/ZooBreedingPlanFormDialog.vue
View File

@ -1,5 +1,6 @@
<script>
import {copy} from "@/utils/common.js";
import {mapGetters} from "vuex";
export default {
name: "ZooBreedingFormDialog",
@ -30,6 +31,9 @@ export default {
default: false
}
},
computed:{
...mapGetters(['getAllSpecies','getKeepers'])
},
mounted() {
// 给表单填充传递的数据
if (this.data) {
@ -51,7 +55,15 @@ export default {
<el-input v-model="form.name" placeholder="计划名称" :disabled="detail"/>
</el-form-item>
<el-form-item label="动物种类">
<el-input v-model="form.species" placeholder="动物种类" :disabled="detail"/>
<!-- <el-input v-model="form.species" placeholder="动物种类" :disabled="detail"/>-->
<el-select v-model="form.species" placeholder="动物种类" clearable :disabled="detail">
<el-option
v-for="(item,index) in getAllSpecies"
:key="index"
:value="item"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="性别">
<el-radio-group v-model="form.sex" :disabled="detail">
@ -74,7 +86,25 @@ export default {
</el-radio-group>
</el-form-item>
<el-form-item label="执行饲养员">
<el-input v-model.number="form.roleId" type="number" placeholder="执行饲养员" :disabled="detail"/>
<!-- <el-input v-model.number="form.roleId" type="number" placeholder="执行饲养员" :disabled="detail"/>-->
<el-select v-model="form.roleId" placeholder="执行饲养员" clearable :disabled="detail">
<el-option
v-for="item in getKeepers"
:key="item.id"
:value="item.id"
>
<span style="float: left">{{ item.username }}</span>
<span
style="
float: right;
color: var(--el-text-color-secondary);
font-size: 13px;
"
>
roleId ：{{ item.id }}
</span>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="计划描述" >
<el-input

32
src/components/ZooHealthFormDialog.vue
View File

@ -1,5 +1,6 @@
<script>
import {copy} from "@/utils/common.js";
import {mapState} from "vuex";
export default {
name: "ZooHealthFormDialog",
@ -33,6 +34,17 @@ export default {
default: false
}
},
computed:{
...mapState(['animals'])
},
watch:{
'form.animalId':{
handler(newValue){
// console.log(newValue)
this.form.animalName = this.animals.find(e=>e.id===this.form.animalId).name
}
}
},
mounted() {
// 给表单填充传递的数据
if (this.data) {
@ -55,7 +67,25 @@ export default {
<el-input v-model.number="form.id" type="number" placeholder="系统自动生成监测号" :disabled="edit || detail || true"/>
</el-form-item>
<el-form-item label="动物ID">
<el-input v-model.number="form.animalId" type="number" placeholder="动物ID" :disabled="detail"/>
<!-- <el-input v-model.number="form.animalId" type="number" placeholder="动物ID" :disabled="detail"/>-->
<el-select v-model="form.animalId" placeholder="动物ID" clearable :disabled="detail">
<el-option
v-for="item in animals"
:key="item.id"
:value="item.id"
>
<span style="float: left">{{ item.name }}</span>
<span
style="
float: right;
color: var(--el-text-color-secondary);
font-size: 13px;
"
>
animalId ：{{ item.id }}
</span>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="动物名称">
<el-input v-model="form.animalName" placeholder="动物名称" :disabled="detail"/>

16
src/pages/ZooAnimal.vue
View File

@ -1,5 +1,5 @@
<script>
import {copy, fuzzyMatching, splitKeyWords} from "@/utils/common.js";
import {copy, fuzzyMatching, refreshData, splitKeyWords} from "@/utils/common.js";
import {Delete, Document, DocumentAdd, Edit, Search, Tickets} from "@element-plus/icons-vue";
import ZooAnimalFormDialog from "@/components/ZooAnimalFormDialog.vue";
import {mapMutations, mapState} from "vuex";
@ -55,7 +55,10 @@ export default {
return Tickets
},
//endregion
...mapState(["animals", 'archives', 'animalsTableData'])
...mapState(["animals", 'archives', 'animalsTableData','loginUser']),
operateWidth() {
return this.loginUser.auth===1?'250':'130'
}
},
watch: {
// 搜索框存在输入，自动调用搜索(刷新数据包含搜索)
@ -333,6 +336,7 @@ export default {
mounted() {
// 加载完成后拉取数据
this.refresh()
refreshData()
}
}
</script>
@ -340,7 +344,7 @@ export default {
<template>
<div class="animal-root">
<div class="select">
<div class="left">
<div class="left" v-if="loginUser.auth===1">
<el-button type="primary" :icon="DocumentAdd" @click="dialog.addDialogVisible = true">添加动物</el-button>
</div>
<div class="right">
@ -389,7 +393,7 @@ export default {
</template>
</el-table-column>
<el-table-column prop="features" label="动物特征" width="300"/>
<el-table-column fixed="right" label="操作" width="250">
<el-table-column fixed="right" label="操作" :width="operateWidth" >
<template #default="scope">
<el-button link type="success" size="small" :icon="Tickets" @click="showTimeline(scope.row)">
档案
@ -397,10 +401,10 @@ export default {
<el-button link type="primary" size="small" :icon="Document" @click="showDetail(scope.row)">
详情
</el-button>
<el-button link type="primary" size="small" :icon="Edit" @click="showEdit(scope.row)">
<el-button link type="primary" size="small" :icon="Edit" @click="showEdit(scope.row)" v-if="loginUser.auth===1">
编辑
</el-button>
<el-button link type="danger" size="small" :icon="Delete" @click="delete_(scope.row)">
<el-button link type="danger" size="small" :icon="Delete" @click="delete_(scope.row)" v-if="loginUser.auth===1">
删除
</el-button>
</template>

17
src/pages/ZooArchive.vue
View File

@ -2,7 +2,7 @@
import ZooArchiveFormDialog from "@/components/ZooArchiveFormDialog.vue";
import {Delete, DocumentAdd, Document, Edit, Search, Tickets, Timer} from "@element-plus/icons-vue";
import {mapState, mapActions, mapMutations} from "vuex";
import {copy, splitKeyWords, fuzzyMatching, sortByDateTime} from "@/utils/common.js";
import {copy, splitKeyWords, fuzzyMatching, sortByDateTime, refreshData} from "@/utils/common.js";
import ZooArchiveTimeline from "@/components/ZooArchiveTimeline.vue";
import request, {frontendArchive, frontendArchives} from "@/utils/request.js";
@ -59,7 +59,10 @@ export default {
return Timer
},
//endregion
...mapState(["archives", 'archivesTableData'])
...mapState(["archives", 'archivesTableData','loginUser']),
operateWidth() {
return this.loginUser.auth!==0?'250':'130'
}
},
watch: {
// 搜索框存在输入，自动调用搜索(刷新数据包含搜索)
@ -368,6 +371,7 @@ export default {
mounted() {
// 加载完成后拉取数据
this.refresh()
refreshData()
},
}
</script>
@ -375,7 +379,7 @@ export default {
<template>
<div class="archive-root">
<div class="select">
<div class="left">
<div class="left" v-if="loginUser.auth!==0">
<el-button type="primary" :icon="DocumentAdd" @click="dialog.addDialogVisible = true">添加记录</el-button>
</div>
<div class="right">
@ -417,8 +421,9 @@ export default {
<el-table-column prop="date" label="记录日期" width="110"/>
<el-table-column prop="time" label="记录时间" width="90"/>
<el-table-column prop="roleId" label="记录人ID" width="90"/>
<el-table-column prop="breedingId" label="关联计划" width="90"/>
<el-table-column prop="description" label="记录描述" width="300"/>
<el-table-column fixed="right" label="操作" width="250">
<el-table-column fixed="right" label="操作" :width="operateWidth">
<template #default="scope">
<el-button link type="success" size="small" :icon="Tickets" @click="showTimeline(scope.row)">
档案
@ -426,10 +431,10 @@ export default {
<el-button link type="primary" size="small" :icon="Document" @click="showDetail(scope.row)">
详情
</el-button>
<el-button link type="primary" size="small" :icon="Edit" @click="showEdit(scope.row)">
<el-button link type="primary" size="small" :icon="Edit" @click="showEdit(scope.row)" v-if="loginUser.auth!==0">
编辑
</el-button>
<el-button link type="danger" size="small" :icon="Delete" @click="delete_(scope.row)">
<el-button link type="danger" size="small" :icon="Delete" @click="delete_(scope.row)" v-if="loginUser.auth!==0">
删除
</el-button>
</template>

82
src/pages/ZooBreeding.vue
View File

@ -1,13 +1,14 @@
<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 {copy, splitKeyWords, fuzzyMatching} from "@/utils/common.js";
import request, {frontendBreeding, frontendBreedingPlans} from "@/utils/request.js";
import {mapState, mapActions, mapMutations, mapGetters} from "vuex";
import {Delete, DocumentAdd, Document, Edit, Search, Tickets} from "@element-plus/icons-vue";
import {copy, splitKeyWords, fuzzyMatching, refreshData} from "@/utils/common.js";
import request, {frontendArchives, frontendBreeding, frontendBreedingPlans} from "@/utils/request.js";
import ZooArchiveTimeline from "@/components/ZooArchiveTimeline.vue";
export default {
name: "ZooBreeding",
components: {ZooBreedingPlanFormDialog},
components: {ZooArchiveTimeline, ZooBreedingPlanFormDialog},
data() {
return {
//表格分页显示的数据
@ -26,11 +27,14 @@ export default {
dialogData: {},
addDialogVisible: false,//添加饲养计划对话框
editDialogVisible: false,//编辑饲养计划对话框
detailDialogVisible: false//查询饲养计划对话框
detailDialogVisible: false,//查询饲养计划对话框
timelineDialogVisible: false,//时间线对话框
timelineData: []//时间线数据
}
}
},
computed: {
//图标
//region
Search() {
@ -48,8 +52,15 @@ export default {
Document() {
return Document
},
Tickets() {
return Tickets
},
//endregion
...mapState(["breedingPlans", 'breedingPlansTableData'])
...mapState(["breedingPlans", 'breedingPlansTableData','loginUser']),
operateWidth() {
return this.loginUser.auth===1?'250':'130'
}
},
watch: {
// 搜索框存在输入，自动调用搜索(刷新数据包含搜索)
@ -63,6 +74,32 @@ export default {
methods: {
...mapMutations(['updateBreedingPlans','updateBreedingPlansTableData']),
//以时间线的形式查看该动物的所有档案记录
showTimeline(data) {
console.log('显示时间线记录', data)
this.dialog.dialogData = data
//从后端获取需要查询的数据，防止数据前后不一致
request.queryAnimalRequest(data.id).then(response => {
if (response.data.data===null){
this.refresh();
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
}
})
}
})
},
//显示详情弹窗
showDetail(data) {
console.log('显示详情', data)
@ -302,6 +339,7 @@ export default {
mounted() {
// 加载完成后拉取数据
this.refresh()
refreshData()
}
}
</script>
@ -309,7 +347,7 @@ export default {
<template>
<div class="breeding-root">
<div class="select">
<div class="left">
<div class="left" v-if="loginUser.auth === 1">
<el-button type="primary" :icon="DocumentAdd" @click="dialog.addDialogVisible = true">添加计划</el-button>
</div>
<div class="right">
@ -349,15 +387,18 @@ export default {
</template>
</el-table-column>
<el-table-column prop="description" label="计划描述" width="300"/>
<el-table-column fixed="right" label="操作" width="190">
<el-table-column fixed="right" label="操作" :width="operateWidth">
<template #default="scope">
<el-button link type="success" size="small" :icon="Tickets" @click="showTimeline(scope.row)">
档案
</el-button>
<el-button link type="primary" size="small" :icon="Document" @click="showDetail(scope.row)">
详情
</el-button>
<el-button link type="primary" size="small" :icon="Edit" @click="showEdit(scope.row)">
<el-button link type="primary" size="small" :icon="Edit" @click="showEdit(scope.row)" v-if="loginUser.auth===1">
编辑
</el-button>
<el-button link type="danger" size="small" :icon="Delete" @click="delete_(scope.row)">
<el-button link type="danger" size="small" :icon="Delete" @click="delete_(scope.row)" v-if="loginUser.auth===1">
删除
</el-button>
</template>
@ -415,6 +456,25 @@ export default {
</template>
</ZooBreedingPlanFormDialog>
</el-dialog>
<!--查看动物所有记录-->
<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">-->
<!-- <el-button type="primary" link @click="showEdit(scope.archive)">编辑</el-button>-->
<!-- <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>
</template>
</ZooArchiveTimeline>
</el-dialog>
</template>
<style scoped>

16
src/pages/ZooHealth.vue
View File

@ -1,7 +1,7 @@
<script>
import {Delete, DocumentAdd, Document, Edit, Search, Tickets, Timer} from "@element-plus/icons-vue";
import {mapActions, mapMutations, mapState} from "vuex";
import {copy, fuzzyMatching, sortByDateTime, splitKeyWords} from "@/utils/common.js";
import {copy, fuzzyMatching, refreshData, 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";
@ -59,7 +59,10 @@ export default {
return Timer
},
//endregion
...mapState(["healths", 'healthsTableData'])
...mapState(["healths", 'healthsTableData','loginUser']),
operateWidth() {
return this.loginUser.auth===2?'250':'130'
}
},
watch: {
// 搜索框存在输入，自动调用搜索(刷新数据包含搜索)
@ -370,6 +373,7 @@ export default {
mounted() {
// 加载完成后拉取数据
this.refresh()
refreshData()
},
}
</script>
@ -377,7 +381,7 @@ export default {
<template>
<div class="health-root">
<div class="select">
<div class="left">
<div class="left" v-if="loginUser.auth===2">
<el-button type="primary" :icon="DocumentAdd" @click="dialog.addDialogVisible = true">添加记录</el-button>
</div>
<div class="right">
@ -445,7 +449,7 @@ export default {
<el-table-column prop="date" label="记录日期" width="110"/>
<el-table-column prop="time" label="记录时间" width="90"/>
<el-table-column prop="description" label="记录描述" width="300"/>
<el-table-column fixed="right" label="操作" width="250">
<el-table-column fixed="right" label="操作" :width="operateWidth">
<template #default="scope">
<el-button link type="success" size="small" :icon="Tickets" @click="showTimeline(scope.row)">
追踪
@ -453,10 +457,10 @@ export default {
<el-button link type="primary" size="small" :icon="Document" @click="showDetail(scope.row)">
详情
</el-button>
<el-button link type="primary" size="small" :icon="Edit" @click="showEdit(scope.row)">
<el-button link type="primary" size="small" :icon="Edit" @click="showEdit(scope.row)" v-if="loginUser.auth===2">
编辑
</el-button>
<el-button link type="danger" size="small" :icon="Delete" @click="delete_(scope.row)">
<el-button link type="danger" size="small" :icon="Delete" @click="delete_(scope.row)" v-if="loginUser.auth===2">
删除
</el-button>
</template>

82
src/pages/ZooHome.vue
View File

@ -1,6 +1,7 @@
<script>
import {mapState} from "vuex";
import {Minus, Plus} from "@element-plus/icons-vue";
import {Bell, Minus, Plus} from "@element-plus/icons-vue";
import {refreshData} from "@/utils/common.js";
export default {
name: "ZooHome",
@ -17,9 +18,9 @@ export default {
foodCount: Math.floor((Math.random() * 201)),//当前食物库存
foodCapacity: 200,//食物库存
breedingAnimalCount: 0,//今日已饲养动物数
healthAnimalCount: 0,//今日已监测动物数
handleAnimalCount: 0,//今日处理异常动物数
// breedingAnimalCount: 0,//今日已饲养动物数
// healthAnimalCount: 0,//今日已监测动物数
// handleAnimalCount: 0,//今日处理异常动物数
percentageColors: [
{color: '#f56c6c', percentage: 30},
@ -90,13 +91,46 @@ export default {
}
},
computed: {
Bell() {
return Bell
},
Plus() {
return Plus
},
Minus() {
return Minus
},
...mapState(["users", 'animals']),
breedingAnimalCount(){//今日已饲养动物数
let count = 0;
const newDate = new Date()
this.archives.forEach(e => {
if (e.type === '日常饲养' && e.date === (newDate.getFullYear() + '-' + (newDate.getMonth()+1).toString().padStart(2, '0') + '-' + newDate.getDate().toString().padStart(2, '0'))) {
count++
}
})
return count;
},
healthAnimalCount(){
let count = 0;
const newDate = new Date()
this.healths.forEach(e => {
if (e.date === (newDate.getFullYear() + '-' + (newDate.getMonth()+1).toString().padStart(2, '0') + '-' + newDate.getDate().toString().padStart(2, '0'))) {
count++
}
})
return count;
},
handleAnimalCount(){
let count = 0;
const newDate = new Date()
this.archives.forEach(e => {
if (e.type === '疾病治疗' && e.date === (newDate.getFullYear() + '-' + (newDate.getMonth()+1).toString().padStart(2, '0') + '-' + newDate.getDate().toString().padStart(2, '0'))) {
count++
}
})
return count;
},
...mapState(["users", 'animals', 'loginUser', 'archives','healths']),
},
methods: {
decreaseFood() {
@ -138,7 +172,17 @@ export default {
if (this.handleAnimalCount < this.abnormalCount) {
this.handleAnimalCount++
}
},
notify(msg){
return ElMessage({
message: '已通知'+msg,
type: 'success',
})
}
},
mounted() {
refreshData()
}
}
</script>
@ -253,9 +297,10 @@ export default {
<span class="percentage-value" v-if="!percentage">0%</span>
<span class="percentage-value" v-else>{{ percentage }}%</span>
<span class="percentage-label">{{ breedingAnimalCount }}/{{ animals.length }}</span>
<span v-if="percentage>=0">
<el-button :icon="Minus" @click="decreaseBreeding" size="small" style="width: 10px"/>
<el-button :icon="Plus" @click="increaseBreeding" size="small" style="width: 10px"/>
<span v-if="percentage>=0 && (loginUser.auth === 0 || loginUser.auth === 1)">
<!-- <el-button :icon="Minus" @click="decreaseBreeding" size="small" style="width: 10px"/>-->
<!-- <el-button :icon="Plus" @click="increaseBreeding" size="small" style="width: 10px"/>-->
<el-button :icon="Bell" @click="notify('饲养员')" size="small" style="width: 80px">通知饲养员</el-button>
</span>
</template>
</el-progress>
@ -267,9 +312,10 @@ export default {
<span class="percentage-label">食物库存</span>
<span class="percentage-value">{{ percentage }}%</span>
<span class="percentage-label">{{ foodCount }}/{{ foodCapacity }}吨</span>
<span v-if="percentage>=0">
<el-button :icon="Minus" @click="decreaseFood" size="small" style="width: 10px"/>
<el-button :icon="Plus" @click="increaseFood" size="small" style="width: 10px"/>
<span v-if="percentage>=0 && (loginUser.auth === 0 || loginUser.auth === 1)">
<!-- <el-button :icon="Minus" @click="decreaseFood" size="small" style="width: 10px"/>-->
<!-- <el-button :icon="Plus" @click="increaseFood" size="small" style="width: 10px"/>-->
<el-button :icon="Bell" @click="notify('饲养员')" size="small" style="width: 80px">通知饲养员</el-button>
</span>
</template>
</el-progress>
@ -284,9 +330,10 @@ export default {
<span class="percentage-value" v-if="!percentage">0%</span>
<span class="percentage-value" v-else>{{ percentage }}%</span>
<span class="percentage-label">{{ healthAnimalCount }}/{{ animals.length }}</span>
<span v-if="percentage>=0">
<el-button :icon="Minus" @click="decreaseHealth" size="small" style="width: 10px"/>
<el-button :icon="Plus" @click="increaseHealth" size="small" style="width: 10px"/>
<span v-if="percentage>=0 && (loginUser.auth === 0 || loginUser.auth === 2)">
<!-- <el-button :icon="Minus" @click="decreaseHealth" size="small" style="width: 10px"/>-->
<!-- <el-button :icon="Plus" @click="increaseHealth" size="small" style="width: 10px"/>-->
<el-button :icon="Bell" @click="notify('兽医')" size="small" style="width: 80px">通知兽医</el-button>
</span>
</template>
</el-progress>
@ -299,9 +346,10 @@ export default {
<span class="percentage-value" v-if="!percentage">0%</span>
<span class="percentage-value" v-else>{{ percentage }}%</span>
<span class="percentage-label">{{ handleAnimalCount }}/{{ abnormalCount }}</span>
<span v-if="percentage>=0">
<el-button :icon="Minus" @click="decreaseHandle" size="small" style="width: 10px"/>
<el-button :icon="Plus" @click="increaseHandle" size="small" style="width: 10px"/>
<span v-if="percentage>=0 && (loginUser.auth === 0 || loginUser.auth === 2)">
<!-- <el-button :icon="Minus" @click="decreaseHandle" size="small" style="width: 10px"/>-->
<!-- <el-button :icon="Plus" @click="increaseHandle" size="small" style="width: 10px"/>-->
<el-button :icon="Bell" @click="notify('兽医')" size="small" style="width: 80px">通知兽医</el-button>
</span>
</template>
</el-progress>

5
src/pages/ZooLogin.vue
View File

@ -90,7 +90,7 @@ export default {
</template>
<el-form :model="form" label-width="auto" style="width: 400px">
<el-form-item label="用户名">
<el-input v-model="form.username" style="width: 240px" placeholder="请输入用户名"/>
<el-input v-model="form.username" style="width: 240px" placeholder="请输入用户名" id="username"/>
</el-form-item>
<el-form-item label="密码">
<el-input
@ -99,10 +99,11 @@ export default {
type="password"
placeholder="请输入密码"
show-password
id="password"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="login">登录</el-button>
<el-button type="primary" @click="login" id="login-button">登录</el-button>
<el-button @click="reset">重置</el-button>
</el-form-item>
</el-form>

12
src/pages/ZooPanel.vue
View File

@ -4,6 +4,7 @@ import ZooAside from "@/components/ZooAside.vue";
import ZooMain from "@/components/ZooMain.vue";
import ZooFooter from "@/components/ZooFooter.vue";
import {mapActions} from "vuex";
import {refreshData} from "@/utils/common.js";
export default {
name: "ZooPanel",
@ -26,11 +27,12 @@ export default {
mounted() {
console.log("登录用户",this.$store.state.loginUser)
//初始化数据
this.getUsers();
this.getAnimals();
this.getBreedingPlans();
this.getArchives();
this.getHealths();
// this.getUsers();
// this.getAnimals();
// this.getBreedingPlans();
// this.getArchives();
// this.getHealths();
refreshData()
}
}
</script>

3
src/pages/ZooUser.vue
View File

@ -2,7 +2,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 {copy, fuzzyMatching, splitKeyWords, showPassword, hidePassword, refreshData} from "@/utils/common.js";
import request, {frontendUser, frontendUsers} from "@/utils/request.js";
@ -317,6 +317,7 @@ export default {
},
mounted() {
this.refresh()
refreshData();
},
}
</script>

22
src/store/index.js
View File

@ -147,8 +147,28 @@ const state = {
healthsTableData:[],//健康检测表格数据
}
const getters = {
getKeepers() {
const k = []
state.users.forEach(user => {
if (user.auth === 1){
k.push(copy(user))
}
})
return k;
},
getAllSpecies() {
const set = new Set
state.animals.forEach(e => {
set.add(e.species)
})
return set
},
}
export default createStore({
actions,
mutations,
state
state,
getters
})

8
src/utils/common.js
View File

@ -2,6 +2,14 @@
import store from "@/store/index.js";
import request from "@/utils/request.js";
export function refreshData() {
store.dispatch('getUsers');
store.dispatch('getAnimals');
store.dispatch('getBreedingPlans');
store.dispatch('getArchives');
store.dispatch('getHealths');
}
// 生成用户数据
export function generateUsers() {
const users = []

46
src/utils/request.js
View File

@ -1,7 +1,7 @@
import axios from "axios";
const instance = axios.create({
baseURL: 'http://localhost:8888',
baseURL : `${import.meta.env.VITE_BASE_URL}/zoo`,
})
export default {
@ -9,77 +9,77 @@ export default {
const formData = new FormData();
formData.append('username', form.username);
formData.append('password', form.password);
return instance.post("/zoo/login/login", formData);
return instance.post("/login/login", formData);
},
//用户请求
addUserRequest(user) {
return instance.post("/zoo/account/save", backendUser(user));
return instance.post("/account/save", backendUser(user));
},
deleteUserRequest(id) {
return instance.get("/zoo/account/delete", {params: {id}});
return instance.get("/account/delete", {params: {id}});
},
updateUserRequest(user) {
return instance.post("/zoo/account/update", backendUser(user));
return instance.post("/account/update", backendUser(user));
},
queryUserRequest(username) {
return instance.get("/zoo/account/info", {params: {username}})
return instance.get("/account/info", {params: {username}})
},
//动物请求
addAnimalRequest(animal) {
return instance.post("/zoo/animal/add", backendAnimal(animal));
return instance.post("/animal/add", backendAnimal(animal));
},
deleteAnimalRequest(aid) {
return instance.get("/zoo/animal/delete", {params: {aid}});
return instance.get("/animal/delete", {params: {aid}});
},
updateAnimalRequest(animal) {
return instance.post("/zoo/animal/update", backendAnimal(animal));
return instance.post("/animal/update", backendAnimal(animal));
},
queryAnimalRequest(aid) {
return instance.get("/zoo/animal/info", {params: {aid}})
return instance.get("/animal/info", {params: {aid}})
},
//饲养计划请求
addBreedingPlanRequest(breedingPlan) {
return instance.post("/zoo/plan/add", backendBreeding(breedingPlan));
return instance.post("/plan/add", backendBreeding(breedingPlan));
},
deleteBreedingPlanRequest(id) {
return instance.get("/zoo/plan/delete", {params: {id}})
return instance.get("/plan/delete", {params: {id}})
},
updateBreedingPlanRequest(breedingPlan) {
return instance.post("/zoo/plan/update", backendBreeding(breedingPlan));
return instance.post("/plan/update", backendBreeding(breedingPlan));
},
queryBreedingPlanRequest(id) {
return instance.get("/zoo/plan/info", {params: {id}})
return instance.get("/plan/info", {params: {id}})
},
//档案请求
addArchiveRequest(archive) {
return instance.post("/zoo/archive/add", backendArchive(archive));
return instance.post("/archive/add", backendArchive(archive));
},
deleteArchiveRequest(id) {
return instance.get("/zoo/archive/delete", {params: {id}})
return instance.get("/archive/delete", {params: {id}})
},
updateArchiveRequest(archive) {
return instance.post("/zoo/archive/update", backendArchive(archive));
return instance.post("/archive/update", backendArchive(archive));
},
queryArchiveRequest(id, animallId) {
return instance.get("/zoo/archive/info", {params: {id, animallId}})
return instance.get("/archive/info", {params: {id, animallId}})
},
//健康记录请求
addHealthRequest(health) {
return instance.post("/zoo/health/add", backendHealth(health));
return instance.post("/health/add", backendHealth(health));
},
deleteHealthRequest(id) {
return instance.get("/zoo/health/delete", {params: {id}})
return instance.get("/health/delete", {params: {id}})
},
updateHealthRequest(health) {
return instance.post("/zoo/health/update", backendHealth(health));
return instance.post("/health/update", backendHealth(health));
},
queryHealthRequest(id,animalId) {
return instance.get("/zoo/health/info", {params: {id,animalId}})
return instance.get("/health/info", {params: {id,animalId}})
}
}
@ -174,6 +174,7 @@ export function frontendArchive(archive) {
time: archive.time,
roleId: archive.roleId,
description: archive.description,
breedingId:archive.breedingId
}
}
@ -252,6 +253,7 @@ export function backendArchive(archive) {
time: archive.time,
roleId: archive.roleId,
description: archive.description,
breedingId:archive.breedingId
}
}

4
vite.config.js
View File

@ -24,6 +24,6 @@ export default defineConfig({
}
},
server: {
port:5000
}
port: 5000,
},
})