网格
This commit is contained in:
liuye
@@ -2,35 +2,15 @@
|
||||
<div class="SelectUser">
|
||||
<div class="header-middle">
|
||||
<div class="hint">
|
||||
<span v-for="(item, index) in slectList" :key="index"><span v-if="index" style="margin:0 4px;">/</span><span style="color:#3F8DF5" @click="girdNameClick(item, index)">{{item.girdName}}</span></span>
|
||||
<u-search v-model="name" :clearabled="true" placeholder="请输入姓名" :show-action="false" bg-color="#F5F5F5" search-icon-color="#999" color="#999" height="58" @search="getListInit" @clear="name='',getListInit"></u-search>
|
||||
</div>
|
||||
|
||||
<div class="showTypes" v-if="!userList.length">
|
||||
<div v-if="treeList.length > 0">
|
||||
<div class="cards" v-for="(item, index) in treeList" :key="index" @click="itemClick(item)">
|
||||
<div class="imges">
|
||||
<span v-if="item.girdLevel == 2">
|
||||
<img src="./components/img/xzh.png" alt="" class="imgselect" v-if="item.isChecked" @click.stop="girdClick(item, index)" />
|
||||
<img src="./components/img/xz.png" alt="" class="imgselect" v-else @click.stop="girdClick(item, index)" />
|
||||
</span>
|
||||
<img src="./components/img/gird--select-icon.png" alt="" class="avatras" />
|
||||
</div>
|
||||
<div class="rightes">
|
||||
<div class="applicationNames">{{ item.girdName }}</div>
|
||||
<img src="./components/img/right-icon.png" alt="" class="imgs" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<AiEmpty description="暂无数据" class="emptyWrap" v-else></AiEmpty>
|
||||
</div>
|
||||
|
||||
<div class="showUsers" v-else>
|
||||
<div class="showUsers">
|
||||
<div v-if="userList.length > 0">
|
||||
<div class="cards" v-for="(e, index) in userList" :key="index">
|
||||
<div class="imges">
|
||||
<img src="./components/img/xzh.png" alt="" class="imgselect" v-if="e.isChecked" @click="userClick(e, index)" />
|
||||
<img src="./components/img/xz.png" alt="" class="imgselect" v-else @click="userClick(e, index)" />
|
||||
<img src="./components/img/xzh.png" alt="" class="imgselect" v-if="e.isChecked" @click="userClick(index)" />
|
||||
<img src="./components/img/xz.png" alt="" class="imgselect" v-else @click="userClick(index)" />
|
||||
|
||||
<img src="./components/img/tx@2x.png" alt="" class="avatras" />
|
||||
</div>
|
||||
@@ -58,128 +38,63 @@ export default {
|
||||
name: 'SelectUser',
|
||||
data() {
|
||||
return {
|
||||
selectUser: {},
|
||||
allData: null,
|
||||
treeList: [],
|
||||
slectList: [],
|
||||
selectUserList: [],
|
||||
userList: [],
|
||||
name: '',
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.getTree()
|
||||
onLoad(option) {
|
||||
this.selectUserList = option.selectUserList
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
getTree() {
|
||||
this.slectList = []
|
||||
this.$http.post('/app/appgirdinfo/listAllByTop').then((res) => {
|
||||
getListInit() {
|
||||
this.userList = []
|
||||
this.current = 1
|
||||
},
|
||||
getList() {
|
||||
this.$http.post(`/app/appgirdmemberinfo/list?name=${this.name}¤t=${this.current}&size=20`).then((res) => {
|
||||
if (res?.data) {
|
||||
this.allData = res.data
|
||||
this.treeInit()
|
||||
res.data.records.map((item) => {
|
||||
item.isChecked = false
|
||||
})
|
||||
|
||||
this.userList = this.current > 1 ? res.data.records : [...this.userList, ...res.data.records]
|
||||
|
||||
this.userList.map((item) => {
|
||||
this.selectUserList.map((e) => {
|
||||
if(e.id == item.id) {
|
||||
item.isChecked = true
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
treeInit() {
|
||||
if(this.allData[0].isLastLevel == 1) {
|
||||
this.userList = this.allData[0].girdMemberList
|
||||
this.userList.map((item) => {
|
||||
item.isChecked = false
|
||||
})
|
||||
}else {
|
||||
this.treeList = this.allData[0].girdList
|
||||
}
|
||||
var obj = {
|
||||
girdName: this.allData[0].girdName,
|
||||
id: this.allData[0].id,
|
||||
girdLevel: this.allData[0].girdLevel
|
||||
}
|
||||
this.slectList.push(obj)
|
||||
},
|
||||
|
||||
itemClick(row) {
|
||||
console.log(row)
|
||||
var obj = {
|
||||
girdName: row.girdName,
|
||||
id: row.id,
|
||||
girdLevel: row.girdLevel
|
||||
}
|
||||
this.slectList.push(obj)
|
||||
this.searckGird(row)
|
||||
},
|
||||
|
||||
searckGird(row) {
|
||||
if(row.girdLevel != 2) { //查网格
|
||||
this.$http.post(`/app/appgirdinfo/list?parentGirdId=${row.id}&size=999`).then((res) => {
|
||||
if (res?.data) {
|
||||
this.treeList = res.data.records
|
||||
}
|
||||
})
|
||||
}else { //查网格员
|
||||
this.$http.post(`/app/appgirdmemberinfo/listByGirdIdByThree?girdId=${row.id}`).then((res) => {
|
||||
if (res?.data) {
|
||||
this.userList = res.data
|
||||
this.userList.map((item) => {
|
||||
item.isChecked = false
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
girdNameClick(row, index) {
|
||||
this.userList = []
|
||||
if(!index) { //第一级别
|
||||
this.slectList = []
|
||||
this.treeInit()
|
||||
}else {
|
||||
var list = []
|
||||
this.slectList.map((item, i) => {
|
||||
if(i <= index) {
|
||||
list.push(item)
|
||||
}
|
||||
})
|
||||
this.slectList = list
|
||||
this.searckGird(row)
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
girdClick(row, index) {
|
||||
if (this.treeList[index].isChecked) {//取消
|
||||
this.treeList[index].isChecked = false
|
||||
this.selectUser = {}
|
||||
} else {
|
||||
this.treeList.map((item) => {
|
||||
item.isChecked = false
|
||||
})
|
||||
this.treeList[index].isChecked = true
|
||||
this.selectUser = row
|
||||
}
|
||||
this.$forceUpdate()
|
||||
},
|
||||
|
||||
userClick(row, index) {
|
||||
if (this.userList[index].isChecked) {//取消
|
||||
this.userList[index].isChecked = false
|
||||
this.selectUser = {}
|
||||
} else {
|
||||
this.userList.map((item) => {
|
||||
item.isChecked = false
|
||||
})
|
||||
this.userList[index].isChecked = true
|
||||
this.selectUser = row
|
||||
}
|
||||
userClick(index) {
|
||||
this.userList[index].isChecked = !this.userList[index].isChecked
|
||||
this.$forceUpdate()
|
||||
},
|
||||
|
||||
submit() {
|
||||
if (this.selectUser.id != null) {
|
||||
uni.$emit('goback', this.selectUser)
|
||||
uni.navigateBack()
|
||||
var selectUserList = []
|
||||
this.userList.map((item) => {
|
||||
if(item.isChecked) {
|
||||
selectUserList.push(item)
|
||||
}
|
||||
})
|
||||
if (!selectUserList.length) {
|
||||
return this.$u.toast('请选择人员')
|
||||
} else {
|
||||
return this.$u.toast('请选择网格或网格员')
|
||||
uni.$emit('selectUser', selectUserList)
|
||||
uni.navigateBack()
|
||||
}
|
||||
},
|
||||
},
|
||||
onReachBottom() {
|
||||
this.current ++
|
||||
this.getList()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user