拉取前

src/assets/css/index.css

@@ -525,7 +525,8 @@ p {
     position: absolute;
     top: .62rem;
     right: 10px;
-    z-index: 11111111
+    z-index: 11111111;
+    text-align: right;
 }
 
 .filterSec select,

src/views/home/components/lineChart.vue

@@ -48,7 +48,7 @@ export default {
             color: "#fff",
           },
 
-          left: "30%",
+          left: "10%",
           top: 0,
         },
         grid: {

src/views/home/components/pieChart.vue

@@ -1,5 +1,5 @@
 <template>
-  <div ref="pieChart" style="width: 100%; height: 100%"></div>
+  <div ref="pieChart" style="width: 100%; height: 100%;padding-top:.375rem"></div>
 </template>
 <script>
 import * as echarts from "echarts";
@@ -56,7 +56,9 @@ export default {
       });
 
       option = {
-        grid: {},
+        grid: {
+        
+        },
 
         title: [
           {

src/views/home/index.vue

@@ -28,11 +28,19 @@
         </div>
         <div class="column">
           <div class="panel deviceSum">
-            <div class="filterSec">
-              <select name="" id="">
+            <div class="filterSec" style="top:.7rem">
+              <!-- <select name="" id="">
                 <option value="3">日</option>
                 <option value="4">月</option>
-              </select>
+              </select> -->
+              <el-date-picker
+                v-model="dDefaultTime"
+                type="datetimerange"
+                range-separator="~"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+              >
+              </el-date-picker>
             </div>
             <pie-chart
               :fdeviceTypeCount="deviceTypeCount"
@@ -74,12 +82,14 @@
                 <option value="22">月</option>
               </select> -->
               <el-date-picker
-      v-model="value1"
-      type="datetimerange"
-      range-separator="~"
-      start-placeholder="开始日期"
-      end-placeholder="结束日期">
-    </el-date-picker>
+                v-model="fDefaultTime"
+                type="datetimerange"
+                range-separator="~"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+                 @change="trendIcoCount_api()"
+              >
+              </el-date-picker>
             </div>
             <line-chart
               :ftrendIcoCount="trendIcoCount"
@@ -111,7 +121,6 @@ import api from "../../api/home/home.js";
 export default {
   name: "index",
   components: {
-   
     statisTop,
     statisBottom,
     pieChart,
@@ -122,7 +131,14 @@ export default {
   },
   data() {
     return {
-       value1:[new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],
+      fDefaultTime: [
+       '2021-6-12 00:00:00',
+        '2021-7-12 00:00:00',
+      ],
+      dDefaultTime: [
+        new Date(2000, 10, 10, 10, 10),
+        new Date(2000, 10, 11, 10, 10),
+      ],
       map: null,
       alarmCount: {},
       personalCount: {},
@@ -134,7 +150,6 @@ export default {
   },
   created() {},
   mounted() {
-    
     this.alarmCount_api();
     this.personalCount_api();
     this.siteCount_api();
@@ -177,10 +192,13 @@ export default {
     },
     //故障抢修echarts折线图
     trendIcoCount_api() {
+      
       api
         .trendIco_api({
-          startTime: "2021-6-12 00:00:00",
-          endTime: "2021-7-16 00:00:00",
+          // startTime: "2021-6-12 00:00:00",
+          // endTime: "2021-7-16 00:00:00",
+          startTime: this.fDefaultTime[0],
+          endTime: this.fDefaultTime[1],
         })
         .then((requset) => {
           this.trendIcoCount = requset.data;
@@ -249,7 +267,7 @@ export default {
                   </div>
                  
                 </div>`;
-      var dataList =this.siteList;
+      var dataList = this.siteList;
 
       dataList.forEach(function (item) {
         let conNew = con;
@@ -274,7 +292,6 @@ export default {
           },
         });
         marker.on("click", async () => {
-          
           // console.log([val.latitude, val.longitude], null, val);
           await this.addMarkerInfo(
             [val.longitude, val.latitude],
@@ -387,8 +404,22 @@ export default {
   background: #fff;
 }
 
-
-
-
-
+// 时间选择器样式
+.filterSec .el-input__inner {
+  // width: 5.25rem !important;
+  width: 90%;
+  height: 0.375rem !important;
+  line-height: 0.375rem !important;
+  background-color: rgba(3, 107, 119, 0.5);
+  border: 1px solid rgba(3, 107, 119, 1);
+  z-index: 199;
+}
+.filterSec .el-range-input {
+  background-color: transparent;
+  color: #fff;
+}
+.filterSec .el-range-separator {
+  line-height: 0.25rem;
+  color: #fff;
+}
 </style>