<template>
|
<view class="">
|
<view class="hander bgc-ff f-30">
|
<text class="c-99">所选位置：</text>
|
<text v-if="currentSite.name">{{currentSite.name}}</text>
|
<block v-if="!currentSite.name">
|
<text v-if="rolesType== 1">暂无绑定街道社区网格信息</text>
|
<text v-if="rolesType==2">暂无绑定居民信息</text>
|
<text v-if="rolesType==3">暂无绑定街道社区信息</text>
|
</block>
|
</view>
|
<view class="section bgc-ff" v-if="roleType == 2 && list.length">
|
<view class="section-title flex a-i-c">
|
<block v-for="(item,index) in list">
|
<text :class="[ 'mr-100',index == selectIndex?'fw f-32':'f-28']"
|
@click="changeType(index)">{{item.name}}</text>
|
</block>
|
</view>
|
<view class="">
|
|
<view class="nomore f-30" v-if="!list[selectIndex].children.length">
|
暂无{{selectIndex == 0?"房屋":"经营场所"}}信息
|
</view>
|
|
<view class="site-list f-30 flex j-c-s-b a-i-c" v-for="(i,k) in list[selectIndex].children"
|
@click="selectChilren(i,k)">
|
<text>{{i.name}}</text>
|
<u-icon v-if="k == chilrenIndex && chilrenId == i.id" size="22" name="checkbox-mark"
|
color="#017BFC"></u-icon>
|
</view>
|
</view>
|
</view>
|
|
<view class="section bgc-ff pb-80" v-if="roleType == 1 && list.length">
|
<view class="section-title flex j-c-s-b a-i-c">
|
<view class="flex a-i-c">
|
<text class="f-32 fw">街道社区</text>
|
<text class="ml-20 f-28">{{cateName}}</text>
|
</view>
|
<view class="select-btn c-main f-28" @click="isShow = true">选择街道</view>
|
</view>
|
|
<view class="">
|
|
<view class="nomore f-30" v-if="!list[selectIndex].children.length">
|
暂无社区信息
|
</view>
|
|
|
<view class="site-list f-30 flex j-c-s-b a-i-c" v-for="(i,k) in list[selectIndex].children"
|
@click="selectChilren(i,k)">
|
<text>{{i.name}}</text>
|
<u-icon v-if="i.isShows" size="22" name="checkbox-mark" color="#017BFC"></u-icon>
|
</view>
|
</view>
|
</view>
|
|
<u-picker :show="isShow" :columns="[list]" :defaultIndex=[selectIndex] title="选择街道" keyName="name"
|
@confirm="confirmSelect" @cancel="isShow = false" @close="isShow = false"></u-picker>
|
<u-toast ref="uToast"></u-toast>
|
|
<footer-btn text="确认" @click="submit" />
|
|
</view>
|
</template>
|
|
<script>
|
import {
|
getFuncList,
|
} from "@/api/doorplateAddress/doorplateAddress";
|
export default {
|
data() {
|
return {
|
addressType: 1,
|
selectIndex: 0,
|
list: [],
|
currentSite: {},
|
chilrenIndex: 0,
|
chilrenId: "",
|
chilrenList: [],
|
roleType: 1,
|
cateName: "",
|
isShow: false,
|
rolesType: 1
|
}
|
},
|
|
onLoad() {
|
let {
|
roleName
|
} = uni.getStorageSync("activeRole");
|
|
if (roleName == '网格员' || roleName == '系统管理员') {
|
this.rolesType = 1;
|
} else if (roleName == '居民') {
|
this.rolesType = 2;
|
} else if (roleName == '民警') {
|
this.rolesType = 3;
|
}
|
this.roleName = roleName;
|
this.roleType = roleName == "居民" ? 2 : 1;
|
this.getList()
|
},
|
|
methods: {
|
changeType(index) {
|
this.selectIndex = index;
|
},
|
|
selectChilren(item, index) {
|
this.chilrenId = item.id;
|
// this.chilrenIndex = index;
|
console.log(item)
|
for (let i = 0, ii = this.list.length; i < ii; i++) {
|
for (let k = 0, kk = this.list[i].children.length; k < kk; k++) {
|
if (this.list[i].children[k].id == item.id) {
|
if (this.list[i].children[k].isShows) {
|
this.list[i].children[k].isShows = false
|
this.chilrenList = this.chilrenList.filter(items => items !== item.id);
|
console.log("********T********" + JSON.stringify(this.chilrenList))
|
} else {
|
this.list[i].children[k].isShows = true
|
this.chilrenList = this.chilrenList.concat(item.id)
|
console.log("********F********" + JSON.stringify(this.chilrenList))
|
// 使用filter()方法返回一个新数组，排除掉要删除的元素
|
}
|
this.list[i].children[k].name = this.list[i].children[k].name + " "
|
}
|
}
|
}
|
// uni.navigateBack({
|
// success: () => {
|
// this.$store.commit("setSiteInfo", item)
|
// uni.$emit("refreshPage", item)
|
// }
|
// })
|
},
|
|
submit() {
|
uni.navigateBack({
|
success: () => {
|
// this.$store.commit("chilrenList", this.chilrenList)
|
console.log("******************" + JSON.stringify(this.chilrenList))
|
uni.setStorageSync("chilrenList", this.chilrenList)
|
uni.$emit("refreshData")
|
}
|
})
|
},
|
|
getList() {
|
// #ifdef MP-WEIXIN
|
this.$refs.uToast.show({
|
type: 'loading',
|
message: '正在加载',
|
duration: 9999999
|
})
|
// #endif
|
getFuncList(
|
this.roleType,
|
this.roleName
|
).then(res => {
|
console.log(res);
|
this.list = res.data;
|
this.$nextTick(() => {
|
if (this.list.length) {
|
this.getSelectIndex()
|
}
|
this.$refs.uToast.isShow = false
|
})
|
})
|
},
|
|
confirmSelect(e) {
|
console.log("**********" + e);
|
this.chilrenList = []
|
uni.setStorageSync("chilrenList", this.chilrenList)
|
this.selectIndex = e.indexs[0];
|
this.cateName = e.value[0].name;
|
this.isShow = false;
|
uni.setStorageSync("curStreet", e.value[0].name);
|
},
|
|
getSelectIndex() {
|
this.chilrenList = uni.getStorageSync("chilrenList");
|
// this.currentSite = data;
|
for (let i = 0, ii = this.list.length; i < ii; i++) {
|
for (let k = 0, kk = this.list[i].children.length; k < kk; k++) {
|
this.list[i].children[k].isShows = false
|
this.chilrenList.forEach(item => {
|
// console.log("******item******" + item)
|
if (this.list[i].children[k].id == item) {
|
// this.chilrenList = this.chilrenList.concat(item)
|
this.list[i].children[k].isShows = true
|
console.log("******item1111******" + JSON.stringify(this.chilrenList))
|
|
this.cateName = this.list[i].name;
|
uni.setStorageSync("curStreet", this.list[i].name);
|
this.chilrenId = this.list[i].children[k].id;
|
this.chilrenIndex = k
|
}
|
})
|
}
|
}
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
page {
|
background-color: #f5f5f5;
|
}
|
|
/* 全局样式或页面样式 */
|
.fixed-bottom {
|
position: fixed;
|
bottom: 0;
|
left: 0;
|
right: 0;
|
/* 可根据需要调整内边距和外边距 */
|
// padding: 10px;
|
box-sizing: border-box;
|
background-color: #fff;
|
/* 背景色，确保按钮下方无穿透 */
|
z-index: 999;
|
/* 确保按钮在最上层，不受其他元素遮挡 */
|
}
|
|
/* 如果需要，也可以为按钮本身添加样式 */
|
.fixed-bottom button {
|
width: 100%;
|
/* 按钮宽度，可根据需要调整 */
|
}
|
|
.hander {
|
padding: 30rpx;
|
margin-bottom: 20rpx;
|
}
|
|
.section {
|
.section-title {
|
padding: 30rpx;
|
border-bottom: 1px solid #f5f5f5;
|
}
|
|
.mr-100 {
|
margin-right: 100rpx;
|
}
|
|
.site-list {
|
padding: 30rpx;
|
border-bottom: 1px solid #f5f5f5;
|
}
|
|
.select-btn {
|
padding: 6rpx 20rpx;
|
border: 1px solid currentColor;
|
border-radius: 30rpx;
|
}
|
}
|
|
.nomore {
|
padding: 30rpx;
|
}
|
</style>
|
