bug fixed

src/pages/index/components/berths_usage.vue

@@ -170,9 +170,7 @@ export default {
       total: 0,
       pageSize: 10,
       pageNum: 1,
-      radio: '2',
       dialogVisible: false,
-      selRow: {},
       formInline: {
         regionCode: '',
         keyAreas: '',

src/pages/index/components/parking_area.vue

@@ -1,5 +1,15 @@
 <template>
   <div class="body-wrapper">
+    <el-form class="form-wrapper" :inline="true" :model="formInline">
+      <el-form-item label="行政区">
+        <el-select clearable v-model="formInline.regionCode" placeholder="请选择" popper-class="cur-select">
+          <el-option v-for="item in districtOptions"  :key="item.label" :label="item.label" :value="item.value"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" @click="queryAll">查询</el-button>
+      </el-form-item>
+    </el-form>
     <div style="display: flex; justify-content: space-between;">
       <div style="width: 50%; height: 300px">
         <div align="center" style="color: white">区域饱和度</div>
@@ -52,6 +62,7 @@ import barchart from "@/components/barChart";
 import * as echarts from 'echarts';
 import * as geoJson from '../../../util/411100.json';
 import api from '@/api/article_z'
+import options from '@/util/options'
 
 
 export default {
@@ -61,6 +72,10 @@ export default {
   },
   data() {
     return {
+      formInline: {
+        regionCode: ''
+      },
+      districtOptions: options.districtOptions,
       option: {
         backgroundColor: '#0c0c0c',
         visualMap: {
@@ -109,37 +124,24 @@ export default {
     }
   },
   mounted() {
-    this.getBarData()
-    this.getLineData()
-    api.queryParkingArea_Tcrdskfb({}).then(res => {
-      let data = res.data || []
-      let areaData = [];
-      data.map(item => { //扩大热力图效果
-        areaData.push(...new Array(3).fill(item))
-      })
-      let mapMax = Math.max(...data.map(item => item[2]))
-      let mapMin = Math.min(...data.map(item => item[2]))
-      let chart = echarts.init(document.getElementById("map"));
-      echarts.registerMap("luohe", geoJson);
-
-      // echarts.registerMap('china', china)
-      this.option.series[0].data = areaData;
-      this.option.visualMap.min = mapMin;
-      this.option.visualMap.max = mapMax;
-      chart.setOption(this.option);
-    })
+    this.queryAll()
   },
   watch: {
 
   },
   methods: {
+    queryAll() {
+      this.getBarData()
+      this.getLineData()
+      this.getMapData()
+    },
     getBarData() {
-      api.queryParkingArea_qybhd({}).then(res => {
+      api.queryParkingArea_qybhd({...this.formInline}).then(res => {
         this.bardata = res.data || []
       })
     },
     getLineData() {
-      api.queryParkingArea_bhdsdfx({}).then(res => {
+      api.queryParkingArea_bhdsdfx({...this.formInline}).then(res => {
         this.linedata = res.data || []
       })
     },
@@ -164,6 +166,25 @@ export default {
       // ${params[0].name || "--"}月：
       return `<div class="${type==='bar' ? 'bar-tooltip-dz' : type==='line' ? 'line-tooltip-dz' : ''}">${params[0].seriesName}:${data.hs || "--"}%</div>`;
     },
+    getMapData() {
+      api.queryParkingArea_Tcrdskfb({...this.formInline}).then(res => {
+        let data = res.data || []
+        let areaData = [];
+        data.map(item => { //扩大热力图效果
+          areaData.push(...new Array(3).fill(item))
+        })
+        let mapMax = Math.max(...data.map(item => item[2]))
+        let mapMin = Math.min(...data.map(item => item[2]))
+        let chart = echarts.init(document.getElementById("map"));
+        echarts.registerMap("luohe", geoJson);
+
+        // echarts.registerMap('china', china)
+        this.option.series[0].data = areaData;
+        this.option.visualMap.min = mapMin;
+        this.option.visualMap.max = mapMax;
+        chart.setOption(this.option);
+      })
+    }
   }
 }
 </script>
@@ -181,4 +202,45 @@ export default {
     height: 100%;
     width: 100%;
   }
+  /deep/ .el-input__inner {
+    background: #2d3744;
+    border: none;
+    border-radius: 0;
+  }
+  /deep/ .el-select {
+
+    /* 下面设置右侧按钮居中 */
+    .el-input__suffix {
+      top: 0px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      flex-wrap: nowrap;
+      flex-direction: row;
+      align-content: flex-start;
+    }
+    /* 输入框加上上下边是 32px + 2px =34px */
+    .el-input__icon {
+      line-height: 0px;
+    }
+  }
+  .body-wrapper {
+    .button-block{
+      text-align: right;
+      margin-bottom: 20px;
+    }
+
+  }
+  .audit-dialog{
+    .mg-bt{
+      margin-bottom: 24px;
+    }
+    .label{
+      text-align: right;
+    }
+  }
+  /deep/ .el-textarea.is-disabled .el-textarea__inner {
+    background: #2a2a2a;
+    color: #fff;
+  }
 </style>