Commit 9833206916e20b55f00f208c352eeadf47ca5d90
1 parent
f240c1f6
地锁支付
Showing
2 changed files
with
724 additions
and
0 deletions
js/lock.js
0 → 100644
| 1 | +/* | |
| 2 | +@songcxa | |
| 3 | +@2018-12-14 | |
| 4 | +@移动支付 | |
| 5 | +*/ | |
| 6 | +var webAppParams = null; | |
| 7 | +var $btnObj = null; | |
| 8 | +var $btnLoad = null; | |
| 9 | +var flag = 0; | |
| 10 | +var webAppCode = null;//如果是微信，先获取微信code | |
| 11 | +//var $btnLoad = document.getElementById("loading"); | |
| 12 | +window.onload = function () { | |
| 13 | + //var root = document.getElementById("root"); | |
| 14 | + $btnObj = document.getElementById("btnPayOK"); | |
| 15 | + $btnLoad = document.getElementById("loading"); | |
| 16 | + | |
| 17 | + // $discountBtn = document.getElementById("discountBtn"); | |
| 18 | + $linkPayDetail = getObjectByID("linkPayDetail"); | |
| 19 | + $linkPayDetail.onclick = webAppClass.linkPayDetailClick; | |
| 20 | + var webRoot = window.location.href; | |
| 21 | + //设置当前客户端浏览器模式[微信、支付宝、其他] | |
| 22 | + webAppClass.clientBrowser(); | |
| 23 | + //绑定事件 | |
| 24 | + var ali = document.getElementById("rowAliPay"); | |
| 25 | + var wx = document.getElementById("rowWxPay"); | |
| 26 | + ali.onclick = webAppClass.aliClick; | |
| 27 | + wx.onclick = webAppClass.wxClick; | |
| 28 | + $btnObj.onclick = webAppClass.okClick; | |
| 29 | + document.getElementById("payTip").innerHTML = ""; | |
| 30 | + //参数 | |
| 31 | + webAppParams = getQueryString(window.location); | |
| 32 | + console.log(webAppParams.carNumber) | |
| 33 | + console.log(webAppParams.plNo) | |
| 34 | + if (webAppParams!=null) { | |
| 35 | + //设置UI参数 | |
| 36 | + var url = 'http://39.98.54.240:8090/queryParkOrder/queryToPayOrderIdByCarNumber'; | |
| 37 | + var discountParams = { | |
| 38 | + app_id:'1', | |
| 39 | + salt:'1', | |
| 40 | + deviceInfo:'1', | |
| 41 | + sign_type:'1', | |
| 42 | + sign:'1', | |
| 43 | + token:'1', | |
| 44 | + terminalSource:7, | |
| 45 | + carNumber:webAppParams.carNumber, | |
| 46 | + plNo:webAppParams.plNo, | |
| 47 | + codeType:0 | |
| 48 | + } | |
| 49 | + // var discountParams = JSON.stringify(discountParams) | |
| 50 | + postRequest(url, discountParams, function (res) { | |
| 51 | + console.log(res) | |
| 52 | + | |
| 53 | + var url1 = 'http://39.98.54.240:8090/queryParkOrder/billQuery'; | |
| 54 | + var discountParams1 = { | |
| 55 | + app_id:'1', | |
| 56 | + salt:'1', | |
| 57 | + deviceInfo:'1', | |
| 58 | + sign_type:'1', | |
| 59 | + sign:'1', | |
| 60 | + token:'1', | |
| 61 | + carNumber:webAppParams.carNumber, | |
| 62 | + parkCode:webAppParams.plNo, | |
| 63 | + terminalSource:7, | |
| 64 | + orderId:res.data, | |
| 65 | + codeType:0 | |
| 66 | + } | |
| 67 | + // var discountParams = JSON.stringify(discountParams) | |
| 68 | + postRequest(url1, discountParams1, function (res) { | |
| 69 | + console.log(res) | |
| 70 | + | |
| 71 | + | |
| 72 | + | |
| 73 | + | |
| 74 | + // // if(res.code==0){ | |
| 75 | + // // | |
| 76 | + // document.getElementById("sumMoney").innerHTML = (res.data.orderFee/100) | |
| 77 | + // document.getElementById("parkName").innerHTML = (res.data.parkName) | |
| 78 | + // document.getElementById("staytime").innerHTML = (res.data.staytime) | |
| 79 | + // | |
| 80 | + // document.getElementById("inparktime").innerHTML = (res.data.inparktime) | |
| 81 | + // document.getElementById("due").innerHTML = (res.data.orderTotalFee/100) | |
| 82 | + // | |
| 83 | + // document.getElementById("paid").innerHTML = (res.data.paid/100) | |
| 84 | + // document.getElementById("discountFee").innerHTML = (res.data.discountFee) | |
| 85 | + // | |
| 86 | + // document.getElementById("discountDesc").innerHTML = (res.data.discountDesc) | |
| 87 | + // | |
| 88 | + // document.getElementById("orderNum").innerHTML = (res.data.orderId) | |
| 89 | + // | |
| 90 | + // // document.getElementById("discountTip").innerHTML = res.data.couponDescribe | |
| 91 | + // // document.getElementById("discountFee").innerHTML = (res.data.discountFee/100) | |
| 92 | + // document.getElementById("discountDesc").style.display="none" | |
| 93 | + // $btnLoad.style.display = "none"; | |
| 94 | + // $btnObj.style.display = "block"; | |
| 95 | + // flag = 1; | |
| 96 | + // webAppClass.okPay(tmpObj);//唤醒支付 | |
| 97 | + | |
| 98 | + webAppClass.setUI(res.data); | |
| 99 | + }) | |
| 100 | + | |
| 101 | + | |
| 102 | + | |
| 103 | + }) | |
| 104 | + } else { | |
| 105 | + alertMsg("暂无订单信息"); | |
| 106 | + } | |
| 107 | + | |
| 108 | + //获取微信code | |
| 109 | + //webAppClass.getCode(); | |
| 110 | + var state = clientBrowserEx(); | |
| 111 | + if (state == "wxPay") { | |
| 112 | + webAppCode = webAppClass.getCode(); | |
| 113 | + } | |
| 114 | + // $discountBtn.onclick = webAppClass.discountClick; | |
| 115 | +} | |
| 116 | +/**/ | |
| 117 | +var webAppClass = { | |
| 118 | + | |
| 119 | + | |
| 120 | + //OK | |
| 121 | + okClick: function (ev) { | |
| 122 | + document.getElementById("payTip").innerHTML = ""; | |
| 123 | + if (webAppParams == null) { | |
| 124 | + alertMsg("暂无订单信息");return; | |
| 125 | + } | |
| 126 | + //先校验停车费用后缴费提交 | |
| 127 | + webAppClass.checkParkCost(); | |
| 128 | + }, | |
| 129 | + //校验该订单当前支付时的费用（排除扫描订单后不支付时长） | |
| 130 | + checkParkCost: function () { | |
| 131 | + $btnObj.style.display = "none"; | |
| 132 | + $btnLoad.style.display = "block"; | |
| 133 | + if (typeof(webAppParams.queryOrderInfo) == "undefined") {//没有queryOrderInfo返回第一页 | |
| 134 | + window.history.back(-1); | |
| 135 | + } | |
| 136 | + var tmpParams = JSON.parse(webAppParams.queryOrderInfo); | |
| 137 | + var url = webAppRoot + window.webAppH5.comServer; | |
| 138 | + postRequest(url, tmpParams, function (res) { | |
| 139 | + //btnObj.style.display = "block"; //$btnLoad.style.display = "none"; | |
| 140 | + //$btnObj.style.display = "block"; | |
| 141 | + if (res.code == 0) {//进场 | |
| 142 | + var tmpObj = res.data; | |
| 143 | + if (tmpObj) { | |
| 144 | + if(flag == 1){ | |
| 145 | + webAppClass.codediscountClick(tmpObj); | |
| 146 | + }else{ | |
| 147 | + webAppClass.setUI(tmpObj); | |
| 148 | + webAppParams = tmpObj;//重新赋值 | |
| 149 | + webAppClass.okPay(tmpObj);//唤醒支付 | |
| 150 | + } | |
| 151 | + | |
| 152 | + console.log(tmpObj) | |
| 153 | + // webAppClass.okPay(tmpObj);//唤醒支付 | |
| 154 | + } else { | |
| 155 | + alertMsg("没有找到相应订单"); | |
| 156 | + } | |
| 157 | + } else {//其他情况如【该卡号场内已存在】 | |
| 158 | + $btnLoad.style.display = "none"; | |
| 159 | + $btnObj.style.display = "block"; | |
| 160 | + console.log(res.message); alertMsg(res.message); | |
| 161 | + } | |
| 162 | + }, function (err) { | |
| 163 | + console.log("网络服务超时..." + url); | |
| 164 | + alertMsg("网络服务超时"); | |
| 165 | + $btnLoad.style.display = "none"; | |
| 166 | + $btnObj.style.display = "block"; | |
| 167 | + //$btnLoad.style.display = "none"; | |
| 168 | + }); | |
| 169 | + }, | |
| 170 | + | |
| 171 | + //确定支付 | |
| 172 | + okPay: function (params) { | |
| 173 | + var orderID = params.orderId;//订单号 | |
| 174 | + //var moneyID = document.getElementById("sumMoney").innerHTML = webAppParams.orderId;//订单号 | |
| 175 | + var val = document.getElementById("sumMoney").innerText; | |
| 176 | + var couponPersonId = document.getElementById("discountBox").value; | |
| 177 | + var url = webAppRoot + window.webAppH5.zeroPayServer; | |
| 178 | + var discountParams = { | |
| 179 | + payOrderType : 101, | |
| 180 | + terminalSource:7, | |
| 181 | + orderId: webAppParams.orderId, | |
| 182 | + couponPersonId:couponPersonId, | |
| 183 | + app_id: '123', | |
| 184 | + sign_type: '123', | |
| 185 | + salt: '123', | |
| 186 | + deviceInfo: '123', | |
| 187 | + sign: '123', | |
| 188 | + } | |
| 189 | + if(val == '0.00' || val=='0'){ | |
| 190 | + postRequest(url, discountParams, function (res) { | |
| 191 | + console.log(res) | |
| 192 | + if(res.code==0){ | |
| 193 | + document.getElementById("paySuccess").style.display = 'block' | |
| 194 | + // | |
| 195 | + // document.getElementById("sumMoney").innerHTML = (res.data.orderFee/100) | |
| 196 | + // document.getElementById("discountTip").innerHTML = res.data.couponDescribe | |
| 197 | + // document.getElementById("discountFee").innerHTML = (res.data.discountFee/100) | |
| 198 | + // document.getElementById("discountDesc").style.display="none" | |
| 199 | + // $btnLoad.style.display = "none"; | |
| 200 | + // $btnObj.style.display = "block"; | |
| 201 | + // document.getElementById("discountBox").setAttribute('readonly','readonly'); | |
| 202 | + // flag = 1 | |
| 203 | + }else{ | |
| 204 | + alert(res.message) | |
| 205 | + // $discountBtn.disabled = false | |
| 206 | + // document.getElementById("discountTip").innerHTML = res.message | |
| 207 | + } | |
| 208 | + }) | |
| 209 | + }else { | |
| 210 | + var root = webAppRoot; | |
| 211 | + //第一首先判断当前哪种浏览器方式[微信内置、支付宝内置、第三方浏览器] | |
| 212 | + var clientType = clientBrowserEx(); | |
| 213 | + //alert(clientType); | |
| 214 | + switch (clientType) { | |
| 215 | + case "wxPay"://微信[内置浏览器] | |
| 216 | + //var wxPay = webAppH5.wxPayServer; | |
| 217 | + //var wxParams = webAppH5.comParams; | |
| 218 | + //wxParams.orderId = orderID; | |
| 219 | + //wxParams.payType = 4;// 1:支付宝 2：微信 3：银联 10:H5 4微信公众号 | |
| 220 | + //wxParams.terminalSource = 3;//请求端来源 1： 任你停 2：pda 3：微信公共号 7:H5扫码 10页面支付 | |
| 221 | + //debugger; | |
| 222 | + if (webAppCode == null || webAppCode == "") {//code检测 | |
| 223 | + alertMsg(appState.codeNullTip); | |
| 224 | + $btnObj.style.display = "block"; | |
| 225 | + $btnLoad.style.display = "none"; | |
| 226 | + return; | |
| 227 | + } | |
| 228 | + webAppClass.payAjaxJDK(orderID); | |
| 229 | + console.log("wxPay");//微信支付 | |
| 230 | + break; | |
| 231 | + case "aliPay"://支付宝 | |
| 232 | + console.log("aliPay"); | |
| 233 | + //订单号 | |
| 234 | + var obj = {}; | |
| 235 | + //this.payAjax(url, { orderId: "11111", price: 0.01 }); | |
| 236 | + var aliPay = webAppH5.aliPayServer; | |
| 237 | + var aliParams = webAppH5.comParams; | |
| 238 | + aliParams.orderId = orderID; | |
| 239 | + aliParams.payType = 1;// 1:支付宝 2：微信 3：银联 10:H5 4微信公众号 | |
| 240 | + aliParams.terminalSource = 7;//请求端来源 1： 任你停 2：pda 3：微信公共号 7:H5扫码 10页面支付 | |
| 241 | + aliParams.paySrcType = 101;//101停车支付 | |
| 242 | + webAppClass.payAliAjax(root + aliPay, aliParams); | |
| 243 | + break; | |
| 244 | + default://第三方浏览器other | |
| 245 | + //默认支付宝 | |
| 246 | + if (document.getElementById("aliPay").checked) { | |
| 247 | + console.log("aliPay"); | |
| 248 | + //订单号 | |
| 249 | + var obj = {}; | |
| 250 | + //this.payAjax(url, { orderId: "11111", price: 0.01 }); | |
| 251 | + var aliPay = webAppH5.aliPayServer; | |
| 252 | + var aliParams = webAppH5.comParams; | |
| 253 | + aliParams.orderId = orderID; | |
| 254 | + aliParams.payType = 1;// 1:支付宝 2：微信 3：银联 10:H5 4微信公众号 | |
| 255 | + aliParams.terminalSource = 7;//请求端来源 1： 任你停 2：pda 3：微信公共号 7:H5扫码 10页面支付 | |
| 256 | + aliParams.paySrcType = 101;//101停车支付 | |
| 257 | + webAppClass.payAliAjax(root + aliPay, aliParams); | |
| 258 | + } else {//微信页面支付 | |
| 259 | + var url = " https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb?prepay_id=wx20161110163838f231619da20804912345&package=1037687096"; | |
| 260 | + //window.location.href = url; | |
| 261 | + var wxPay = webAppH5.wxPayServer; | |
| 262 | + var wxParams = webAppH5.comParams; | |
| 263 | + wxParams.orderId = orderID; | |
| 264 | + wxParams.payType = 4;// 1:支付宝 2：微信 3：银联 10:H5 4微信公众号 | |
| 265 | + wxParams.terminalSource = 7;//请求端来源 1： 任你停 2：pda 3：微信公共号 7:H5扫码 10页面支付 | |
| 266 | + webAppClass.payAjax(root + wxPay, wxParams); | |
| 267 | + console.log("wxPay"); | |
| 268 | + } | |
| 269 | + break; | |
| 270 | + } | |
| 271 | + } | |
| 272 | + | |
| 273 | + }, | |
| 274 | + | |
| 275 | + getCode: function () { | |
| 276 | + var appID = appWxID; | |
| 277 | + var code = getUrlParam('code'); | |
| 278 | + var local = window.location.href; | |
| 279 | + //alert("local:" + local); | |
| 280 | + if (code == null || code === '') { | |
| 281 | + //alert(code); | |
| 282 | + window.location.href = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=' + appID + '&redirect_uri=' + encodeURIComponent(local) + '&response_type=code&scope=snsapi_userinfo&state=1#wechat_redirect' | |
| 283 | + //window.event.returnValue = false; | |
| 284 | + //window.open('https://open.weixin.qq.com/connect/oauth2/authorize?appid=' + appID + '&redirect_uri=' + encodeURIComponent(local) + '&response_type=code&scope=snsapi_userinfo&state=1#wechat_redirect'); | |
| 285 | + //alert("22"); | |
| 286 | + } else { | |
| 287 | + //getOpenId(code); //把code传给后台获取用户信息 | |
| 288 | + //alert(code); | |
| 289 | + //webAppCode = code; | |
| 290 | + return code; | |
| 291 | + } | |
| 292 | + | |
| 293 | + function getUrlParam(name) { | |
| 294 | + var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)'); | |
| 295 | + var r = window.location.search.substr(1).match(reg) | |
| 296 | + if (r != null) return unescape(r[2]) | |
| 297 | + return null | |
| 298 | + } | |
| 299 | + }, | |
| 300 | + //Ali | |
| 301 | + aliClick: function (ev) { | |
| 302 | + console.log("AliClick"); | |
| 303 | + document.getElementById("aliPay").checked = true; | |
| 304 | + ev.preventDefault(); | |
| 305 | + }, | |
| 306 | + //Wx | |
| 307 | + wxClick: function (ev) { | |
| 308 | + console.log("wxClick"); | |
| 309 | + document.getElementById("wxPay").checked = true; | |
| 310 | + ev.preventDefault(); | |
| 311 | + }, | |
| 312 | + //浏览器 | |
| 313 | + clientBrowser: function () { | |
| 314 | + if (/MicroMessenger/.test(window.navigator.userAgent)) { | |
| 315 | + console.log("微信客户端"); | |
| 316 | + this.switchShow("wxPay"); | |
| 317 | + } else if (/AlipayClient/.test(window.navigator.userAgent)) { | |
| 318 | + console.log("支付宝客户端"); | |
| 319 | + this.switchShow("aliPay"); | |
| 320 | + } else { | |
| 321 | + console.log("其他浏览器"); | |
| 322 | + this.switchShow("other"); | |
| 323 | + } | |
| 324 | + }, | |
| 325 | + //根据浏览器显示内容[aliPay、wxPay、other] | |
| 326 | + switchShow: function (type) { | |
| 327 | + var aliObj = document.getElementById("rowAliPay"); | |
| 328 | + var wxObj = document.getElementById("rowWxPay"); | |
| 329 | + var lineObj = document.getElementById("splitLine"); | |
| 330 | + switch (type) { | |
| 331 | + case "aliPay": | |
| 332 | + lineObj.style.display = "none"; | |
| 333 | + wxObj.style.display = "none"; | |
| 334 | + document.getElementById("aliPay").checked = true; | |
| 335 | + break; | |
| 336 | + case "wxPay": | |
| 337 | + lineObj.style.display = "none"; | |
| 338 | + aliObj.style.display = "none"; | |
| 339 | + document.getElementById("wxPay").checked = true; | |
| 340 | + break; | |
| 341 | + default://其他浏览器[浏览器暂时屏蔽微信] | |
| 342 | + lineObj.style.display = "none"; | |
| 343 | + wxObj.style.display = "none"; | |
| 344 | + document.getElementById("aliPay").checked = true; | |
| 345 | + break; | |
| 346 | + } | |
| 347 | + }, | |
| 348 | + | |
| 349 | + //异步请求-微信H5页面 | |
| 350 | + payAjax: function (url, params) { | |
| 351 | + var btnOBj = $btnObj; | |
| 352 | + postRequest(url, params, function (res) { | |
| 353 | + btnOBj.style.display = "block"; | |
| 354 | + $btnLoad.style.display = "none"; | |
| 355 | + //debugger; | |
| 356 | + if (res.code == 0) {//进场 | |
| 357 | + //alertMsg("出场成功"); | |
| 358 | + if (res.data) { | |
| 359 | + var tmpObj = res.data; | |
| 360 | + if (typeof (tmpObj.mwebUrl)!="undefined") { | |
| 361 | + window.location.href = tmpObj.mwebUrl + "&redirect_url=" + webAppPayResult; | |
| 362 | + } else { | |
| 363 | + alertMsg("没有返回支付地址mwebUrl"); | |
| 364 | + } | |
| 365 | + console.log(JSON.stringify(tmpObj)); | |
| 366 | + } else { | |
| 367 | + alertMsg("没有找到返回值"); | |
| 368 | + } | |
| 369 | + } else {//其他情况如【该卡号场内已存在】 | |
| 370 | + console.log(res.message); | |
| 371 | + alertMsg(res.message); | |
| 372 | + } | |
| 373 | + }, function (err) { | |
| 374 | + console.log("网络地址出错..."); | |
| 375 | + alertMsg("网络地址出错..."); | |
| 376 | + $btnLoad.style.display = "none"; | |
| 377 | + btnOBj.style.display = "block"; | |
| 378 | + }); | |
| 379 | + }, | |
| 380 | + //异步请求-微信JDK调用 | |
| 381 | + payAjaxJDK: function (orderID) { | |
| 382 | + var btnOBj = $btnObj; | |
| 383 | + //0：页面初始化获取code[webAppCode] | |
| 384 | + var codeParams = { code: webAppCode, appId: appWxID }; | |
| 385 | + var openIdUrl = webAppRoot + window.webAppH5.wxGetOpenIdServer; | |
| 386 | + | |
| 387 | + //1：有code获取OpenId | |
| 388 | + postRequest(openIdUrl, codeParams, function (res) { | |
| 389 | + //alert(JSON.stringify(res)); | |
| 390 | + if (res.code == 0) { | |
| 391 | + //alert(res.data); | |
| 392 | + webAppClass.getPayParams(res.data, orderID); | |
| 393 | + } | |
| 394 | + else if (res.code == 40163) {//code been used, hints[重复code问题] | |
| 395 | + alertMsg(appState.codeNullTip); | |
| 396 | + console.log(res.message); | |
| 397 | + $btnObj.style.display = "block"; | |
| 398 | + $btnLoad.style.display = "none"; | |
| 399 | + } | |
| 400 | + else { | |
| 401 | + alertMsg(res.message); | |
| 402 | + $btnObj.style.display = "block"; | |
| 403 | + $btnLoad.style.display = "none"; | |
| 404 | + } | |
| 405 | + }, function (err) { | |
| 406 | + console.log("网络地址出错..." + openIdUrl); | |
| 407 | + $btnObj.style.display = "block"; | |
| 408 | + $btnLoad.style.display = "none"; | |
| 409 | + }); | |
| 410 | + //2：获取支付参数 | |
| 411 | + //function getPayParams(openId) { | |
| 412 | + | |
| 413 | + //} | |
| 414 | + }, | |
| 415 | + getPayParams: function (openId, orderID) { | |
| 416 | + var wxPay = window.webAppH5.wxPayServer; | |
| 417 | + var wxParams = window.webAppH5.comParams; | |
| 418 | + wxParams.orderId = orderID; | |
| 419 | + wxParams.payType = 4;// 1:支付宝 2：微信 3：银联 10:H5 4微信公众号 | |
| 420 | + wxParams.terminalSource = 7;//请求端来源 1： 任你停 2：pda 3：微信公共号 7:H5扫码 10页面支付 | |
| 421 | + //webAppClass.payAjax(root + wxPay, wxParams); | |
| 422 | + wxParams.openId = openId; | |
| 423 | + wxParams.appId = appWxID; | |
| 424 | + var payParamsUrl = webAppRoot + window.webAppH5.wxPayServer; | |
| 425 | + //alert(payParamsUrl);alert(orderID); | |
| 426 | + postRequest(payParamsUrl, wxParams, function (res) { | |
| 427 | + $btnObj.style.display = "block"; | |
| 428 | + $btnLoad.style.display = "none"; | |
| 429 | + //debugger; | |
| 430 | + if (res.code == 0) {//进场 | |
| 431 | + //alertMsg("出场成功"); | |
| 432 | + if (res.data) { | |
| 433 | + var tmpObj = res.data; | |
| 434 | + webAppClass.weixinJSBridge(res.data); | |
| 435 | + console.log(JSON.stringify(tmpObj)); | |
| 436 | + //alert(JSON.stringify(tmpObj)); | |
| 437 | + } else { | |
| 438 | + alertMsg("没有找到返回值"); | |
| 439 | + } | |
| 440 | + } else { | |
| 441 | + $btnLoad.style.display = "none"; | |
| 442 | + $btnObj.style.display = "block"; | |
| 443 | + console.log(res.message); alertMsg(res.message); | |
| 444 | + } | |
| 445 | + }, function (err) { | |
| 446 | + console.log("网络地址出错..."); | |
| 447 | + alertMsg("网络地址出错..." + payParamsUrl); | |
| 448 | + $btnLoad.style.display = "none"; | |
| 449 | + $btnObj.style.display = "block"; | |
| 450 | + }); | |
| 451 | + }, | |
| 452 | + | |
| 453 | + //调用微信内置WeixinJSBridge对象发起支付 | |
| 454 | + weixinJSBridge: function (params) { | |
| 455 | + function onBridgeReady() { | |
| 456 | + WeixinJSBridge.invoke( | |
| 457 | + 'getBrandWCPayRequest', params, | |
| 458 | + //'getBrandWCPayRequest', { | |
| 459 | + // "appId": appWxID, //公众号名称，由商户传入 | |
| 460 | + // "timeStamp": "1395712654", //时间戳，自1970年以来的秒数 | |
| 461 | + // "nonceStr": "e61463f8efa94090b1f366cccfbbb444", //随机串 | |
| 462 | + // "package": "prepay_id=u802345jgfjsdfgsdg888", | |
| 463 | + // "signType": "MD5", //微信签名方式： | |
| 464 | + // "paySign": "70EA570631E4BB79628FBCA90534C63FF7FADD89" //微信签名 | |
| 465 | + //}, | |
| 466 | + function (res) { | |
| 467 | + //alert(res.err_msg); | |
| 468 | + if (res.err_msg == "get_brand_wcpay_request:ok") { | |
| 469 | + // 使用以上方式判断前端返回,微信团队郑重提示： | |
| 470 | + //res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。 | |
| 471 | + window.location.href = webAppPayResult+"?trade_no=" + "success"; | |
| 472 | + } | |
| 473 | + else if (res.err_msg == 'get_brand_wcpay_request:cancel') { | |
| 474 | + window.location.href = webAppPayResult + "?trade_no=" + "fail"; | |
| 475 | + } | |
| 476 | + else { | |
| 477 | + alertMsg(JSON.stringify(res)); | |
| 478 | + //alert(res.err_msg); | |
| 479 | + } | |
| 480 | + }); | |
| 481 | + } | |
| 482 | + if (typeof WeixinJSBridge == "undefined") { | |
| 483 | + if (document.addEventListener) { | |
| 484 | + document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false); | |
| 485 | + } else if (document.attachEvent) { | |
| 486 | + document.attachEvent('WeixinJSBridgeReady', onBridgeReady); | |
| 487 | + document.attachEvent('onWeixinJSBridgeReady', onBridgeReady); | |
| 488 | + } | |
| 489 | + } else { | |
| 490 | + onBridgeReady(); | |
| 491 | + } | |
| 492 | + }, | |
| 493 | + | |
| 494 | + //异步请求-支付宝 | |
| 495 | + payAliAjax: function (url, params) { | |
| 496 | + var btnOBj = $btnObj; | |
| 497 | + postRequest(url, params, function (res) { | |
| 498 | + btnOBj.style.display = "block"; | |
| 499 | + $btnLoad.style.display = "none"; | |
| 500 | + if (res.code == 0) {//进场 | |
| 501 | + document.write(res.data);//打开支付表单 | |
| 502 | + } else {//其他情况如【该卡号场内已存在】 | |
| 503 | + console.log(res.message); | |
| 504 | + alertMsg(res.message); | |
| 505 | + } | |
| 506 | + }, function (err) { | |
| 507 | + console.log("网络地址出错...");alertMsg("网络地址出错..."); | |
| 508 | + $btnLoad.style.display = "none"; | |
| 509 | + btnOBj.style.display = "block"; | |
| 510 | + }); | |
| 511 | + }, | |
| 512 | + | |
| 513 | + //设置UI | |
| 514 | + setUI: function (params) { | |
| 515 | + console.log(params) | |
| 516 | + var $carNum = getObjectByID("carNum"),//车牌号 | |
| 517 | + $orderNum = getObjectByID("orderNum"),//订单号 | |
| 518 | + $sumMoney = getObjectByID("sumMoney"),//实际应付金额 | |
| 519 | + $outtime = getObjectByID("outtime"),//实际出场时间 | |
| 520 | + $payTip = getObjectByID("payTip"),//支付提示 | |
| 521 | + | |
| 522 | + $parkName = getObjectByID("parkName"),//车场名称 | |
| 523 | + $inparktime = getObjectByID("inparktime"),//进场时间 | |
| 524 | + $staytime = getObjectByID("staytime"),//停车时长 | |
| 525 | + $due = getObjectByID("due"),//停车总费用 | |
| 526 | + | |
| 527 | + $paid = getObjectByID("paid"),//已支付金额 | |
| 528 | + $discountDesc = getObjectByID("discountDesc"),//8折优惠折扣费用 | |
| 529 | + $discountFee = getObjectByID("discountFee");//优惠金额 | |
| 530 | + | |
| 531 | + if (params != null && params!="") { | |
| 532 | + var price = keepTwoDecimalFull((params.orderFee / 100));//(params.orderFee / 100); | |
| 533 | + $carNum.innerHTML = params.plateno;//手机号 | |
| 534 | + $orderNum.innerHTML = params.orderId;//订单号 | |
| 535 | + $sumMoney.innerHTML = price;///params.orderFee//缴费金额 | |
| 536 | + $outtime.innerHTML = params.outtime;//实际出场时间 | |
| 537 | + //.appOrderTimeout | |
| 538 | + $payTip.innerHTML = "注意: " + params.appOrderTimeout;//请在支付完成10分钟内出场，如超时未出场，会继续计费。 | |
| 539 | + | |
| 540 | + $parkName.innerHTML = params.parkName; | |
| 541 | + $inparktime.innerHTML = params.inparktime; | |
| 542 | + $staytime.innerHTML = formatSeconds(params.staytime); | |
| 543 | + | |
| 544 | + $due.innerHTML = keepTwoDecimalFull((params.due / 100));//停车总费用 | |
| 545 | + $paid.innerHTML = params.paid; | |
| 546 | + // $discountFee.innerHTML = keepTwoDecimalFull((params.discountFee / 100));//优惠金额 | |
| 547 | + $discountFee.innerHTML = (params.discountFee ) | |
| 548 | + $discountDesc.innerHTML = params.discountDesc; | |
| 549 | + } else { | |
| 550 | + console.log("没有接受到参数"); | |
| 551 | + } | |
| 552 | + }, | |
| 553 | + | |
| 554 | + //查看详情 | |
| 555 | + linkPayDetailClick: function (ev) { | |
| 556 | + var $payDetail = getObjectByID("payDetail"); | |
| 557 | + var $linkPayDetail = getObjectByID("linkPayDetail"); | |
| 558 | + if ($linkPayDetail.innerHTML == "详情+") { | |
| 559 | + $linkPayDetail.innerHTML = "详情-"; | |
| 560 | + $payDetail.style.height = "195px"; | |
| 561 | + } else { | |
| 562 | + $linkPayDetail.innerHTML = "详情+"; | |
| 563 | + $payDetail.style.height = "55px"; | |
| 564 | + } | |
| 565 | + } | |
| 566 | +} | ... | ... |
lockpay.html
0 → 100644
| 1 | +<!doctype html> | |
| 2 | +<html lang="en"> | |
| 3 | +<head> | |
| 4 | + <meta charset="utf-8"> | |
| 5 | + <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> | |
| 6 | + <meta name="theme-color" content="#000000"> | |
| 7 | + <meta name="google" value="notranslate"> | |
| 8 | + <meta name="format-detection" content="telephone=no"> | |
| 9 | + <meta name="format-detection" content="email=no"> | |
| 10 | + <meta name="apple-mobile-web-app-capable" content="yes"> | |
| 11 | + <meta name="apple-mobile-web-app-status-bar-style" content="black"> | |
| 12 | + <meta http-equiv="Pragma" content="no-cache"> | |
| 13 | + <meta http-equiv="Cache-control" content="no-cache"> | |
| 14 | + <meta http-equiv="Cache" content="no-cache"> | |
| 15 | + <meta http-equiv="Expires" content="0"> | |
| 16 | + <link rel="stylesheet" href="css/index.css?v=0.1"> | |
| 17 | + <script src="config.js?v=0.1"></script> | |
| 18 | + <script src="js/common.js?v=1.11"></script> | |
| 19 | + <!--<script src="js/jweixin-1.0.0.js?v=0.1"></script>--> | |
| 20 | + <script src="js/lock.js?v=0.120"></script> | |
| 21 | + <!--<script src="https://gw.alipayobjects.com/as/g/h5-lib/alipayjsapi/3.1.1/alipayjsapi.min.js"></script>--> | |
| 22 | + <!--<script src="config.js"></script>--> | |
| 23 | + <!-- | |
| 24 | + Notice the use of %PUBLIC_URL% in the tags above. | |
| 25 | + It will be replaced with the URL of the `public` folder during the build. | |
| 26 | + Only files inside the `public` folder can be referenced from the HTML. | |
| 27 | + | |
| 28 | + Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will | |
| 29 | + work correctly both with client-side routing and a non-root public URL. | |
| 30 | + Learn how to configure a non-root public URL by running `npm run build`. | |
| 31 | + --> | |
| 32 | + <title>地锁支付</title> | |
| 33 | + <style> | |
| 34 | + .discountBox{ | |
| 35 | + border: 0; | |
| 36 | + outline: 0; | |
| 37 | + width: calc(100% - 120px); | |
| 38 | + height:28px; | |
| 39 | + line-height: 28px; | |
| 40 | + padding-left: 10px; | |
| 41 | + background:rgba(240,244,245,1); | |
| 42 | + border-radius:4px; | |
| 43 | + display: inline-block; | |
| 44 | + float: left; | |
| 45 | + color: #8a8a8a; | |
| 46 | + font-size: 14px; | |
| 47 | + } | |
| 48 | + .discountBox:focus{ | |
| 49 | + border: 0; | |
| 50 | + outline: 0; | |
| 51 | + } | |
| 52 | + .discountBtn{ | |
| 53 | + display: inline-block; | |
| 54 | + float: right; | |
| 55 | + border: none; | |
| 56 | + outline: none; | |
| 57 | + -webkit-appearance: none; | |
| 58 | + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| 59 | + border: 1px solid #75CBBE; | |
| 60 | + border-radius:25px ; | |
| 61 | + padding: 4px 20px; | |
| 62 | + font-size: 14px; | |
| 63 | + color: #75CBBE; | |
| 64 | + background: #fff; | |
| 65 | + } | |
| 66 | + .discount-tip{ | |
| 67 | + padding-top: 10px; | |
| 68 | + font-size: 14px; | |
| 69 | + color: #EB453B; | |
| 70 | + } | |
| 71 | + .paySuccess{ | |
| 72 | + width: 100%; | |
| 73 | + height: 100%; | |
| 74 | + text-align: center; | |
| 75 | + line-height: 100px; | |
| 76 | + font-size: 20px; | |
| 77 | + color: #fff; | |
| 78 | + background: rgba(0,0,0,.7); | |
| 79 | + position: fixed; | |
| 80 | + top:0; | |
| 81 | + left: 0; | |
| 82 | + display: none; | |
| 83 | + } | |
| 84 | + </style> | |
| 85 | +</head> | |
| 86 | +<body> | |
| 87 | +<!--<noscript>--> | |
| 88 | +<!--You need to enable JavaScript to run this app.--> | |
| 89 | +<!--</noscript>--> | |
| 90 | +<header id="header" class="flexBoxRow panelBgColor"> | |
| 91 | + <div class="headerBox"> | |
| 92 | + <div class="carNumBox"><span></span><span id="carNum"></span></div> | |
| 93 | + <div class="moneyBox"><span>￥</span><span id="sumMoney">0.00</span></div> | |
| 94 | + </div> | |
| 95 | +</header> | |
| 96 | +<section id="payDetail" class="panelBgColor marginTop"> | |
| 97 | + <div><span>车场名称:</span><span id="parkName"></span><a id="linkPayDetail">详情+</a> </div> | |
| 98 | + <div><span>停车时长:</span><span id="staytime"></span></div> | |
| 99 | + <div><span>进场时间:</span><span id="inparktime"></span></div> | |
| 100 | + <div><span>停车总费用:</span><span id="due"></span></div> | |
| 101 | + <div><span>已支付金额:</span><span id="paid"></span></div> | |
| 102 | + <div><span>优惠金额:</span><span id="discountFee"></span><span id="discountDesc"></span></div> | |
| 103 | + <div><span>订单编号: </span><span id="orderNum">1234567890</span> </div> | |
| 104 | +</section> | |
| 105 | +<!--<div class="row marginTop">--> | |
| 106 | + <!--<div style="overflow: hidden">--> | |
| 107 | + <!--<input class="discountBox" id="discountBox" type="text" placeholder="请输入优惠券编号" maxlength="20">--> | |
| 108 | + <!--<button class="discountBtn" id="discountBtn">兑换</button>--> | |
| 109 | + <!--</div>--> | |
| 110 | + <!--<div class="discount-tip" id="discountTip"></div>--> | |
| 111 | +<!--</div>--> | |
| 112 | +<section id="section" class="marginTop"> | |
| 113 | + <div class="flexBoxRow" > | |
| 114 | + <span class="payWayTitle" style="padding-left: 10px;">选择支付方式</span> <span class="orderTime colorGray">出场时间: <span id="outtime"></span></span> | |
| 115 | + </div> | |
| 116 | + <div class="row marginTop"> | |
| 117 | + <!--AliPay--> | |
| 118 | + <div class="flexBoxRow" id="rowAliPay"> | |
| 119 | + <img class="payIcon" src="img/aliPay.png" /> | |
| 120 | + <span class="marginLeft">支付宝支付</span> | |
| 121 | + <label for="aliPay" class="radio"> | |
| 122 | + <span class="radio-bg"></span> | |
| 123 | + <input type="radio" name="radioPayWay" id="aliPay" value="支付宝" checked="checked" /> | |
| 124 | + <span class="radio-on"></span> | |
| 125 | + </label> | |
| 126 | + </div> | |
| 127 | + <hr class="splitLine marginTop" id="splitLine" /> | |
| 128 | + <!--WxPay--> | |
| 129 | + <div class="flexBoxRow marginTop" id="rowWxPay"> | |
| 130 | + <img class="payIcon" src="img/wxPay.png" /> | |
| 131 | + <span class="marginLeft">微信支付</span> | |
| 132 | + <label for="wxPay" class="radio"> | |
| 133 | + <span class="radio-bg"></span> | |
| 134 | + <input type="radio" name="radioPayWay" id="wxPay" value="微信" /> | |
| 135 | + <span class="radio-on"></span> | |
| 136 | + </label> | |
| 137 | + </div> | |
| 138 | + </div> | |
| 139 | +</section> | |
| 140 | +<footer id="footer" class="flexBoxRow marginTop"> | |
| 141 | + <div class="btnOK" id="btnPayOK">确定支付</div> | |
| 142 | + <img src="img/loading.gif" id="loading" style="display: none;" /> | |
| 143 | +</footer> | |
| 144 | +<section id="payTip" style="padding: 10px;margin-top:5px; color: #3385ff; font-size: 14px; "></section> | |
| 145 | +<div class="paySuccess" id="paySuccess">支付成功，请立即离场</div> | |
| 146 | +<!-- | |
| 147 | + This HTML file is a template. | |
| 148 | + If you open it directly in the browser, you will see an empty page. | |
| 149 | + | |
| 150 | + You can add webfonts, meta tags, or analytics to this file. | |
| 151 | + The build step will place the bundled scripts into the <body> tag. | |
| 152 | + | |
| 153 | + To begin the development, run `npm start` or `yarn start`. | |
| 154 | + To create a production bundle, use `npm run build` or `yarn build`. | |
| 155 | +--> | |
| 156 | +</body> | |
| 157 | + | |
| 158 | +</html> | ... | ... |