主页

src/utils/index.js

@@ -0,0 +1,23 @@
+function timeDate(timestamp) {
+  var date = new Date(timestamp);
+  var Y = date.getFullYear() + '-';
+  var M = (date.getMonth() + 1) < 10 ? '0'+ (date.getMonth()+1) + '-' : (date.getMonth()+1) + '-';
+  var D = date.getDate() < 10 ? '0' +  date.getDate() + ' ' :  date.getDate() + ' ';
+  var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours() )+ ':';
+  var mm = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
+  var s = (date.getSeconds() + 1) < 10 ? '0'+ (date.getSeconds()+1) : (date.getSeconds()+1);
+  return Y + M + D + h + mm + s
+}
+
+function timestamp(timestamp) {
+  var date = new Date(timestamp);
+  var Y = date.getFullYear() + '-';
+  var M = (date.getMonth() + 1) < 10 ? '0'+ (date.getMonth()+1) + '-' : (date.getMonth()+1) + '-';
+  var D = date.getDate() < 10 ? '0' +  date.getDate() : date.getDate();
+  return Y + M + D;
+}
+
+export default{
+  timeDate,
+  timestamp
+}

src/views/pastureData/chart/chartDl.vue

@@ -0,0 +1,152 @@
+<template>
+  <div id="chart-dl" style="width: 100%; height: 450px"></div>
+</template>
+
+<script>
+export default {
+  name: "chartDl",
+  data() {
+    return {
+      myCharts: null
+    }
+  },
+  props: {
+    dlList: {
+      type: Array
+    }
+  },
+  watch: {
+    dlList: {
+      handler(newVal) {
+        if(newVal) {
+          this.myCharts.clear();
+          this.init();
+        }
+      },
+      deep: true,
+    }
+  },
+  methods: {
+    init() {
+      let options;
+      let that = this;
+      if(this.dlList[0].length > 0) {
+        options = {
+          legend: {
+            data: ['电量'],
+            x: 'center',
+            y: '5%',
+          },
+          tooltip: {
+            trigger: 'axis',
+            // formatter: '{b} <br/>{a0}: {c0}℃',
+            // position(pt) {
+            //   return [pt[0], '10%'];
+            // },
+          },
+          dataZoom: [{
+            type: 'inside',
+            start: 90,
+            end: 100,
+          }, {
+            start: 0,
+            end: 10,
+            handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
+            handleSize: '80%',
+            handleStyle: {
+              color: '#fff',
+              shadowBlur: 3,
+              shadowColor: 'rgba(0, 0, 0, 0.6)',
+              shadowOffsetX: 2,
+              shadowOffsetY: 2,
+            },
+          }],
+          grid: {
+            left: '2%',
+            right: '4%',
+            bottom: '12%',
+            containLabel: true,
+          },
+          xAxis: {
+            type: 'category',
+            boundaryGap: false,
+            data: that.dlList[0],
+          },
+          yAxis: {
+            type: 'value',
+            name: '单位:%',
+            boundaryGap: [0, '100%'],
+            max: 100,
+          },
+          series: [
+            {
+              name: '电量',
+              type: 'line',
+              smooth: true,
+              // symbol: 'none',
+              sampling: 'average',
+              itemStyle: {
+                normal: {
+                  color: '#7ED3F4', // 改变折线点的颜色
+                },
+              },
+              data: that.dlList[1],
+            },
+          ],
+        }
+      } else {
+        options = {
+          title: {
+            text: '暂无数据',
+            x: 'center',
+            y: 'center',
+            textStyle: {
+              color: '#000000',
+              fontWeight: 'normal',
+              fontSize: 12,
+            },
+          },
+          grid: {
+            left: '3%',
+            right: '4%',
+            bottom: '3%',
+            containLabel: true,
+          },
+          xAxis: {
+            type: 'category',
+            boundaryGap: false,
+            data: [],
+            axisLabel: {
+              show: true,
+              textStyle: {
+                color: '#000000', // 更改坐标轴文字颜色
+              },
+            },
+          },
+          yAxis: {
+            type: 'value',
+            axisLabel: {
+              show: true,
+              textStyle: {
+                color: '#000000', // 更改坐标轴文字颜色
+              },
+            },
+          },
+        }
+      }
+      this.myCharts.setOption(options);
+    }
+  },
+  mounted() {
+    this.myCharts = this.$echarts.init(document.getElementById('chart-dl'));
+    this.init();
+    window.onresize = () => {
+      this.myCharts.resize();
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/pastureData/chart/chartMzcl.vue

@@ -10,6 +10,22 @@ export default {
       myCharts: null
     }
   },
+  props: {
+    mzclList: {
+      type: Array
+    }
+  },
+  watch: {
+    mzclList: {
+      handler(newVal) {
+        if(newVal) {
+          this.myCharts.clear();
+          this.init();
+        }
+      }
+    },
+    deep: true
+  },
   methods: {
     init() {
       let options = {
@@ -80,6 +96,10 @@ export default {
           },
         ]
       }
+      options.yAxis.data = this.mzclList[0];
+      options.series[0].data = this.mzclList[1];
+      options.series[1].data = this.mzclList[2];
+      options.series[2].data = this.mzclList[3];
       this.myCharts.setOption(options);
     }
   },

src/views/pastureData/chart/chartMzxz.vue

@@ -10,6 +10,22 @@ export default {
       myCharts: null
     }
   },
+  props: {
+    mzxzList: {
+      type: Array
+    }
+  },
+  watch: {
+    mzxzList: {
+      handler(newVal) {
+        if(newVal) {
+          this.myCharts.clear();
+          this.init();
+        }
+      },
+      deep: true
+    }
+  },
   methods: {
     init() {
       let options = {
@@ -48,6 +64,9 @@ export default {
           },
         ]
       }
+      options.xAxis.data = this.mzxzList[0];
+      options.series[0].data = this.mzxzList[1];
+      options.series[1].data = this.mzxzList[2];
       this.myCharts.setOption(options);
     }
   },

src/views/pastureData/chart/chartPjwd.vue

