|
|
|
@ -1,7 +1,7 @@ |
|
|
|
<template> |
|
|
|
|
|
|
|
<div class="div_community_info" |
|
|
|
@click="handleShowAllUser()"> |
|
|
|
@click="handleCloseAllUser()"> |
|
|
|
<div class="div_select"> |
|
|
|
|
|
|
|
<img src="../../../../assets/img/shuju/title-tip.png" |
|
|
|
@ -10,7 +10,8 @@ |
|
|
|
<div class="second-select"> |
|
|
|
<el-select v-model="selBuildingId" |
|
|
|
:popper-append-to-body="false" |
|
|
|
placeholder="请选择"> |
|
|
|
placeholder="请选择" |
|
|
|
@click="handleCloseAllUser()"> |
|
|
|
<el-option v-for="(item,index) in buildingArray" |
|
|
|
:key="item.buildingId" |
|
|
|
:label="item.buildingName" |
|
|
|
@ -21,8 +22,10 @@ |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="div_room_bar"> |
|
|
|
<el-scrollbar style="height:100%"> |
|
|
|
<el-scrollbar v-if="roomArray.length>0" |
|
|
|
style="height:100%"> |
|
|
|
<div class="info_loading" |
|
|
|
v-if="roomLoaded"> |
|
|
|
<screen-loading>加载中</screen-loading> |
|
|
|
@ -41,17 +44,35 @@ |
|
|
|
alt /> |
|
|
|
</div> |
|
|
|
<div class="icon_category"> |
|
|
|
<img v-for="(iconItem,iconIndex) in item.iconArrayShow" |
|
|
|
|
|
|
|
<div class="div_icon_item" |
|
|
|
v-for="(iconItem,iconIndex) in item.iconArrayShow" |
|
|
|
:key="iconIndex"> |
|
|
|
<el-popover trigger="click" |
|
|
|
popper-class="icon_popover" |
|
|
|
width="10" |
|
|
|
placement="bottom"> |
|
|
|
<div class="icon_name">{{iconItem.name}} </div> |
|
|
|
<div slot="reference"> |
|
|
|
|
|
|
|
<img class="icon_img" |
|
|
|
:src="iconItem.iconUrl" |
|
|
|
alt /> |
|
|
|
</div> |
|
|
|
|
|
|
|
</el-popover> |
|
|
|
</div> |
|
|
|
<!-- <img v-for="(iconItem,iconIndex) in item.iconArrayShow" |
|
|
|
:key="iconIndex" |
|
|
|
:src="iconItem.iconUrl" |
|
|
|
alt /> |
|
|
|
alt /> --> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- <el-popover v-model="item.showAllUser" |
|
|
|
<el-popover v-model="item.showAllUser" |
|
|
|
placement="bottom" |
|
|
|
width="50" |
|
|
|
popper-class="my_popover" |
|
|
|
trigger="click"> |
|
|
|
trigger="manual"> |
|
|
|
<div class="user_list"> |
|
|
|
<div v-for="(userItem,userIndex) in userArray" |
|
|
|
:key="userIndex" |
|
|
|
@ -76,10 +97,10 @@ |
|
|
|
<img src="../../../../assets/img/xiala.png" |
|
|
|
alt /> |
|
|
|
</div> |
|
|
|
|
|
|
|
</el-popover> --> |
|
|
|
|
|
|
|
<div @click.stop="handleShowAllUser(index)" |
|
|
|
</el-popover> |
|
|
|
|
|
|
|
<!-- <div @click.stop="handleShowAllUser(index)" |
|
|
|
class="div_user"> |
|
|
|
|
|
|
|
<span>全部成员</span> |
|
|
|
@ -103,12 +124,18 @@ |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> --> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
</el-scrollbar> |
|
|
|
|
|
|
|
<div v-else |
|
|
|
class="no-data"> |
|
|
|
<img src="@/assets/img/modules/visual/noData.png" |
|
|
|
class="no-data-img" /> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
@ -119,6 +146,7 @@ import { mapGetters } from "vuex"; |
|
|
|
import { Loading } from 'element-ui'; //引入Loading服务 |
|
|
|
import { requestPost } from "@/js/dai/request"; |
|
|
|
import ScreenLoading from "@/views/modules/visual/cpts/loading"; |
|
|
|
import nextTick from "dai-js/tools/nextTick"; |
|
|
|
|
|
|
|
let loading;//加载动画 |
|
|
|
|
|
|
|
@ -157,6 +185,7 @@ export default { |
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
methods: { |
|
|
|
//小区id，小区名称 |
|
|
|
async initData (neighborHoodId, neighborHoodName) { |
|
|
|
@ -194,28 +223,40 @@ export default { |
|
|
|
}, |
|
|
|
//点击全部成员 |
|
|
|
async handleShowAllUser (selIndex) { |
|
|
|
// this.startLoading() |
|
|
|
|
|
|
|
this.userArray = [] |
|
|
|
this.roomArray.forEach((element, index) => { |
|
|
|
|
|
|
|
let obj = JSON.parse(JSON.stringify(element)) |
|
|
|
|
|
|
|
obj.showAllUser = false |
|
|
|
this.$set(this.roomArray, index, obj) |
|
|
|
// element.showAllUser = false |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
await nextTick(100); |
|
|
|
|
|
|
|
if ((selIndex === 0 || selIndex) && !this.roomArray[selIndex].showAllUser) { |
|
|
|
|
|
|
|
await this.loadUser(this.roomArray[selIndex].houseId, selIndex) |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
|
//关闭成员显示 |
|
|
|
async handleCloseAllUser () { |
|
|
|
|
|
|
|
this.userArray = [] |
|
|
|
this.roomArray.forEach((element, index) => { |
|
|
|
let obj = JSON.parse(JSON.stringify(element)) |
|
|
|
|
|
|
|
if (index === selIndex) { |
|
|
|
obj.showAllUser = !obj.showAllUser |
|
|
|
this.$set(this.roomArray, selIndex, obj) |
|
|
|
let obj = JSON.parse(JSON.stringify(element)) |
|
|
|
|
|
|
|
obj.showAllUser = false |
|
|
|
this.$set(this.roomArray, index, obj) |
|
|
|
|
|
|
|
} else { |
|
|
|
obj.showAllUser = false |
|
|
|
this.$set(this.roomArray, index, obj) |
|
|
|
// element.showAllUser = false |
|
|
|
} |
|
|
|
}); |
|
|
|
// this.endLoading() |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
@ -228,6 +269,13 @@ export default { |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
onEnterTd () { |
|
|
|
console.log('进入') |
|
|
|
}, |
|
|
|
onLeaveTd () { |
|
|
|
console.log('出来') |
|
|
|
}, |
|
|
|
|
|
|
|
//加载楼栋数据 |
|
|
|
async loadBuilding () { |
|
|
|
const url = "/gov/org/agency/baseinfofamilybuilding" |
|
|
|
@ -320,7 +368,7 @@ export default { |
|
|
|
}, |
|
|
|
|
|
|
|
//加载成员数据 |
|
|
|
async loadUser (houseId, index) { |
|
|
|
async loadUser (houseId, selIndex) { |
|
|
|
const url = "/epmetuser/icresiuser/getpeoplebyroom" |
|
|
|
// const url = "http://yapi.elinkservice.cn/mock/245/epmetuser/icresiuser/getpeoplebyroom" |
|
|
|
let params = { |
|
|
|
@ -333,6 +381,11 @@ export default { |
|
|
|
this.userArray = data |
|
|
|
if (this.userArray.length === 0) { |
|
|
|
this.$message.warning('该房间下没有住户') |
|
|
|
} else { |
|
|
|
let objItem = JSON.parse(JSON.stringify(this.roomArray[selIndex])) |
|
|
|
|
|
|
|
objItem.showAllUser = true |
|
|
|
this.$set(this.roomArray, selIndex, objItem) |
|
|
|
} |
|
|
|
|
|
|
|
} else { |
|
|
|
@ -433,7 +486,7 @@ export default { |
|
|
|
.second-select { |
|
|
|
margin: 0 10px 10px; |
|
|
|
::v-deep .el-input { |
|
|
|
width: 180px; |
|
|
|
width: 380px; |
|
|
|
height: 36px; |
|
|
|
.el-input__inner { |
|
|
|
height: 100%; |
|
|
|
@ -442,6 +495,7 @@ export default { |
|
|
|
line-height: 36px; |
|
|
|
background: #06186d; |
|
|
|
border: 1px solid #1a64cc; |
|
|
|
width: 380px; |
|
|
|
} |
|
|
|
|
|
|
|
.el-icon-arrow-up:before { |
|
|
|
@ -491,6 +545,12 @@ export default { |
|
|
|
/deep/ .el-scrollbar__wrap { |
|
|
|
overflow-x: hidden !important; |
|
|
|
} |
|
|
|
|
|
|
|
.no-data { |
|
|
|
padding-top: 120px; |
|
|
|
display: flex; |
|
|
|
justify-content: center; |
|
|
|
} |
|
|
|
} |
|
|
|
</style> |
|
|
|
<style lang="scss" > |
|
|
|
@ -499,4 +559,10 @@ export default { |
|
|
|
margin-top: 10px; |
|
|
|
border: 0; |
|
|
|
} |
|
|
|
.el-popover.icon_popover { |
|
|
|
min-width: 80px !important; |
|
|
|
margin-top: 5px !important; |
|
|
|
padding: 6px !important; |
|
|
|
background-color: rgb(247, 250, 253); |
|
|
|
} |
|
|
|
</style> |
|
|
|
|
jiangyy
3 years ago