geek
/
xinyi


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338
							<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="black" />
	<meta name="format-detection" content="telephone=no">
	<title>编辑地址</title>
	<link rel="stylesheet" href="/static/css/style.css" />
	<link rel="stylesheet" href="/static/css/address.css" />

	<link rel="stylesheet" type="text/css" href="/static/index/css/mobileSelect.css">

	<script src="/static/index/js/mobileSelect.js" type="text/javascript"></script>
</head>
<body>
<style>
	.address2-bottom input{
		-webkit-appearance:none;
		box-shadow:0 0 11px 0 rgba(0,0,0,0.2);
		font-size:0.9rem;
		float: inherit;
		margin: 0 auto 0.56rem auto;
		border-radius: 0.3rem;
		height: 2.5rem;
		line-height: 2.5rem;
	}
	.address2 .address2-bottom{
		padding-left: 0;
	}
	.address2-middle label{
		color: #999;
		font-size: 0.9rem;
	}
	.address2-middle-msg .middle-msg-box input,.address2-middle-msg .middle-msg-box select{
		font-size: 0.9rem;
	}
	.select-add{
		width: 200px;height: 50px;line-height: 50px;float: left
	}
</style>
<!--<img src="/static/images/address1.jpg" width="100%" style="position: absolute;opacity: 0.6;top: 0; z-index: -1;display:none;">
<img src="/static/images/address2.jpg" width="100%" style="position: absolute;opacity: 0.6;top: 0; z-index: -1; display:none;">
<img src="/static/images/address3.jpg" width="100%" style="position: absolute;opacity: 0.6;top: 0; z-index: -1; display:none;">-->
<!--address2页面-->
<div class="address2" id="address2" style="display:block;">
	<!--<div class="address2-top"></div>-->
	<input type="hidden" class="addressId" value="{$addressInfo.address_id}">
	<div class="address2-middle">
		<div class="address2-middle-msg">
				<span class="middle-msg-box">
					<!--<span>收货人</span>
					<span>陈伟</span>-->
					<label for="person">收件人</label>
					<input type="text" id="person" placeholder="请填写收件人" value="{$addressInfo.consignee}"/>
				</span>
			<span class="middle-msg-box">
					<label for="phone_number">手机号</label>
					<input type="text" id="phone_number" placeholder="请填写手机号码" value="{$addressInfo.address_mobile}"/>
				</span>
		</div>
		<div class="address2-middle-msg">
				<span class="middle-msg-box">
					<label for="provinces">省份</label>
					<div id="trigger1" class="select-add" data-id="{$addressInfo.province.code}">{$addressInfo.province.name}</div>
				</span>
			<span class="middle-msg-box">
					<label for="cities">城市</label>
					<div id="trigger2" class="select-add" data-id="{$addressInfo.city.code}">{$addressInfo.city.name}</div>
				</span>
			<span class="middle-msg-box">
					<label for="counties">县区</label>
					<div id="trigger3" class="select-add" data-id="{$addressInfo.area.code}">{$addressInfo.area.name}</div>
				</span>
			<span class="middle-msg-box">
					<!--<span>详细地址</span>
					<span>在呢在呢</span>-->
					<label for="address_detail">详细地址</label>
					<textarea id="address_detail" placeholder="请填写详细地址">{$addressInfo.address}</textarea>
				</span>
		</div>
	</div>
	<div class="address2-bottom">
		{if $addressInfo.is_default==1}
		<input type="button" style="background: white;color: #868A89;" class="default_address" value="这是您的默认收货地址"/>
		{else/}
		<input type="button" class="set_default save_address" data-action="1" value="设为默认收货地址"/>
		{/if}
		<input type="button" class="save_address" data-action="2"  value="保存"/>
	</div>
</div>
<script src="/static/js/jquery-3.2.1.min.js"></script>
<script src="/static/layer/layer.js"></script>
<script src="/static/js/common.js"></script>
<script src="/static/js/address.js"></script>
</body>
</html>

