153 lines
7.0 KiB
PHP
153 lines
7.0 KiB
PHP
@extends('layouts.app')
|
|
|
|
@section('title','新增地址')
|
|
|
|
@section('css')
|
|
<link rel="stylesheet" href="{{ asset('assets/index/css/area.css') }}">
|
|
@endsection
|
|
|
|
@section('content')
|
|
<!-- footer -->
|
|
|
|
<!-- section -->
|
|
<section>
|
|
<!-- 新增收货地址 -->
|
|
<form action="{{ route('addresses.store', ['callback' => Request::get('callback')])}}" method="get" accept-charset="utf-8">
|
|
<div class="addressForm">
|
|
<div class="addressForm-input" >
|
|
<div class="addressForm-input-name"><i class="icon-user address-i"></i>收货人</div>
|
|
<input type="text" name="name" value="" placeholder="输入收货人姓名" class=" clear_null">
|
|
</div>
|
|
<div class="addressForm-input">
|
|
<div class="addressForm-input-name"><i class="icon-tablet address-i"></i>手机号</div>
|
|
<input type="number" name="mobile" value="" placeholder="输入手机号" class=" clear_null">
|
|
</div>
|
|
<div class="addressForm-input">
|
|
{{-- <div class="addressForm-input-name"><i class="icon-map-marker address-i"></i>所在地区</div>
|
|
<div class="addressForm-option">
|
|
<select name="province_sn" id="province">
|
|
<option value="">选择省份</option>
|
|
@foreach ($provinces as $province)
|
|
<option value="{{ $province->sn }}">{{ $province->name }}</option>
|
|
@endforeach
|
|
</select>
|
|
<select name="city_sn" id="city">
|
|
<option value="">选择城市</option>
|
|
</select>
|
|
<select name="area_sn" id="area">
|
|
<option value=" ">请选择地区</option>
|
|
</select>
|
|
</div> --}}
|
|
<div class="ui-form-item ui-border-b">
|
|
<div class="addressForm-input-name"><i class="icon-map-marker address-i"></i>所在地区</div>
|
|
<div class="ui-select">
|
|
<input id="expressArea" name="area" data-name="custUa" data-required="true" data-label="所在地区" placeholder="选择省市区" readonly style="padding-left:0;">
|
|
</div>
|
|
<div class="browser">
|
|
<!--选择地区弹层-->
|
|
<div id="areaLayer" class="express-area-box">
|
|
<div class="addressForm-area">
|
|
<h3>选择省市区</h3>
|
|
<div class="selet-area-wrap">
|
|
<p><span class="one"></span></p>
|
|
<p><span class="two"></span></p>
|
|
<p><span class="three"></span></p>
|
|
</div>
|
|
<div class="hot-city">
|
|
<p>热门城市</p>
|
|
<ul>
|
|
<li onClick="selectPP(0,1)">北京</li>
|
|
<li onClick="selectPP(10,1)">上海</li>
|
|
<li onClick="quickselectC(18,0)">广州</li>
|
|
<li onClick="quickselectC(18,1)">深圳</li>
|
|
<li onClick="quickselectC(12,0)">杭州</li>
|
|
<li onClick="quickselectC(11,0)">南京</li>
|
|
<li onClick="quickselectC(11,4)">苏州</li>
|
|
<li onClick="selectPP(1,1)">天津</li>
|
|
<li onClick="quickselectC(16,0)">武汉</li>
|
|
<li onClick="quickselectC(17,0)">长沙</li>
|
|
<li onClick="selectPP(21,1)">重庆</li>
|
|
<li onClick="quickselectC(22,0)">成都</li>
|
|
</ul>
|
|
<p>选择省份/地区</p>
|
|
</div>
|
|
<a id="backUp" class="back" href="javascript:void(0)" title="返回"></a>
|
|
<a id="closeArea" class="close" href="javascript:void(0)" title="关闭"></a>
|
|
</div>
|
|
<article id="areaBox">
|
|
<ul id="areaList" class="area-list"></ul>
|
|
</article>
|
|
</div>
|
|
<!--遮罩层-->
|
|
<div id="areaMask" class="mask"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="addressForm-select">
|
|
<div class="addressForm-input-name"><i class="icon-edit address-i"></i>详细地址</div>
|
|
<textarea class="textarea" placeholder="街道等详细地址" name="address" id="desc" rows="2" style="padding-right: 1rem"></textarea>
|
|
</div>
|
|
</div>
|
|
<div class="addressForm-mode">
|
|
设为默认地址
|
|
<div class="addressForm-mode-btn">
|
|
<input type="checkbox" name="def" value="1">
|
|
<label></label>
|
|
</div>
|
|
</div>
|
|
@csrf
|
|
<footer>
|
|
<button type="button" class="addressAdd ajax-post">保存</button>
|
|
</footer>
|
|
</form>
|
|
|
|
</section>
|
|
@endsection
|
|
|
|
@section('script')
|
|
<script type="text/javascript" src="/assets/index/js/jquery.area.js"></script>
|
|
<script type="text/javascript">
|
|
$("#province").on('change', function() {
|
|
var psn = $(this).val();
|
|
$.post('{{ route('addresses.areas')}}', {psn: psn, _token:"{{ csrf_token() }}"}, function(res) {
|
|
if (res.code) {
|
|
$('#city').html("");
|
|
var option1 = $("<option>").val('').text('请选择');
|
|
$('#city').append(option1);
|
|
$.each(res.data, function(key, val) {
|
|
var option1 = '<option value="' + val.sn + '">'+ val.name +'</option>';
|
|
$('#city').append(option1);
|
|
});
|
|
$("#area").get(0).selectedIndex = 0;
|
|
$("#city").get(0).selectedIndex = 0;
|
|
|
|
} else {
|
|
updateAlert(res.msg);
|
|
}
|
|
});
|
|
|
|
});
|
|
|
|
$("#city").on('change', function() {
|
|
var psn = $(this).val();
|
|
$.post('{{ route('addresses.areas')}}', {psn: psn, _token:"{{ csrf_token() }}"}, function(res) {
|
|
if (res.code) {
|
|
$('#area').html("");
|
|
var option1 = $("<option>").val('').text('请选择');
|
|
$('#area').append(option1);
|
|
$.each(res.data, function(key, val) {
|
|
var option1 = '<option value="' + val.sn + '">'+ val.name +'</option>';
|
|
$('#area').append(option1);
|
|
});
|
|
$("#area").get(0).selectedIndex=0;
|
|
} else {
|
|
updateAlert(res.msg);
|
|
}
|
|
});
|
|
|
|
});
|
|
|
|
</script>
|
|
@endsection
|