This commit is contained in:
yanran200730
2022-08-09 17:52:39 +08:00
2 changed files with 120 additions and 48 deletions

View File

@@ -9,11 +9,11 @@
</div> </div>
<div class="card"> <div class="card">
<h2>积分余额</h2> <h2>积分余额</h2>
<p class="color2">{{ data.integral }}</p> <p class="color2">{{ data.integral || 0 }}</p>
</div> </div>
<div class="card"> <div class="card">
<h2>已用积分</h2> <h2>已用积分</h2>
<p class="color3">{{ data.usedIntegral }}</p> <p class="color3">{{ data.usedIntegral || 0 }}</p>
</div> </div>
</div> </div>
</el-row> </el-row>
@@ -21,7 +21,7 @@
<div class="title"> <div class="title">
<h4>事件汇总</h4> <h4>事件汇总</h4>
<div class="timecSelect"> <div class="timecSelect">
时间<el-date-picker size="small" v-model="time" type="datetimerange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker> 时间<el-date-picker size="small" value-format="yyyy-MM-dd" @change="timeChange" v-model="timeList" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
</div> </div>
</div> </div>
<div class="bar_Box"> <div class="bar_Box">
@@ -79,8 +79,10 @@ export default {
}, },
page: {current: 1, size: 10, total: 0}, page: {current: 1, size: 10, total: 0},
girdList: [], girdList: [],
time: '', timeList: [],
data: {}, data: {},
startTime: '',
endTime: '',
} }
}, },
props: { props: {
@@ -88,28 +90,57 @@ export default {
dict: Object, dict: Object,
permissions: Function, permissions: Function,
}, },
watch: {
timeList(newVal, oldVal) {
if(!newVal) {
// this.getList()
}
}
},
computed: { computed: {
colConfigs() { colConfigs() {
return [ return [
{ prop: "", label: '时间', align: "left", width: "200px" }, { prop: "doTime", label: '时间', align: "left", width: "200px" },
{ prop: "", label: '类型', align: "center", width: "180px" }, { prop: "integralType", label: '类型', align: "center", width: "180px" },
{ prop: "", label: '变动积分', align: "center",width: "200px" }, { prop: "changeIntegral", label: '变动积分', align: "center",width: "200px" },
{ prop: "", label: '剩余积分', align: "center",width: "200px" }, { prop: "nowIntegral", label: '剩余积分', align: "center",width: "200px" },
{ prop: "", label: '事件', align: "center", }, { prop: "eventDesc", label: '事件', align: "center", },
] ]
} }
}, },
created() { created() {
this.getDetail() this.getDetail()
this.getIntegralChange()
}, },
methods: { methods: {
// 详情
getDetail() { getDetail() {
this.instance.post(`/app/appintegraluser/girdDetail?id=${id}`).then(res=>{ this.instance.post(`/app/appintegraluser/girdDetail?id`).then(res=>{
if(res?.data) { if(res?.data) {
this.data = res.data this.data = res.data
} }
}) })
}, },
// 余额变动明细
getIntegralChange() {
this.instance.post(`/app/appintegraluser/getChangeDetail`, null, {
param: {
...this.page,
type: this.type //积分类型
}
}).then(res => {
if(res?.data) {
this.tableData = res.data.detailList
}
})
},
timeChange() {
if(this.timeList.length) {
this.startTime = this.timeList[0]
this.endTime = this.timeList[1]
}
},
getColEcherts() { getColEcherts() {
let chartDom = document.getElementById('chartDom'); let chartDom = document.getElementById('chartDom');
@@ -165,21 +196,28 @@ export default {
}, true); }, true);
window.addEventListener("resize", this.onResize) window.addEventListener("resize", this.onResize)
}, },
onResize() { onResize() {
this.myChart.resize() this.myChart.resize()
}, },
getTableData() {}, getTableData() {},
getListInit() {}, getListInit() {},
cancel(isRefresh) { cancel(isRefresh) {
this.$emit('change', { this.$emit('change', {
type: 'gridScoreManage', type: 'gridScoreManage',
isRefresh: !!isRefresh isRefresh: !!isRefresh
}) })
} }
}, },
mounted() { mounted() {
this.getColEcherts() this.getColEcherts()
}, },
destroyed () { destroyed () {
window.removeEventListener('resize', this.onResize) window.removeEventListener('resize', this.onResize)
}, },

View File

