会话统计

src/project/saas/AppDataStatistics/components/message.vue

@@ -15,12 +15,12 @@
     </div>
 
     <div class="card">
-      <div class="item" :class="privateCurrent == 0? 'active':''" @click="privateCurrent = 0">
+      <div class="item" :class="privateCurrent == 0? 'active':''" @click="privateCurrent = 0,getPrivateData()">
         <div class="item_name">单聊会话</div>
         <div class="item_num" v-if="privateCard">{{ Number(privateCard.chatCnt).toLocaleString('en-US') }}</div>
         <div class="item_num" v-else>0</div>
       </div>
-      <div class="item" :class="privateCurrent == 1? 'active':''" @click="privateCurrent = 1">
+      <div class="item" :class="privateCurrent == 1? 'active':''" @click="privateCurrent = 1,getPrivateData()">
         <div class="item_name">单聊消息</div>
         <div class="item_num" v-if="privateCard">{{ Number(privateCard.messageCnt).toLocaleString('en-US') }}</div>
         <div class="item_num" v-else>0</div>
@@ -28,8 +28,8 @@
     </div>
 
     <div class="privateChat_box">
-      <div id="privateChat"></div>
+      <div id="privateChat" v-if="privateData.length"></div>
-      <!-- <AiEmpty style="padding-top: 10px;" description="暂无数据" v-else></AiEmpty> -->
+      <AiEmpty style="padding-top: 10px;" description="暂无数据" v-else></AiEmpty>
     </div>
 
     <div class="head">
@@ -37,17 +37,17 @@
     </div>
 
     <div class="card">
-      <div class="item" :class="groupCurrent == 0? 'active':''" @click="groupCurrent = 0">
+      <div class="item" :class="groupCurrent == 0? 'active':''" @click="groupCurrent = 0,getGroupData()">
         <div class="item_name">活跃群聊</div>
         <div class="item_num" v-if="groupCard">{{ Number(groupCard.chatHasMsg).toLocaleString('en-US') }}</div>
         <div class="item_num" v-else>0</div>
       </div>
-      <div class="item" :class="groupCurrent == 1? 'active':''" @click="groupCurrent = 1">
+      <div class="item" :class="groupCurrent == 1? 'active':''" @click="groupCurrent = 1,getGroupData()">
         <div class="item_name">活跃群成员</div>
         <div class="item_num" v-if="groupCard">{{ Number(groupCard.memberHasMsg).toLocaleString('en-US') }}</div>
         <div class="item_num" v-else>0</div>
       </div>
-      <div class="item" :class="groupCurrent == 2? 'active':''" @click="groupCurrent = 2">
+      <div class="item" :class="groupCurrent == 2? 'active':''" @click="groupCurrent = 2,getGroupData()">
         <div class="item_name">群聊消息</div>
         <div class="item_num" v-if="groupCard">{{ Number(groupCard.msgTotal).toLocaleString('en-US') }}</div>
         <div class="item_num" v-else>0</div>
@@ -55,8 +55,8 @@
     </div>
 
     <div class="groupChat_box">
-      <div id="groupChat"></div>
+      <div id="groupChat" v-if="groupData.length"></div>
-      <!-- <AiEmpty style="padding-top: 10px;" description="暂无数据" v-else></AiEmpty> -->
+      <AiEmpty style="padding-top: 10px;" description="暂无数据" v-else></AiEmpty>
     </div>
 
   </div>
@@ -98,22 +98,39 @@ export default {
           console.log(res);
         }
       })
+      this.getPrivateData()
+      this.getGroupData()
+    },
+    getPrivateData() {
       // 单聊统计
       this.$http.post('/app/wxgroupstatistic/getUserChatNumber').then(res=> {
         if(res?.data) {
           this.privateCard = res.data.单聊总和
           this.privateData = res.data.条形统计
-          this.privateDate = this.privateData.map(v=> v.dateDay)
+          this.privateDate = this.privateData?.map(v=> v.dateDay)
-          this.privateMsg = this.privateData.map(v=> v.memberHasMsg)
+          if(this.privateCurrent == 0) {
+            this.privateMsg = this.privateData?.map(v=> v.chatCnt)
+          } else if(this.privateCurrent == 1) {
+            this.privateMsg = this.privateData?.map(v=> v.messageCnt)
+          }
+          
         }
       })
+    },
+    getGroupData() {
       // 群聊统计
       this.$http.post('/app/wxgroupstatistic/getgroupChatNumber').then(res=> {
         if(res?.data) {
           this.groupCard = res.data.群聊总和
           this.groupData = res.data.条形统计
-          this.groupDate = this.groupData.map(v=> v.dateDay)
+          this.groupDate = this.groupData?.map(v=> v.dateDay)
-          this.groupMsg = this.groupData.map(v=>v.chatHasMsg)
+          if(this.groupCurrent == 0) {
+            this.groupMsg = this.groupData?.map(v=>v.chatHasMsg)
+          } else if(this.groupCurrent ==1) {
+            this.groupMsg = this.groupData?.map(v=>v.memberHasMsg)
+          } else if(this.groupCurrent == 2) {
+            this.groupMsg = this.groupData?.map(v=>v.msgTotal)
+          }
         }
       })
     },
@@ -270,7 +287,7 @@ export default {
         },
         xAxis: {
           type: 'category',
-          data: ['1月', '2月', '3月', '4月', '5月'],
+          data: this.privateDate,
           axisTick: {
             show: false,
           }
@@ -286,7 +303,7 @@ export default {
         },
         series: [
           {
-            data: [350, 230, 224, 218, 135],
+            data: this.privateMsg,
             type: 'line',
             lineStyle: {
               color: '#3975C6', // 折线线条颜色
@@ -328,7 +345,7 @@ export default {
         },
         xAxis: {
           type: 'category',
-          data: ['1月', '2月', '3月', '4月', '5月'],
+          data: this.groupDate,
           axisTick: {
             show: false,
           }
@@ -344,7 +361,7 @@ export default {
         },
         series: [
           {
-            data: [350, 230, 224, 218, 135],
+            data: this.groupMsg,
             type: 'line',
             lineStyle: {
               color: '#3975C6', // 折线线条颜色
@@ -395,17 +412,18 @@ export default {
   }
 
   .card {
-    
+    padding: 8px;
+    box-sizing: border-box;
     display: flex;
     text-align: center;
     align-items: center;
     background: #FFF;
-    border-radius: 16px;
+    border-radius: 16px 16px 0 0;
     margin-top: 24px;
 
     .item {
       flex: 1;
-      padding: 24px 0;
+      padding: 16px 0;
       box-sizing: border-box;
 
       .item_name {
@@ -424,14 +442,13 @@ export default {
       }
     }
     .active {
-      border: 2px solid #3975C6;
+      background: #EBF1F9;
       border-radius: 16px;
     }
   }
 
   .privateChat_box,
   .groupChat_box {
-    margin-top: 24px;
     width: 100%;
     height: 514px;
     background: #FFF;

src/project/saas/AppDataStatistics/components/resident.vue

@@ -243,8 +243,8 @@ export default {
               maxSurfaceAngle: 80
             },
             data: [
-              { value: this.sexArray[1].v2, name: '男' },
+              { value: this.sexArray[1]?.v2, name: '男' },
-              { value: this.sexArray[0].v2, name: '女' },
+              { value: this.sexArray[0]?.v2, name: '女' },
             ]
           }
         ]