|
@@ -0,0 +1,180 @@
|
|
|
+<template>
|
|
|
+ <div class="eartagdetail">
|
|
|
+ <el-card class="kuang">
|
|
|
+ <div slot="header">
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="16">
|
|
|
+ <span>温度曲线</span>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-date-picker
|
|
|
+ @change="onSelect"
|
|
|
+ size="mini"
|
|
|
+ type="datetimerange"
|
|
|
+ v-model="date"
|
|
|
+ range-separator="至"
|
|
|
+ :clearable="false"
|
|
|
+ start-placeholder="开始日期"
|
|
|
+ end-placeholder="结束日期"
|
|
|
+ value-format="yyyy-MM-dd HH:mm:ss"
|
|
|
+ style="width: 100%;">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ <div class="kuang-body">
|
|
|
+ <template v-if="timeList.length > 0">
|
|
|
+ <chart-temp :env-list="envList" :time-list="timeList" :temp-list="tempList" :averange-list="averangeList"></chart-temp>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <el-empty style="height: 490px" description="暂无数据"></el-empty>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ <br/>
|
|
|
+ <el-card class="kuang">
|
|
|
+ <div slot="header">
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="16">
|
|
|
+ <span>耳标电量</span>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-date-picker
|
|
|
+ @change="onSelect"
|
|
|
+ size="mini"
|
|
|
+ type="datetimerange"
|
|
|
+ v-model="date"
|
|
|
+ range-separator="至"
|
|
|
+ :clearable="false"
|
|
|
+ start-placeholder="开始日期"
|
|
|
+ end-placeholder="结束日期"
|
|
|
+ value-format="yyyy-MM-dd HH:mm:ss"
|
|
|
+ style="width: 100%;">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ <div class="kuang-body">
|
|
|
+ <template v-if="timeList.length > 0">
|
|
|
+ <chart-dls :time-list="timeList" :dl-list="dlList"></chart-dls>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <el-empty style="height: 490px" description="暂无数据"></el-empty>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ <br/>
|
|
|
+ <el-card class="kuang">
|
|
|
+ <div slot="header">
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="16">
|
|
|
+ <span>运动量</span>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-date-picker
|
|
|
+ @change="onSelect"
|
|
|
+ size="mini"
|
|
|
+ type="datetimerange"
|
|
|
+ v-model="date"
|
|
|
+ range-separator="至"
|
|
|
+ :clearable="false"
|
|
|
+ start-placeholder="开始日期"
|
|
|
+ end-placeholder="结束日期"
|
|
|
+ value-format="yyyy-MM-dd HH:mm:ss"
|
|
|
+ style="width: 100%;">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ <div class="kuang-body">
|
|
|
+ <template v-if="timeList.length > 0">
|
|
|
+ <chart-ydl :time-list="timeList" :ydl-list="ydlList"></chart-ydl>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <el-empty style="height: 490px" description="暂无数据"></el-empty>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { getEarTagDetail } from "@/utils/apis/eartag-detail/earTagDetail";
|
|
|
+import ChartTemp from "./chart/ChartTemp";
|
|
|
+import ChartDls from "./chart/ChartDls";
|
|
|
+import ChartYdl from "./chart/ChartYdl";
|
|
|
+export default {
|
|
|
+ name: "EartagDetail",
|
|
|
+ components: {
|
|
|
+ ChartTemp,
|
|
|
+ ChartDls,
|
|
|
+ ChartYdl
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ date: [],
|
|
|
+ tempList: [],
|
|
|
+ timeList: [],
|
|
|
+ envList: [],
|
|
|
+ averangeList: [],
|
|
|
+ dlList: [],
|
|
|
+ ydlList: [],
|
|
|
+ eartagNo: '',
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ init() {
|
|
|
+ let params = {
|
|
|
+ eartagNo: this.eartagNo,
|
|
|
+ }
|
|
|
+ getEarTagDetail(params).then(res => {
|
|
|
+ if(res.code === 0) {
|
|
|
+ this.timeList = res.data.timeList;
|
|
|
+ this.tempList = res.data.earTempList;
|
|
|
+ this.envList = res.data.environmentTempList;
|
|
|
+ this.dlList = res.data.electricList;
|
|
|
+ this.ydlList = res.data.exerciseList;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ onSelect() {
|
|
|
+ let params = {
|
|
|
+ eartagNo: this.eartagNo,
|
|
|
+ startTime: this.date[0],
|
|
|
+ endTime: this.date[1]
|
|
|
+ }
|
|
|
+ getEarTagDetail(params).then(res => {
|
|
|
+ if(res.code === 0) {
|
|
|
+ this.timeList = res.data.timeList;
|
|
|
+ this.tempList = res.data.earTempList;
|
|
|
+ this.envList = res.data.environmentTempList;
|
|
|
+ this.dlList = res.data.electricList;
|
|
|
+ this.ydlList = res.data.exerciseList;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.eartagNo = this.$route.query.id;
|
|
|
+ this.init()
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+ .eartagdetail {
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 20px;
|
|
|
+ }
|
|
|
+ .kuang {
|
|
|
+ width: 100%;
|
|
|
+ height: 600px;
|
|
|
+ background: #fff;
|
|
|
+ border-radius: 2px;
|
|
|
+ }
|
|
|
+ .kuang-body {
|
|
|
+ box-sizing: border-box;
|
|
|
+ width: 100%;
|
|
|
+ height: 490px;
|
|
|
+ }
|
|
|
+</style>
|