This commit is contained in:
shijingjing
2022-12-22 15:31:49 +08:00
parent 71f1da9717
commit f2807e77d3
3 changed files with 92 additions and 27 deletions

View File

@@ -16,12 +16,14 @@
<div class="card"> <div class="card">
<div class="item"> <div class="item">
<div class="item_name">居民好友</div> <div class="item_name">单聊会话</div>
<div class="item_num">{{ (235625).toLocaleString('en-US') }}</div> <div class="item_num" v-if="privateCard.length">{{ Number(privateCard.chatCnt).toLocaleString('en-US') }}</div>
<div class="item_num" v-else>0</div>
</div> </div>
<div class="item"> <div class="item">
<div class="item_name">单聊消息</div> <div class="item_name">单聊消息</div>
<div class="item_num">235</div> <div class="item_num" v-if="privateCard.length">{{ Number(privateCard.messageCnt).toLocaleString('en-US') }}</div>
<div class="item_num" v-else>0</div>
</div> </div>
</div> </div>
@@ -36,15 +38,18 @@
<div class="card"> <div class="card">
<div class="item"> <div class="item">
<div class="item_name">活跃群聊</div> <div class="item_name">活跃群聊</div>
<div class="item_num">111</div> <div class="item_num" v-if="groupCard.length">{{ Number(groupCard.chatHasMsg).toLocaleString('en-US') }}</div>
<div class="item_num" v-else>0</div>
</div> </div>
<div class="item"> <div class="item">
<div class="item_name">活跃群成员</div> <div class="item_name">活跃群成员</div>
<div class="item_num">235</div> <div class="item_num" v-if="groupCard.length">{{ Number(groupCard.memberHasMsg).toLocaleString('en-US') }}</div>
<div class="item_num" v-else>0</div>
</div> </div>
<div class="item"> <div class="item">
<div class="item_name">群聊消息</div> <div class="item_name">群聊消息</div>
<div class="item_num">{{ (235625).toLocaleString('en-US') }}</div> <div class="item_num" v-if="groupCard.length">{{ Number(groupCard.msgTotal).toLocaleString('en-US') }}</div>
<div class="item_num" v-else>0</div>
</div> </div>
</div> </div>
@@ -61,9 +66,15 @@ export default {
name: 'message', name: 'message',
data() { data() {
return { return {
privateCard: {},
privateData: [],
groupCard: {},
groupData: [],
} }
}, },
created() {
this.getData()
},
mounted() { mounted() {
this.getEcharts1() this.getEcharts1()
this.getEcharts2() this.getEcharts2()
@@ -72,6 +83,28 @@ export default {
this.getGroupChat() this.getGroupChat()
}, },
methods: { methods: {
getData() {
// 回复率
this.$http.post(`/app/wxgroupstatistic/replyPercentage`).then(res=> {
if(res?.data) {
console.log(res);
}
})
// 单聊统计
this.$http.post('/app/wxgroupstatistic/getUserChatNumber').then(res=> {
if(res?.data) {
this.privateCard = res.data.单聊总和
this.privateData = res.data.条形统计
}
})
// 群聊统计
this.$http.post('/app/wxgroupstatistic/getgroupChatNumber').then(res=> {
if(res?.data) {
this.groupCard = res.data.群聊总和
this.groupData = res.data.条形统计
}
})
},
getEcharts1() { getEcharts1() {
let echarts1 = document.getElementById('echarts1'); let echarts1 = document.getElementById('echarts1');
let myChart = echarts.init(echarts1); let myChart = echarts.init(echarts1);

View File

@@ -19,7 +19,8 @@
<div class="ageDistribution"> <div class="ageDistribution">
<h3>年龄分布</h3> <h3>年龄分布</h3>
<div class="ageBox"> <div class="ageBox">
<div id="ageEcharts"></div> <div id="ageEcharts" v-if="ageFlag"></div>
<AiEmpty style="padding-top: 10px;" description="暂无数据" v-else></AiEmpty>
</div> </div>
</div> </div>
<!-- 男女比例 --> <!-- 男女比例 -->
@@ -44,6 +45,7 @@ export default {
specialPeople: {}, specialPeople: {},
specialFlag: true, specialFlag: true,
ageArray: [], ageArray: [],
ageFlag: true,
sexArray: [], sexArray: [],
sexFlag: true, sexFlag: true,
cardArray: ['居民总数','本地居民','流动人口'] cardArray: ['居民总数','本地居民','流动人口']
@@ -68,8 +70,10 @@ export default {
this.specialFlag = false this.specialFlag = false
} }
} }
this.ageArray = res.data.年龄层次 this.ageArray = res.data.年龄层次.map(v=> v.v2)
this.aexArray = res.data.男女比例 this.ageFlag = !this.ageArray.every(e=> e==0)
this.sexArray = res.data.男女比例.map(v=> v.v2)
this.sexFlag = !this.sexArray.every(e=> e==0)
} }
}) })
}, },
@@ -159,16 +163,15 @@ export default {
}, },
series: [ series: [
{ {
data: [136, 195, 162, 138, { data: this.ageArray,
value: 98,
itemStyle: {
color: '#F3A963'
}
}],
type: 'bar', type: 'bar',
itemStyle: { itemStyle: {
normal: { normal: {
color: "#3975C6", // 每个柱子的颜色
color: function(params) {
var colorList = ['#3975C6','#3975C6', '#3975C6', '#3975C6', '#F3A963',];
return colorList[params.dataIndex]
},
label: { label: {
show: true, //开启显示 show: true, //开启显示
position: 'top', //在上方显示 position: 'top', //在上方显示

View File

@@ -7,20 +7,24 @@
<div class="card"> <div class="card">
<div class="item"> <div class="item">
<div class="item_name">居民好友</div> <div class="item_name">居民好友</div>
<div class="item_num">{{ (235625).toLocaleString('en-US') }}</div> <div class="item_num">{{ Number(friendsCard.customerTotal).toLocaleString('en-US') }}</div>
</div> </div>
<div class="item"> <div class="item">
<div class="item_name">昨日新增</div> <div class="item_name">昨日新增</div>
<div class="item_num">235 <img src="../img/up.png" alt="" class="imgs"></div> <div class="item_num">{{ Number(friendsCard.addCustomerCount).toLocaleString('en-US') }}
<img src="../img/up.png" alt="" class="imgs" v-show="friendsCard.addCustomerCount != 0">
</div>
</div> </div>
<div class="item"> <div class="item">
<div class="item_name">昨日流失</div> <div class="item_name">昨日流失</div>
<div class="item_num">18 <img src="../img/down.png" alt="" class="imgs"></div> <div class="item_num">{{ Number(friendsCard.removeCustomerCount).toLocaleString('en-US') }}
<img src="../img/down.png" alt="" class="imgs" v-show="friendsCard.removeCustomerCount !=0"></div>
</div> </div>
</div> </div>
<div class="friends_box"> <div class="friends_box">
<div id="friends"></div> <div id="friends" v-if="friendsData.length"></div>
<AiEmpty style="padding-top: 10px;" description="暂无数据" v-else></AiEmpty>
</div> </div>
<div class="head"> <div class="head">
@@ -30,24 +34,27 @@
<div class="card"> <div class="card">
<div class="item"> <div class="item">
<div class="item_name">居民群</div> <div class="item_name">居民群</div>
<div class="item_num">{{ (5230).toLocaleString('en-US') }}</div> <div class="item_num">{{ Number(groupsCard.groupSum).toLocaleString('en-US') }}</div>
</div> </div>
<div class="item"> <div class="item">
<div class="item_name">群成员</div> <div class="item_name">群成员</div>
<div class="item_num">235</div> <div class="item_num">{{ Number(groupsCard.totalSum).toLocaleString('en-US') }}</div>
</div> </div>
<div class="item"> <div class="item">
<div class="item_name">昨日新增</div> <div class="item_name">昨日新增</div>
<div class="item_num">18 <img src="../img/up.png" alt="" class="imgs"></div> <div class="item_num">{{ Number(groupsCard.increaseSum).toLocaleString('en-US') }}
<img src="../img/up.png" alt="" class="imgs" v-show="groupsCard.increaseSum"></div>
</div> </div>
<div class="item"> <div class="item">
<div class="item_name">昨日流失</div> <div class="item_name">昨日流失</div>
<div class="item_num">18 <img src="../img/down.png" alt="" class="imgs"></div> <div class="item_num">{{ Number(groupsCard.decreaseSum).toLocaleString('en-US') }}
<img src="../img/down.png" alt="" class="imgs" v-show="groupsCard.decreaseSum"></div>
</div> </div>
</div> </div>
<div class="groups_box"> <div class="groups_box">
<div id="groups"></div> <div id="groups" v-if="groupsData.length"></div>
<AiEmpty style="padding-top: 10px;" description="暂无数据" v-else></AiEmpty>
</div> </div>
</div> </div>
</template> </template>
@@ -58,14 +65,36 @@ export default {
name: "wechat", name: "wechat",
data() { data() {
return { return {
friendsCard: {},
friendsData: [],
groupsCard: {},
groupsData: [],
} }
}, },
created() {
this.getData()
},
mounted() { mounted() {
this.getFriendsEcharts() this.getFriendsEcharts()
this.getGroupsEcharts() this.getGroupsEcharts()
}, },
methods: { methods: {
getData() {
// 居民好友
this.$http.post(`/app/wxgroupstatistic/getCustommerNumber`).then(res=> {
if(res?.data) {
this.friendsCard = res.data.居民统计
this.friendsData = res.data.居民好友数
}
})
// 居民群
this.$http.post(`/app/wxgroupstatistic/getGroupNumber`).then(res=> {
if(res?.data) {
this.groupsCard = res.data.居民群统计
this.groupsData = res.data.群成员数
}
})
},
getFriendsEcharts() { getFriendsEcharts() {
let friendsDom = document.getElementById('friends'); let friendsDom = document.getElementById('friends');
let myChart = echarts.init(friendsDom); let myChart = echarts.init(friendsDom);