巡查

src/project/lulong/AppHandSnapshot/Statistics.vue

@@ -9,7 +9,7 @@
     </AiTopFixed>
     <div class="statstics-content">
       <div class="info-content">
-        <div class="title">今日概况</div>
+        <div class="title">概况总览</div>
         <div class="el-row">
           <div class="item" v-for="(item, index) in todayList" :key="index">
             <h2>{{item.value}}</h2>
@@ -20,20 +20,23 @@
       <div class="info-content">
         <div class="title">事件办结率</div>
         <div class="echart-content" id="finish"></div>
-        <div class="num">98.26%</div>
+        <div class="num" v-if="finishData">{{finshNum}}%</div>
+        <AiEmpty v-else></AiEmpty>
       </div>
 
       <div class="info-content">
         <div class="title">巡查上报趋势图</div>
         <div class="echart-content" id="trend"></div>
+        <AiEmpty v-if="!trendData.length"></AiEmpty>
       </div>
 
       <div class="info-content">
         <div class="title">巡查事件分类
-          <div class="type-select" :style="groupInfo.groupName ? '' : 'color:#999;'" @click="show=true">{{groupInfo.groupName || '请选择'}}<u-icon name="arrow-right"></u-icon></div>
-          <u-select v-model="show" :list="typeList" value-name="id" label-name="groupName" @confirm="selectStatus"></u-select>
+          <div class="type-select" :style="statusInfo.name ? '' : 'color:#999;'" @click="show=true">{{statusInfo.name || '请选择'}}<u-icon name="arrow-right"></u-icon></div>
+          <u-select v-model="show" :list="$dict.getDict('clapEventStatusHistory')" value-name="dictValue" label-name="dictName" @confirm="selectStatus"></u-select>
         </div>
         <div class="echart-content" id="type"></div>
+        <AiEmpty v-if="!typeData.length"></AiEmpty>
       </div>
       <div class="pad-b120"></div>
     </div>
