You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
90 lines
1.9 KiB
90 lines
1.9 KiB
<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.$store.commit('setArea', selectArea.selectedOptions[2])
|
|
this.showArea = false
|
|
this.$emit('select')
|
|
// 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>
|