<template>
|
|
<!-- 选择地区 -->
|
|
<van-popup
|
|
v-model:show="showArea"
|
|
round
|
|
position="bottom"
|
|
@close="showArea = false"
|
|
>
|
|
<!-- <van-picker
|
|
title="地区选择" :columns="columns1" @confirm="onConfirm" @cancel="onCancel"
|
|
/> -->
|
|
<van-picker title="选择地区" :columns="columns" :columns-field-names="customFieldName" @cancel="onCancel" @confirm="onConfirm"/>
|
|
</van-popup>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props : ['show'],
|
|
name:"selectArea",
|
|
data() {
|
|
return {
|
|
showArea : false,
|
|
columns : [],
|
|
columns1 : [
|
|
{ text: '星沙区', value: '星沙区' },
|
|
{ text: '雨花区', value: '雨花区' },
|
|
{ text: '岳麓区', value: '岳麓区' },
|
|
{ text: '天心区', value: '天心区' },
|
|
{ text: '开福区', value: '开福区' }
|
|
],
|
|
customFieldName : {
|
|
text: 'name',
|
|
value: 'name',
|
|
children: 'children'
|
|
}
|
|
}
|
|
},
|
|
watch: {
|
|
show: {
|
|
handler (newValue, oldValue) {
|
|
this.showArea = newValue
|
|
},
|
|
immediate: true
|
|
}
|
|
},
|
|
created(){
|
|
this.getCurrentArea();
|
|
},
|
|
methods : {
|
|
onConfirm(selectArea){
|
|
this.$emit('select',selectArea.selectedValues.pop())
|
|
},
|
|
onCancel(){
|
|
this.$emit('close')
|
|
},
|
|
getCurrentArea(){ //获取当前开放区域
|
|
let self = this;
|
|
this.$api('getCurrentArea', this.queryParams, res => {
|
|
if (res.code == 200) {
|
|
this.columns = this.handleTree(res.result,'id','pid')
|
|
// 使用pop移除并返回数组的最后一个元素
|
|
const lastElement = this.columns[0].children[0].children.pop();
|
|
this.columns[0].children[0].children.unshift(lastElement)
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
</style>
|