confirm.html
9.3 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
<!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 http-equiv="X-UA-Compatible" content="ie=edge" />
<title>订单确认</title>
<tc_include file="Public:common"/>
<link rel="stylesheet" type="text/css" href="__TMPL__Public/assets/css/swiper-3.4.2.min.css" />
<link rel="stylesheet" type="text/css" href="__TMPL__Public/assets/css/order_sure.css" />
<script src="__TMPL__Public/assets/js/swiper-3.4.2.jquery.min.js" type="text/javascript" charset="utf-8"></script>
<style type="text/css">
.kong{
height: 1.2rem;
width: 100%;
}
</style>
</head>
<body>
<div class="container">
<div class="head_adders"></div>
<div class="head" id="add_address">
<i class="iconfont icon-jia1"></i> 添加收获地址
</div>
<input type="hidden" name="realname" value=""/>
<input type="hidden" name="mobile" value=""/>
<input type="hidden" name="province" value=""/>
<input type="hidden" name="city" value=""/>
<input type="hidden" name="region" value=""/>
<volist name="cartList" id="vo">
<input type="hidden" name="ids[]" value="{$vo.goods_id}"/>
<div class="order_res">
<img src="{:sp_get_image_preview_url($vo['thumb'])}" class="order_res_logo" />
<div class="order_res_main">
<p class="main_title">{$vo.goods_name}</p>
<p class="main_mintitle">{$vo.short_name}</p>
<p class="mian_priceGroup">
<span class="mian_price">￥{$vo.goods_price}</span>
<span class="main_num">x{$vo.num}</span>
</p>
</div>
</div>
</volist>
<div class="pay_type">
<p class="type_title">
支付方式
</p>
<p class="type">微信支付</p>
</div>
<div class="pay_type">
<p class="type_title">
配送方式
</p>
<p class="type">快递</p>
</div>
<div class="pay_res">
<div class="pay_res_list">
<p class="pay_title">商品金额</p>
<p class="price">¥ {$count_amount}</p>
</div>
<div class="pay_res_list">
<p class="pay_title">商品数量</p>
<p class="price">x {$count_amount}</p>
</div>
<div class="pay_res_list">
<p class="pay_title">运费</p>
<p class="price">¥ 0.00</p>
</div>
</div>
<div class="kong">
</div>
</div>
<div class="footer">
<div class="footer_price">
合计：<span class="order_price">¥{$count_amount}</span>
</div>
<div class="ordre_sure" id="pay_confirm">
提交订单
</div>
</div>
</body>
<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script>
wx.config({
debug: false,
appId: '{$signPackage.appId}',
timestamp: '{$signPackage.timestamp}',
nonceStr: '{$signPackage.nonceStr}',
signature: '{$signPackage.signature}',
jsApiList: [
'checkJsApi',
'openAddress'
]
});
/*
* 注意：
* 1. 所有的JS接口只能在公众号绑定的域名下调用，公众号开发者需要先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。
* 2. 如果发现在 Android 不能分享自定义内容，请到官网下载最新的包覆盖安装，Android 自定义分享接口需升级至 6.0.2.58 版本及以上。
* 3. 完整 JS-SDK 文档地址：http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html
*
* 如有问题请通过以下渠道反馈：
* 邮箱地址：weixin-open@qq.com
* 邮件主题：【微信JS-SDK反馈】具体问题
* 邮件内容说明：用简明的语言描述问题所在，并交代清楚遇到该问题的场景，可附上截屏图片，微信团队会尽快处理你的反馈。
*/
wx.ready(function () {
// 1 判断当前版本是否支持指定 JS 接口，支持批量判断
wx.checkJsApi({
jsApiList: [
'openAddress'
],
success: function (res) {
//alert(JSON.stringify(res));
}
});
$('#add_address').click(function(){
wx.openAddress({
success: function (res) {
// var userName = res.userName; // 收货人姓名
// var postalCode = res.postalCode; // 邮编
// var provinceName = res.provinceName; // 国标收货地址第一级地址（省）
// var cityName = res.cityName; // 国标收货地址第二级地址（市）
// var countryName = res.countryName; // 国标收货地址第三级地址（国家）
// var detailInfo = res.detailInfo; // 详细收货地址信息
// var nationalCode = res.nationalCode; // 收货地址国家码
// var telNumber = res.telNumber; // 收货人手机号码
var html = '<div class="head_adder">' +
'<div class="adder_info">'+
'<p class="adder_name">'+ res.userName +'</p>'+
'<p class="adder_tel">'+ res.telNumber +'</p>'+
'</div>'+
'<div class="adder_res">'+
'<i class="iconfont icon-icon_location"></i>'+
'<p class="adder_res_info">'+ res.provinceName + res.cityName + res.detailInfo +'</p>'+
'</div> '+
'</div>';
$('input[name=realname]').val(res.userName);
$('input[name=mobile]').val(res.telNumber);
$('input[name=province]').val(res.provinceName);
$('input[name=city]').val(res.cityName);
$('input[name=region]').val(res.detailInfo);
$('.head_adders').html(html);
},
cancel: function () {
// 用户取消拉出地址
//alert('用户取消拉出地址');
}
});
});
// 确认订单
$('#pay_confirm').click(function(){
var btn = $(this);
var text = btn.text();
var realame = $('input[name=realname]').val();
var mobile = $('input[name=mobile]').val();
var province = $('input[name=province]').val();
var city = $('input[name=city]').val();
var region = $('input[name=region]').val();
var ids = [];
$('input[name="ids[]"]').each(function(){
ids.push($(this).val());
});
// if(!realame||!mobile||!province||!city||!region) {
// alert('请选择收货地址');
// return false;
// }
$.ajax({
url:"{:U('User/Cart/createOrder')}",
type:"POST",
data:{
ids:ids,
realame:realame,
mobile:mobile,
province:province,
city:city,
region:region,
sort:"{$sort}",
num:"{$num}"
},
dateType:"json",
beforeSend:function() {
btn.text('提交中...').attr('disabled', true);
},
success:function (data) {
console.log(data);
if(data.status) {
wx.chooseWXPay({
timestamp: data.data.timeStamp, // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
nonceStr: data.data.nonceStr, // 支付签名随机串，不长于 32 位
package: data.data.package, // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=\*\*\*）
signType: data.data.signType, // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5'
paySign: data.data.paySign, // 支付签名
success: function (res) {
// 支付成功后的回调函数
alert('支付成功');
},
error: function (data, status, e) { //提交失败自动执行的处理函数
alert(e);
}
});
} else {
alert(data.msg);
}
},
error: function (data, status, e) { //提交失败自动执行的处理函数
alert(e);
},
complete: function () {
// Handle the complete event
btn.val(text).attr('disabled', false);
}
});
});
});
wx.error(function (res) {
alert(res.errMsg);
});
</script>
</html>