@@ -0,0 +1,172 @@
+<template>
+  <div id="chart-pjwd" style="width: 100%; height: 450px"></div>
+</template>
+
+<script>
+export default {
+  name: "chartPjwd",
+  data() {
+    return {
+      myCharts: null
+    }
+  },
+  props: {
+    pjwdList: {
+      type: Object
+    }
+  },
+  watch: {
+    pjwdList: {
+      handler(newVal) {
+        if(newVal) {
+          this.myCharts.clear();
+          this.init();
+        }
+      },
+      deep: true,
+    }
+  },
+  methods: {
+    // 对象排序
+    objectOrder(obj) {
+      var newKey = Object.keys(obj).sort();
+      var newObj = {};
+      for(var i = 0; i < newKey.length; i++) {
+        newObj[newKey[i]] = obj[newKey[i]];
+      }
+      return newObj
+    },
+    init() {
+      let options;
+      let time = [];
+      let data = [];
+      // this.pjwdList
+      for(var k  in this.objectOrder(this.pjwdList)) {
+        time.push(k);
+        data.push(this.pjwdList[k]);
+      }
+      if(time.length > 0) {
+        options = {
+          legend: {
+            data: ['群体平均温度'],
+            x: 'center',
+            y: '5%',
+          },
+          tooltip: {
+            trigger: 'axis',
+            // formatter: '{b} <br/>{a0}: {c0}℃',
+            // position(pt) {
+            //   return [pt[0], '10%'];
+            // },
+          },
+          dataZoom: [{
+            type: 'inside',
+            start: 90,
+            end: 100,
+          }, {
+            start: 0,
+            end: 10,
+            handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
+            handleSize: '80%',
+            handleStyle: {
+              color: '#fff',
+              shadowBlur: 3,
+              shadowColor: 'rgba(0, 0, 0, 0.6)',
+              shadowOffsetX: 2,
+              shadowOffsetY: 2,
+            },
+          }],
+          grid: {
+            left: '2%',
+            right: '4%',
+            bottom: '12%',
+            containLabel: true,
+          },
+          xAxis: {
+            type: 'category',
+            boundaryGap: false,
+            data: time,
+          },
+          yAxis: {
+            type: 'value',
+            name: '单位:℃',
+            boundaryGap: [0, '100%'],
+          },
+          series: [
+            {
+              name: '群体平均温度',
+              type: 'line',
+              smooth: true,
+              // symbol: 'none',
+              sampling: 'average',
+              itemStyle: {
+                normal: {
+                  color: '#5599f0', // 折线点颜色
+                  lineStyle: { // 折线颜色
+                    color: '#5599fe'
+                  },
+                  label: { // 显示数值
+                    show: true
+                  }
+                }
+              },
+              data: data,
+            },
+          ],
+        }
+      } else {
+        options = {
+          title: {
+            text: '暂无数据',
+            x: 'center',
+            y: 'center',
+            textStyle: {
+              color: '#000000',
+              fontWeight: 'normal',
+              fontSize: 12,
+            },
+          },
+          grid: {
+            left: '3%',
+            right: '4%',
+            bottom: '3%',
+            containLabel: true,
+          },
+          xAxis: {
+            type: 'category',
+            boundaryGap: false,
+            data: [],
+            axisLabel: {
+              show: true,
+              textStyle: {
+                color: '#000000', // 更改坐标轴文字颜色
+              },
+            },
+          },
+          yAxis: {
+            type: 'value',
+            axisLabel: {
+              show: true,
+              textStyle: {
+                color: '#000000', // 更改坐标轴文字颜色
+              },
+            },
+          },
+        }
+      }
+      this.myCharts.setOption(options);
+    }
+  },
+  mounted() {
+    this.myCharts = this.$echarts.init(document.getElementById('chart-pjwd'));
+    this.init();
+    window.onresize = () => {
+      this.myCharts.resize();
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/pastureData/chart/chartTemp.vue

@@ -0,0 +1,177 @@
+<template>
+  <div id="chart-temp" style="width: 100%; height: 450px"></div>
+</template>
+
+<script>
+export default {
+  name: "chartTemp",
+  data() {
+    return {
+      myCharts: null
+    }
+  },
+  props: {
+    tempList: {
+      type: Array
+    }
+  },
+  watch: {
+    tempList: {
+      handler(newVal) {
+        if(newVal) {
+          this.myCharts.clear();
+          this.init();
+        }
+      },
+      deep: true,
+    }
+  },
+  methods: {
+    init() {
+      let options;
+      let that = this;
+      if(this.tempList[0].length > 0) {
+        options = {
+          legend: {
+            data: ['耳根温度', '环境温度'],
+            x: 'center',
+            y: '5%',
+          },
+          tooltip: {
+            trigger: 'axis',
+            // formatter: '{b} <br/>{a0}: {c0}℃',
+            // position(pt) {
+            //   return [pt[0], '10%'];
+            // },
+          },
+          dataZoom: [{
+            type: 'inside',
+            start: 90,
+            end: 100,
+          }, {
+            start: 0,
+            end: 10,
+            handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
+            handleSize: '80%',
+            handleStyle: {
+              color: '#fff',
+              shadowBlur: 3,
+              shadowColor: 'rgba(0, 0, 0, 0.6)',
+              shadowOffsetX: 2,
+              shadowOffsetY: 2,
+            },
+          }],
+          grid: {
+            left: '2%',
+            right: '4%',
+            bottom: '12%',
+            containLabel: true,
+          },
+          xAxis: {
+            type: 'category',
+            boundaryGap: false,
+            data: that.tempList[0],
+          },
+          yAxis: {
+            type: 'value',
+            name: '单位:℃',
+            boundaryGap: [0, '100%'],
+            min(value) {
+              return value.min - 1;
+            },
+            axisLabel: {
+              formatter(value) {
+                return value.toFixed(2);
+              },
+            },
+          },
+          series: [
+            {
+              name: '耳根温度',
+              type: 'line',
+              smooth: true,
+              // symbol: 'none',
+              sampling: 'average',
+              itemStyle: {
+                normal: {
+                  color: '#7ED3F4', // 改变折线点的颜色
+                  label: { // 显示数值
+                    show: true
+                  }
+                },
+              },
+              data: that.tempList[1],
+            },
+            {
+              name: '环境温度',
+              type: 'line',
+              smooth: true,
+              sampling: 'average',
+              itemStyle: {
+                normal: {
+                  color: '#6EE9CF', // 改变折线点的颜色
+                  label: { // 显示数值
+                    show: true
+                  }
+                },
+              },
+              data: that.tempList[2],
+            },
+          ],
+        }
+      } else {
+        options = {
+          title: {
+            text: '暂无数据',
+            x: 'center',
+            y: 'center',
+            textStyle: {
+              color: '#000000',
+              fontWeight: 'normal',
+              fontSize: 12,
+            },
+          },
+          grid: {
+            left: '3%',
+            right: '4%',
+            bottom: '3%',
+            containLabel: true,
+          },
+          xAxis: {
+            type: 'category',
+            boundaryGap: false,
+            data: [],
+            axisLabel: {
+              show: true,
+              textStyle: {
+                color: '#000000', // 更改坐标轴文字颜色
+              },
+            },
+          },
+          yAxis: {
+            type: 'value',
+            axisLabel: {
+              show: true,
+              textStyle: {
+                color: '#000000', // 更改坐标轴文字颜色
+              },
+            },
+          },
+        }
+      }
+      this.myCharts.setOption(options);
+    }
+  },
+  mounted() {
+    this.myCharts = this.$echarts.init(document.getElementById('chart-temp'));
+    this.init();
+    window.onresize = () => {
+      this.myCharts.resize();
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/pastureData/chart/chartYdl.vue

@@ -0,0 +1,143 @@
+<template>
+  <div id="chart-ydl" style="width: 100%; height: 450px"></div>
+</template>
+
+<script>
+export default {
+  name: "chartYdl",
+  data() {
+    return {
+      myCharts: null
+    }
+  },
+  props: {
+    ydlList: {
+      type: Array
+    }
+  },
+  watch: {
+    ydlList: {
+      handler(newVal) {
+        if(newVal) {
+          this.myCharts.clear();
+          this.init();
+        }
+      },
+      deep: true,
+    }
+  },
+  methods: {
+    init() {
+      let options;
+      let that = this;
+      if(this.ydlList[0].length > 0) {
+        options = {
+          legend: {
+            data: ['运动量'],
+            x: 'center',
+            y: '5%',
+          },
+          tooltip: {
+            trigger: 'axis',
+            // formatter: '{b} <br/>{a0}: {c0}℃',
+            // position(pt) {
+            //   return [pt[0], '10%'];
+            // },
+          },
+          dataZoom: [{
+            type: 'inside',
+            start: 90,
+            end: 100,
+          }, {
+            start: 0,
+            end: 10,
+            handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
+            handleSize: '80%',
+            handleStyle: {
+              color: '#fff',
+              shadowBlur: 3,
+              shadowColor: 'rgba(0, 0, 0, 0.6)',
+              shadowOffsetX: 2,
+              shadowOffsetY: 2,
+            },
+          }],
+          grid: {
+            left: '2%',
+            right: '4%',
+            bottom: '12%',
+            containLabel: true,
+          },
+          xAxis: {
+            type: 'category',
+            boundaryGap: false,
+            data: that.ydlList[0],
+          },
+          yAxis: {
+            type: 'value',
+            boundaryGap: [0, '100%'],
+          },
+          series: [
+            {
+              name: '运动量',
+              type: 'bar',
+              // symbol: 'none',
+              data: that.ydlList[1],
+            },
+          ],
+        }
+      } else {
+        options = {
+          title: {
+            text: '暂无数据',
+            x: 'center',
+            y: 'center',
+            textStyle: {
+              color: '#000000',
+              fontWeight: 'normal',
+              fontSize: 12,
+            },
+          },
+          grid: {
+            left: '3%',
+            right: '4%',
+            bottom: '3%',
+            containLabel: true,
+          },
+          xAxis: {
+            type: 'category',
+            boundaryGap: false,
+            data: [],
+            axisLabel: {
+              show: true,
+              textStyle: {
+                color: '#000000', // 更改坐标轴文字颜色
+              },
+            },
+          },
+          yAxis: {
+            type: 'value',
+            axisLabel: {
+              show: true,
+              textStyle: {
+                color: '#000000', // 更改坐标轴文字颜色
+              },
+            },
+          },
+        }
+      }
+      this.myCharts.setOption(options);
+    }
+  },
+  mounted() {
+    this.myCharts = this.$echarts.init(document.getElementById('chart-ydl'));
+    this.init();
+    window.onresize = () => {
+      this.myCharts.resize();
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/pastureData/dataDetail.vue

@@ -1,29 +1,342 @@
 <template>
-  <div class="dataDetail">
-    <div class="header">
-      <span>耳标133100017283716详情</span>
+  <div class="about" v-if="isShow">
+    <div>
+      <div class="header_title">
+        <span>耳标 <strong style="color: mediumturquoise;"> {{earTag}}</strong> 详情</span>
+        <div class="back" @click="jump">回到上一页</div>
+      </div>
+      <div class="box">
+        <div>耳标</div>
+        <div>{{earTag}}</div>
+        <div></div>
+        <div></div>
+        <div>首次上传时间（配标时间）</div>
+        <div>{{tableData.movePigPenData[2].moveDate}}</div>
+        <div>本次采集时间</div>
+        <div>{{tableData.eartagdeta.time}}</div>
+        <div>配标日龄</div>
+        <div>{{tableData.eartagdeta.dayAge}}</div>
+        <div>日龄</div>
+        <div>{{tableData.eartagdeta.dayAge2}}</div>
+        <div>耳根温度</div>
+        <div>{{tableData.eartagdeta.earTemp}}℃</div>
+        <div>环境温度</div>
+        <div>{{tableData.eartagdeta.envTemp}}℃</div>
+        <div>运动量</div>
+        <div>{{tableData.eartagdeta.sportGap}}</div>
+        <div>耳标电量</div>
+        <div>{{tableData.eartagdeta.bat}}%</div>
+        <div>首次位置记录</div>
+        <div>
+          <div style="line-height: 14px; font-size: 14px;">时间: {{tableData.movePigPenData[2].moveDate}}</div>
+          <div style="line-height: 14px; font-size: 14px;">阶段：{{getStage(tableData.movePigPenData[2].stage)}}</div>
+          <div style="line-height: 14px; font-size: 14px;">{{tableData.movePigPenData[2].penName}}{{tableData.movePigPenData[2].unitname}}</div>
+        </div>
+        <div>上一次位置记录</div>
+        <div>
+          <div style="line-height: 14px; font-size: 14px;">时间: {{tableData.movePigPenData[1].moveDate}}</div>
+          <div style="line-height: 14px; font-size: 14px;">阶段：{{getStage(tableData.movePigPenData[1].stage)}}</div>
+          <div style="line-height: 14px; font-size: 14px;">{{tableData.movePigPenData[1].penName}}{{tableData.movePigPenData[1].unitname}}</div>
+        </div>
+        <div>当前位置位置</div>
+        <div>
+          <div style="line-height: 14px; font-size: 14px;">时间: {{tableData.movePigPenData[0].moveDate}}</div>
+          <div style="line-height: 14px; font-size: 14px;">阶段：{{getStage(tableData.movePigPenData[0].stage)}}</div>
+          <div style="line-height: 14px; font-size: 14px;">位置：{{tableData.movePigPenData[0].penName}}{{tableData.movePigPenData[0].unitname}}</div>
+        </div>
+        <div>信号强度</div>
+        <div>-{{tableData.eartagdeta.rssi}}db(最后一次上传)</div>
+      </div>
+
+      <!--  echarts   -->
+      <div class="echarts">
+        <div class="echarts_header">
+          <span>温度走势图</span>
+          <el-date-picker
+              style="float: right; margin: 12px 10px 0 0;"
+              size="mini"
+              v-model="value2"
+              type="datetimerange"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              @change="onSelect"
+              value-format="yyyy-MM-dd HH:mm:ss"
+              align="right">
+          </el-date-picker>
+        </div>
+        <div class="echart_init">
+          <chart-temp :tempList="tempList"></chart-temp>
+        </div>
+      </div>
+      <div class="echarts">
+        <div class="echarts_header">
+          <span>电量走势图</span>
+          <el-date-picker
+              style="float: right; margin: 12px 10px 0 0;"
+              size="mini"
+              v-model="value2"
+              type="datetimerange"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              @change="onSelect"
+              value-format="yyyy-MM-dd HH:mm:ss"
+              align="right">
+          </el-date-picker>
+        </div>
+        <div class="echart_init">
+          <chartDl :dlList="dlList"></chartDl>
+        </div>
+      </div>
+      <div class="echarts">
+        <div class="echarts_header">
+          <span>运动量走势图</span>
+          <el-date-picker
+              style="float: right; margin: 12px 10px 0 0;"
+              size="mini"
+              v-model="value2"
+              type="datetimerange"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              @change="onSelect"
+              value-format="yyyy-MM-dd HH:mm:ss"
+              align="right">
+          </el-date-picker>
+        </div>
+        <div class="echart_init">
+          <chartYdl :ydlList="ydlList"></chartYdl>
+        </div>
+      </div>
+      <div class="echarts">
+        <div class="echarts_header">
+          <span>群体平均温度走势图</span>
+          <el-date-picker
+              style="float: right; margin: 12px 10px 0 0;"
+              size="mini"
+              v-model="value2"
+              type="datetimerange"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              value-format="yyyy-MM-dd HH:mm:ss"
+              align="right">
+          </el-date-picker>
+        </div>
+        <div class="echart_init">
+          <chartPjwd :pjwdList="pjwdList"></chartPjwd>
+        </div>
+      </div>
     </div>
   </div>
+  <div class="flex" v-else>
+    <div style="width: 100%; height: 100%"  v-loading="loading"
+         element-loading-text="拼命加载中"
+         element-loading-spinner="el-icon-loading"
+         element-loading-background="rgba(0, 0, 0, 0.8)"></div>
+  </div>
 </template>
 
 <script>
+import chartTemp from "./chart/chartTemp";
+import chartDl from "./chart/chartDl";
+import chartYdl from "./chart/chartYdl";
+import chartPjwd from "./chart/chartPjwd";
 export default {
-  name: "dataDetail"
+  name: "dataDetail",
+  components: {
+    chartTemp,
+    chartDl,
+    chartYdl,
+    chartPjwd
+  },
+  data() {
+    return {
+      id: '',
+      earTag: '',
+      value2: [],
+      tableData: {},
+      // 温度曲线数据
+      tempList: [],
+      // 电量曲线数据
+      dlList: [],
+      // 运动量曲线
+      ydlList: [],
+      // 平均温度曲线
+      pjwdList: {},
+      loading: true,
+      isShow: false,
+      options: [
+        {
+          id: 1,
+          name: '配种'
+        },
+        {
+          id: 2,
+          name: '分娩'
+        },
+        {
+          id: 3,
+          name: '保育'
+        },
+        {
+          id: 4,
+          name: '育成育肥'
+        },
+        {
+          id: 5,
+          name: '空怀'
+        },
+        {
+          id: 6,
+          name: '后备母猪'
+        },
+        {
+          id: 7,
+          name: '公猪'
+        },
+        {
+          id: 8,
+          name: '病死猪场内收集'
+        },
+        {
+          id: 9,
+          name: '病死猪无害化'
+        },
+      ]
+    }
+  },
+  methods: {
+    // 过滤
+    getStage(id) {
+      let str = '';
+      this.options.forEach(item => {
+        if(item.id === id) {
+          str = item.name;
+        }
+      })
+      return str;
+    },
+    init() {
+      let params = {
+        id: this.id,
+        startTime: this.value2[0],
+        endTime: this.value2[1]
+      }
+      this.$http({
+        url: this.$http.adornUrl('/manager/eartagdata/list_deatils'),
+        method: 'post',
+        data: this.$http.adornData(params)
+      })
+          .then(res => {
+            this.loading = false;
+            if(res.data.code === 0) {
+              this.isShow = true;
+              this.tableData = res.data.page;
+              this.earTag = this.tableData.eartagdeta.eartagNo;
+              // 温度曲线
+              this.tempList = [this.tableData.time, this.tableData.temp, this.tableData.environmenttemp];
+              // 电量曲线
+              this.dlList = [this.tableData.time, this.tableData.electric];
+              // 运动量曲线
+              this.ydlList = [this.tableData.time, this.tableData.sports];
+              // 平均温度曲线
+              this.pjwdList = this.tableData.averangeTemp;
+            } else {
+              this.$message.error(res.data.msg);
+            }
+          })
+          .catch(() => {
+            this.loading = false;
+            this.isShow = true;
+          })
+    },
+    jump() {
+      this.$router.replace('/');
+    },
+    onSelect() {
+      // console.log(this.value2)
+      this.isShow = false;
+      this.init();
+    }
+  },
+  created() {
+    this.id = this.$route.query.id;
+    this.value2 = [this.$route.query.startTime, this.$route.query.endTime]
+    this.init();
+  },
+  mounted() {
+  }
 }
 </script>
 
 <style scoped>
-  .dataDetail {
-    width: 100%;
-    box-sizing: border-box;
-    padding: 20px;
-  }
-  .header {
-    width: 100%;
-    height: 50px;
-    border: 1px solid #Ddd;
-    background-color: #F3F3F3;
-    box-sizing: border-box;
-    padding: 10px 20px;
-  }
+.about {
+  width: 100%;
+  box-sizing: border-box;
+  padding: 20px;
+}
+.back {
+  width: 90px;
+  height: 30px;
+  line-height: 30px;
+  font-size: 14px;
+  border: 1px solid #ddd;
+  text-align: center;
+  border-radius: 10px;
+  margin-top: 4px;
+  margin-right: 10px;
+  float: right;
+  cursor: pointer;
+}
+.box {
+  width: calc(100% - 2px);
+  height: 300px;
+  border-top: 1px solid #ddd;
+  border-left: 1px solid #ddd;
+  border-right: 1px solid #ddd;
+  display: grid;
+  grid-template-columns: 1fr 2fr 1fr 2fr;
+  grid-template-rows: repeat(7, 1fr);
+  grid-column-gap: 0;
+  grid-row-gap: 0;
+  margin-bottom: 20px;
+}
+.box>div:nth-child(2n+1) {
+  background-color: #F9FAFC;
+  font-size: 14px;
+}
+.box>div:nth-child(4n-3),  .box>div:nth-child(4n-2), .box>div:nth-child(4n-1){
+  border-right: 1px solid #ddd;
+}
+.box>div{
+  border-bottom: 1px solid #ddd;
+  text-align: center;
+  line-height: 42px;
+}
+.echarts {
+  width: 100%;
+  height: 500px;
+  margin-bottom: 20px;
+  border: 1px solid #ddd;
+}
+.echarts_header {
+  height: 50px;
+  font-size: 14px;
+  background-color: #F3F3F3;
+  padding-left: 20px;
+  font-weight: 600;
+  line-height: 50px;
+  border-bottom: 1px solid #ddd;
+  color: #667E9C;
+}
+.echart_init {
+  width: 100%;
+  height: 450px;
+}
+.flex {
+  width: 100%;
+  height: 1000px;
+}
 </style>

src/views/pastureData/dayData.vue

@@ -1,58 +1,79 @@
 <template>
-  <div>
-    <div class="box">
-      <div class="box_item" v-for="item in boxList" :key="item.id">
-        <p>{{item.name}}</p>
-        <p>{{item.value}}</p>
+  <div class="home">
+    <div class="box" v-if="show">
+      <div class="box_item">
+        <p>母猪存栏</p>
+        <p>{{pigData.stockTotal}}</p>
+      </div>
+      <div class="box_item">
+        <p>能繁母猪存栏</p>
+        <p>{{pigData.sowStock}}</p>
+      </div>
+      <div class="box_item">
+        <p>配怀存栏</p>
+        <p>{{pigData.stock1}}</p>
+      </div>
+      <div class="box_item">
+        <p>分娩存栏</p>
+        <p>{{pigData.stock2}}</p>
+      </div>
+      <div class="box_item">
+        <p>母猪新增</p>
+        <p>{{pigData.stockNew}}</p>
+      </div>
+      <div class="box_item">
+        <p>耳标离线</p>
+        <p>{{pigData.offlineNo}}</p>
       </div>
     </div>
     <div class="form_item">
-      <el-form :inline="true">
+      <el-form :inline="true" size="mini">
         <el-form-item label="时间:">
           <el-date-picker
               v-model="value1"
               type="date"
+              value-format="yyyy-MM-dd"
               placeholder="选择日期">
           </el-date-picker>
         </el-form-item>
-        <el-form-item label="牧场:">
-          <el-select filterable style="width: 120px;"></el-select>
-        </el-form-item>
-        <el-form-item label="栋舍:">
-          <el-select filterable style="width: 120px;"></el-select>
-        </el-form-item>
+        <!--        <el-form-item label="牧场:">-->
+        <!--          <el-select filterable style="width: 120px;"></el-select>-->
+        <!--        </el-form-item>-->
+        <!--        <el-form-item label="栋舍:">-->
+        <!--          <el-select filterable style="width: 120px;"></el-select>-->
+        <!--        </el-form-item>-->
         <el-form-item label="采集器编码:">
-          <el-input style="width: 120px;"></el-input>
+          <el-input v-model="deviceCode" ></el-input>
         </el-form-item>
         <el-form-item label="耳标号:">
-          <el-input style="width: 120px;"></el-input>
-        </el-form-item>
-        <el-form-item label="配标日龄:">
-          <el-select filterable style="width: 120px;"></el-select>
-        </el-form-item>
-        <el-form-item label="日龄:">
-          <el-select filterable style="width: 120px;"></el-select>
-        </el-form-item>
-        <el-form-item label="耳根温度:">
-          <el-select filterable style="width: 120px;"></el-select>
-        </el-form-item>
-        <el-form-item label="环境温度:">
-          <el-select filterable style="width: 120px;"></el-select>
-        </el-form-item>
-        <el-form-item label="耳标电量:">
-          <el-select filterable style="width: 120px;"></el-select>
-        </el-form-item>
-        <el-form-item label="信号强度:">
-          <el-select filterable style="width: 120px;"></el-select>
+          <el-input v-model="eartagNo"></el-input>
         </el-form-item>
+        <!--        <el-form-item label="配标日龄:">-->
+        <!--          <el-select filterable style="width: 120px;"></el-select>-->
+        <!--        </el-form-item>-->
+        <!--        <el-form-item label="日龄:">-->
+        <!--          <el-select filterable style="width: 120px;"></el-select>-->
+        <!--        </el-form-item>-->
+        <!--        <el-form-item label="耳根温度:">-->
+        <!--          <el-select filterable style="width: 120px;"></el-select>-->
+        <!--        </el-form-item>-->
+        <!--        <el-form-item label="环境温度:">-->
+        <!--          <el-select filterable style="width: 120px;"></el-select>-->
+        <!--        </el-form-item>-->
+        <!--        <el-form-item label="耳标电量:">-->
+        <!--          <el-select filterable style="width: 120px;"></el-select>-->
+        <!--        </el-form-item>-->
+        <!--        <el-form-item label="信号强度:">-->
+        <!--          <el-select filterable style="width: 120px;"></el-select>-->
+        <!--        </el-form-item>-->
         <el-form-item>
-          <el-button>查询</el-button>
-          <el-button @click="jump">测试接口去数据详情</el-button>
+          <el-button type="primary" @click="search">查询</el-button>
         </el-form-item>
       </el-form>
     </div>
     <div class="box_table">
       <el-table
+          v-loading="loading"
           :data="tableData"
           border
           stripe
@@ -71,7 +92,7 @@
             width="150">
         </el-table-column>
         <el-table-column
-            prop="eartagNo"
+            prop="tail"
             label="配标时间"
             width="160">
         </el-table-column>
@@ -113,12 +134,16 @@
           </template>
         </el-table-column>
         <el-table-column
-            prop="date"
             label="阶段">
+          <template slot-scope="scope">
+            <span>{{getStage(scope.row.stage)}}</span>
+          </template>
         </el-table-column>
         <el-table-column
-            prop="date"
             label="栋舍">
+          <template slot-scope="scope">
+            <span>{{scope.row.version}}{{scope.row.command}}</span>
+          </template>
         </el-table-column>
         <el-table-column
             prop="deviceCode"
@@ -142,6 +167,7 @@
 
 <script>
 import TableFooter from "../../components/TableFooter";
+import utils from '../../utils/index';
 export default {
   name: "dayData",
   components: {
@@ -149,53 +175,79 @@ export default {
   },
   data() {
     return {
-      boxList: [
+      value1: utils.timestamp(new Date().getTime()),
+      totalPages: 0,
+      pageNum: 1,
+      pageSize: 20,
+      tableData: [],
+      pigData: {},
+      farmCode: '330703010000422',
+      farmName: '',
+      eartagNo: '',
+      deviceCode: '',
+      show: true,
+      options: [
         {
           id: 1,
-          name: '母猪存栏',
-          value: 2500,
+          name: '配种'
         },
         {
           id: 2,
-          name: '分娩舍母猪数',
-          value: 1689
+          name: '分娩'
         },
         {
           id: 3,
-          name: '配怀舍母猪数',
-          value: 1689
+          name: '保育'
         },
         {
           id: 4,
-          name: '母猪新增',
-          value: 1689
+          name: '育成育肥'
         },
         {
           id: 5,
-          name: '耳标离线',
-          value: 1689
+          name: '空怀'
         },
         {
           id: 6,
-          name: '预计未来三月出栏量',
-          value: 50000
+          name: '后备母猪'
+        },
+        {
+          id: 7,
+          name: '公猪'
+        },
+        {
+          id: 8,
+          name: '病死猪场内收集'
+        },
+        {
+          id: 9,
+          name: '病死猪无害化'
         },
       ],
-      value1: '',
-      totalPages: 0,
-      pageNum: 1,
-      pageSize: 20,
-      tableData: [],
+      loading: true,
+      isParent: false,
     }
   },
   methods: {
+    // 过滤
+    getStage(id) {
+      let str = '';
+      this.options.forEach(item => {
+        if(item.id === id) {
+          str = item.name;
+        }
+      })
+      return str;
+    },
     // 修改size
     sizeChange(val) {
       this.pageSize = val;
+      this.init()
     },
     // 修改页数
     pageChange(val) {
       this.pageNum = val;
+      this.init()
     },
     renderHeader(createElement, { column }) {
       const label = column.label
@@ -212,25 +264,87 @@ export default {
           ]
       )
     },
-    jump() {
-      this.$router.push('/dataDetail');
+    search() {
+      this.init();
+      this.initTable();
     },
     // 初始化
     init() {
+      let params = {
+        farmCode: this.farmCode,
+        date: this.value1,
+      }
+      this.$http({
+        url: this.$http.adornUrl('http://122.112.224.199:9000/manager/dailytabulatedata/listByFarm'),
+        method: 'get',
+        params: this.$http.adornParams(params)
+      })
+          .then(res => {
+            if(res.data.code === 0) {
+              if(res.data.page != null) {
+                this.show = true;
+                this.pigData = res.data.page;
+              } else {
+                this.show = false;
+              }
+            }
+          })
+    },
+    // 初始化表格
+    initTable() {
+      this.loading = true;
+      let starttime = String(`${this.value1} 00:00:00`);
+      let endtime = String(`${this.value1} 23:59:59`);
+      let data = {
+        farmID: this.farmCode,
+        starttime: starttime,
+        endtime: endtime,
+        page: this.pageNum,
+        limit: this.pageSize
+      }
+      if(this.eartagNo !== ''){
+        data.eartagNo = this.eartagNo;
+      }
+      if(this.deviceCode !=='') {
+        data.deviceCode = this.deviceCode;
+      }
+      //http://122.112.224.199:9500/manager/eartagdata/findByConditions
       this.$http({
-        url: this.$http.adornUrl("/manager/eartagdata/list"),
+        url: this.$http.adornUrl("http://192.168.1.171:8210/manager/eartagdata/findByConditions"),
         method: 'post',
-        data: this.$http.adornData(),
+        data: this.$http.adornData(data),
       }).then(res => {
-        console.log(res);
+        this.loading = false;
         if(res.data.code === 0) {
           this.tableData = res.data.page.list;
+          this.totalPages = res.data.page.totalCount;
+        } else {
+          this.$message.error(res.data.msg)
+        }
+      }).catch(() => {
+        this.loading = false;
+      })
+    },
+    open(row) {
+      let endTime = new Date().getTime();
+      let startTime = endTime - 3600 * 1000 * 24;
+      this.$router.push({
+        path: '/dataDetail',
+        query: {
+          id: row.id,
+          startTime: utils.timeDate(startTime),
+          endTime: utils.timeDate(endTime)
         }
       })
     },
   },
   mounted() {
+    let farmCode = this.$route.query.farmCode;
+    if(farmCode) {
+      this.farmCode = farmCode;
+    }
     this.init();
+    this.initTable();
   }
 }
 </script>

src/views/pastureData/hand.vue

@@ -1,44 +1,166 @@
 <template>
   <div class="band">
     <div class="box">
-      <div class="box_header">母猪存栏走势</div>
+      <div class="box_header">
+        <span>母猪存栏统计</span>
+        <div class="right">
+          <el-date-picker
+              v-model="timeSelected"
+              v-show="daySelected === 1"
+              type="daterange"
+              range-separator="—"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              @change="onChange"
+              value-format="yyyy-MM-dd"
+              size="mini">
+          </el-date-picker>
+          <el-date-picker
+              v-model="monthSelected"
+              v-show="daySelected === 2"
+              type="monthrange"
+              range-separator="至"
+              start-placeholder="开始月份"
+              end-placeholder="结束月份"
+              @change="onChange"
+              size="mini"
+              value-format="yyyy-MM">
+          </el-date-picker>
+          <div v-show="daySelected === 3">
+            <el-date-picker
+                v-model="startYear"
+                type="year"
+                placeholder="选择年"
+                size="mini"
+                style="width: 100px;"
+                value-format="yyyy">
+            </el-date-picker>
+            -
+            <el-date-picker
+                v-model="endYear"
+                type="year"
+                placeholder="选择年"
+                size="mini"
+                @change="onChange"
+                style="width: 100px;"
+                value-format="yyyy">
+            </el-date-picker>
+          </div>
+        </div>
+        <div class="right">
+          <span :class="{'scopeEle': true, 'ifScoped': daySelected === 1, 'borderLeft': true}" @click="scopeDay(1)">日</span>
+          <span :class="{'scopeEle': true, 'ifScoped': daySelected === 2}" @click="scopeDay(2)">月</span>
+          <span :class="{'scopeEle': true, 'ifScoped': daySelected === 3, 'borderRight': true}" @click="scopeDay(3)">年</span>
+        </div>
+      </div>
       <div class="box_content">
-        <chart-mzcl></chart-mzcl>
+        <chart-mzcl :mzclList="mzclList"></chart-mzcl>
       </div>
     </div>
     <div class="box">
-      <div class="box_header">母猪存栏走势</div>
-      <div class="box_main">
-        <chart-mzxz></chart-mzxz>
+      <div class="box_header">
+        <span>母猪新增-离线走势图</span>
+        <div class="right">
+          <el-date-picker
+              v-model="timeSelected"
+              v-show="daySelected === 1"
+              type="daterange"
+              range-separator="—"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              @change="onChange"
+              value-format="yyyy-MM-dd"
+              size="mini">
+          </el-date-picker>
+          <el-date-picker
+              v-model="monthSelected"
+              v-show="daySelected === 2"
+              type="monthrange"
+              range-separator="至"
+              start-placeholder="开始月份"
+              end-placeholder="结束月份"
+              @change="onChange"
+              size="mini"
+              value-format="yyyy-MM">
+          </el-date-picker>
+          <div v-show="daySelected === 3">
+            <el-date-picker
+                v-model="startYear"
+                type="year"
+                placeholder="选择年"
+                size="mini"
+                style="width: 100px;"
+                value-format="yyyy">
+            </el-date-picker>
+            -
+            <el-date-picker
+                v-model="endYear"
+                type="year"
+                placeholder="选择年"
+                size="mini"
+                @change="onChange"
+                style="width: 100px;"
+                value-format="yyyy">
+            </el-date-picker>
+          </div>
+        </div>
+        <div class="right">
+          <span :class="{'scopeEle': true, 'ifScoped': daySelected === 1, 'borderLeft': true}" @click="scopeDay(1)">日</span>
+          <span :class="{'scopeEle': true, 'ifScoped': daySelected === 2}" @click="scopeDay(2)">月</span>
+          <span :class="{'scopeEle': true, 'ifScoped': daySelected === 3, 'borderRight': true}" @click="scopeDay(3)">年</span>
+        </div>
       </div>
-    </div>
-    <div class="box">
-      <div class="box_header">公猪存栏走势</div>
       <div class="box_main">
-        <chart-gzxz></chart-gzxz>
+        <chart-mzxz :mzxzList="mzxzList"></chart-mzxz>
       </div>
     </div>
+<!--    <div class="box">-->
+<!--      <div class="box_header">公猪存栏走势</div>-->
+<!--      <div class="box_main">-->
+<!--        <chart-gzxz></chart-gzxz>-->
+<!--      </div>-->
+<!--    </div>-->
   </div>
 </template>
 
 <script>
 import chartMzcl from "./chart/chartMzcl";
 import chartMzxz from "./chart/chartMzxz";
-import chartGzxz from "./chart/chartGzxz";
+// import chartGzxz from "./chart/chartGzxz";
 export default {
   name: "hand",
   components: {
     chartMzcl,
     chartMzxz,
-    chartGzxz
+    // chartGzxz
+  },
+  data() {
+    return {
+      daySelected: 1, // 年月日选中值，默认月
+      timeSelected: [], // 时间选择器选中的时间
+      monthSelected: [], // 月份选择
+      startYear: '',
+      endYear: '',
+      farmCode: 'N0003',
+      mzclList: [],
+      mzxzList: [],
+    }
   },
   methods: {
     init() {
       let params = {
-        startDate: '',
-        endDate: '',
-        farmCode: 'N0003',
-        type: 1
+        farmCode: this.farmCode,
+        type: this.daySelected,
+      }
+      if(this.daySelected === 1) {
+        params.startDate = this.timeSelected[0];
+        params.endDate = this.timeSelected[1];
+      } else if(this.daySelected === 2) {
+        params.startDate = this.monthSelected[0];
+        params.endDate = this.monthSelected[1];
+      } else if(this.daySelected === 3) {
+        params.startDate = this.startYear;
+        params.endDate = this.endYear
       }
       this.$http({
         url: this.$http.adornUrl('http://122.112.224.199:9000/manager/dailytabulatedata/countAllChange'),
@@ -46,8 +168,68 @@ export default {
         params: this.$http.adornParams(params)
       })
       .then(res => {
-        console.log(res);
+        if(res.data.code === 0) {
+          let arr = [];
+          let arr1 = [];
+          let arr2 = [];
+          let arr3 = [];
+          let arr4 = [];
+          let arr5 = [];
+          res.data.page.forEach(item => {
+            arr.push(item.ydate);
+            arr1.push(item.stockNew);
+            arr2.push(item.offlineNo);
+            // 配怀
+            arr3.push(item.stock1);
+            // 分娩
+            arr4.push(item.stock2);
+            // 后备
+            arr5.push(item.stock3);
+          })
+          let time = arr.reverse()
+          let stockNew = arr1.reverse();
+          let offlineNo = arr2.reverse()
+          let stock1 = arr3.reverse();
+          let stock2 = arr4.reverse();
+          let stock3 = arr5.reverse()
+          this.mzclList = [time, stock1, stock2, stock3];
+          this.mzxzList = [time, stockNew, offlineNo];
+          console.log(stockNew);
+        } else {
+          this.mzclList = [];
+        }
       })
+    },
+    onChange() {
+      if(this.daySelected === 3) {
+        if(this.startYear > this.endYear) {
+          this.$message.error('起始年份不能大于终止年份')
+          this.startYear = '';
+          this.endYear = '';
+          return false;
+        } else {
+          this.init()
+        }
+      } else {
+        this.init()
+      }
+    },
+    scopeDay(val) {
+      this.daySelected = val
+      this.init();
+      // switch (val) {
+      //   case 1: // 日
+      //     this.init()
+      //     break;
+      //   case 2: // 月
+      //     this.init()
+      //     break;
+      //   case 3: // 年
+      //     this.init()
+      //     break;
+      //   default:
+      //     break;
+      // }
     }
   },
   mounted() {
@@ -86,4 +268,33 @@ export default {
     background-color: #fff;
     height: 340px;
   }
+  .right {
+    float: right;
+    margin-right: 20px;
+    font-size: 12px;
+  }
+  /** 年月日选择 */
+  .scopeEle {
+    display: inline-block;
+    border: 1px solid #ccc;
+    width: 75px;
+    text-align: center;
+    height: 26px;
+    line-height: 26px;
+    margin-left: -1px;
+    cursor: pointer;
+    background-color: #fff;
+  }
+  .borderLeft {
+    border-radius: 5px 0 0 5px;
+  }
+  .borderRight {
+    border-radius: 0 5px 5px 0 ;
+  }
+  /* 如果选中了 */
+  .ifScoped {
+    background-color: #1abc9c;
+    color: #fff;
+    border: 1px solid #1abc9c;
+  }
 </style>

src/views/pastureData/homeComponent/city.vue

@@ -2,17 +2,33 @@
   <div>
     <div>
       <div class="box">
-        <div class="box_item" v-for="item in boxList" :key="item.id">
-          <p>{{item.name}}</p>
+        <div class="box_item">
+          <p>母猪总存栏</p>
           <p class="number">
-            {{item.value}}
-            <template v-if="item.data !==0">
-              <i :class="['icon', item.isUp ? '' : 'icon_red']"></i>
-              <span v-if="item.isUp" class="icon_green">+{{item.data}}</span>
-              <span v-else class="icon_dev">-{{item.data}}</span>
+            {{boxList.stockToal}}
+            <template v-if="boxList.sowTotalStockValue !== 0">
+              <i :class="['icon', boxList.sowTotalStockType ? '' : 'icon_red']"></i>
+              <span v-if="boxList.sowTotalStockType" class="icon_green">+{{boxList.sowTotalStockValue}}</span>
+              <span v-else class="icon_dev">-{{boxList.sowTotalStockValue}}</span>
             </template>
           </p>
         </div>
+        <div class="box_item">
+          <p>能繁母猪存栏</p>
+          <p class="number">{{boxList.sowStock}}</p>
+        </div>
+        <div class="box_item">
+          <p>配怀存栏</p>
+          <p class="number">{{boxList.stock1}}</p>
+        </div>
+        <div class="box_item">
+          <p>分娩存栏</p>
+          <p class="number">{{boxList.stock2}}</p>
+        </div>
+        <div class="box_item">
+          <p>后备存栏</p>
+          <p class="number">{{boxList.stock3}}</p>
+        </div>
       </div>
       <!-- 拆分 市 -->
       <div class="form_item">
@@ -74,7 +90,7 @@
               label="市县"
               prop="name">
             <template slot-scope="scope">
-              <span style="cursor: pointer;" @click="onSelect(scope.row)">{{scope.row.name}}</span>
+              <span style="cursor: pointer; color: #4098CA;" @click="onSelect(scope.row)">{{scope.row.name}}</span>
             </template>
           </el-table-column>
           <el-table-column
@@ -136,50 +152,7 @@ export default {
   },
   data() {
     return {
-      boxList: [
-        {
-          id: 1,
-          name: '母猪总存栏',
-          value: 2500,
-          data: 20,
-          isUp: true,
-        },
-        {
-          id: 2,
-          name: '配怀存栏',
-          value: 1689,
-          data: 20,
-          isUp: true,
-        },
-        {
-          id: 3,
-          name: '分娩存栏',
-          value: 1689,
-          data: 20,
-          isUp: false,
-        },
-        {
-          id: 4,
-          name: '后备存栏',
-          value: 1689,
-          data: 0,
-          isUp: true,
-        },
-        {
-          id: 5,
-          name: '公猪存栏',
-          value: 1689,
-          data: 20,
-          isUp: true,
-        },
-        {
-          id: 6,
-          name: '预计年出栏量',
-          value: 50000,
-          data: 20,
-          isUp: true,
-        },
-      ],
+      boxList: {},
       pickerOptions: {
         shortcuts: [{
           text: '最近一周',
@@ -261,32 +234,6 @@ export default {
           ]
       )
     },
-    // 省级
-    // init() {
-    //   let params = {
-    //     countyCode: this.countyCode,
-    //     farmCode: this.farmCode,
-    //     minStockTotal: this.minStockTotal,
-    //     maxStockTotal: this.maxStockTotal,
-    //     minStockNew: this.minStockNew,
-    //     maxStockNew: this.maxStockNew,
-    //     minOfflineNo: this.minOfflineNo,
-    //     maxOfflineNo: this.maxOfflineNo,
-    //     minSowStock: this.minSowStock,
-    //     maxSowStock: this.maxSowStock
-    //   }
-    //   console.log(111);
-    //   this.$http({
-    //     url: this.$http.adornUrl(`${this.baseUrl}/manager/farmstock/countAll`),
-    //     method: 'get',
-    //     params: this.$http.adornParams(params)
-    //   })
-    //       .then(res => {
-    //         if (res.data.code === 0) {
-    //           this.tableData = res.data.page;
-    //         }
-    //       })
-    // },
     // // 市级
     initCity() {
       let params = {
@@ -312,60 +259,11 @@ export default {
             }
           })
     },
-    // 县级
-    // initCounty() {
-    //   let params = {
-    //     countyCode: this.countyCode,
-    //     farmName: this.farmName,
-    //     minStockTotal: this.minStockTotal,
-    //     maxStockTotal: this.maxStockTotal,
-    //     minStockNew: this.minStockNew,
-    //     maxStockNew: this.maxStockNew,
-    //     minOfflineNo: this.minOfflineNo,
-    //     maxOfflineNo: this.maxOfflineNo,
-    //     minSowStock: this.minSowStock,
-    //     maxSowStock: this.maxSowStock
-    //   }
-    //   this.$http({
-    //     url: this.$http.adornUrl(`${this.baseUrl}/manager/farmstock/list`),
-    //     method: 'get',
-    //     params: this.$http.adornParams(params)
-    //   })
-    //       .then(res => {
-    //         if(res.data.code === 0) {
-    //           this.tableData = res.data.page.list;
-    //         }
-    //       })
-    // },
-    // // 去牧场
-    // onFarm(row) {
-    //   this.farmCode = row.farmCode;
-    //   let params = {
-    //     farmCode: this.farmCode,
-    //     startTime: this.value2[0],
-    //     endTime: this.value2[1],
-    //     minStockTotal: this.minStockTotal,
-    //     maxStockTotal: this.maxStockTotal,
-    //     minStockNew: this.minStockNew,
-    //     maxStockNew: this.maxStockNew,
-    //     minOfflineNo: this.minOfflineNo,
-    //     maxOfflineNo: this.maxOfflineNo,
-    //     minSowStock: this.minSowStock,
-    //     maxSowStock: this.maxSowStock,
-    //   }
-    //   this.$http({
-    //     url: this.$http.adornUrl(`${this.baseUrl}/manager/dailytabulatedata/list`),
-    //     method: 'get',
-    //     params: this.$http.adornParams(params)
-    //   })
-    //       .then(res => {
-    //         console.log(res);
-    //       })
-    // },
     // 选择
     onSelect(row) {
       this.countyCode = row.code;
       this.type = row.type;
+      console.log(row);
       this.$emit('getCountyCode', {countyCode: this.countyCode, type: this.type});
       // if (row.type === 1) {
       //   this.initCity();
@@ -373,9 +271,23 @@ export default {
       //   this.initCounty();
       // }
     },
+    // 统计
+    initState() {
+      this.$http({
+        url: this.$http.adornUrl('http://192.168.1.165:9000/manager/dailytabulatedata/countAllsow'),
+        method: 'get',
+        params: this.$http.adornParams({countyCode: this.cityCode})
+      })
+          .then(res => {
+            if(res.data.code === 0) {
+              this.boxList = res.data.data;
+            }
+          })
+    }
   },
   mounted() {
     this.initCity();
+    this.initState();
   }
 }
 </script>

src/views/pastureData/homeComponent/district.vue

@@ -2,17 +2,33 @@
   <div>
     <div>
       <div class="box">
-        <div class="box_item" v-for="item in boxList" :key="item.id">
-          <p>{{item.name}}</p>
+        <div class="box_item">
+          <p>母猪总存栏</p>
           <p class="number">
-            {{item.value}}
-            <template v-if="item.data !==0">
-              <i :class="['icon', item.isUp ? '' : 'icon_red']"></i>
-              <span v-if="item.isUp" class="icon_green">+{{item.data}}</span>
-              <span v-else class="icon_dev">-{{item.data}}</span>
+            {{boxList.stockToal}}
+            <template v-if="boxList.sowTotalStockValue !== 0">
+              <i :class="['icon', boxList.sowTotalStockType ? '' : 'icon_red']"></i>
+              <span v-if="boxList.sowTotalStockType" class="icon_green">+{{boxList.sowTotalStockValue}}</span>
+              <span v-else class="icon_dev">-{{boxList.sowTotalStockValue}}</span>
             </template>
           </p>
         </div>
+        <div class="box_item">
+          <p>能繁母猪存栏</p>
+          <p class="number">{{boxList.sowStock}}</p>
+        </div>
+        <div class="box_item">
+          <p>配怀存栏</p>
+          <p class="number">{{boxList.stock1}}</p>
+        </div>
+        <div class="box_item">
+          <p>分娩存栏</p>
+          <p class="number">{{boxList.stock2}}</p>
+        </div>
+        <div class="box_item">
+          <p>后备存栏</p>
+          <p class="number">{{boxList.stock3}}</p>
+        </div>
       </div>
       <!-- 拆分 市 -->
       <div class="form_item">
@@ -60,7 +76,7 @@
             prop="farmName"
             >
             <template slot-scope="scope">
-              <span @click="goFarm(scope.row)">{{scope.row.farmName}}</span>
+              <span @click="goFarm(scope.row)" style="color: #4098CA; cursor: pointer;">{{scope.row.farmName}}</span>
             </template>
           </el-table-column>
           <el-table-column
@@ -120,50 +136,7 @@ export default {
   },
   data() {
     return {
-      boxList: [
-        {
-          id: 1,
-          name: '母猪总存栏',
-          value: 2500,
-          data: 20,
-          isUp: true,
-        },
-        {
-          id: 2,
-          name: '配怀存栏',
-          value: 1689,
-          data: 20,
-          isUp: true,
-        },
-        {
-          id: 3,
-          name: '分娩存栏',
-          value: 1689,
-          data: 20,
-          isUp: false,
-        },
-        {
-          id: 4,
-          name: '后备存栏',
-          value: 1689,
-          data: 0,
-          isUp: true,
-        },
-        {
-          id: 5,
-          name: '公猪存栏',
-          value: 1689,
-          data: 20,
-          isUp: true,
-        },
-        {
-          id: 6,
-          name: '预计年出栏量',
-          value: 50000,
-          data: 20,
-          isUp: true,
-        },
-      ],
+      boxList: {},
       pickerOptions: {
         shortcuts: [{
           text: '最近一周',
@@ -245,57 +218,6 @@ export default {
           ]
       )
     },
-    // 省级
-    // init() {
-    //   let params = {
-    //     countyCode: this.countyCode,
-    //     farmCode: this.farmCode,
-    //     minStockTotal: this.minStockTotal,
-    //     maxStockTotal: this.maxStockTotal,
-    //     minStockNew: this.minStockNew,
-    //     maxStockNew: this.maxStockNew,
-    //     minOfflineNo: this.minOfflineNo,
-    //     maxOfflineNo: this.maxOfflineNo,
-    //     minSowStock: this.minSowStock,
-    //     maxSowStock: this.maxSowStock
-    //   }
-    //   console.log(111);
-    //   this.$http({
-    //     url: this.$http.adornUrl(`${this.baseUrl}/manager/farmstock/countAll`),
-    //     method: 'get',
-    //     params: this.$http.adornParams(params)
-    //   })
-    //       .then(res => {
-    //         if (res.data.code === 0) {
-    //           this.tableData = res.data.page;
-    //         }
-    //       })
-    // },
-    // // 市级
-    // initCity() {
-    //   let params = {
-    //     countyCode: this.countyCode ? this.countyCode : this.cityCode,
-    //     farmCode: this.farmCode,
-    //     minStockTotal: this.minStockTotal,
-    //     maxStockTotal: this.maxStockTotal,
-    //     minStockNew: this.minStockNew,
-    //     maxStockNew: this.maxStockNew,
-    //     minOfflineNo: this.minOfflineNo,
-    //     maxOfflineNo: this.maxOfflineNo,
-    //     minSowStock: this.minSowStock,
-    //     maxSowStock: this.maxSowStock
-    //   }
-    //   this.$http({
-    //     url: this.$http.adornUrl(`${this.baseUrl}/manager/farmstock/cityCountAll`),
-    //     method: 'get',
-    //     params: this.$http.adornParams(params)
-    //   })
-    //       .then(res => {
-    //         if(res.data.code === 0) {
-    //           this.tableData = res.data.page;
-    //         }
-    //       })
-    // },
     // 县级
     initCounty() {
       let params = {
@@ -324,45 +246,23 @@ export default {
     goFarm(row) {
       this.$emit('goFarm', {farmCode: row.farmCode, type: 4});
     },
-    // // 去牧场
-    // onFarm(row) {
-    //   this.farmCode = row.farmCode;
-    //   let params = {
-    //     farmCode: this.farmCode,
-    //     startTime: this.value2[0],
-    //     endTime: this.value2[1],
-    //     minStockTotal: this.minStockTotal,
-    //     maxStockTotal: this.maxStockTotal,
-    //     minStockNew: this.minStockNew,
-    //     maxStockNew: this.maxStockNew,
-    //     minOfflineNo: this.minOfflineNo,
-    //     maxOfflineNo: this.maxOfflineNo,
-    //     minSowStock: this.minSowStock,
-    //     maxSowStock: this.maxSowStock,
-    //   }
-    //   this.$http({
-    //     url: this.$http.adornUrl(`${this.baseUrl}/manager/dailytabulatedata/list`),
-    //     method: 'get',
-    //     params: this.$http.adornParams(params)
-    //   })
-    //       .then(res => {
-    //         console.log(res);
-    //       })
-    // },
-    // 选择
-    // onSelect(row) {
-    //   this.countyCode = row.code;
-    //   this.type = row.type;
-    //   this.$emit('getCountyCode', {countyCode: this.countyCode, type: this.type});
-      // if (row.type === 1) {
-      //   this.initCity();
-      // } else if (row.type === 2) {
-      //   this.initCounty();
-      // }
-    // },
+    // 统计
+    initState() {
+      this.$http({
+        url: this.$http.adornUrl('http://192.168.1.165:9000/manager/dailytabulatedata/countAllsow'),
+        method: 'get',
+        params: this.$http.adornParams({countyCode: this.distCode})
+      })
+          .then(res => {
+            if(res.data.code === 0) {
+              this.boxList = res.data.data;
+            }
+          })
+    }
   },
   mounted() {
     this.initCounty();
+    this.initState();
   }
 }
 </script>

src/views/pastureData/homeComponent/farm.vue

@@ -2,17 +2,33 @@
   <div>
     <div>
       <div class="box">
-        <div class="box_item" v-for="item in boxList" :key="item.id">
-          <p>{{item.name}}</p>
+        <div class="box_item">
+          <p>母猪总存栏</p>
           <p class="number">
-            {{item.value}}
-            <template v-if="item.data !==0">
-              <i :class="['icon', item.isUp ? '' : 'icon_red']"></i>
-              <span v-if="item.isUp" class="icon_green">+{{item.data}}</span>
-              <span v-else class="icon_dev">-{{item.data}}</span>
+            {{boxList.stockToal}}
+            <template v-if="boxList.sowTotalStockValue !== 0">
+              <i :class="['icon', boxList.sowTotalStockType ? '' : 'icon_red']"></i>
+              <span v-if="boxList.sowTotalStockType" class="icon_green">+{{boxList.sowTotalStockValue}}</span>
+              <span v-else class="icon_dev">-{{boxList.sowTotalStockValue}}</span>
             </template>
           </p>
         </div>
+        <div class="box_item">
+          <p>能繁母猪存栏</p>
+          <p class="number">{{boxList.sowStock}}</p>
+        </div>
+        <div class="box_item">
+          <p>配怀存栏</p>
+          <p class="number">{{boxList.stock1}}</p>
+        </div>
+        <div class="box_item">
+          <p>分娩存栏</p>
+          <p class="number">{{boxList.stock2}}</p>
+        </div>
+        <div class="box_item">
+          <p>后备存栏</p>
+          <p class="number">{{boxList.stock3}}</p>
+        </div>
       </div>
       <!-- 拆分 市 -->
       <div class="form_item">
@@ -64,19 +80,19 @@
             height="700"
             style="width: 100%;">
           <el-table-column
-              prop="sowTotalStock"
+              prop="statisticDate"
               label="时间">
           </el-table-column>
           <el-table-column
-              prop="sowTotalStock"
+              prop="stockTotal"
               label="母猪总存栏">
           </el-table-column>
           <el-table-column
-              prop="eartagNew"
+              prop="stockNew"
               label="母猪新增">
           </el-table-column>
           <el-table-column
-              prop="eartagOffone"
+              prop="offlineNo"
               label="耳标离线">
           </el-table-column>
           <el-table-column
@@ -85,19 +101,19 @@
           </el-table-column>
           <el-table-column label="存栏能繁母猪月龄分布">
             <el-table-column
-                prop="date"
+                prop="ratio1"
                 label="8月-20月">
             </el-table-column>
             <el-table-column
-                prop="date"
+                prop="ratio2"
                 label="20月-32月">
             </el-table-column>
             <el-table-column
-                prop="date"
+                prop="ratio3"
                 label="32月-44月">
             </el-table-column>
             <el-table-column
-                prop="date"
+                prop="ratio4"
                 label=">44月">
             </el-table-column>
           </el-table-column>
@@ -121,6 +137,11 @@
               prop="stock5"
               label="公猪存栏">
           </el-table-column>
+          <el-table-column label="操作">
+            <template slot-scope="scope">
+              <el-button size="mini" type="primary" @click="jump(scope.row)">查看</el-button>
+            </template>
+          </el-table-column>
         </el-table>
         <table-footer
             :totals="totalPages"
@@ -143,50 +164,7 @@ export default {
   props: ['farmCode'],
   data() {
     return {
-      boxList: [
-        {
-          id: 1,
-          name: '母猪总存栏',
-          value: 2500,
-          data: 20,
-          isUp: true,
-        },
-        {
-          id: 2,
-          name: '配怀存栏',
-          value: 1689,
-          data: 20,
-          isUp: true,
-        },
-        {
-          id: 3,
-          name: '分娩存栏',
-          value: 1689,
-          data: 20,
-          isUp: false,
-        },
-        {
-          id: 4,
-          name: '后备存栏',
-          value: 1689,
-          data: 0,
-          isUp: true,
-        },
-        {
-          id: 5,
-          name: '公猪存栏',
-          value: 1689,
-          data: 20,
-          isUp: true,
-        },
-        {
-          id: 6,
-          name: '预计年出栏量',
-          value: 50000,
-          data: 20,
-          isUp: true,
-        },
-      ],
+      boxList: {},
       pickerOptions: {
         shortcuts: [{
           text: '最近一周',
@@ -264,83 +242,6 @@ export default {
           ]
       )
     },
-    // 省级
-    // init() {
-    //   let params = {
-    //     countyCode: this.countyCode,
-    //     farmCode: this.farmCode,
-    //     minStockTotal: this.minStockTotal,
-    //     maxStockTotal: this.maxStockTotal,
-    //     minStockNew: this.minStockNew,
-    //     maxStockNew: this.maxStockNew,
-    //     minOfflineNo: this.minOfflineNo,
-    //     maxOfflineNo: this.maxOfflineNo,
-    //     minSowStock: this.minSowStock,
-    //     maxSowStock: this.maxSowStock
-    //   }
-    //   console.log(111);
-    //   this.$http({
-    //     url: this.$http.adornUrl(`${this.baseUrl}/manager/farmstock/countAll`),
-    //     method: 'get',
-    //     params: this.$http.adornParams(params)
-    //   })
-    //       .then(res => {
-    //         if (res.data.code === 0) {
-    //           this.tableData = res.data.page;
-    //         }
-    //       })
-    // },
-    // // 市级
-    // initCity() {
-    //   let params = {
-    //     countyCode: this.countyCode,
-    //     farmCode: this.farmCode,
-    //     minStockTotal: this.minStockTotal,
-    //     maxStockTotal: this.maxStockTotal,
-    //     minStockNew: this.minStockNew,
-    //     maxStockNew: this.maxStockNew,
-    //     minOfflineNo: this.minOfflineNo,
-    //     maxOfflineNo: this.maxOfflineNo,
-    //     minSowStock: this.minSowStock,
-    //     maxSowStock: this.maxSowStock
-    //   }
-    //   console.log(222);
-    //   this.$http({
-    //     url: this.$http.adornUrl(`${this.baseUrl}/manager/farmstock/cityCountAll`),
-    //     method: 'get',
-    //     params: this.$http.adornParams(params)
-    //   })
-    //       .then(res => {
-    //         if(res.data.code === 0) {
-    //           this.tableData = res.data.page;
-    //         }
-    //       })
-    // },
-    // 县级
-    // initCounty() {
-    //   let params = {
-    //     countyCode: this.countyCode,
-    //     farmName: this.farmName,
-    //     minStockTotal: this.minStockTotal,
-    //     maxStockTotal: this.maxStockTotal,
-    //     minStockNew: this.minStockNew,
-    //     maxStockNew: this.maxStockNew,
-    //     minOfflineNo: this.minOfflineNo,
-    //     maxOfflineNo: this.maxOfflineNo,
-    //     minSowStock: this.minSowStock,
-    //     maxSowStock: this.maxSowStock
-    //   }
-    //   this.$http({
-    //     url: this.$http.adornUrl(`${this.baseUrl}/manager/farmstock/list`),
-    //     method: 'get',
-    //     params: this.$http.adornParams(params)
-    //   })
-    //       .then(res => {
-    //         if(res.data.code === 0) {
-    //           this.tableData = res.data.page.list;
-    //         }
-    //       })
-    // },
     // // 去牧场
     onFarm() {
       let params = {
@@ -380,9 +281,31 @@ export default {
     //   //   this.initCounty();
     //   // }
     // },
+    jump(row) {
+      this.$router.push({
+        path: '/dayData',
+        query: {
+          farmCode: row.farmCode
+        }
+      })
+    },
+    // 统计
+    initState() {
+      this.$http({
+        url: this.$http.adornUrl('http://192.168.1.165:9000/manager/dailytabulatedata/countAllsow'),
+        method: 'get',
+        params: this.$http.adornParams({farmCode: this.farmCode})
+      })
+          .then(res => {
+            if(res.data.code === 0) {
+              this.boxList = res.data.data;
+            }
+          })
+    }
   },
   mounted() {
     this.onFarm();
+    this.initState();
   }
 }
 </script>

src/views/pastureData/homeComponent/proinvce.vue

@@ -1,17 +1,33 @@
 <template>
   <div>
     <div class="box">
-      <div class="box_item" v-for="item in boxList" :key="item.id">
-        <p>{{item.name}}</p>
+      <div class="box_item">
+        <p>母猪总存栏</p>
         <p class="number">
-          {{item.value}}
-          <template v-if="item.data !==0">
-            <i :class="['icon', item.isUp ? '' : 'icon_red']"></i>
-            <span v-if="item.isUp" class="icon_green">+{{item.data}}</span>
-            <span v-else class="icon_dev">-{{item.data}}</span>
+          {{boxList.stockToal}}
+          <template v-if="boxList.sowTotalStockValue !== 0">
+            <i :class="['icon', boxList.sowTotalStockType ? '' : 'icon_red']"></i>
+            <span v-if="boxList.sowTotalStockType" class="icon_green">+{{boxList.sowTotalStockValue}}</span>
+            <span v-else class="icon_dev">-{{boxList.sowTotalStockValue}}</span>
           </template>
         </p>
       </div>
+      <div class="box_item">
+        <p>能繁母猪存栏</p>
+        <p class="number">{{boxList.sowStock}}</p>
+      </div>
+      <div class="box_item">
+        <p>配怀存栏</p>
+        <p class="number">{{boxList.stock1}}</p>
+      </div>
+      <div class="box_item">
+        <p>分娩存栏</p>
+        <p class="number">{{boxList.stock2}}</p>
+      </div>
+      <div class="box_item">
+        <p>后备存栏</p>
+        <p class="number">{{boxList.stock3}}</p>
+      </div>
     </div>
     <!-- 拆分 市 -->
     <div class="form_item">
@@ -73,7 +89,7 @@
             label="市县"
             prop="name">
           <template slot-scope="scope">
-            <span style="cursor: pointer;" @click="onSelect(scope.row)">{{scope.row.name}}</span>
+            <span style="cursor: pointer; color: #4098CA;" @click="onSelect(scope.row)">{{scope.row.name}}</span>
           </template>
         </el-table-column>
         <el-table-column
@@ -135,48 +151,6 @@ export default {
   data() {
     return {
       boxList: [
-        {
-          id: 1,
-          name: '母猪总存栏',
-          value: 2500,
-          data: 20,
-          isUp: true,
-        },
-        {
-          id: 2,
-          name: '配怀存栏',
-          value: 1689,
-          data: 20,
-          isUp: true,
-        },
-        {
-          id: 3,
-          name: '分娩存栏',
-          value: 1689,
-          data: 20,
-          isUp: false,
-        },
-        {
-          id: 4,
-          name: '后备存栏',
-          value: 1689,
-          data: 0,
-          isUp: true,
-        },
-        {
-          id: 5,
-          name: '公猪存栏',
-          value: 1689,
-          data: 20,
-          isUp: true,
-        },
-        {
-          id: 6,
-          name: '预计年出栏量',
-          value: 50000,
-          data: 20,
-          isUp: true,
-        },
       ],
       pickerOptions: {
         shortcuts: [{
@@ -220,7 +194,7 @@ export default {
       minSowStock: '',
       maxSowStock: '',
       isProvince: false,
-      countyCode: '',
+      countyCode: '330000',
       farmName: '',
     }
   },
@@ -272,7 +246,6 @@ export default {
         minSowStock: this.minSowStock,
         maxSowStock: this.maxSowStock
       }
-      console.log(111);
       this.$http({
         url: this.$http.adornUrl(`${this.baseUrl}/manager/farmstock/countAll`),
         method: 'get',
@@ -284,97 +257,30 @@ export default {
             }
           })
     },
-    // // 市级
-    // initCity() {
-    //   let params = {
-    //     countyCode: this.countyCode,
-    //     farmCode: this.farmCode,
-    //     minStockTotal: this.minStockTotal,
-    //     maxStockTotal: this.maxStockTotal,
-    //     minStockNew: this.minStockNew,
-    //     maxStockNew: this.maxStockNew,
-    //     minOfflineNo: this.minOfflineNo,
-    //     maxOfflineNo: this.maxOfflineNo,
-    //     minSowStock: this.minSowStock,
-    //     maxSowStock: this.maxSowStock
-    //   }
-    //   console.log(222);
-    //   this.$http({
-    //     url: this.$http.adornUrl(`${this.baseUrl}/manager/farmstock/cityCountAll`),
-    //     method: 'get',
-    //     params: this.$http.adornParams(params)
-    //   })
-    //       .then(res => {
-    //         if(res.data.code === 0) {
-    //           this.tableData = res.data.page;
-    //         }
-    //       })
-    // },
-    // 县级
-    // initCounty() {
-    //   let params = {
-    //     countyCode: this.countyCode,
-    //     farmName: this.farmName,
-    //     minStockTotal: this.minStockTotal,
-    //     maxStockTotal: this.maxStockTotal,
-    //     minStockNew: this.minStockNew,
-    //     maxStockNew: this.maxStockNew,
-    //     minOfflineNo: this.minOfflineNo,
-    //     maxOfflineNo: this.maxOfflineNo,
-    //     minSowStock: this.minSowStock,
-    //     maxSowStock: this.maxSowStock
-    //   }
-    //   this.$http({
-    //     url: this.$http.adornUrl(`${this.baseUrl}/manager/farmstock/list`),
-    //     method: 'get',
-    //     params: this.$http.adornParams(params)
-    //   })
-    //       .then(res => {
-    //         if(res.data.code === 0) {
-    //           this.tableData = res.data.page.list;
-    //         }
-    //       })
-    // },
-    // // 去牧场
-    // onFarm(row) {
-    //   this.farmCode = row.farmCode;
-    //   let params = {
-    //     farmCode: this.farmCode,
-    //     startTime: this.value2[0],
-    //     endTime: this.value2[1],
-    //     minStockTotal: this.minStockTotal,
-    //     maxStockTotal: this.maxStockTotal,
-    //     minStockNew: this.minStockNew,
-    //     maxStockNew: this.maxStockNew,
-    //     minOfflineNo: this.minOfflineNo,
-    //     maxOfflineNo: this.maxOfflineNo,
-    //     minSowStock: this.minSowStock,
-    //     maxSowStock: this.maxSowStock,
-    //   }
-    //   this.$http({
-    //     url: this.$http.adornUrl(`${this.baseUrl}/manager/dailytabulatedata/list`),
-    //     method: 'get',
-    //     params: this.$http.adornParams(params)
-    //   })
-    //       .then(res => {
-    //         console.log(res);
-    //       })
-    // },
     // 选择
     onSelect(row) {
-      console.log(row);
       this.countyCode = row.code;
       this.type = row.type;
       this.$emit('getCountyCode', {countyCode: this.countyCode, type: this.type});
-      // if (row.type === 1) {
-      //   this.initCity();
-      // } else if (row.type === 2) {
-      //   this.initCounty();
-      // }
     },
+
+    // 统计
+    initState() {
+      this.$http({
+        url: this.$http.adornUrl('http://192.168.1.165:9000/manager/dailytabulatedata/countAllsow'),
+        method: 'get',
+        params: this.$http.adornParams({countyCode: this.countyCode})
+      })
+      .then(res => {
+        if(res.data.code === 0) {
+          this.boxList = res.data.data;
+        }
+      })
+    }
   },
   mounted() {
     this.init();
+    this.initState();
   }
 }
 </script>