<template>
	<view class="">
		<uni-data-picker style="z-index: 10;" :popup-title="title" :localdata="localData" v-model="dataValue"
			@change="onChange">
			<slot></slot>
		</uni-data-picker>
	</view>
</template>

<script>
	import {
		getRegion
	} from "@/api/common";

	export default {
		props: {
			title: {
				type: String,
				default: '请选择所在城市'
			},
		},
		data() {
			return {
				localData: [],
			}
		},
		created() {
			this.onGetRegion()
		},
		methods: {
			onGetRegion() {
				let localData = uni.getStorageSync('sysCityData')
				if (!localData) {
					getRegion({
						type: 1
					}).then((res) => {
						if (res.code === 1) {
							this.localData = res.data;
							uni.setStorageSync('sysCityData', JSON.stringify(this.localData))
						} else {
							tools.error(res.msg);
						}
					})
				} else {
					this.localData = JSON.parse(localData)
				}
			},
			onChange(e) {
				const address = e.detail.value.map(item => {
					return item.text
				})
				this.$emit('onChange', address.join("/"))
			}
		}
	}
</script>

<style lang="scss" scoped>
</style>