324 lines
15 KiB
HTML
324 lines
15 KiB
HTML
![]() |
<!DOCTYPE html>
|
||
|
<html>
|
||
|
<head>
|
||
|
<meta charset="UTF-8">
|
||
|
<title>地址管理-{$tpshop_config['shop_info_store_title']}</title>
|
||
|
<link rel="stylesheet" type="text/css" href="__STATIC__/css/tpshop.css"/>
|
||
|
<link rel="stylesheet" type="text/css" href="__STATIC__/css/myaccount.css"/>
|
||
|
<script src="__STATIC__/js/jquery-1.11.3.min.js" type="text/javascript" charset="utf-8"></script>
|
||
|
<script src="__PUBLIC__/js/layer/layer.js"></script>
|
||
|
</head>
|
||
|
<body class="bg-f5">
|
||
|
<include file="user/header"/>
|
||
|
<div class="home-index-middle">
|
||
|
<div class="w1224">
|
||
|
<div class="g-crumbs">
|
||
|
<a href="{:U('Home/User/index')}">我的商城</a>
|
||
|
<i class="litt-xyb"></i>
|
||
|
<span>地址管理</span>
|
||
|
</div>
|
||
|
<div class="home-main">
|
||
|
<include file="user/menu"/>
|
||
|
<div class="ri-menu fr">
|
||
|
<div class="menumain p">
|
||
|
<div class="goodpiece">
|
||
|
<h1>地址管理</h1>
|
||
|
<a class="address" href="javascript:;"><span class="co_blue">增加新地址</span></a>
|
||
|
</div>
|
||
|
<div class="grou_num_list address_list_jl ma-to-20">
|
||
|
<ul class="grou_tite">
|
||
|
<li class="sx2"><span>收货人</span></li>
|
||
|
<li class="sx1"><span>收货地址</span></li>
|
||
|
<li class="sx3"><span>联系电话</span></li>
|
||
|
<li class="sx5"><span>操作</span></li>
|
||
|
</ul>
|
||
|
<volist name="lists" id="list">
|
||
|
<ul class="add_conta">
|
||
|
<li class="sx2">
|
||
|
<span>{$list.consignee}</span>
|
||
|
</li>
|
||
|
<li class="sx1"><span>{$region_list[$list['province']]}</span><span>{$region_list[$list['city']]}</span><span>{$region_list[$list['district']]}</span><span>{$region_list[$list['twon']]}{$list.address}</span>
|
||
|
</li>
|
||
|
<li class="sx3"><span>{$list.mobile}</span></li>
|
||
|
<li class="sx5">
|
||
|
<if condition="$list['is_default'] neq 1">
|
||
|
<span><a class="address_set_default" data-address-id="{$list['address_id']}">设为默认</a></span>
|
||
|
<else/>
|
||
|
<span style="font-size:14px;background:#ffaa45;padding:2px;font-weight:400;"><a>默认地址</a></span>
|
||
|
</if>
|
||
|
<a class="address co_blue" data-address-id="{$list['address_id']}">修改</a>
|
||
|
<a class="address_delete co_blue" data-address-id="{$list['address_id']}">删除</a></li>
|
||
|
</ul>
|
||
|
</volist>
|
||
|
</div>
|
||
|
<p class="gp_num2">已保存<em class="red">{$lists|count}</em>条地址,还可以保存<em class="red">
|
||
|
<php>echo 20-count($lists);</php>
|
||
|
</em>条地址
|
||
|
</p>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
<!--编辑地址弹窗-s--->
|
||
|
<div class="ui-dialog infom-dia" style="width: 700px">
|
||
|
<form id="address_form">
|
||
|
<input name="address_id" type="hidden" value="0">
|
||
|
|
||
|
<div class="ui-dialog-title">
|
||
|
<span>新增收货地址</span>
|
||
|
<a class="ui-dialog-close" title="关闭">
|
||
|
<span class="ui-icon ui-icon-delete"></span>
|
||
|
</a>
|
||
|
</div>
|
||
|
<div class="ui-dialog-content" style="height: 600px;width: 700px">
|
||
|
<div class="invoice-dialog">
|
||
|
<div class="zinvoice-tips">
|
||
|
<!--<span class="tip-cont">错误信息</span>-->
|
||
|
</div>
|
||
|
<div class="ui-switchable-panel">
|
||
|
<div class="invoice_title p">
|
||
|
<span class="label"><span class="red">*</span>收货人:</span>
|
||
|
|
||
|
<div class="fl">
|
||
|
<input class="invoice_tt" name="consignee" type="text" value="" maxlength="12"/>
|
||
|
<span class="err" id="err_consignee"></span>
|
||
|
</div>
|
||
|
</div>
|
||
|
<div class="invoice_title p">
|
||
|
<span class="label"><span class="red">*</span>手机或固定电话:</span>
|
||
|
|
||
|
<div class="fl">
|
||
|
<input class="invoice_tt" name="mobile" type="text" value=""
|
||
|
placeholder="固话号码格式:xx-xx(例如: 0755-86140485)" onblur="verifyMobile()" maxlength="15"/>
|
||
|
<span class="err" id="err_mobile"></span>
|
||
|
</div>
|
||
|
</div>
|
||
|
<div class="invoice_title p">
|
||
|
<span class="label"><span class="red">*</span>收货地址:</span>
|
||
|
<span class="err" id="err_province"></span>
|
||
|
<span class="err" id="err_city"></span>
|
||
|
<span class="err" id="err_district"></span>
|
||
|
<select class="di-bl fl seauii" name="province" id="province" onChange="get_city(this,0)">
|
||
|
<option value="0">请选择</option>
|
||
|
</select>
|
||
|
|
||
|
<select class="di-bl fl seauii" name="city" id="city" onChange="get_area(this)">
|
||
|
<option value="0">请选择</option>
|
||
|
</select>
|
||
|
|
||
|
<select class="di-bl fl seauii" name="district" id="district" onChange="get_twon(this)">
|
||
|
<option value="0">请选择</option>
|
||
|
</select>
|
||
|
|
||
|
<select class="di-bl fl seauii" name="twon" id="twon" style="display:none;">
|
||
|
</select>
|
||
|
</div>
|
||
|
<div class="invoice_title p">
|
||
|
<span class="label"><span class="red">*</span>详细地址:</span>
|
||
|
<span class="err" id="err_address"></span>
|
||
|
|
||
|
<div class="fl">
|
||
|
<input class="invoice_tt" name="address" type="text" placeholder="详细地址" maxlength="100"/>
|
||
|
</div>
|
||
|
</div>
|
||
|
<div class="invoice_title p">
|
||
|
<span class="label">邮编:</span>
|
||
|
|
||
|
<div class="fl">
|
||
|
<input class="invoice_tt" name="zipcode" type="text" value=""
|
||
|
onKeyUp="this.value=this.value.replace(/[^\d]/g,'')" maxlength="6"/>
|
||
|
<span class="err" id="err_zipcode"></span>
|
||
|
</div>
|
||
|
</div>
|
||
|
<div class="invoice_title p">
|
||
|
<span class="label"> </span>
|
||
|
|
||
|
<div class="fl">
|
||
|
<div class="op-btns invoice_sendwithgift">
|
||
|
<button id="address_submit" type="button" class="btn-1">保存</button>
|
||
|
<a onclick="$('.ui-dialog-close').trigger('click');" class="btn-9">取消</a>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</form>
|
||
|
</div>
|
||
|
<!--编辑地址弹窗-e--->
|
||
|
<div class="ui-mask"></div>
|
||
|
<!--footer-s-->
|
||
|
<div class="footer p">
|
||
|
<include file="public/footer"/>
|
||
|
</div>
|
||
|
<!--footer-e-->
|
||
|
<script type="text/javascript">
|
||
|
$(document).ready(function () {
|
||
|
get_province();
|
||
|
});
|
||
|
//验证手机
|
||
|
function verifyMobile(){
|
||
|
var phone = $("input[name='mobile']").val();
|
||
|
var isPhone = /^1[34578]\d{9}$/;//手机号码
|
||
|
var isMob= /^0?1[3|4|5|8][0-9]\d{8}$/;// 座机格式
|
||
|
if(!isMob.test(phone) && !isPhone.test(phone)){
|
||
|
$('#err_mobile').text('号码有误,请重填');
|
||
|
return false;
|
||
|
}else{
|
||
|
$('#err_mobile').text('');
|
||
|
}
|
||
|
|
||
|
}
|
||
|
//新增编辑地址
|
||
|
$(function () {
|
||
|
//新增编辑弹窗事件
|
||
|
$(document).on("click", '.address', function (e) {
|
||
|
var dh = $(document).height();
|
||
|
var dw = $(document).width();
|
||
|
$('.ui-mask').height(dh).width(dw).show();
|
||
|
$('.ui-dialog').show();
|
||
|
var address_id = $(this).data('address-id');
|
||
|
if (address_id > 0) {
|
||
|
$("input[name='address_id']").val(address_id);
|
||
|
$.ajax({
|
||
|
type: "POST",
|
||
|
url: "{:U('Home/User/address')}",
|
||
|
data: {address_id: address_id},
|
||
|
dataType: 'json',
|
||
|
success: function (data) {
|
||
|
if (data.status == 1) {
|
||
|
$("input[name='consignee']").val(data.result.user_address.consignee);
|
||
|
$("input[name='address']").val(data.result.user_address.address);
|
||
|
$("input[name='mobile']").val(data.result.user_address.mobile);
|
||
|
$("input[name='zipcode']").val(data.result.user_address.zipcode);
|
||
|
var city_list_option_html = '<option value="0">请选择</option>';
|
||
|
var district_list_option_html = '<option value="0">请选择</option>';
|
||
|
var twon_list_option_html = '<option value="0">请选择</option>';
|
||
|
$.each(data.result.city_list, function (n, value) {
|
||
|
city_list_option_html += '<option value="' + value.id + '">' + value.name + '</option>';
|
||
|
});
|
||
|
$('#city').html(city_list_option_html).val(data.result.user_address.city);
|
||
|
$.each(data.result.district_list, function (n, value) {
|
||
|
district_list_option_html += '<option value="' + value.id + '">' + value.name + '</option>';
|
||
|
});
|
||
|
$('#district').html(district_list_option_html).val(data.result.user_address.district);
|
||
|
$.each(data.result.twon_list, function (n, value) {
|
||
|
twon_list_option_html += '<option value="' + value.id + '">' + value.name + '</option>';
|
||
|
});
|
||
|
if (data.result.twon_list.length > 0) {
|
||
|
$('#twon').html(twon_list_option_html).val(data.result.user_address.twon).show();
|
||
|
}
|
||
|
$("#province").val(data.result.user_address.province);
|
||
|
} else {
|
||
|
layer.open({icon: 2, content: data.msg, time: 1000});
|
||
|
}
|
||
|
}
|
||
|
});
|
||
|
} else {
|
||
|
$("input[name='address_id']").val(0);
|
||
|
$("input[name='consignee']").val('');
|
||
|
$("input[name='address']").val('');
|
||
|
$("input[name='mobile']").val('');
|
||
|
$("input[name='zipcode']").val('');
|
||
|
$("#province").val(0);
|
||
|
$("#city").empty().html('<option value="0">请选择</option>');
|
||
|
$("#district").empty().html('<option value="0">请选择</option>');
|
||
|
$("#twon").empty().html('<option value="0">请选择</option>').hide();
|
||
|
}
|
||
|
})
|
||
|
//关闭弹窗事件
|
||
|
$(document).on("click", '.ui-dialog-close', function (e) {
|
||
|
$('.ui-mask').hide();
|
||
|
$('.ui-dialog').hide();
|
||
|
$('.err').hide();
|
||
|
})
|
||
|
//地址提交
|
||
|
$(document).on("click", '#address_submit', function (e) {
|
||
|
$(this).prop('disabled',true);
|
||
|
var that = $(this);
|
||
|
$.ajax({
|
||
|
type: "POST",
|
||
|
url: "{:U('Home/User/addressSave')}",
|
||
|
data: $('#address_form').serialize(),
|
||
|
dataType: 'json',
|
||
|
success: function (data) {
|
||
|
that.prop('disabled',false);
|
||
|
if (data.status == 1) {
|
||
|
location.reload();
|
||
|
} else {
|
||
|
layer.open({
|
||
|
icon: 2, content: data.msg, time: 1000, end: function () {
|
||
|
$.each(data.result, function (index, item) {
|
||
|
$('#err_' + index).text(item).show();
|
||
|
});
|
||
|
}
|
||
|
});
|
||
|
}
|
||
|
}
|
||
|
});
|
||
|
})
|
||
|
|
||
|
})
|
||
|
//设置默认地址
|
||
|
$(function () {
|
||
|
$(document).on("click", '.address_set_default', function (e) {
|
||
|
var address_id = $(this).data('address-id');
|
||
|
$.ajax({
|
||
|
type: "POST",
|
||
|
url: "{:U('Home/User/addressSetDefault')}",
|
||
|
data: {address_id: address_id},
|
||
|
dataType: 'json',
|
||
|
success: function (data) {
|
||
|
if (data.status == 1) {
|
||
|
location.reload();
|
||
|
} else {
|
||
|
layer.open({icon: 2, content: data.msg, time: 1000});
|
||
|
}
|
||
|
}
|
||
|
});
|
||
|
})
|
||
|
})
|
||
|
//删除地址
|
||
|
$(function () {
|
||
|
$(document).on("click", '.address_delete', function (e) {
|
||
|
var address_id = $(this).data('address-id');
|
||
|
$.ajax({
|
||
|
type: "POST",
|
||
|
url: "{:U('Home/User/addressDelete')}",
|
||
|
data: {address_id: address_id},
|
||
|
dataType: 'json',
|
||
|
success: function (data) {
|
||
|
if (data.status == 1) {
|
||
|
location.reload();
|
||
|
} else {
|
||
|
layer.open({icon: 2, content: data.msg, time: 1000});
|
||
|
}
|
||
|
}
|
||
|
});
|
||
|
})
|
||
|
})
|
||
|
|
||
|
//获取省列表
|
||
|
function get_province() {
|
||
|
$.ajax({
|
||
|
type: "GET",
|
||
|
url: "{:U('Home/Api/getProvince')}",
|
||
|
dataType: 'json',
|
||
|
success: function (data) {
|
||
|
if (data.status == 1) {
|
||
|
var option_html = '<option value="0">请选择</option>';
|
||
|
$.each(data.result, function (n, value) {
|
||
|
option_html += '<option value="' + value.id + '">' + value.name + '</option>';
|
||
|
});
|
||
|
$('#province').html(option_html);
|
||
|
} else {
|
||
|
layer.msg(data.msg, {icon: 2});
|
||
|
}
|
||
|
}
|
||
|
});
|
||
|
}
|
||
|
|
||
|
</script>
|
||
|
</body>
|
||
|
</html>
|