同步一下地区选择器

This commit is contained in:
aixianling
2021-12-30 16:55:43 +08:00
parent 94f289511d
commit dce018eb1c

View File

@@ -14,10 +14,12 @@
<em>选择区域</em> <em>选择区域</em>
<div class="selectedArea" v-if="hasSelected"> <div class="selectedArea" v-if="hasSelected">
<p v-for="area in fullArea" :key="area.id" v-text="area.name"/> <p v-for="area in fullArea" :key="area.id" v-text="area.name"/>
<p v-if="selected.type==5" v-text="selected.name"/>
</div> </div>
<div/> <div/>
<span v-if="all" v-text="`全国`" @click="selectNode({}, -1)"/> <span v-if="all" v-text="``" @click="selectNode({}, -1)"/>
<span v-for="(area,i) in fullArea" :key="area.id" v-text="area.levelLabel" @click="selectNode(area, i)"/> <span v-for="(area,i) in fullArea" :key="area.id" v-text="area.levelLabel"
@click="selectNode(area, i)"/>
</div> </div>
<!--用来作为占位的--> <!--用来作为占位的-->
<div class="fixedPlaceholder"> <div class="fixedPlaceholder">
@@ -34,7 +36,7 @@
</div> </div>
<div class="bottomBtns"> <div class="bottomBtns">
<div @click="closePopup">取消</div> <div @click="closePopup">取消</div>
<div class="primary fill" @click="handleSelect(currentArea)">确定</div> <div class="primary fill" @click="handleSelect">确定</div>
</div> </div>
</ai-search-popup> </ai-search-popup>
</section> </section>
@@ -86,7 +88,8 @@ export default {
fullArea: [], fullArea: [],
index: '', index: '',
list: [], list: [],
levelLabels: ["省", "市", "县/区", "镇/街道", "村/社区"] levelLabels: ["省", "市", "县/区", "镇/街道", "村/社区"],
selected: {}
} }
}, },
watch: { watch: {
@@ -133,17 +136,18 @@ export default {
} }
}) })
}, },
handleSelect(op) { handleSelect() {
this.$emit('select', op) this.$emit('select', this.index)
this.$emit('update:name', this.currentArea.name) this.$emit('update:name', this.selected.name)
this.closePopup() this.closePopup()
}, },
getChild(op) { getChild(op) {
if (op.id != this.index) { if (op.id != this.index) {
if (op.type < 5 && (/0{3}$/g.test(this.index)||!this.index)) { if (op.type < 5 && (/0{3}$/g.test(this.index) || !this.index)) {
this.fullArea.push(op) this.fullArea.push(op)
this.getChildAreas(op.id) this.getChildAreas(op.id)
} }
this.selected = op
this.index = op.id this.index = op.id
} }
}, },
@@ -222,6 +226,9 @@ export default {
display: flex; display: flex;
align-items: center; align-items: center;
width: fit-content; width: fit-content;
max-width: calc(100vw - 128px);
overflow: hidden;
text-overflow: ellipsis;
padding: 0 32px; padding: 0 32px;
height: 80px; height: 80px;
background: #ECF2FF; background: #ECF2FF;
@@ -231,6 +238,7 @@ export default {
font-weight: 500; font-weight: 500;
color: #4181FF !important; color: #4181FF !important;
margin: 16px 0 32px; margin: 16px 0 32px;
white-space: nowrap;
} }
.fixedTop { .fixedTop {