@@ -4,31 +4,26 @@
<div class="title"> <div class="title">
<p>总体统计</p> <p>总体统计</p>
<div class="title_right"> <div class="title_right">
<div><span v-for="(item,index) in timeCheck" :key="index" :class="currrntTime == index? 'active':''" @click="timeChange(index)">{{item}}</span></div> <div>
<el-select size="small" style="width: 200px;" v-model="search.girdId" placeholder="所属网格" clearable <span v-for="(item,index) in timeCheck" :key="index" :class="type == index? 'active':''"
@change="getListInit()"> @click="timeChange(index)">{{ item }}</span>
<el-option </div>
v-for="(item,i) in girdList" <el-cascader ref="cascader1" v-model="girdId" :options="girdOptions" placeholder="所属网格" size="small"
:key="i" :props="defaultProps" :show-all-levels="false" @change="gridChange"></el-cascader>
:label="item.girdName"
:value="item.id"
>
</el-option>
</el-select>
</div> </div>
</div> </div>
<div class="card_list"> <div class="card_list">
<div class="card"> <div class="card">
<h2>剩余积分汇总<i class="el-icon-warning-outline"></i></h2> <h2>剩余积分汇总<i class="el-icon-warning-outline"></i></h2>
<p class="color1">20</p> <p class="color1">{{ data.nowIntegral || 0 }}</p>
</div> </div>
<div class="card"> <div class="card">
<h2>发放积分</h2> <h2>发放积分</h2>
<p class="color1">5</p> <p class="color1">{{ data.addIntegral || 0 }}</p>
</div> </div>
<div class="card"> <div class="card">
<h2>消耗积分</h2> <h2>消耗积分</h2>
<p class="color1">0</p> <p class="color1">{{ data.reduceIntegral || 0 }}</p>
</div> </div>
</div> </div>
<div class="echertsBox"> <div class="echertsBox">
@@ -50,13 +45,7 @@
<template #left> <template #left>
<el-select size="small" style="width: 200px;" v-model="search.girdId" placeholder="所属网格" clearable <el-select size="small" style="width: 200px;" v-model="search.girdId" placeholder="所属网格" clearable
@change="getListInit()"> @change="getListInit()">
<el-option <el-option v-for="(item,i) in girdList" :key="i" :label="item.girdName" :value="item.id"></el-option>
v-for="(item,i) in girdList"
:key="i"
:label="item.girdName"
:value="item.id"
>
</el-option>
</el-select> </el-select>
<ai-select <ai-select
v-model="search.level" v-model="search.level"
@@ -145,13 +134,22 @@ export default {
girdList: [], girdList: [],
time: '', time: '',
timeCheck: ['昨日','近7天','近30天','自定义'], timeCheck: ['昨日','近7天','近30天','自定义'],
currrntTime: '0',
dialog: false, dialog: false,
dialogDate: false, dialogDate: false,
timeList: '', timeList: '',
type: '0',
startTime: '', startTime: '',
endTime: '', endTime: '',
data: {}, data: {},
girdId: '',
girdOptions: [],
defaultProps: {
label: 'girdName',
value: 'id',
checkStrictly: true,
expandTrigger: 'hover',
children: 'girdList'
}
} }
}, },
computed: { computed: {
@@ -172,14 +170,16 @@ export default {
created() { created() {
this.$dict.load('epidemicDangerousAreaLevel') this.$dict.load('epidemicDangerousAreaLevel')
this.getStatistics() this.getStatistics()
this.getGridList()
this.getRanking()
}, },
methods: { methods: {
// 统计接口 // 统计接口
getStatistics() { getStatistics() {
this.instance.post('/app/appintegraluser/allGirdIntegral',null, { this.instance.post('/app/appintegraluser/allGirdIntegral',null, {
params: { params: {
type: 0, type: this.type,
girdId: this.user.info.girdId, girdId: this.girdId,
startTime: this.startTime, startTime: this.startTime,
endTime: this.endTime, endTime: this.endTime,
} }
@@ -189,6 +189,20 @@ export default {
} }
}) })
}, },
// 事件汇总暂定
// 人员、网格排行
getRanking() {
this.instance.post('/app/appintegraluser/userAndGirdIntegralSort',null,{
params: {
type: this.type,
girdId: this.girdId,
startTime: this.startTime,
endTime: this.endTime
}
}).then((res) => {
console.log(res);
})
},
getColEcherts1() { getColEcherts1() {
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";
@@ -315,20 +329,46 @@ export default {
onResize2() { onResize2() {
this.myChart2.resize() this.myChart2.resize()
}, },
getListInit() {}, gridChange(val) {
this.girdId = val?.[val.length - 1]
this.$refs.cascader1.dropDownVisible = false;
},
getGridList() {
this.instance.post(`/app/appgirdinfo/listAll`).then((res) => {
if (res.code == 0) {
this.girdOptions = this.formatTree(res.data)
}
})
},
formatTree(data) {
for (var i = 0; i < data.length; i++){
if(data[i].girdList.length < 1) {
data[i].girdList = undefined
} else {
this.formatTree(data[i].girdList)
}
}
return data
},
getTableData() {}, getTableData() {},
timeChange(index) { timeChange(index) {
if(index == 3) { if(index == 3) {
this.dialogDate = true this.dialogDate = true
this.type = index
} else { } else {
this.currrntTime = index this.type = index
} }
}, },
open(id) { open(id) {
this.dialog = true this.dialog = true
this.getDetail(id) this.getDetail(id)
}, },
getDetail(id) { getDetail(id) {
}, },
@@ -337,30 +377,24 @@ export default {
if(!this.timeList || !this.timeList.length) { if(!this.timeList || !this.timeList.length) {
return this.$message.error('请选择自定义时间'); return this.$message.error('请选择自定义时间');
} }
this.startTime = this.timeList?.[0]
if(this.isEffectTimeSelect) { //宣发效果 this.endTime = this.timeList?.[1]
this.timeListEffect = this.timeList
this.effectType = 3
// this.getEffect()
} else { //宣发明细
this.timeListDepart = this.timeList
this.departType = 3
// this.getDepart()
}
this.dialogDate = false this.dialogDate = false
this.getStatistics()
}, },
}, },
mounted() { mounted() {
this.getColEcherts1() this.getColEcherts1()
this.getColEcherts2() this.getColEcherts2()
}, },
destroyed () { destroyed () {
window.removeEventListener('resize', this.onResize1) window.removeEventListener('resize', this.onResize1)
window.removeEventListener('resize', this.onResize2) window.removeEventListener('resize', this.onResize2)
}, },
} }
</script> </script>