|
@@ -1,46 +1,16 @@
|
|
|
<template>
|
|
|
<div class="UnityTrace">
|
|
|
<header class="header">
|
|
|
- <h5>基本信息</h5>
|
|
|
+ <h5>设备信息</h5>
|
|
|
<ul>
|
|
|
<el-row type="flex" class="row">
|
|
|
<el-col :span="8" class="col">
|
|
|
- <span class="title">猪编号:</span>
|
|
|
- <span class="content">1540</span>
|
|
|
+ <span class="title">设备名字:</span>
|
|
|
+ <span class="content">{{ mainInfo.name }}</span>
|
|
|
</el-col>
|
|
|
<el-col class="col">
|
|
|
- <span class="title">出生天数:</span>
|
|
|
- <span class="content">51</span>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- <el-row type="flex" class="row">
|
|
|
- <el-col :span="8" class="col">
|
|
|
- <span class="title">出生日期:</span>
|
|
|
- <span class="content">2020-05-01</span>
|
|
|
- </el-col>
|
|
|
- <el-col class="col">
|
|
|
- <span class="title">耳标号:</span>
|
|
|
- <span class="content">A3525DF3542</span>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- <el-row type="flex" class="row">
|
|
|
- <el-col :span="8" class="col">
|
|
|
- <span class="title">批次:</span>
|
|
|
- <span class="content">13543</span>
|
|
|
- </el-col>
|
|
|
- <el-col class="col">
|
|
|
- <span class="title">当前位置:</span>
|
|
|
- <span class="content">育肥舍四栋</span>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- <el-row type="flex" class="row">
|
|
|
- <el-col :span="8" class="col">
|
|
|
- <span class="title">品种:</span>
|
|
|
- <span class="content">大白</span>
|
|
|
- </el-col>
|
|
|
- <el-col class="col">
|
|
|
- <span class="title">饲养员:</span>
|
|
|
- <span class="content">某某某</span>
|
|
|
+ <span class="title">设备描述:</span>
|
|
|
+ <span class="content">{{ mainInfo.description }}</span>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
</ul>
|
|
@@ -57,13 +27,14 @@
|
|
|
align="right"
|
|
|
class="date-picker"
|
|
|
></el-date-picker>
|
|
|
- <article v-if="dateArr.length > 0">
|
|
|
- <chart-a :dateArr="dateArr" :data="animalTempArr" class="charts"></chart-a>
|
|
|
- <chart-b :dateArr="dateArr" :data="envTempArr" class="charts"></chart-b>
|
|
|
+ <article v-if="temperatureData || humidityData">
|
|
|
+ <chart-a v-if="temperatureData" :data="temperatureData" :time="temperatureTime" class="charts"></chart-a>
|
|
|
+ <p v-else class="hint">当前时间段无温度数据...</p>
|
|
|
+ <chart-b v-if="humidityData" :data="humidityData" :time="humidityTime" class="charts"></chart-b>
|
|
|
+ <p v-else class="hint">当前时间段无温度数据...</p>
|
|
|
</article>
|
|
|
- <p v-else class="hint"> 当前时间段无数据... </p>
|
|
|
+
|
|
|
</section>
|
|
|
-
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
@@ -94,7 +65,7 @@ const pickerOptions = {
|
|
|
picker.$emit("pick", [start, end]);
|
|
|
}
|
|
|
},
|
|
|
- {
|
|
|
+ {
|
|
|
text: "最近一天",
|
|
|
onClick(picker) {
|
|
|
const end = new Date();
|
|
@@ -133,46 +104,60 @@ export default {
|
|
|
data() {
|
|
|
return {
|
|
|
mainInfo: {},
|
|
|
- dateArr: [],
|
|
|
- animalTempArr: [],
|
|
|
- envTempArr: [],
|
|
|
- batteryArr: [],
|
|
|
+ temperatureData: [],
|
|
|
+ temperatureTime: [],
|
|
|
+ humidityData: [],
|
|
|
+ humidityTime: [],
|
|
|
+
|
|
|
pickerOptions,
|
|
|
value2: null,
|
|
|
- SData: Math.floor(( new Date().getTime() - 3600 * 1000 * 6 ) / 1000), // 默认最近六小时
|
|
|
+ SData: Math.floor((new Date().getTime() - 3600 * 1000 * 6) / 1000), // 默认最近六小时
|
|
|
EData: Math.ceil(new Date().getTime() / 1000)
|
|
|
};
|
|
|
},
|
|
|
created() {
|
|
|
- console.log(this.$route.query)
|
|
|
- this.mainInfo = this.$route.query
|
|
|
+ this.mainInfo = this.$route.query;
|
|
|
// 一分钟更新一次 后端10分钟更新一次数据
|
|
|
- this.getHumitureList(1)
|
|
|
- this.getHumitureList(2)
|
|
|
-
|
|
|
+ this.getHumitureList(1);
|
|
|
+ this.getHumitureList(2);
|
|
|
},
|
|
|
mounted() {},
|
|
|
-
|
|
|
+
|
|
|
methods: {
|
|
|
...mapActions(["fetch"]),
|
|
|
// 事件选择器值改变
|
|
|
pickerChange(value) {
|
|
|
- console.log(value)
|
|
|
- this.SData = Math.floor(new Date(value[0]).getTime() / 1000)
|
|
|
- this.EData = Math.ceil(new Date(value[1]).getTime() / 1000)
|
|
|
- console.log(this.SData, this.EData)
|
|
|
- this.getHumitureList(1)
|
|
|
- this.getHumitureList(2)
|
|
|
+ console.log(value);
|
|
|
+ this.SData = Math.floor(new Date(value[0]).getTime() / 1000);
|
|
|
+ this.EData = Math.ceil(new Date(value[1]).getTime() / 1000);
|
|
|
+ console.log(this.SData, this.EData);
|
|
|
+ this.getHumitureList(1);
|
|
|
+ this.getHumitureList(2);
|
|
|
},
|
|
|
// 请求温湿度
|
|
|
getHumitureList(type) {
|
|
|
// type:1-温度 2-湿度
|
|
|
this.fetch({
|
|
|
- api: "/hm/device/history/by-device-id",
|
|
|
+ api: "/analyse/hm/device/history/by-device-id",
|
|
|
method: "GET",
|
|
|
- data: { deviceId: this.mainInfo.id, type}, //目前只有一个组织,其他参数调整钟
|
|
|
+ data: { deviceId: this.mainInfo.id, type, date: "2020-07-20" },
|
|
|
+ // data: { deviceId: 666, type },
|
|
|
success: res => {
|
|
|
- console.log(res)
|
|
|
+ console.log(res);
|
|
|
+ console.log(type);
|
|
|
+ if (type == 1) {
|
|
|
+ res.forEach(item => {
|
|
|
+ this.temperatureData.push(item.value);
|
|
|
+ this.temperatureTime.push(item.created);
|
|
|
+ });
|
|
|
+ console.log(this.temperature);
|
|
|
+ } else if (type == 2) {
|
|
|
+ res.forEach(item => {
|
|
|
+ this.humidityData.push(item.value);
|
|
|
+ this.humidityTime.push(item.created);
|
|
|
+ });
|
|
|
+ console.log(this.temperature);
|
|
|
+ }
|
|
|
},
|
|
|
fail: err => {
|
|
|
console.log(err);
|
|
@@ -184,7 +169,7 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
- },
|
|
|
+ }
|
|
|
}
|
|
|
};
|
|
|
</script>
|
|
@@ -218,7 +203,7 @@ export default {
|
|
|
margin-top: 30px;
|
|
|
margin-bottom: 20px;
|
|
|
}
|
|
|
- .charts{
|
|
|
+ .charts {
|
|
|
border-top: 1px solid #ccc;
|
|
|
padding-top: 25px;
|
|
|
}
|