import {Component, Vue} from 'vue-property-decorator'; import Http from '../../extend/Http'; import Utils from '../../extend/Utils'; import wx from 'weixin-jsapi'; import router from '@/router'; import {MessageBox} from 'element-ui'; // import 'vue-router/types/vue'; @Component({ components: {} }) export default class UserIndex extends Vue { public data: any = { hour: 0, minute: 0, second: 0, orderSn: '0', totalCharge: '0', payment: 'weixin', model: false, html:'', zhifupay:true, isShowA:true, isShowB: false, isShowC: true, recharfe: true }; private closeTime: string = '0'; private timer: number = 0; async created() { let url = Utils.getInstance().getParams(location.href); console.log(url) if(url.tip == 'yes'){ this.data.model = true; }else{ this.data.model = false; } let isWeiXin = () => { return navigator.userAgent.toLowerCase().indexOf('micromessenger') !== -1 } if (isWeiXin()) { this.data.zhifupay = false } } mounted() { if( this.$route.params.type == '1'){ let info = JSON.parse(localStorage.getItem('order_paying') as string); // this.closeTime = info.close_timestamp; this.data.totalCharge = info.total_charge; this.data.orderSn = info.order_sn; }else{ let info = JSON.parse(localStorage.getItem('order_payings') as string); // this.closeTime = info.close_timestamp; this.data.totalCharge = info.total_charge; this.data.orderSn = info.order_sn; } if (this.$route.params.recharfe) { this.data.recharfe = false } } hideModel() { this.data.model = false; router.replace({ name: 'olist' }); } open() { // @ts-ignore MessageBox.alert('' + Http.PHONE + '', '请联系客服', { dangerouslyUseHTMLString: true, confirmButtonText: "拨打" , beforeClose: (action, instance, done) => { window.location.href = 'tel://' +Http.PHONE; done() } }).then(action =>{ }); } weixin(){ this.data.isShowA = !this.data.isShowA; this.data.isShowB = false } zhifubao(){ this.data.isShowB = !this.data.isShowB; this.data.isShowA = false } gzhweixin(){ this.data.isShowC = true } zongpay(){ let isWeiXin = () => { return navigator.userAgent.toLowerCase().indexOf('micromessenger') !== -1 } if (isWeiXin()) { this.weixinpayment() }else { if( this.data.isShowA == true ){ this.payment(); } if(this.data.isShowB == true){ this.alipayment(); } } } async payment() { // let res = await Http.getInstance().payOrder({ // order_sn: this.data.orderSn, platform: platform, remark: '订单支付' // }); // let res = await Http.getInstance().getWeixin({ // order_sn: this.data.orderSn, // platform: 'weixin', // pay:'wappay' // }); // 社保支付 // let res = await Http.getInstance().getWeixin({ // order_sn: this.data.orderSn, // platform: 'weixin', // pay:'wappay' // }); // 合并 let res if (this.data.recharfe) { res = await Http.getInstance().getWeixin({ order_sn: this.data.orderSn, platform: 'weixin', pay:'wappay' }); // console.log('社保支付',res) } else { res = await Http.getInstance().RechargeOrderPay({ order_sn: this.data.orderSn, platform: 'weixin', pay:'wappay' }); // console.log('卡支付',res) } window.location.replace( res.data.mweb_url+'&redirect_url='+encodeURIComponent(window.location.href+'?tip=yes')) // console.log(this.data.orderSn) // this.data.model = true; // this.data.payment = platform; // switch (platform) { // case 'weixin': // // this.wxpay(res.data); // this.data.payment = 'weixin'; // break; // case 'alipay': // // this.alipay(res.data); // break; // case 'union': // // this.unionpay(res.data); // break; // } } async alipayment() { // 社保 // let res = await Http.getInstance().getAlipay({ // order_sn: this.data.orderSn, // platform: 'alipay', // pay:'wappay' // }); // 合并后 let res if (this.data.recharfe) { res = await Http.getInstance().getAlipay({ order_sn: this.data.orderSn, platform: 'alipay', pay:'wappay' }); } else { res = await Http.getInstance().RechargeOrderPay({ order_sn: this.data.orderSn, platform: 'alipay', pay:'wappay' }); } console.log(res.data) this.data.model = true; this.data.html = res.data let form= res.data; const div = document.createElement('div') div.innerHTML = form//此处form就是后台返回接收到的数据 document.body.appendChild(div) document.forms[0].submit() } async weixinpayment() { let openid = localStorage.getItem('openid'); let res if (this.data.recharfe) { console.log(123); res = await Http.getInstance().getWeixin({ order_sn: this.data.orderSn, platform: 'weixin', pay: 'wxpay', openid: openid }); } else { console.log(111); res = await Http.getInstance().RechargeOrderPay({ order_sn: this.data.orderSn, platform: 'weixin', pay: 'wxpay', openid: openid }); } res.data.jsApiList = ['chooseWXPay']; console.log(res.data) //wx.config(res.data); wx.config({ debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。 appId: res.data.appId, // 必填,公众号的唯一标识 timestamp: res.data.timeStamp, // 必填,生成签名的时间戳 nonceStr: res.data.nonceStr, // 必填,生成签名的随机串 signature: res.data.paySign,// 必填,签名,见附录1 https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115 jsApiList: ['chooseWXPay']//['chooseWXPay'] // getBrandWCPayquest 必填,需要使用的JS接口列表,这里只写支付的 }); wx.ready(() => { wx.chooseWXPay({ timestamp: res.data.timeStamp, // 支付签名时间戳,注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符 nonceStr: res.data.nonceStr, // 支付签名随机串,不长于 32 位 package: res.data.package, // 统一支付接口返回的prepay_id参数值,提交格式如:prepay_id=***) signType: res.data.signType, // 签名方式,默认为'SHA1',使用新版支付需传入'MD5' paySign: res.data.paySign, // 支付签名 success: (r) => { // alert('支付成功'); if (r.errMsg == "chooseWXPay:ok") { alert('支付成功'); if (this.data.recharfe) { router.replace('/order/list'); } else { router.replace('/recharge/list'); } } else { alert('支付失败') if (this.data.recharfe) { router.replace('/order/list'); } else { router.replace('/recharge/list'); } } }, cancel: (r) => { //支付取消 alert('支付取消') if (this.data.recharfe) { router.replace('/order/list'); } else { router.replace('/recharge/list'); } }, fail: (res) => { alert('支付失败'); if (this.data.recharfe) { router.replace('/order/list'); } else { router.replace('/recharge/list'); } } }); }); } private countTime(datetime: any): any { this.timer = setInterval(() => { // 获取当前时间 let now = new Date().getTime(); // 设置截止时间 let end = new Date(datetime).getTime(); // 时间差 let left = end - now; if (left > 0) { this.data.hour = Utils.getInstance().prefixInteger(Math.floor(left / 3600000)); this.data.minute = Utils.getInstance().prefixInteger(Math.floor((left / 60000) % 60)); this.data.second = Utils.getInstance().prefixInteger(Math.floor((left / 1000) % 60)); } else { clearInterval(this.timer); router.replace({ name: 'olist', }); } }, 1000); } async wxpay(data: any) { // let info = JSON.parse(localStorage.getItem('order_paying') || ''); // console.log('info'); // let resss = await Http.getInstance().getConfig({ // platform: 'weixin', // order_sn: info.order_sn, // url: location.href.slice(0, -7) // }); // console.log(resss) let openid = localStorage.getItem('openid'); let res = await Http.getInstance().getWeixin({ order_sn: this.data.orderSn, platform: 'weixin', pay:'wxpay', openid:openid }); res.data.jsApiList = ['chooseWXPay']; wx.config(res.data); wx.ready(() => { wx.chooseWXPay({ timestamp: res.data.timestamp, // 支付签名时间戳,注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符 nonceStr: res.data.nonceStr, // 支付签名随机串,不长于 32 位 package: res.data.prepay_id, // 统一支付接口返回的prepay_id参数值,提交格式如:prepay_id=\*\*\*) signType: res.data.signType, // 签名方式,默认为'SHA1',使用新版支付需传入'MD5' paySign: res.data.paySign, // 支付签名 success: (res: any) => { alert(res); if (res) { // localStorage.removeItem('order_paying'); // router.replace('orderList'); } else { } } }); }); wx.error((err: any) => { alert(JSON.stringify(err)); }); } private alipay(data: any) { } private unionpay(data: any) { } }