<template>
	<view>
		<view class="w100 rows rowsc">
			<view class="w-702 h-566 bgff br-20 rows rowsm rowsl">
				<view class="w-650 h-112 rows rowsm rowsb" style="border-bottom: 1rpx solid #f5f5f5;">
					<text class="fs-30 col333">收货人：</text>
					<input type="text" class="fs-28 trt" placeholder="请输入收货人姓名" v-model="name"/>
				</view>
				<view class="w-650 h-112 rows rowsm rowsb" style="border-bottom: 1rpx solid #f5f5f5;">
					<text class="fs-30 col333">手机号：</text>
					<input type="number" maxlength="11" class="fs-28 trt" placeholder="请输入手机号" v-model="mobile"/>
				</view>
				<view class="w-650 h-112 rows rowsm rowsb" style="border-bottom: 1rpx solid #f5f5f5;">
					<text class="fs-30 col333">所在地区：</text>
					<view class="rows rowsm">
						<address-picker @change="onChange" class="fs-28" :class="region?'':'col888'">{{region?region:'选择所在区域'}}</address-picker>
						<image class="w-20 h-20 ml-10" src="/static/images/erf.png" mode=""></image>
					</view>
				</view>
				<view class="w-650 h-112 rows rowsm rowsb" style="border-bottom: 1rpx solid #f5f5f5;">
					<text class="fs-30 col333">详细地址：</text>
					<input type="text" class="fs-28 trt w-450" placeholder="请输入详细地址" v-model="address"/>
				</view>
				<view class="w-650 h-112 rows rowsm rowsb">
					<text class="fs-30 col333">设为默认地址：</text>
					<image class="w-132 h-64" :src="is_switch?'/static/images/04_13kaig.png':'/static/images/04_13kaigd.png'" mode="" @click="is_switch = !is_switch"></image>
				</view>
			</view>
		</view>
		<view class="w100 rows rowsc fixed h-150 rowsm" style="bottom: 50rpx;">
			<view class="w-690 h-88 lh-88 bg fw-b fs-30 tct br-100 colfff" @click="addAddress">
				立即保存
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data(){
			return{
				name:'',
				mobile:'',
				region:'',
				address:'',
				is_switch:false,
			}
		},
		methods:{
			// 选择省市区
			onChange(e){
				this.region = e.data[0] + '/' + e.data[1] + '/' + e.data[2]
			},
			addAddress(){
				if(this.name=='') return this.$tools.showtt('收货人不能为空')
				if(this.mobile=='') return this.$tools.showtt('手机号不能为空')
				if(!this.$tools.isPhone(this.mobile)) return this.$tools.showtt('无效手机号')
				if(this.region=='') return this.$tools.showtt('请选择所在区域')
				if(this.address=='') return this.$tools.showtt('详细地址不能为空')
				this.$tools.axiosFromToken("POST","address/addAddress",{
					name:this.name,
					mobile:this.mobile,
					region:this.region,
					address:this.address,
					is_switch:this.is_switch==false?0:1
				}).then(res => {
					this.$tools.showtt(res.msg)
					if(res.code != 1) return
					setTimeout(() => {
						this.$tools.goBack()
					},1000)	
				})
			}
		}
	}
</script>

<style>
	page{
		background-color: #f7f6fa;
		padding-top: 20rpx;
	}
</style>