统计

src/project/lulong/AppHandSnapshot/Statistics.vue

@@ -19,8 +19,8 @@
       </div>
       <div class="info-content">
         <div class="title">事件办结率</div>
-        <div class="echart-content" id="finish" v-if="finishData.length && finshNum > 0"></div>
-        <div class="num" v-if="finishData.length && finshNum > 0">{{finshNum}}%</div>
+        <div class="echart-content" id="finish" v-if="showFinish"></div>
+        <div class="num" v-if="showFinish">{{finshNum || 0}}%</div>
         <AiEmpty v-else></AiEmpty>
       </div>
 
@@ -57,6 +57,7 @@ export default {
       typeChart: null,
       show: false,
       finishData: [],
+      showFinish: false,
       finshNum: '',
       trendData: [],
       trendDataX: [],
@@ -77,12 +78,9 @@ export default {
   },
   methods: {
     getStatistics() {
-      this.todayList = [], this.finishData = [], this.trendDataX = [], this.trendData = [], this.typeData = []
+      this.todayList = [], this.finishData = [], this.trendDataX = [], this.trendData = [], this.typeData = [], this.showFinish = false
       this.$http.post(`/app/apppatrolreportinfo/countByGirdId?girdId=${this.selectGird.id}&eventStatus=${this.statusInfo.eventStatus}`).then((res) => {
         if (res.code == 0) {
-          this.$nextTick(() => {
-            this.chartInit()
-          })
 
           Object.keys(res.data.allCountMap).forEach((key) => {
             var info = {
@@ -97,12 +95,18 @@ export default {
               name: key,
               value: res.data.finishCountMap[key]
             }
+            if(res.data.finishCountMap[key] > 0) {
+              this.showFinish = true
+            }
             this.finishData.push(info)
           })
           
-          var total = Number(res.data.finishCountMap['累计事件上报'])+Number(res.data.finishCountMap['累计事件办结'])
-          var num = res.data.finishCountMap['累计事件办结']/total
-          this.finshNum = Number(num*100).toFixed(2)
+          if(this.showFinish) {
+            var total = Number(res.data.finishCountMap['累计事件上报'])+Number(res.data.finishCountMap['累计事件办结'])
+            var num = res.data.finishCountMap['累计事件办结']/total
+            this.finshNum = Number(num*100).toFixed(2)
+          }
+          
 
           res.data.dateCountList.map((item) => {
             this.trendData.push(item.ecount)
@@ -118,17 +122,22 @@ export default {
           })
 
           this.$nextTick(() => {
-            this.chartInit()
+            if(this.showFinish) {
+              this.finishChartInit()
+            }
+            if(this.trendData.length) {
+              this.trendChartInit()
+            }
+            if(this.typeData.length) {
+              this.typeChartInit()
+            }
           })
         }
       })
     },
 
-    chartInit() {
+    finishChartInit() {
       this.finishChart = echarts.init(document.getElementById('finish'))
-      this.trendChart = echarts.init(document.getElementById('trend'))
-      this.typeChart = echarts.init(document.getElementById('type'))
-
       var option = {
         tooltip: {
           trigger: 'item'
@@ -141,7 +150,7 @@ export default {
             itemStyle: {
               normal: {
                 color: function (colors) {
-                  var colorList = ['#83B5F7', '#7E94F6', '#85E3D5', '#2891FF'];
+                  var colorList = ['#7E94F6', '#85E3D5', '#2891FF'];
                   return colorList[colors.dataIndex];
                 }
               },
@@ -158,7 +167,10 @@ export default {
         ]
       };
       this.finishChart.setOption(option)
+    },
 
+    trendChartInit() {
+      this.trendChart = echarts.init(document.getElementById('trend'))
       var option2 = {
         grid: {
           left: '5%',
@@ -235,7 +247,10 @@ export default {
         ]
       };
       this.trendChart.setOption(option2)
+    },
 
+    typeChartInit() {
+      this.typeChart = echarts.init(document.getElementById('type'))
       var option3 = {
         tooltip: {
           trigger: 'item'
@@ -273,7 +288,6 @@ export default {
       this.getStatistics()
     },
     handleSelectGird(v) {
-      console.log(v)
       this.selectGird = v || {}
       this.getStatistics()
     }