|
@@ -38,9 +38,28 @@
|
|
element-loading-spinner="el-icon-loading"
|
|
element-loading-spinner="el-icon-loading"
|
|
element-loading-background="rgba(0, 0, 0, 0.8)"
|
|
element-loading-background="rgba(0, 0, 0, 0.8)"
|
|
>
|
|
>
|
|
|
|
+ <div class="zooFlex">
|
|
|
|
+ <el-form :inline="true" size="small">
|
|
|
|
+ <el-form-item label="栋舍">
|
|
|
|
+ <el-select v-model="schoolId" style="width: 160px;" @change="handSchool">
|
|
|
|
+ <el-option v-for="item in schoolList" :key="item.id" :value="item.id" :label="item.floorName"></el-option>
|
|
|
|
+ </el-select>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="楼层">
|
|
|
|
+ <el-select v-model="floorId" style="width: 160px;" @change="handFloor">
|
|
|
|
+ <el-option v-for="item in floorList" :key="item.uid" :value="item.uid" :label="item.alias"></el-option>
|
|
|
|
+ </el-select>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="单元">
|
|
|
|
+ <el-select v-model="unitId" style="width: 160px;" @change="handUnit">
|
|
|
|
+ <el-option v-for="item in unitList" :key="item.id" :value="item.id" :label="item.roomName"></el-option>
|
|
|
|
+ </el-select>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ </el-form>
|
|
|
|
+ </div>
|
|
<template v-if="swiperData.length > 0">
|
|
<template v-if="swiperData.length > 0">
|
|
<swiper
|
|
<swiper
|
|
- style="height: 600px; margin-top: auto; margin-bottom: auto;"
|
|
|
|
|
|
+ style="height: 180px; margin-top: auto; margin-bottom: auto;"
|
|
ref="mySwiper"
|
|
ref="mySwiper"
|
|
class="swiper"
|
|
class="swiper"
|
|
:options="swiperOption"
|
|
:options="swiperOption"
|
|
@@ -158,8 +177,9 @@ import SwiperContent from "./leftTop/SwiperContent.vue";
|
|
import ChartBoard from "./charts/ChartBoard.vue";
|
|
import ChartBoard from "./charts/ChartBoard.vue";
|
|
import ChartLine from "./charts/ChartLine.vue";
|
|
import ChartLine from "./charts/ChartLine.vue";
|
|
import ChartLineAnd from "./charts/ChartLineAnd.vue";
|
|
import ChartLineAnd from "./charts/ChartLineAnd.vue";
|
|
-import { getEnv, getByRoom, getListWater, getRoomVideo, getLastVideo } from "@/utils/api";
|
|
|
|
|
|
+import {getEnv, getByRoom, getListWater, getRoomVideo, getLastVideo, getSchool, getByFloor, getUid} from "@/utils/api";
|
|
import { timeDate, Debounce } from "@/utils";
|
|
import { timeDate, Debounce } from "@/utils";
|
|
|
|
+import { Form, FormItem ,Select } from "element-ui";
|
|
|
|
|
|
export default {
|
|
export default {
|
|
name: "Zoology",
|
|
name: "Zoology",
|
|
@@ -172,6 +192,9 @@ export default {
|
|
ChartBoard,
|
|
ChartBoard,
|
|
ChartLine,
|
|
ChartLine,
|
|
ChartLineAnd,
|
|
ChartLineAnd,
|
|
|
|
+ 'el-form': Form,
|
|
|
|
+ 'el-form-item': FormItem,
|
|
|
|
+ 'el-select': Select
|
|
},
|
|
},
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
@@ -232,6 +255,12 @@ export default {
|
|
loading: true,
|
|
loading: true,
|
|
weatherLoading: true,
|
|
weatherLoading: true,
|
|
chartLoading: true,
|
|
chartLoading: true,
|
|
|
|
+ schoolId:'',
|
|
|
|
+ schoolList: [],
|
|
|
|
+ floorList: [],
|
|
|
|
+ floorId: '',
|
|
|
|
+ unitId: '',
|
|
|
|
+ unitList: [],
|
|
};
|
|
};
|
|
},
|
|
},
|
|
computed: {
|
|
computed: {
|
|
@@ -249,6 +278,11 @@ export default {
|
|
this.loading = false;
|
|
this.loading = false;
|
|
}
|
|
}
|
|
});
|
|
});
|
|
|
|
+ getSchool({}).then(res => {
|
|
|
|
+ if(res.code === 10000) {
|
|
|
|
+ this.schoolList = res.data;
|
|
|
|
+ }
|
|
|
|
+ })
|
|
},
|
|
},
|
|
leftTopSelect() {
|
|
leftTopSelect() {
|
|
// 左上角的选择是否显示
|
|
// 左上角的选择是否显示
|
|
@@ -358,6 +392,31 @@ export default {
|
|
onLeave() {
|
|
onLeave() {
|
|
this.swipers.autoplay.start();
|
|
this.swipers.autoplay.start();
|
|
},
|
|
},
|
|
|
|
+ handSchool(val) {
|
|
|
|
+ this.floorList = [];
|
|
|
|
+ this.floorId = '';
|
|
|
|
+ this.unitList= [];
|
|
|
|
+ this.unitId = '';
|
|
|
|
+ let params = {
|
|
|
|
+ floorId: val,
|
|
|
|
+ };
|
|
|
|
+ getByFloor(params).then((res) => {
|
|
|
|
+ this.floorList = res.data;
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ handFloor(val) {
|
|
|
|
+ this.unitList= [];
|
|
|
|
+ this.unitId = '';
|
|
|
|
+ let params = {
|
|
|
|
+ uid: val,
|
|
|
|
+ };
|
|
|
|
+ getUid(params).then((res) => {
|
|
|
|
+ this.unitList = res.data;
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ handUnit(val) {
|
|
|
|
+ this.getRoomId(val);
|
|
|
|
+ }
|
|
},
|
|
},
|
|
mounted() {
|
|
mounted() {
|
|
this.init();
|
|
this.init();
|
|
@@ -367,6 +426,9 @@ export default {
|
|
</script>
|
|
</script>
|
|
|
|
|
|
<style scoped>
|
|
<style scoped>
|
|
|
|
+/deep/.el-form-item__label {
|
|
|
|
+ color: #fff;
|
|
|
|
+}
|
|
.zoology {
|
|
.zoology {
|
|
width: 100%;
|
|
width: 100%;
|
|
height: 100%;
|
|
height: 100%;
|
|
@@ -516,4 +578,8 @@ export default {
|
|
margin-left: 10px;
|
|
margin-left: 10px;
|
|
width: 50%;
|
|
width: 50%;
|
|
}
|
|
}
|
|
|
|
+.zooFlex {
|
|
|
|
+ height: 40px;
|
|
|
|
+ width: 100%;
|
|
|
|
+}
|
|
</style>
|
|
</style>
|