|
@ -1,66 +1,83 @@ |
|
|
<template> |
|
|
<template> |
|
|
<!-- 选择地区 --> |
|
|
<!-- 选择地区 --> |
|
|
<van-popup |
|
|
|
|
|
v-model:show="showArea" |
|
|
|
|
|
round |
|
|
|
|
|
position="bottom" |
|
|
|
|
|
@close="showArea = false" |
|
|
|
|
|
> |
|
|
|
|
|
<!-- <van-picker |
|
|
|
|
|
|
|
|
<van-popup v-model:show="showArea" round position="bottom" @close="showArea = false"> |
|
|
|
|
|
<!-- <van-picker |
|
|
title="地区选择" :columns="columns1" @confirm="onConfirm" @cancel="onCancel" |
|
|
title="地区选择" :columns="columns1" @confirm="onConfirm" @cancel="onCancel" |
|
|
/> --> |
|
|
/> --> |
|
|
<van-picker title="选择地区" :columns="columns" :columns-field-names="customFieldName" @cancel="onCancel" @confirm="onConfirm"/> |
|
|
|
|
|
|
|
|
<van-picker title="选择地区" |
|
|
|
|
|
:columns="columns" |
|
|
|
|
|
:columns-field-names="customFieldName" |
|
|
|
|
|
@cancel="onCancel" |
|
|
|
|
|
@confirm="onConfirm" /> |
|
|
</van-popup> |
|
|
</van-popup> |
|
|
</template> |
|
|
</template> |
|
|
|
|
|
|
|
|
<script> |
|
|
<script> |
|
|
export default { |
|
|
export default { |
|
|
props : ['show'], |
|
|
|
|
|
name:"selectArea", |
|
|
|
|
|
|
|
|
props: ['show'], |
|
|
|
|
|
name: "selectArea", |
|
|
data() { |
|
|
data() { |
|
|
return { |
|
|
return { |
|
|
showArea : false, |
|
|
|
|
|
columns : [], |
|
|
|
|
|
columns1 : [ |
|
|
|
|
|
{ text: '星沙区', value: '星沙区' }, |
|
|
|
|
|
{ text: '雨花区', value: '雨花区' }, |
|
|
|
|
|
{ text: '岳麓区', value: '岳麓区' }, |
|
|
|
|
|
{ text: '天心区', value: '天心区' }, |
|
|
|
|
|
{ text: '开福区', value: '开福区' } |
|
|
|
|
|
], |
|
|
|
|
|
customFieldName : { |
|
|
|
|
|
text: 'name', |
|
|
|
|
|
value: 'name', |
|
|
|
|
|
children: 'children' |
|
|
|
|
|
|
|
|
showArea: false, |
|
|
|
|
|
columns: [], |
|
|
|
|
|
columns1: [{ |
|
|
|
|
|
text: '星沙区', |
|
|
|
|
|
value: '星沙区' |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
text: '雨花区', |
|
|
|
|
|
value: '雨花区' |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
text: '岳麓区', |
|
|
|
|
|
value: '岳麓区' |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
text: '天心区', |
|
|
|
|
|
value: '天心区' |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
text: '开福区', |
|
|
|
|
|
value: '开福区' |
|
|
|
|
|
} |
|
|
|
|
|
], |
|
|
|
|
|
customFieldName: { |
|
|
|
|
|
text: 'name', |
|
|
|
|
|
value: 'name', |
|
|
|
|
|
children: 'children' |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
watch: { |
|
|
watch: { |
|
|
show: { |
|
|
show: { |
|
|
handler (newValue, oldValue) { |
|
|
|
|
|
this.showArea = newValue |
|
|
|
|
|
}, |
|
|
|
|
|
immediate: true |
|
|
|
|
|
|
|
|
handler(newValue, oldValue) { |
|
|
|
|
|
this.showArea = newValue |
|
|
|
|
|
}, |
|
|
|
|
|
immediate: true |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
created(){ |
|
|
|
|
|
|
|
|
created() { |
|
|
this.getCurrentArea(); |
|
|
this.getCurrentArea(); |
|
|
}, |
|
|
}, |
|
|
methods : { |
|
|
|
|
|
onConfirm(selectArea){ |
|
|
|
|
|
this.$emit('select',selectArea.selectedValues.pop()) |
|
|
|
|
|
|
|
|
methods: { |
|
|
|
|
|
onConfirm(selectArea) { |
|
|
|
|
|
|
|
|
|
|
|
this.$store.commit('setArea', selectArea.selectedOptions[2]) |
|
|
|
|
|
this.showArea = false |
|
|
|
|
|
this.$emit('select') |
|
|
|
|
|
// this.$emit('select', selectArea.selectedValues.pop()) |
|
|
}, |
|
|
}, |
|
|
onCancel(){ |
|
|
|
|
|
|
|
|
onCancel() { |
|
|
this.$emit('close') |
|
|
this.$emit('close') |
|
|
}, |
|
|
}, |
|
|
getCurrentArea(){ //获取当前开放区域 |
|
|
|
|
|
let self = this; |
|
|
|
|
|
|
|
|
getCurrentArea() { //获取当前开放区域 |
|
|
|
|
|
let self = this; |
|
|
this.$api('getCurrentArea', this.queryParams, res => { |
|
|
this.$api('getCurrentArea', this.queryParams, res => { |
|
|
if (res.code == 200) { |
|
|
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) |
|
|
|
|
|
|
|
|
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) |
|
|
} |
|
|
} |
|
|
}) |
|
|
}) |
|
|
} |
|
|
} |
|
|