kubbo/dvcp_v2_webapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

统计

Browse Source
This commit is contained in:
shijingjing
2022-08-11 15:11:05 +08:00
parent c08514c60f
commit 15eb67168f
2 changed files with 66 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
packages/conv/creditScore/AppGridMemberScore/components/gridScoreManage.vue
View File

@@ -116,7 +116,6 @@ export default {
label: 'girdName', label: 'girdName',
value: 'id', value: 'id',
checkStrictly: true, checkStrictly: true,
expandTrigger: 'hover',
}, },
} }
}, },

114
packages/conv/creditScore/AppGridMemberScore/components/gridScoreStatistics.vue
View File

@@ -35,12 +35,18 @@
</div> </div>
<div class="echertsBox"> <div class="echertsBox">
<div class="left_Box"> <div class="left_Box">
<div id="chart1" style="height: 300px; width: 100%;"></div> <p>个人积分排行</p>
<ai-empty v-if="false" style="height: 300px;"></ai-empty> <div>
<div id="chart1" style="height: 300px; width: 100%;" v-show="userSortListX.length && userSortListY.length"></div>
<ai-empty v-show="!userSortListX.length && !userSortListY.length" style="height: 200px; width: 100%;" id="empty"></ai-empty>
</div>
</div> </div>
<div class="right_Box"> <div class="right_Box">
<div id="chart2" style="height: 300px; width: 100%;"></div> <p>网格积分排行</p>
<ai-empty v-if="false" style="height: 300px;"></ai-empty> <div>
<div id="chart2" style="height: 300px; width: 100%;" v-show="girdSortListX.length && girdSortListY.length"></div>
<ai-empty v-show="!girdSortListX.length && !girdSortListY.length" style="height: 200px; width: 100%;" id="empty"></ai-empty>
</div>
</div> </div>
</div> </div>
</el-row> </el-row>
@@ -51,14 +57,16 @@
<ai-search-bar> <ai-search-bar>
<template #left> <template #left>
<el-cascader ref="cascader2" v-model="search.girdId" :options="girdOptions" placeholder="所属网格" size="small" <el-cascader ref="cascader2" v-model="search.girdId" :options="girdOptions" placeholder="所属网格" size="small"
:props="defaultProps" :show-all-levels="false" @change="gridChangeOpt"></el-cascader> :props="defaultProps" :show-all-levels="false" clearable @change="gridChangeOpt"></el-cascader>
<!-- <el-date-picker v-model="time" size="small" type="daterange" value-format="yyyy-MM-dd" <ai-select v-model="search.integralType" placeholder="请选择类型" @change="page.current=1, getTableData()"
range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"> :selectList="dict.getDict('integralDetailType')"/>
</el-date-picker> --> <el-date-picker v-model="time" size="small" type="daterange" value-format="yyyy-MM-dd"
range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" @change="onChange">
</el-date-picker>
</template> </template>
<template #right> <template #right>
<el-input size="small" placeholder="请输入居民名称或真实姓名" v-model="search.name" clearable <el-input size="small" placeholder="请输入居民名称或真实姓名" v-model="search.userName" clearable
@clear="page.current = 1, search.name = '', getTableData()" suffix-icon="iconfont iconSearch" @clear="page.current = 1, search.userName = '', getTableData()" suffix-icon="iconfont iconSearch"
v-throttle="() => {(page.current = 1), getTableData();}" /> v-throttle="() => {(page.current = 1), getTableData();}" />
</template> </template>
</ai-search-bar> </ai-search-bar>
@@ -121,23 +129,25 @@ export default {
}, },
data() { data() {
return { return {
name: "积分统计",
myChart1: null, myChart1: null,
myChart2: null, myChart2: null,
tableData: [], tableData: [],
search: { search: {
current: 1, current: 1,
name: '', userName: '',
girdId: '' girdId: '',
integralType: '',
startTime: '',
endTime: '',
}, },
page: {current: 1, size: 10,total: 0,}, page: {current: 1, size: 10,total: 0,},
girdList: [], girdList: [],
time: '', time: [],
timeCheck: ['昨日','近7天','近30天','自定义'], timeCheck: ['昨日','近7天','近30天','自定义'],
dialog: false, dialog: false,
dialogDate: false, dialogDate: false,
timeList: '', timeList: [],
type: '0', type: '1',
startTime: '', startTime: '',
endTime: '', endTime: '',
data: {}, data: {},
@@ -147,13 +157,13 @@ export default {
label: 'girdName', label: 'girdName',
value: 'id', value: 'id',
checkStrictly: true, checkStrictly: true,
expandTrigger: 'hover',
}, },
details: {}, details: {},
fileDownLoad: [], fileDownLoad: [],
girdSortList: [], userSortListX: [],
userSortList: [], userSortListY: [],
girdSortListX: [],
girdSortListY: [],
} }
}, },
computed: { computed: {
@@ -179,11 +189,12 @@ export default {
} }
}, },
created() { created() {
this.$dict.load('epidemicDangerousAreaLevel') this.$dict.load('epidemicDangerousAreaLevel').then(() => {
this.getStatistics() this.getStatistics()
this.getGridList() this.getGridList()
this.getRanking() this.getRanking()
this.getTableData() this.getTableData()
})
}, },
methods: { methods: {
// 统计接口 // 统计接口
@@ -212,9 +223,14 @@ export default {
endTime: this.endTime endTime: this.endTime
} }
}).then((res) => { }).then((res) => {
console.log(res, '积分排行'); if(res?.data) {
this.userSortList = res.data.userSortList this.userSortListX = res.data.userSortList.map(e=> e.userName).reverse();
this.girdSortList = res.data.girdSortList this.userSortListY = res.data.userSortList.map(e=> e.changeIntegral).reverse()
this.girdSortListX = res.data.girdSortList.map(e=> e.girdName).reverse();
this.girdSortListY = res.data.girdSortList.map(e=> e.changeIntegral).reverse()
this.getColEcherts1(this.userSortListX,this.userSortListY)
this.getColEcherts2(this.girdSortListX,this.girdSortListY)
}
}) })
}, },
// 积分明细 // 积分明细
@@ -223,9 +239,6 @@ export default {
params: { params: {
...this.page, ...this.page,
...this.search, ...this.search,
integralType: this.integralType,
startTime: this.startTime,
endTime: this.endTime,
} }
}).then(res => { }).then(res => {
if(res?.data) { if(res?.data) {
@@ -235,21 +248,17 @@ export default {
}) })
}, },
gridChangeOpt() { gridChangeOpt(val) {
this.search.girdId = val?.[val.length - 1] this.search.girdId = val?.[val.length - 1]
this.$refs.cascader2.dropDownVisible = false; this.$refs.cascader2.dropDownVisible = false;
this.getTableData() this.getTableData()
}, },
getColEcherts1() { getColEcherts1(xData,yData) {
let chartDom1 = document.getElementById('chart1'); let chartDom1 = document.getElementById('chart1');
chartDom1.style.width = (window.innerWidth - 435) / 2 + "px"; chartDom1.style.width = (window.innerWidth - 435) / 2 + "px";
this.myChart1 = echarts.init(chartDom1); this.myChart1 = echarts.init(chartDom1);
this.myChart1.setOption({ this.myChart1.setOption({
title: {
text: '个人积分排行'
},
tooltip: { tooltip: {
trigger: 'axis', trigger: 'axis',
axisPointer: { axisPointer: {
@@ -260,7 +269,7 @@ export default {
left: '16px', left: '16px',
right: '28px', right: '28px',
bottom: '14px', bottom: '14px',
top: '50px', top: '16px',
containLabel: true containLabel: true
}, },
xAxis: { xAxis: {
@@ -269,7 +278,7 @@ export default {
}, },
yAxis: { yAxis: {
type: 'category', type: 'category',
data: ['Brazil', 'Indonesia', 'India', 'China', 'World'], data: xData,
axisTick: { axisTick: {
show: false, show: false,
}, },
@@ -280,7 +289,7 @@ export default {
series: [ series: [
{ {
data: [120, 200, 150, 80, 70,], data: yData,
type: 'bar', type: 'bar',
itemStyle: { itemStyle: {
normal: { normal: {
@@ -302,14 +311,11 @@ export default {
}, true); }, true);
window.addEventListener("resize", this.onResize) window.addEventListener("resize", this.onResize)
}, },
getColEcherts2() { getColEcherts2(xData,yData) {
let chartDom2 = document.getElementById('chart2'); let chartDom2 = document.getElementById('chart2');
chartDom2.style.width = (window.innerWidth - 435) / 2 + "px"; chartDom2.style.width = (window.innerWidth - 435) / 2 + "px";
this.myChart2 = echarts.init(chartDom2); this.myChart2 = echarts.init(chartDom2);
this.myChart2.setOption({ this.myChart2.setOption({
title: {
text: '网格积分排行'
},
tooltip: { tooltip: {
trigger: 'axis', trigger: 'axis',
axisPointer: { axisPointer: {
@@ -320,7 +326,7 @@ export default {
left: '16px', left: '16px',
right: '28px', right: '28px',
bottom: '14px', bottom: '14px',
top: '50px', top: '16px',
containLabel: true containLabel: true
}, },
xAxis: { xAxis: {
@@ -329,7 +335,7 @@ export default {
}, },
yAxis: { yAxis: {
type: 'category', type: 'category',
data: ['Brazil', 'Indonesia', 'India', 'China', 'World'], data: xData,
axisTick: { axisTick: {
show: false, show: false,
}, },
@@ -339,7 +345,7 @@ export default {
}, },
series: [ series: [
{ {
data: [120, 200, 150, 80, 70,], data: yData,
type: 'bar', type: 'bar',
itemStyle: { itemStyle: {
normal: { normal: {
@@ -417,6 +423,12 @@ export default {
this.getDetail(id) this.getDetail(id)
}, },
onChange(val) {
this.search.startTime = val?.[0]
this.search.endTime = val?.[1]
this.getTableData()
},
getDetail(id) { getDetail(id) {
this.instance.post(`/app/appintegraldetail/queryDetailById?id=${id}`).then(res=> { this.instance.post(`/app/appintegraldetail/queryDetailById?id=${id}`).then(res=> {
if(res?.data) { if(res?.data) {
@@ -436,6 +448,7 @@ export default {
this.endTime = this.timeList?.[1] this.endTime = this.timeList?.[1]
this.dialogDate = false this.dialogDate = false
this.getStatistics() this.getStatistics()
this.getRanking()
}, },
}, },
@@ -540,9 +553,11 @@ export default {
display: flex; display: flex;
.left_Box { .left_Box {
margin-right: 16px; margin-right: 16px;
flex: 1;
} }
.right_Box { .right_Box {
width: 100%; width: 100%;
flex: 1;
} }
.left_Box, .left_Box,
@@ -555,7 +570,10 @@ export default {
#chart1, #chart1,
#chart2 { #chart2 {
width: 100%; width: 100%;
height: 260px; height: 300px;
}
p {
font-weight: 600;
} }
} }
} }