主页

src/views/pastureData/chart/chartTemp.vue

@@ -62,7 +62,7 @@ export default {
             },
           }],
           grid: {
-            left: '2%',
+            left: '0.5%',
             right: '4%',
             bottom: '12%',
             containLabel: true,

src/views/pastureData/dataDetail.vue

@@ -5,131 +5,133 @@
         <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 v-if="tableData.movePigPenData">{{tableData.movePigPenData[0].moveDate ? tableData.movePigPenData[0].moveDate : ''}}</div>
-        <div v-else></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 v-if="tableData.movePigPenData ">
-          <div style="line-height: 14px; font-size: 14px;">时间: {{tableData.movePigPenData[0].moveDate ? tableData.movePigPenData[0].moveDate : ''}}</div>
-          <div style="line-height: 14px; font-size: 14px;">阶段：{{getStage(tableData.movePigPenData[0].stage ? tableData.movePigPenData[0].stage : '')}}</div>
-          <div style="line-height: 14px; font-size: 14px;">{{tableData.movePigPenData[0].penName ? tableData.movePigPenData[0].penName: ''}}{{tableData.movePigPenData[0].unitname ? tableData.movePigPenData[0].unitname : ''}}</div>
+      <div style="padding-top: 60px">
+        <div class="box">
+          <div>耳标</div>
+          <div>{{earTag}}</div>
+          <div></div>
+          <div></div>
+          <div>首次上传时间（配标时间）</div>
+          <div v-if="tableData.movePigPenData">{{tableData.movePigPenData[0].moveDate ? tableData.movePigPenData[0].moveDate : ''}}</div>
+          <div v-else></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 v-if="tableData.movePigPenData ">
+            <div style="line-height: 14px; font-size: 14px;">时间: {{tableData.movePigPenData[0].moveDate ? tableData.movePigPenData[0].moveDate : ''}}</div>
+            <div style="line-height: 14px; font-size: 14px;">阶段：{{getStage(tableData.movePigPenData[0].stage ? tableData.movePigPenData[0].stage : '')}}</div>
+            <div style="line-height: 14px; font-size: 14px;">{{tableData.movePigPenData[0].penName ? tableData.movePigPenData[0].penName: ''}}{{tableData.movePigPenData[0].unitname ? tableData.movePigPenData[0].unitname : ''}}</div>
+          </div>
+          <div v-else></div>
+          <div>上一次位置记录</div>
+          <div v-if="tableData.movePigPenData.length >=2">
+            <div style="line-height: 14px; font-size: 14px;">时间: {{tableData.movePigPenData[0].moveDate ? tableData.movePigPenData[0].moveDate : ''}}</div>
+            <div style="line-height: 14px; font-size: 14px;">阶段：{{getStage(tableData.movePigPenData[0].stage ? tableData.movePigPenData[0].stage : '')}}</div>
+            <div style="line-height: 14px; font-size: 14px;">{{tableData.movePigPenData[0].penName ? tableData.movePigPenData[0].penName : ''}}{{tableData.movePigPenData[0].unitname ? tableData.movePigPenData[0].unitname : ''}}</div>
+          </div>
+          <div v-else></div>
+          <div>当前位置记录</div>
+          <div v-if="tableData.movePigPenData.length >= 1">
+            <div style="line-height: 14px; font-size: 14px;">时间: {{tableData.movePigPenData[0].moveDate ? tableData.movePigPenData[0].moveDate : ''}}</div>
+            <div style="line-height: 14px; font-size: 14px;">阶段：{{getStage(tableData.movePigPenData[0].stage ? tableData.movePigPenData[0].stage : '')}}</div>
+            <div style="line-height: 14px; font-size: 14px;">位置：{{tableData.movePigPenData[0].penName ? tableData.movePigPenData[0].penName : ''}}{{tableData.movePigPenData[0].unitname ? tableData.movePigPenData[0].unitname : ''}}</div>
+          </div>
+          <div v-else></div>
+          <div>信号强度</div>
+          <div>-{{tableData.eartagdeta.rssi}}db(最后一次上传)</div>
         </div>
-        <div v-else></div>
-        <div>上一次位置记录</div>
-        <div v-if="tableData.movePigPenData.length >=2">
-          <div style="line-height: 14px; font-size: 14px;">时间: {{tableData.movePigPenData[0].moveDate ? tableData.movePigPenData[0].moveDate : ''}}</div>
-          <div style="line-height: 14px; font-size: 14px;">阶段：{{getStage(tableData.movePigPenData[0].stage ? tableData.movePigPenData[0].stage : '')}}</div>
-          <div style="line-height: 14px; font-size: 14px;">{{tableData.movePigPenData[0].penName ? tableData.movePigPenData[0].penName : ''}}{{tableData.movePigPenData[0].unitname ? tableData.movePigPenData[0].unitname : ''}}</div>
-        </div>
-        <div v-else></div>
-        <div>当前位置记录</div>
-        <div v-if="tableData.movePigPenData.length >= 1">
-          <div style="line-height: 14px; font-size: 14px;">时间: {{tableData.movePigPenData[0].moveDate ? tableData.movePigPenData[0].moveDate : ''}}</div>
-          <div style="line-height: 14px; font-size: 14px;">阶段：{{getStage(tableData.movePigPenData[0].stage ? tableData.movePigPenData[0].stage : '')}}</div>
-          <div style="line-height: 14px; font-size: 14px;">位置：{{tableData.movePigPenData[0].penName ? tableData.movePigPenData[0].penName : ''}}{{tableData.movePigPenData[0].unitname ? tableData.movePigPenData[0].unitname : ''}}</div>
-        </div>
-        <div v-else></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="结束日期"
-              value-format="yyyy-MM-dd HH:mm:ss"
-              align="right">
-          </el-date-picker>
-        </div>
-        <div class="echart_init">
-          <chartPjwd :pjwdList="pjwdList"></chartPjwd>
+        <!--  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>
-      <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 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 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 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="echart_init">
-          <chartYdl :ydlList="ydlList"></chartYdl>
+        <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>
     </div>
@@ -285,7 +287,7 @@ export default {
 .about {
   width: 100%;
   box-sizing: border-box;
-  padding: 20px;
+  padding:0 20px 20px 20px;
 }
 .back {
   width: 90px;
@@ -350,6 +352,8 @@ export default {
   height: 1000px;
 }
 .header_title {
+  position: fixed;
+  width: 1600px;
   height: 40px;
   background-color: #F7F7F7;
   border: 1px solid #ddd;
@@ -357,6 +361,6 @@ export default {
   color: #6FA8C8;
   margin-bottom: 10px;
   padding-left: 20px;
-  position: relative;
+  z-index: 99;
 }
 </style>

src/views/pastureData/dayData.vue

@@ -1,167 +1,169 @@
 <template>
   <div class="home">
     <div class="header_title">耳标数据</div>
-    <div class="box" v-if="show">
-      <div class="box_item">
-        <p>母猪存栏</p>
-        <p>{{pigData.stockTotal}}</p>
+    <div style="padding-top: 40px;">
+      <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="box_item">
-        <p>能繁母猪存栏</p>
-        <p>{{pigData.sowStock}}</p>
+      <div class="form_item">
+        <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-input v-model="deviceCode" ></el-input>
+          </el-form-item>
+          <el-form-item label="耳标号:">
+            <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 type="primary" @click="search">查询</el-button>
+          </el-form-item>
+        </el-form>
       </div>
-      <div class="box_item">
-        <p>配怀存栏</p>
-        <p>{{pigData.stock1}}</p>
+      <div class="box_table">
+        <el-table
+            v-loading="loading"
+            :data="tableData"
+            border
+            stripe
+            :header-cell-style="{'text-align':'center', 'background-color': '#F9FAFC', 'padding': '5px 0', 'color': '#666666'}"
+            :cell-style="{'text-align':'center', 'padding': '5px 0'}"
+            height="700"
+            style="width: 100%;">
+          <el-table-column
+              prop="time"
+              label="采集时间"
+              width="160">
+          </el-table-column>
+          <el-table-column
+              prop="eartagNo"
+              label="耳标号"
+              width="150">
+          </el-table-column>
+          <el-table-column
+              prop="tail"
+              label="配标时间"
+              width="160">
+          </el-table-column>
+          <el-table-column
+              prop="dayAge"
+              label="佩标日龄">
+          </el-table-column>
+          <el-table-column
+              prop="dayAge2"
+              label="日龄">
+          </el-table-column>
+          <el-table-column
+              label="耳根温度">
+            <template slot-scope="scope">
+              <span>{{scope.row.earTemp}}℃</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+              label="环境温度">
+            <template slot-scope="scope">
+              <span>{{scope.row.envTemp}}℃</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+              prop="exercise"
+              label="运动量">
+          </el-table-column>
+          <el-table-column
+              label="电池电量">
+            <template slot-scope="scope">
+              <span>{{scope.row.bat}}%</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+              prop="rssi"
+              label="信号强度">
+            <template slot-scope="scope">
+              <span>-{{scope.row.rssi}}db</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+              label="阶段">
+            <template slot-scope="scope">
+              <span>{{getStage(scope.row.stage)}}</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+              label="栋舍">
+            <template slot-scope="scope">
+              <span>{{scope.row.version}}{{scope.row.command}}</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+              prop="deviceCode"
+              label="采集器编码"
+              width="150">
+          </el-table-column>
+          <el-table-column label="操作">
+            <template slot-scope="scope">
+              <el-button @click="open(scope.row)">查看</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <table-footer
+            :totals="totalPages"
+            :size="pageSize"
+            @sizeChange="sizeChange"
+            @pageChange="pageChange"></table-footer>
       </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" 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-input v-model="deviceCode" ></el-input>
-        </el-form-item>
-        <el-form-item label="耳标号:">
-          <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 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
-          :header-cell-style="{'text-align':'center', 'background-color': '#F9FAFC', 'padding': '5px 0', 'color': '#666666'}"
-          :cell-style="{'text-align':'center', 'padding': '5px 0'}"
-          height="700"
-          style="width: 100%;">
-        <el-table-column
-            prop="time"
-            label="采集时间"
-            width="160">
-        </el-table-column>
-        <el-table-column
-            prop="eartagNo"
-            label="耳标号"
-            width="150">
-        </el-table-column>
-        <el-table-column
-            prop="tail"
-            label="配标时间"
-            width="160">
-        </el-table-column>
-        <el-table-column
-            prop="dayAge"
-            label="佩标日龄">
-        </el-table-column>
-        <el-table-column
-            prop="dayAge2"
-            label="日龄">
-        </el-table-column>
-        <el-table-column
-            label="耳根温度">
-          <template slot-scope="scope">
-            <span>{{scope.row.earTemp}}℃</span>
-          </template>
-        </el-table-column>
-        <el-table-column
-            label="环境温度">
-          <template slot-scope="scope">
-            <span>{{scope.row.envTemp}}℃</span>
-          </template>
-        </el-table-column>
-        <el-table-column
-            prop="exercise"
-            label="运动量">
-        </el-table-column>
-        <el-table-column
-            label="电池电量">
-          <template slot-scope="scope">
-            <span>{{scope.row.bat}}%</span>
-          </template>
-        </el-table-column>
-        <el-table-column
-            prop="rssi"
-            label="信号强度">
-          <template slot-scope="scope">
-            <span>-{{scope.row.rssi}}db</span>
-          </template>
-        </el-table-column>
-        <el-table-column
-            label="阶段">
-          <template slot-scope="scope">
-            <span>{{getStage(scope.row.stage)}}</span>
-          </template>
-        </el-table-column>
-        <el-table-column
-            label="栋舍">
-          <template slot-scope="scope">
-            <span>{{scope.row.version}}{{scope.row.command}}</span>
-          </template>
-        </el-table-column>
-        <el-table-column
-            prop="deviceCode"
-            label="采集器编码"
-            width="150">
-        </el-table-column>
-        <el-table-column label="操作">
-          <template slot-scope="scope">
-            <el-button @click="open(scope.row)">查看</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-      <table-footer
-          :totals="totalPages"
-          :size="pageSize"
-          @sizeChange="sizeChange"
-          @pageChange="pageChange"></table-footer>
     </div>
   </div>
 </template>
@@ -395,6 +397,8 @@ export default {
   padding: 10px;
 }
 .header_title {
+  position: fixed;
+  width: 1640px;
   height: 40px;
   background-color: #F7F7F7;
   border: 1px solid #ddd;
@@ -402,5 +406,6 @@ export default {
   color: #6FA8C8;
   margin-bottom: 10px;
   padding-left: 20px;
+  z-index: 99;
 }
 </style>

src/views/pastureData/hand.vue

@@ -1,119 +1,121 @@
 <template>
   <div class="band">
     <div class="header_title">存栏走势</div>
-    <div class="box">
-      <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">
+    <div style="padding-top: 60px;">
+      <div class="box">
+        <div class="box_header">
+          <span>母猪存栏统计</span>
+          <div class="right">
             <el-date-picker
-                v-model="startYear"
-                type="year"
-                placeholder="选择年"
-                size="mini"
-                style="width: 100px;"
-                value-format="yyyy">
+                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="endYear"
-                type="year"
-                placeholder="选择年"
-                size="mini"
+                v-model="monthSelected"
+                v-show="daySelected === 2"
+                type="monthrange"
+                range-separator="至"
+                start-placeholder="开始月份"
+                end-placeholder="结束月份"
                 @change="onChange"
-                style="width: 100px;"
-                value-format="yyyy">
+                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="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 class="box_content">
+          <chart-mzcl :mzclList="mzclList"></chart-mzcl>
         </div>
       </div>
-      <div class="box_content">
-        <chart-mzcl :mzclList="mzclList"></chart-mzcl>
-      </div>
-    </div>
-    <div class="box">
-      <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">
+      <div class="box">
+        <div class="box_header">
+          <span>母猪新增-离线走势图</span>
+          <div class="right">
             <el-date-picker
-                v-model="startYear"
-                type="year"
-                placeholder="选择年"
-                size="mini"
-                style="width: 100px;"
-                value-format="yyyy">
+                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="endYear"
-                type="year"
-                placeholder="选择年"
-                size="mini"
+                v-model="monthSelected"
+                v-show="daySelected === 2"
+                type="monthrange"
+                range-separator="至"
+                start-placeholder="开始月份"
+                end-placeholder="结束月份"
                 @change="onChange"
-                style="width: 100px;"
-                value-format="yyyy">
+                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="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 class="box_main">
+          <chart-mzxz :mzxzList="mzxzList"></chart-mzxz>
         </div>
       </div>
-      <div class="box_main">
-        <chart-mzxz :mzxzList="mzxzList"></chart-mzxz>
-      </div>
     </div>
 <!--    <div class="box">-->
 <!--      <div class="box_header">公猪存栏走势</div>-->
@@ -298,6 +300,8 @@ export default {
     border: 1px solid #1abc9c;
   }
   .header_title {
+    position: fixed;
+    width: 1640px;
     height: 40px;
     background-color: #F7F7F7;
     border: 1px solid #ddd;
@@ -305,5 +309,6 @@ export default {
     color: #6FA8C8;
     margin-bottom: 10px;
     padding-left: 20px;
+    z-index: 99;
   }
 </style>

src/views/pastureData/homeComponent/city.vue

@@ -314,6 +314,7 @@ export default {
   justify-content: space-around;
   align-items: center;
   margin-bottom: 10px;
+  padding-top: 40px;
 }
 .box_item {
   width: 198px;
@@ -365,6 +366,7 @@ export default {
   font-size: 16px;
 }
 .header_title {
+  width: 1660px;
   height: 40px;
   background-color: #F7F7F7;
   border: 1px solid #ddd;
@@ -372,7 +374,8 @@ export default {
   color: #6FA8C8;
   margin-bottom: 10px;
   padding-left: 20px;
-  position: relative;
+  position: fixed;
+  z-index: 999;
 }
 .right_float {
   width: 100px;

src/views/pastureData/homeComponent/district.vue

@@ -297,6 +297,7 @@ export default {
   justify-content: space-around;
   align-items: center;
   margin-bottom: 10px;
+  padding-top: 40px;
 }
 .box_item {
   width: 198px;
@@ -348,6 +349,7 @@ export default {
   font-size: 16px;
 }
 .header_title {
+  width: 1660px;
   height: 40px;
   background-color: #F7F7F7;
   border: 1px solid #ddd;
@@ -355,7 +357,8 @@ export default {
   color: #6FA8C8;
   margin-bottom: 10px;
   padding-left: 20px;
-  position: relative;
+  position: fixed;
+  z-index: 999;
 }
 .right_float {
   width: 100px;

src/views/pastureData/homeComponent/farm.vue

@@ -343,6 +343,7 @@ export default {
   justify-content: space-around;
   align-items: center;
   margin-bottom: 10px;
+  padding-top: 40px;
 }
 .box_item {
   width: 198px;
@@ -394,6 +395,8 @@ export default {
   font-size: 16px;
 }
 .header_title {
+  position: fixed;
+  width: 1660px;
   height: 40px;
   background-color: #F7F7F7;
   border: 1px solid #ddd;
@@ -401,7 +404,7 @@ export default {
   color: #6FA8C8;
   margin-bottom: 10px;
   padding-left: 20px;
-  position: relative;
+  z-index: 999;
 }
 .right_float {
   width: 100px;

src/views/pastureData/homeComponent/proinvce.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div style="position: relative">
     <div class="header_title">每日汇总--浙江省</div>
     <div class="box">
       <div class="box_item">
@@ -301,6 +301,7 @@ export default {
   justify-content: space-around;
   align-items: center;
   margin-bottom: 10px;
+  padding-top: 40px;
 }
 .box_item {
   width: 198px;
@@ -352,6 +353,8 @@ export default {
   font-size: 16px;
 }
 .header_title {
+  position: fixed;
+  width: 1640px;
   height: 40px;
   background-color: #F7F7F7;
   border: 1px solid #ddd;
@@ -359,5 +362,6 @@ export default {
   color: #6FA8C8;
   margin-bottom: 10px;
   padding-left: 20px;
+  z-index: 99;
 }
 </style>