<template>
	<sh-popup :popupShow="selectAddressPopup" :maxHeight="maxHeight" :popupTitle="popupTitle">
		<template #content>
			<u-tabs @change="handelClick" :list="tabList" @click="click" lineColor="#f56c6c"></u-tabs>
			<view class="list_item p-l-20 p-t-10">
				<ul v-show="current==0">
					<li v-for="item in list1">{{item.name}}</li>
					
				</ul>
				<ul v-show="current==1">
					<li v-for="item in list2">{{item.name}}</li>
				
				</ul>
				<ul v-show="current==2">
					<li v-for="item in list3">{{item.name}}</li>
					
				</ul>
			</view>
		</template>
	</sh-popup>
</template>

<script>
	import shPopup from '@/components/sh-popup/sh-popup.vue';
	export default {
		props: {
			addressPopup: {
				type: Boolean,
				default: ''
			}
		},
		components: {
			shPopup,
		},
		data() {
			return {
				current:0,
				tabList: [{
					name: '北京',
				}, {
					name: '朝阳区',
				}, {
					name: '请选择'
				}, ],
				// addressPopup:false,
				maxHeight: '600rpx',
				popupTitle: "配送至",
				list1:[
					{
						name: '安徽',
					}, 
					{
					    name: '北京',
					}, 
					{
				     	name: '重庆'
					}, 
					{
					 	name: '天津'
					}, 
					{
					 	name: '上海'
					}, 
					 
				],
				list2:[
					{
						name: '大兴区',
					}, 
					{
					    name: '朝阳区',
					}, 
					{
				     	name: '丰台区'
					}, 
					{
					 	name: '昌平区'
					}, 
					{
					 	name: '海淀区'
					}, 
				],
				list3:[
					{
						name: '奥运村街道',
					}, 
					{
					    name: '八里街道',
					}, 
					{
				     	name: '北苑街道'
					}, 
					{
					 	name: '豆各庄街道'
					}, 
					{
					 	name: '大屯街道'
					}, 
				],
			}
		},
		methods: {
			handelClick(item){
				console.log('item',item);
				this.current = item.index
			},
			click(item) {
				console.log('item', item);
			},
		
		}

	}
</script>

<style lang="scss" scoped>
	.list_item{
		ul{
			padding: 0;
			margin: 0;
			li{
				list-style: none;
				margin-bottom:10rpx
			}
		}
	}
</style>
