|
|
@ -7,12 +7,23 @@ |
|
|
|
<span class="flex"> |
|
|
|
<div v-for="(item, index) in selfCity"> |
|
|
|
<span @click="handelClickAgencyNav(item, index)"> {{ item.label }}</span> |
|
|
|
<span v-if="index != selfCity.length - 1">,</span> |
|
|
|
<span v-if="index != selfCity.length - 1">-</span> |
|
|
|
</div> |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
<van-button type="info" size="small" round class="m-right10" @click="restAddress" v-if="autoFlag">手动选择</van-button> |
|
|
|
</div> |
|
|
|
<div class="search"> |
|
|
|
<van-field |
|
|
|
v-model="searchKey" |
|
|
|
center |
|
|
|
placeholder="输入居住小区或地址自动检索所在社区" |
|
|
|
> |
|
|
|
<template #button> |
|
|
|
<span @click="search">检索</span> |
|
|
|
</template> |
|
|
|
</van-field> |
|
|
|
</div> |
|
|
|
<div class="container"> |
|
|
|
<van-list finished-text="没有更多了" class="selectAgency"> |
|
|
|
<van-cell v-for="(item, index) in cityJson" :title="item.label" :key="index" is-link |
|
|
@ -24,7 +35,7 @@ |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import { editUser, getAllOrgTreeList } from "@/api/user"; |
|
|
|
import { editUser, getAllOrgTreeList ,getNeighborHoodListByName } from "@/api/user"; |
|
|
|
import { setConfig } from '@/utils/jweixin' |
|
|
|
export default { |
|
|
|
data() { |
|
|
@ -35,7 +46,9 @@ export default { |
|
|
|
district: null, |
|
|
|
show:true, |
|
|
|
autoFlag:true, |
|
|
|
latLng:null |
|
|
|
latLng:null, |
|
|
|
searchKey:null, |
|
|
|
organizationName:null, |
|
|
|
}; |
|
|
|
}, |
|
|
|
created() { |
|
|
@ -48,10 +61,15 @@ export default { |
|
|
|
} |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
search(){ |
|
|
|
this.organizationName = this.searchKey; |
|
|
|
this.getNeighborHoodListByName(); |
|
|
|
}, |
|
|
|
restAddress() { |
|
|
|
this.district = null; |
|
|
|
this.autoFlag = false; |
|
|
|
this.organizationName = null; |
|
|
|
this.selfCity = []; |
|
|
|
this.searchKey = null; |
|
|
|
this.getAgency(true); |
|
|
|
}, |
|
|
|
signWX() { |
|
|
@ -86,8 +104,12 @@ export default { |
|
|
|
getAddress() { |
|
|
|
this.$http.get(`https://restapi.amap.com/v3/geocode/regeo?location=${this.latLng.lng},${this.latLng.lat}&key=2af5c38e8d31470a87b4671829e01d1a&radius=1000&extensions=all`).then((res) => { |
|
|
|
if (res.status == 200) { |
|
|
|
this.city = res.data.regeocode.addressComponent.city |
|
|
|
this.district = res.data.regeocode.addressComponent.district; |
|
|
|
this.getAgency(true) |
|
|
|
this.street = res.data.regeocode.addressComponent.township; |
|
|
|
this.organizationName = this.street; |
|
|
|
this.selfCity.push({label:this.city},{ label: this.district},{label:this.street}) |
|
|
|
this.getAgency() |
|
|
|
} else{ |
|
|
|
console.log(res); |
|
|
|
} |
|
|
@ -98,20 +120,27 @@ export default { |
|
|
|
if(this.autoFlag) return |
|
|
|
this.autoFlag = true; |
|
|
|
this.selfCity = []; |
|
|
|
this.searchKey = null; |
|
|
|
this.signWX() |
|
|
|
}, |
|
|
|
async getAgency(type) { |
|
|
|
let parm ={ |
|
|
|
organizationName: this.district |
|
|
|
organizationName:this.organizationName |
|
|
|
} |
|
|
|
if(!this.autoFlag && type){ |
|
|
|
parm.pid = 0 |
|
|
|
} |
|
|
|
let res = await getAllOrgTreeList(parm) |
|
|
|
if (res.code === 0) { |
|
|
|
if (type) { |
|
|
|
this.selfCity.push({ label: this.district, children: res.data }) |
|
|
|
} |
|
|
|
this.cityJson = res.data; |
|
|
|
} |
|
|
|
}, |
|
|
|
async getNeighborHoodListByName(){ |
|
|
|
let parm ={ |
|
|
|
neighborHoodName:this.organizationName |
|
|
|
} |
|
|
|
let res = await getNeighborHoodListByName(parm) |
|
|
|
if (res.code === 0) { |
|
|
|
this.cityJson = res.data; |
|
|
|
} |
|
|
|
}, |
|
|
@ -119,6 +148,10 @@ export default { |
|
|
|
if (item.id === this.selfCity[this.selfCity.length - 1].id) return |
|
|
|
this.selfCity.splice(index + 1); |
|
|
|
this.cityJson = item.children; |
|
|
|
if(this.autoFlag ){ |
|
|
|
this.neighborHoodName = item.label; |
|
|
|
this.getAgency() |
|
|
|
} |
|
|
|
}, |
|
|
|
async handelClickAgency(item) { |
|
|
|
this.selfCity.push(item); |
|
|
@ -131,7 +164,7 @@ export default { |
|
|
|
this.$router.replace('/') |
|
|
|
} |
|
|
|
} else { |
|
|
|
this.district = item.label; |
|
|
|
this.organizationName = item.label; |
|
|
|
this.getAgency() |
|
|
|
} |
|
|
|
} |
|
|
@ -144,4 +177,32 @@ export default { |
|
|
|
|
|
|
|
<style lang='less' scoped> |
|
|
|
@import './index'; |
|
|
|
.search{ |
|
|
|
:deep .van-cell { |
|
|
|
border: 1px solid #b3d1fd; |
|
|
|
border-radius: 15px; |
|
|
|
padding: 5px 10px 5px; |
|
|
|
box-sizing: border-box; |
|
|
|
width: calc(100% - 20px); |
|
|
|
margin: 0 auto; |
|
|
|
} |
|
|
|
span{ |
|
|
|
position: relative; |
|
|
|
color: #3974f6; |
|
|
|
&::after{ |
|
|
|
content: ''; |
|
|
|
width: 1px; |
|
|
|
height: 16px; |
|
|
|
position: absolute; |
|
|
|
left: -10px; |
|
|
|
top: 4px; |
|
|
|
background: #3974f6 |
|
|
|
} |
|
|
|
} |
|
|
|
:deep .van-field__control{ |
|
|
|
padding-right: 10px; |
|
|
|
box-sizing: border-box; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
</style> |
|
|
|