This commit is contained in:
yanran200730
2023-04-28 13:47:35 +08:00
parent f346e8289f
commit de3e4ef259
2 changed files with 98 additions and 21 deletions

View File

@@ -91,11 +91,11 @@
<div class="right wrapper">
<div class="AppQxnDv-title">
<h2>群标签情况</h2>
<el-select v-model="value" style="width: 92px" size="mini" placeholder="专属">
<!-- <el-select v-model="value" style="width: 92px" size="mini" placeholder="专属">
<el-option label="XXX派出所" value="1"></el-option>
<el-option label="XXX派出所" value="2"></el-option>
<el-option label="XXX派出所" value="3"></el-option>
</el-select>
</el-select> -->
</div>
<ai-echart-v2
style="height: 220px; width: 100%; margin-top: 10px;"
@@ -122,7 +122,7 @@
<h2>群人数规模分布</h2>
</div>
<ai-echart-v2
style="height: 180px; width: 100%; margin-top: 20px;"
style="height: 160px; width: 100%; margin-top: 20px;"
:ref="'chart2'"
:data="qrsGmData"
:ops="pieChart">
@@ -205,8 +205,8 @@
<h2>日均活跃率</h2>
</div>
<DoughnutChart
:ratio="'61'"
:value="[{key: '活跃成员', value: '6005'}, {key: '激活成员', value: '9789'}]">
:ratio="rjhyRate"
:value="rjhyData">
</DoughnutChart>
</div>
</div>
@@ -217,8 +217,8 @@
<ai-echart-v2
style="height: 236px; width: 100%;"
:ref="'chart'"
:data="lineData"
:ops="lineChart1">
:data="cyfbData"
:ops="lineChart2">
</ai-echart-v2>
</div>
</AiDvPanel>
@@ -428,6 +428,61 @@
}
})
},
lineChart2: {
legend: {
show: false
},
grid: {
left: '0%',
right: '0%',
bottom: '0%',
top: '35px',
containLabel: true
},
tooltip: {
trigger: 'axis',
backgroundColor: 'rgba(0, 102, 154, 0.65)',
borderColor: 'rgba(0, 102, 154, 0.65)',
textStyle: { color: '#fff' },
axisPointer: { type: 'cross' }
},
color: ['#33CCCC', '#33CCCC'],
xAxis: {
type: "category",
axisTick: {show: false},
axisLine: { lineStyle: { color: 'rgba(179, 223, 255, 0.4)' } },
axisLabel: {color: '#8FABBF', fontSize: 12},
},
yAxis: {
nameGap: 23,
minInterval: 1,
splitLine: { lineStyle: { color: 'rgba(108, 128, 151, 0.3)', type: 'dashed' } },
axisLabel: {color: '#8FABBF', fontSize: 12},
axisPointer: { snap: true }
},
daemon: (color) => ({
showSymbol: false,
smooth: true,
lineStyle: {
shadowBlur: 4,
shadowOffsetY: 2,
width: 2
},
areaStyle: {
color: {
type: 'linear',
x: 0,
x2: 0,
y: 0,
y2: 1,
colorStops: [
{ offset: 0, color: this.Hex2RGBA(color, 0.3) },
{ offset: 1, color: this.Hex2RGBA(color, 0.1) }
]
}
}
})
},
barChart8: {
legend: {
textStyle: {
@@ -569,9 +624,9 @@
show: false
},
grid: {
left: '6%',
left: '0%',
top: '6%',
right: '6%',
right: '0%',
bottom: '6%'
},
yAxis: {
@@ -598,7 +653,7 @@
normal: {
textStyle: {
color: '#9BB7D4',
fontSize: 14
fontSize: 10
}
}
}
@@ -629,12 +684,24 @@
},
computed: {
rjhyData () {
return [{key: '活跃成员', value: (this.cyActivityInfo['活跃成员总数(7日)'] / 7).toFixed(0)}, {key: '激活成员', value: this.cyActivityInfo['已激活']}]
},
rjhyRate () {
if (!this.cyActivityInfo['已激活']) {
return 0
}
return Number((((this.cyActivityInfo['活跃成员总数(7日)'] / 7).toFixed(0) / (this.cyActivityInfo['已激活'] + this.cyActivityInfo['未激活'])) * 100).toFixed(2))
},
qbqlData () {
return [{key: '活跃成员', value: 6006}, {key: '激活成员', value: 9789}]
return [{key: '已打标签', value: 2938}, {key: '未打标签', value: 2283}]
},
qbqRate () {
return 61
return 26.27
if (!this.cyActivityInfo['已激活']) {
return 0
}
@@ -642,11 +709,11 @@
return Number(((this.cyActivityInfo['已激活'] / (this.cyActivityInfo['已激活'] + this.cyActivityInfo['未激活'])) * 100).toFixed(2))
},
fglData () {
return [{key: '已激活成员', value: 9789}, {key: '未激活成员', value: 6}]
return [{key: '已关联人数', value: 726079}, {key: '地区户籍数', value: 3015112}]
},
fglRate () {
return 99.93
return 24.08
if (!this.cyActivityInfo['已激活']) {
return 0
}
@@ -690,6 +757,19 @@
return Number(((this.wxGroupOverview['活跃群成员数量(7天)'] / (this.wxGroupOverview['群成员数量'])) * 100).toFixed(2))
},
cyfbData () {
if (!this.cyActivityInfo['成员使用分布']) {
return []
}
return this.cyActivityInfo['成员使用分布'].map(v => {
return {
'日期': v['日期'],
'活跃用户数': v['活跃用户数']
}
})
},
barChartData () {
if (!this.wxGroupOverview['各单位群主及群分布']) {
return []
@@ -697,7 +777,7 @@
return this.wxGroupOverview['各单位群主及群分布'].map(v => {
return {
name: v['网格名称'],
'name': v['网格名称'],
'群主数量': v['群主数量'],
'群数量': v['群数量']
}

View File

@@ -9,7 +9,7 @@
<div class="DoughnutChart-explain">
<div class="item" v-for="(item, index) in value" :key="index">
<i></i>
<span>{{ item.key }}</span>
<span :style="labelStyle">{{ item.key }}</span>
<p>{{ item.value }}</p>
</div>
</div>
@@ -18,7 +18,7 @@
<script>
export default {
props: ['ratio', 'value'],
props: ['ratio', 'value', 'labelStyle'],
data () {
return {
@@ -146,10 +146,7 @@
}
span {
margin-right: 20px;
// width: 88px;
// min-width: 50px;
// max-width: 70px;
width: 78px;
font-weight: 400;
font-size: 14px;
color: #9BB7D4;