|
|
|
@ -2,12 +2,12 @@ |
|
|
|
|
<view> |
|
|
|
|
<!-- 头部 --> |
|
|
|
|
<view class="width100 height120 backcorfff"> |
|
|
|
|
<image src="../../../static/img/noorder.png" class="flleft conImg mart10 margle10"></image> |
|
|
|
|
<image :src="orderList.goodsImg" class="flleft conImg mart10 margle10"></image> |
|
|
|
|
<view class="conCont paddtop15"> |
|
|
|
|
<view class="font20 fontwig6 fcor333 text1 paddtright10">乌江能源加油站(大一型国企)</view> |
|
|
|
|
<view class="font14 fcor999 text2 paddtop5 paddtright10">贵州省贵阳市什么什么大道65号</view> |
|
|
|
|
<view class="font20 fontwig6 fcoreb5 paddtop5">¥6.40 |
|
|
|
|
<text class="margle10 slogan font14">¥6.38</text> |
|
|
|
|
<view class="font20 fontwig6 fcor333 text1 paddtright10">{{orderList.goodsName}}</view> |
|
|
|
|
<view class="font14 fcor999 text2 paddtop5 paddtright10">{{refulAdress}}</view> |
|
|
|
|
<view class="font20 fontwig6 fcoreb5 paddtop5">¥{{orderList.gasPriceVip}} |
|
|
|
|
<text class="margle10 slogan font14">¥{{orderList.gasPriceGun}}</text> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
@ -19,7 +19,7 @@ |
|
|
|
|
油号\油枪 |
|
|
|
|
</view> |
|
|
|
|
<view class="flright width40 fotct"> |
|
|
|
|
92#/2号 |
|
|
|
|
{{orderList.gasOilNo}}#/{{orderList.gasGunNo}}号 |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="line1"></view> |
|
|
|
@ -28,31 +28,170 @@ |
|
|
|
|
加油金额 |
|
|
|
|
</view> |
|
|
|
|
<view class="flright width40 fotct"> |
|
|
|
|
500 |
|
|
|
|
{{orderList.totalPrice}} |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
<view class="width100 mart15 fcor333 font16 fontwig6 paddleft10">重要说明</view> |
|
|
|
|
<view class="width95 paddleft10 font14 fcor999 mart5">1.<text class="fcor089 fontwig6">请先加油后下单</text>,即您到站后,与工作人员确认油号,抢号后再付款。</view> |
|
|
|
|
<view class="width95 paddleft10 font14 fcor999 mart5">2.请勿先付款后加油,若您已下单付款。请于24小时内到加油站完成加油;若您48小时内未完成加油,请及时发起退单;逾期退单可能会退单失败。</view> |
|
|
|
|
<view class="width95 paddleft10 font14 fcor999 mart5">1.<text |
|
|
|
|
class="fcor089 fontwig6">请先加油后下单</text>,即您到站后,与工作人员确认油号,抢号后再付款。</view> |
|
|
|
|
<view class="width95 paddleft10 font14 fcor999 mart5"> |
|
|
|
|
2.请勿先付款后加油,若您已下单付款。请于24小时内到加油站完成加油;若您48小时内未完成加油,请及时发起退单;逾期退单可能会退单失败。</view> |
|
|
|
|
<!-- 底部按钮 --> |
|
|
|
|
<view class="footer"> |
|
|
|
|
<view class="width50 flleft fcoreb5 padleft15 font15"> |
|
|
|
|
合计: ¥<text class="font24">0.00</text> |
|
|
|
|
合计: ¥<text class="font24">{{payprice}}</text> |
|
|
|
|
</view> |
|
|
|
|
<button class="reBtn flright">去支付</button> |
|
|
|
|
<button class="reBtn flright" @click="orderToPay">去支付</button> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
<script> |
|
|
|
|
import { |
|
|
|
|
getOrderById, |
|
|
|
|
orderToPay |
|
|
|
|
} from '../../../Utils/Api.js'; |
|
|
|
|
let app = getApp(); |
|
|
|
|
// #ifdef H5 |
|
|
|
|
var jweixin = require('jweixin-module'); |
|
|
|
|
// #endif |
|
|
|
|
export default { |
|
|
|
|
data() { |
|
|
|
|
return { |
|
|
|
|
|
|
|
|
|
orderNo: '', |
|
|
|
|
couponId: '', |
|
|
|
|
payprice: '', |
|
|
|
|
orderList: '', |
|
|
|
|
refulAdress: '' |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
onLoad(e) { |
|
|
|
|
this.payprice = e.payprice; |
|
|
|
|
this.orderNo = e.orderId; |
|
|
|
|
this.couponId = e.couponId; |
|
|
|
|
this.refulAdress = e.adres; |
|
|
|
|
this.getOrderById(); |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
getOrderById() { |
|
|
|
|
uni.showLoading({ |
|
|
|
|
title: '加载中...' |
|
|
|
|
}) |
|
|
|
|
let params = { |
|
|
|
|
orderId: this.orderNo, |
|
|
|
|
} |
|
|
|
|
getOrderById(params).then(res => { |
|
|
|
|
uni.hideLoading(); |
|
|
|
|
if (res.return_code == '000000') { |
|
|
|
|
this.orderList = res.return_data.highChildOrderList[0]; |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
//获取订单数据 |
|
|
|
|
orderToPay() { |
|
|
|
|
let that = this; |
|
|
|
|
let params = { |
|
|
|
|
"orderId": that.orderNo, |
|
|
|
|
"openId": app.globalData.openId, |
|
|
|
|
"orderScene": "GOODS_ORDER" |
|
|
|
|
} |
|
|
|
|
orderToPay(params).then(res => { |
|
|
|
|
if (res.return_code == '000000') { |
|
|
|
|
// #ifdef MP |
|
|
|
|
uni.showLoading({ |
|
|
|
|
title: '支付中...' |
|
|
|
|
}) |
|
|
|
|
uni.requestPayment({ |
|
|
|
|
"appId": res.return_data.appId, |
|
|
|
|
"nonceStr": res.return_data.nonceStr, |
|
|
|
|
"package": res.return_data.package, |
|
|
|
|
"paySign": res.return_data.sign, |
|
|
|
|
"signType": "MD5", |
|
|
|
|
"timeStamp": res.return_data.timeStamp, |
|
|
|
|
success: function(res) { |
|
|
|
|
uni.hideLoading(); |
|
|
|
|
uni.showToast({ |
|
|
|
|
title: '支付成功' |
|
|
|
|
}) |
|
|
|
|
uni.reLaunch({ |
|
|
|
|
url: '/pages/goods/refuel-succes/refuel-succes?id=' + that |
|
|
|
|
.orderNo |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
fail: function(err) { |
|
|
|
|
uni.hideLoading(); |
|
|
|
|
}, |
|
|
|
|
}); |
|
|
|
|
// #endif |
|
|
|
|
|
|
|
|
|
//判断是否是公众号 |
|
|
|
|
// #ifdef H5 |
|
|
|
|
//判断微信浏览器 |
|
|
|
|
that.payRequest(res); |
|
|
|
|
// #endif |
|
|
|
|
|
|
|
|
|
} else { |
|
|
|
|
uni.showToast({ |
|
|
|
|
title: res.return_msg, |
|
|
|
|
icon: 'none' |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
payRequest: function(self) { |
|
|
|
|
uni.showLoading({ |
|
|
|
|
title: '支付中...' |
|
|
|
|
}) |
|
|
|
|
jweixin.config({ |
|
|
|
|
// debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。 |
|
|
|
|
appId: self.return_data.appId, // 必填,公众号的唯一标识 |
|
|
|
|
timestamp: self.return_data.timeStamp, // 必填,生成签名的时间戳 |
|
|
|
|
nonceStr: self.return_data.nonceStr, // 必填,生成签名的随机串 |
|
|
|
|
signature: self.return_data.sign, // 必填,签名,见附录1 |
|
|
|
|
jsApiList: ['chooseWXPay'] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2 |
|
|
|
|
}); |
|
|
|
|
uni.hideLoading(); |
|
|
|
|
jweixin.ready(function() { |
|
|
|
|
jweixin.checkJsApi({ |
|
|
|
|
jsApiList: ['chooseWXPay'], // 需要检测的JS接口列表,所有JS接口列表见附录2, |
|
|
|
|
success: function(res) {}, |
|
|
|
|
fail: function(res) {} |
|
|
|
|
}); |
|
|
|
|
jweixin.chooseWXPay({ |
|
|
|
|
appId: self.return_data.appId, |
|
|
|
|
timestamp: self.return_data |
|
|
|
|
.timeStamp, // 支付签名时间戳,注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符 |
|
|
|
|
nonceStr: self.return_data.nonceStr, // 支付签名随机串,不长于 32 位 |
|
|
|
|
package: self.return_data |
|
|
|
|
.package, // 统一支付接口返回的prepay_id参数值,提交格式如:prepay_id=***) |
|
|
|
|
signType: 'MD5', // 签名方式,默认为'SHA1',使用新版支付需传入'MD5' |
|
|
|
|
paySign: self.return_data.sign, // 支付签名 |
|
|
|
|
success: function(res) { |
|
|
|
|
// 支付成功后的回调函数 |
|
|
|
|
uni.showToast({ |
|
|
|
|
title: '支付成功' |
|
|
|
|
}) |
|
|
|
|
uni.reLaunch({ |
|
|
|
|
url: '/pages/goods/refuel-succes/refuel-succes?id=' + that |
|
|
|
|
.orderNo |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
cancel: function(r) {}, |
|
|
|
|
fail: function(res) {} |
|
|
|
|
}); |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
jweixin.error(function(res) { |
|
|
|
|
uni.showToast({ |
|
|
|
|
icon: 'none', |
|
|
|
|
title: '支付失败了', |
|
|
|
|
duration: 4000 |
|
|
|
|
}); |
|
|
|
|
// config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。 |
|
|
|
|
/*alert("config信息验证失败");*/ |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
} |
|
|
|
@ -62,18 +201,22 @@ |
|
|
|
|
page { |
|
|
|
|
background-color: #f7f7f7; |
|
|
|
|
} |
|
|
|
|
.conImg{ |
|
|
|
|
|
|
|
|
|
.conImg { |
|
|
|
|
width: 100px; |
|
|
|
|
height: 100px; |
|
|
|
|
border-radius: 8px; |
|
|
|
|
} |
|
|
|
|
.conCont{ |
|
|
|
|
|
|
|
|
|
.conCont { |
|
|
|
|
margin-left: 115px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.slogan { |
|
|
|
|
color: #807c87; |
|
|
|
|
text-decoration: line-through; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.footer { |
|
|
|
|
position: fixed; |
|
|
|
|
bottom: 0upx; |
|
|
|
@ -86,7 +229,8 @@ |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
align-items: center; |
|
|
|
|
.reBtn{ |
|
|
|
|
|
|
|
|
|
.reBtn { |
|
|
|
|
width: 110px; |
|
|
|
|
background-color: #089bf5; |
|
|
|
|
color: #FFFFFF; |
|
|
|
|