<script type="text/javascript">

	var mobileSelect1 = new MobileSelect({
		trigger: '#trigger1',
		title: '选择省份',
		wheels: [
			{data:[
					{
						id:'1',
						value:'',
						childs:[
							{id:'A1',value:''},
						]
					}
				]}
		],
		callback:function(indexArr, data){
			getCity(data[0].id)
			$('#trigger1').text(data[0].name);
			$('#trigger1').attr('data-id',data[0].id);
		},
		// position:[0]
	});
	var mobileSelect2 = new MobileSelect({
		trigger: '#trigger2',
		title: '选择城市',
		wheels: [
			{data:[
					{
						id:'1',
						value:'',
						childs:[
							{id:'A1',value:''},
						]
					}
				]}
		],
		callback:function(indexArr, data){
			getArea(data[0].id)
			$('#trigger2').text(data[0].name);
			$('#trigger2').attr('data-id',data[0].id);
		},
		position:[0]

	});
	var mobileSelect3 = new MobileSelect({
		trigger: '#trigger3',
		title: '选择区域',
		wheels: [
			{data:[
					{
						id:'1',
						value:'',
						childs:[
							{id:'A1',value:''},
						]
					}
				]}
		],
		callback:function(indexArr, data){
			$('#trigger3').text(data[0].name);
			$('#trigger3').attr('data-id',data[0].id);
		},
		position:[0]

	});

	$.ajax({
		url: '/index/AddressInterfaces/getAddress',
		type: 'GET',
		async:false,
		data:{level:1},
		dataType:'json',
		success: function (res) {
			if(res.code==400){
				layer.msg(res.msg);
			}else{
				var province_data = [];
				var name = '';
				var id ='';
				var provinceId = "{$addressInfo.province.code}";
				var i=0;
				$.each(res.data,function (k,v) {
					province_data[k]={"id":v.code,"value":v.name};
					if(provinceId==v.code){
						i=k;
						name = v.name;
						id = v.code;
					}
				});
				mobileSelect1.updateWheels(province_data);
				mobileSelect1.locatePosition(0,i);
				getCity(id);
			}
		}
	});

	function getCity(cityCode){
		$.ajax({
			url: '/index/AddressInterfaces/getAddress',
			type: 'GET',
			async:false,
			data:{level:2,code:cityCode},
			dataType:'json',
			success: function (res) {
				if(res.code==400){
					layer.msg(res.msg);
				}else{
					var city_data = [];
					var name = '';
					var id ='';
					var cityId = "{$addressInfo.city.code}";
					var i=0;
					$.each(res.data,function (k,v) {
						city_data[k]={"id":v.code,"value":v.name};
						if(k===0){
							name = v.name;
							id = v.code;
						}
						if(cityId==v.code){
							i=k;
							name = v.name;
							id = v.code;
						}
					})
					mobileSelect2.updateWheels(city_data)
					mobileSelect2.locatePosition(0,i);
					getArea(id);
					if(cityId != cityCode){
						$('#trigger2').text(name);
						$('#trigger2').attr('data-id',id);
					}
				}
			}
		});
	}

	function getArea(cityCode) {
		$.ajax({
			url: '/index/AddressInterfaces/getAddress',
			type: 'GET',
			async:false,
			data:{level:3,code:cityCode},
			dataType:'json',
			success: function (res) {
				if(res.code==400){
					layer.msg(res.msg);
				}else{
					var area_data = [];
					var name = '';
					var id ='';
					var areaId = "{$addressInfo.area.code}";
					var i=0;
					$.each(res.data,function (k,v) {
						area_data[k]={"id":v.code,"value":v.name};
						if(k===0){
							name = v.name;
							id = v.code;
						}
						if(areaId == v.code){
							i = k;
							name = v.name;
							id = v.code;
						}
					})
					mobileSelect3.updateWheels(area_data);
					mobileSelect3.locatePosition(0,i);
					if(areaId != cityCode){
						$('#trigger3').text(name);
						$('#trigger3').attr('data-id',id);
					}
				}
			}
		});
	}

	$('.address2-bottom').on('click','.save_address',function () {
		var addressId = $('.addressId').val();
		var is_default = $(this).data('action');
		var name = $('#person').val();
		var mobile = $('#phone_number').val();
		var province = $('#trigger1').data('id');
		var city = $('#trigger2').data('id');
		var area = $('#trigger3').data('id');
		var address = $('#address_detail').val();
		if(name==null||name==undefined||name==""){
			layer.msg('请输入姓名');
			return false;
		}
		if(mobile==null||mobile==undefined||mobile==""){
			layer.msg('请输入手机号');
			return false;
		}
		if(province==null||province==undefined||province==""){
			layer.msg('请选择省份');
			return false;
		}
		if(city==null||city==undefined||city==""){
			layer.msg('请选择城市');
			return false;
		}
		if(area==null||area==undefined||area==""){
			layer.msg('请选择地区');
			return false;
		}
		if(address==null||address==undefined||address==""){
			layer.msg('请填写具体地址');
			return false;
		}

		$.ajax({
			url: '/index/addressInterfaces/saveUserAddress',
			type: 'GET',
			async:false,
			data:{
				mobile:mobile,
				addressId:addressId,
				is_default:is_default,
				province:province,
				city:city,
				area:area,
				address:address,
				consignee:name,
			},
			dataType:'json',
			success: function (res) {
				if(res.code==400){
					layer.msg(res.msg);
					return false;
				}else{
					window.location.href="{:url('/index/address/addressList')}";
				}
			}
		})
	});


</script>