@@ -48,18 +51,17 @@ export default {
   data() {
     return {
       todayList: [],
-      info: {},
-      pageShow: false,
-      showSelect: false,
-      myGirdList: [],
-      girdName: '全部网格',
-      selectGird: {},
+      selectGird: {girdId: '', girdName: ''},
       finishChart: null,
       trendChart: null,
       typeChart: null,
-      typeList: [],
       show: false,
-      groupInfo: {groupId: '', groupName: ''}
+      finishData: [],
+      finshNum: '',
+      trendData: [],
+      trendDataX: [],
+      typeData: [],
+      statusInfo: {name: '', eventStatus: ''}
     }
   },
   computed: {
@@ -67,45 +69,56 @@ export default {
   },
   
   mounted() {
-    this.selectGird.girdName = this.user.girdName
-    this.selectGird.girdId = this.user.girdId
-    this.getStatistics()
-    this.getTypeList()
+    // this.selectGird.girdName = this.user.girdName
+    // this.selectGird.girdId = this.user.girdId
+    this.$dict.load('clapEventStatusHistory').then(() => {
+      this.getStatistics()
+    })
   },
   methods: {
     getStatistics() {
-      this.$http.post('/app/appresidentreportinfo/countByGirdMember').then((res) => {
+      this.todayList = [], this.finishData = [], this.trendDataX = [], this.trendData = [], this.typeData = []
+      this.$http.post(`/app/apppatrolreportinfo/countByGirdId?girdId=${this.selectGird.girdId}&eventStatus=${this.statusInfo.eventStatus}`).then((res) => {
         if (res.code == 0) {
           this.$nextTick(() => {
             this.chartInit()
           })
-          // if(res.data.businessCountMap['受理率']) {
-          //   res.data.businessCountMap['受理率'] = Number(res.data.businessCountMap['受理率'] * 100).toFixed(1)
-          // }
-          // if(res.data.businessCountMap['办结率']) {
-          //   res.data.businessCountMap['办结率'] = Number(res.data.businessCountMap['办结率'] * 100).toFixed(1)
-          // }
-          // this.info = res.data
 
-          // Object.keys(res.data.todayCountMap).forEach((key) => {
-          //   var info = {
-          //     label: key,
-          //     value: res.data.todayCountMap[key]
-          //   }
-          //   this.todayList.push(info)
-          // })
-          // if(this.info.groupList.length) {
-          //   this.info.groupList.map((item, index) => {
-          //     if(item.finishNum) {
-          //       item.percentage = (item.finishNum/item.totalNum).toFixed(2)
-          //     }else {
-          //       item.percentage = 0
-          //     }
-          //     item.width = 56-(index*10)
-          //   })
-          // }
+          Object.keys(res.data.allCountMap).forEach((key) => {
+            var info = {
+              label: key,
+              value: res.data.allCountMap[key]
+            }
+            this.todayList.push(info)
+          })
+
+          Object.keys(res.data.finishCountMap).forEach((key) => {
+            var info = {
+              name: key,
+              value: res.data.finishCountMap[key]
+            }
+            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)
+
+          res.data.dateCountList.map((item) => {
+            this.trendData.push(item.ecount)
+            this.trendDataX.push(item.ymd)
+          })
+
+          res.data.groupList.map((item) => {
+            var info = {
+              name: item.groupName,
+              value: item.totalNum
+            }
+            this.typeData.push(info)
+          })
+
+          this.chartInit()
         }
-        this.pageShow = true
       })
     },
 
@@ -131,12 +144,7 @@ export default {
                 }
               },
             },
-            data: [
-              { value: 100, name: '吸毒人员100' },
-              { value: 150, name: '高龄老人150' },
-              { value: 80, name: '刑满释放人员80' },
-              { value: 84, name: '退伍军人84' },
-            ],
+            data: this.finishData,
             emphasis: {
               itemStyle: {
                 shadowBlur: 10,
@@ -171,7 +179,7 @@ export default {
               color: '#666',
             },
           },
-          data: ['4月', '5月', '6月', '7月', '8月',]
+          data: this.trendDataX
         },
         yAxis: {
           axisLine:{       //y轴
@@ -194,7 +202,7 @@ export default {
         },
         series: [
           {
-            data: [155, 130, 120, 160, 120, 130, 110],
+            data: this.trendData,
             type: 'line',
             areaStyle: {//覆盖区域的渐变色
             	normal: {
@@ -244,10 +252,7 @@ export default {
                 }
               },
             },
-            data: [
-              { value: 100, name: '男100' },
-              { value: 100, name: '女100' },
-            ],
+            data: this.typeData,
             emphasis: {
               itemStyle: {
                 shadowBlur: 10,
@@ -261,23 +266,10 @@ export default {
       this.typeChart.setOption(option3)
     },
 
-    getTypeList() {
-      this.$http.post(`/app/apppatrolreportgroup/list`, null, {
-        params: {
-          size: 9999,
-        },
-      })
-      .then((res) => {
-        if (res.code == 0) {
-          this.typeList = res.data.records
-          this.$forceUpdate()
-        }
-      })
-    },
-
     selectStatus(e) {
-      this.groupInfo.groupName = e[0].label
-      this.groupInfo.groupId = e[0].value
+      this.statusInfo.name = e[0].label
+      this.statusInfo.eventStatus = e[0].value
+      this.getStatistics()
     },
   },
 }
@@ -311,6 +303,7 @@ export default {
     border-radius: 16px;
     margin-bottom: 24px;
     position: relative;
+    padding-bottom: 32px;
     .title{
       font-size: 32px;
       font-family: PingFangSC-Regular, PingFang SC;
@@ -357,12 +350,12 @@ export default {
     }
     .echart-content {
       width: 100%;
-      height: 600px;
+      height: 500px;
     }
     .num {
       position: absolute;
       left: 50%;
-      top: 364px;
+      top: 320px;
       margin-left: -100px;
       font-size: 40px;
       font-weight: 600;