数组转树形结构

This commit is contained in:
shijingjing
2022-08-10 09:47:45 +08:00
parent c06d38bb5f
commit c0302ce05c
2 changed files with 62 additions and 44 deletions

View File

@@ -121,6 +121,9 @@ export default {
} }
}) })
}, },
// 事件汇总暂定
// 余额变动明细 // 余额变动明细
getIntegralChange() { getIntegralChange() {
this.instance.post(`/app/appintegraluser/getChangeDetail`, null, { this.instance.post(`/app/appintegraluser/getChangeDetail`, null, {

View File

@@ -43,25 +43,11 @@
<template #content> <template #content>
<ai-search-bar> <ai-search-bar>
<template #left> <template #left>
<el-select size="small" style="width: 200px;" v-model="search.girdId" placeholder="所属网格" clearable <el-cascader ref="cascader1" v-model="girdId" :options="girdOptions" placeholder="所属网格" size="small"
@change="getListInit()"> :props="defaultProps" :show-all-levels="false" @change="gridChange"></el-cascader>
<el-option v-for="(item,i) in girdList" :key="i" :label="item.girdName" :value="item.id"></el-option> <!-- <el-date-picker v-model="time" size="small" type="daterange" value-format="yyyy-MM-dd"
</el-select> range-separator="" start-placeholder="开始日期" end-placeholder="结束日期">
<ai-select </el-date-picker> -->
v-model="search.level"
clearable
placeholder="类型"
:selectList="$dict.getDict('epidemicDangerousAreaLevel')"
@change="search.current = 1, getList()">
</ai-select>
<el-date-picker
v-model="time"
type="datetimerange"
range-separator=""
size="small"
start-placeholder="开始日期"
end-placeholder="结束日期">
</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.name" clearable
@@ -148,7 +134,6 @@ export default {
value: 'id', value: 'id',
checkStrictly: true, checkStrictly: true,
expandTrigger: 'hover', expandTrigger: 'hover',
children: 'girdList'
} }
} }
}, },
@@ -156,13 +141,13 @@ export default {
...mapState(['user']), ...mapState(['user']),
colConfigs() { colConfigs() {
return [ return [
{ prop: "", label: '姓名', align: "left", width: "200px" }, { prop: "integralUserName", label: '姓名', align: "left", width: "200px" },
{ prop: "", label: '所属网格', align: "center", width: "180px" }, { prop: "girdName", label: '所属网格', align: "center", width: "180px" },
{ prop: "", label: '事件', align: "center",width: "200px" }, { prop: "eventDesc", label: '事件', align: "center",width: "200px" },
{ prop: "", label: '类型', align: "center",width: "200px" }, { prop: "integralType", label: '类型', align: "center",width: "200px" },
{ prop: "", label: '积分变动', align: "center", }, { prop: "changeIntegral", label: '积分变动', align: "center", },
{ prop: "", label: '剩余积分', align: "center", }, { prop: "nowIntegral", label: '剩余积分', align: "center", },
{ prop: "", label: '时间', align: "center", }, { prop: "createTime", label: '时间', align: "center", },
{ slot: "options" } { slot: "options" }
] ]
} }
@@ -172,6 +157,7 @@ export default {
this.getStatistics() this.getStatistics()
this.getGridList() this.getGridList()
this.getRanking() this.getRanking()
this.getTableData()
}, },
methods: { methods: {
// 统计接口 // 统计接口
@@ -189,7 +175,7 @@ export default {
} }
}) })
}, },
// 事件汇总暂定
// 人员、网格排行 // 人员、网格排行
getRanking() { getRanking() {
this.instance.post('/app/appintegraluser/userAndGirdIntegralSort',null,{ this.instance.post('/app/appintegraluser/userAndGirdIntegralSort',null,{
@@ -203,6 +189,25 @@ export default {
console.log(res); console.log(res);
}) })
}, },
// 积分明细
getTableData() {
this.instance.post('/app/appintegraluser/girdIntegralDetail',null,{
params: {
...this.page,
girdId: this.girdIdUser,
integralType: this.integralType,
startTime: this.startTime,
endTime: this.endTime,
name: this.search.name,
}
}).then(res => {
if(res?.data) {
this.tableData = res.data.records
this.page.total = res.data.total
}
})
},
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";
@@ -332,36 +337,46 @@ export default {
gridChange(val) { gridChange(val) {
this.girdId = val?.[val.length - 1] this.girdId = val?.[val.length - 1]
this.$refs.cascader1.dropDownVisible = false; this.$refs.cascader1.dropDownVisible = false;
this.getStatistics()
this.getRanking()
}, },
getGridList() { getGridList() {
this.instance.post(`/app/appgirdinfo/listAll`).then((res) => { this.instance.post(`/app/appgirdinfo/listAll3`).then((res) => {
if (res.code == 0) { if (res.code == 0) {
this.girdOptions = this.formatTree(res.data) this.girdOptions = this.toTree(res.data)
} }
}) })
}, },
formatTree(data) { // 转树形结构
for (var i = 0; i < data.length; i++){ toTree(data) {
if(data[i].girdList.length < 1) { let result = [];
data[i].girdList = undefined if (!Array.isArray(data)) {
} else { return result
this.formatTree(data[i].girdList)
}
} }
return data let map = {};
data.forEach(item => {
map[item.id] = item;
});
data.forEach(item => {
let parent = map[item.parentGirdId];
if (parent) {
(parent.children || (parent.children = [])).push(item);
} else {
result.push(item);
}
});
return result;
}, },
getTableData() {},
timeChange(index) { timeChange(index) {
if(index == 3) { if(index == 3) {
this.dialogDate = true this.dialogDate = true
this.type = index }
} else { this.type = index
this.type = index this.getStatistics()
} this.getRanking()
}, },
open(id) { open(id) {