add_address.html 5.4 KB

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link rel="stylesheet" href="__INDEX__/css/weui.css">
    <link rel="stylesheet" href="__INDEX__/css/jquery-weui.css">
    <link rel="stylesheet" href="__INDEX__/css/demos.css">
    <link rel="stylesheet" href="https://at.alicdn.com/t/font_834805_9njxvxqweig.css">
    <link rel="stylesheet" href="__INDEX__/css/base.css">
    <link rel="stylesheet" href="__INDEX__/css/swiper.min.css">
    <script type="text/javascript" src="__INDEX__/js/base.js"></script>
    <title>添加地址</title>
    <style>
        body,html{
            width:100%;
            height:100%;
            background: #F5F6FA;
        }
        .select_address{
            width:6.86rem;
            margin: 0 auto;
            height:1.01rem;
            border-bottom: 1px solid #f5f5f5;
            display:flex;
            /*justify-content: space-between;*/
            align-items: center;
            position: relative;
            padding: 0 0.33rem;

        }
        .weui-cell{
            /*display:flex;*/
            /*justify-content: space-between;*/
            /*align-items: center;*/
        }
        .detail_address{
            width:6.86rem;
            margin: 0 auto;
            height:1.01rem;
            border-bottom: 1px solid #f5f5f5;
            display:flex;
            /*justify-content: space-between;*/
            align-items: center;
            padding: 0 0.33rem;
        }
        .place{
            width:1.5rem;
            color:#1A1A1A;
            font-size: 0.3rem;
        }
        .detailplace{
            color:#999999;
            font-size: 0.3rem;
        }
        .province{
            color:#999999;
            font-size: 0.3rem;
        }
        .weui-label {
            width:1.3rem;
        }
        .detailplace{
            border:none;
            outline: none;
            /*margin-right:0.6rem;*/
        }
        .select{
            background: #fff;
        }
        .save{
            width:6.86rem;
            height:0.88rem;
            background:#FE0A01;
            color:#fff;
            font-size:0.32rem ;
            text-align: center;
            line-height: 0.88rem;
            border-radius: 0.44rem;
            position:fixed;
            bottom:0.55rem;
            left:0;
            right:0;
            margin: 0 auto;
            box-shadow:0px 15px 30px 0px rgba(254,10,1,0.24);
        }
        .icon-xiaotuziCduan_{
            color:#999999;
            font-size: 0.5rem;
            position:absolute;
            right:0.3rem;
            z-index: 5;
        }
        .selectadd{
            width:4.6rem;
            position:relative;
            border:none;
            outline:none;
            z-index: 8;
            /*margin-left: 0.5rem;*/
        }
    </style>
</head>
<body>
<div class="container">
    <div class="select">
        <div class="select_address">
            <p class="place">选择地区</p>
            <div class="weui-cell" style="padding: 0">
                <!--<div class="weui-cell__hd"><label for="date" class="weui-label place">选择地区</label></div>-->
                <div class="weui-cell__bd">
                    <input class="weui-input selectadd" id="end" type="text"  placeholder="请选择省市区" >
                </div>
            </div>
            <p class="iconfont icon-xiaotuziCduan_"></p>
        </div>
        <div class="detail_address">
            <p class="place">详细地址</p>
            <input id="P" type="text" placeholder="请填写详细地址" class="detailplace">
        </div>
        <div class="detail_address">
            <p class="place">收货人</p>
            <input id="N" type="text" placeholder="请填写收货人" class="detailplace">
        </div>
        <div class="detail_address">
            <p class="place">联系电话</p>
            <input id="M" type="text" placeholder="请填写联系电话" class="detailplace">
        </div>
    </div>
    <div class="save">保存</div>
</div>
</body>
<script type="text/javascript" src="__INDEX__/js/jquery-2.1.4.js"></script>
<script type="text/javascript" src="__INDEX__/js/fastclick.js"></script>
<script>
    $(function() {
        FastClick.attach(document.body);
    });
</script>
<script type="text/javascript" src="__INDEX__/js/jquery-weui.js"></script>
<script type="text/javascript" src="__INDEX__/js/city-picker.js"></script>

<script>
    $("#end,.icon-xiaotuziCduan").cityPicker({
        title: "请选择地区"
    });
</script>

<script>
    $(".save").click(function () {
        var code = $("#end").attr('data-codes');
        var label = $("#end").val();
        if(code == null || label == null || $("#P").val() == '' || $("#N").val() == '' || $("#M").val() == '') {
            alert('请完善地址信息');
        }else {
            $.ajax({
                url: "{:url('user/Center/addAddress')}",
                data: {
                    code: code,
                    label: label,
                    place: $("#P").val(),
                    name: $("#N").val(),
                    mobile: $("#M").val()
                },
                type: "POST",
                dataType: "JSON",

                success: function (data) {
                    window.location.href = data.url;
                }
            })
        }
    })
</script>
</html>