zhangjing/ysdH5
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

[本时生活h5端]

Browse Source
This commit is contained in:
张慢慢
2023-06-21 17:19:58 +08:00
commit ebb9575bd0
284 changed files with 39689 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

708
pages/cashier/index.vue Normal file
View File

@@ -0,0 +1,708 @@
<template>
<view>
<view class="cashierTips">
<image src="/static/img/cashierTips_icon.png" mode="aspectFill"></image>注：推荐使用沃支付，可在享优惠！
</view>
<view class="cashierCont">
<view class="cashierCont-title">
<text>支付类型</text>线上支付
</view>
<view class="cashierCont-price">
<block v-if="this.defaultType == 'unicom'">
<view class="cashierCont-price-title">
中奖用户0元支付
</view>
<view class="cashierCont-price-title">
具体支付金额以页面显示为准
</view>
</block>
<block v-else>
<view class="cashierCont-price-title">
付款金额
</view>
<view class="cashierCont-price-number">
￥{{ defaultPrice }}
</view>
</block>
</view>
<view class="cashierCont-pay">
<view class="cashierCont-pay-title">
付款方式<text>*</text>
</view>
<view class="cashierCont-pay-way">
<radio-group @change="radioChange" v-if="this.defaultType == 'unicom'">
<view class="cashierCont-way-label cashierCont-way-unicom" :class="{active : current == 1}">
<view class="payContList-label-name">
<image class="payContList-label-img" src="/static/img/wqb.jpg"></image>
<text>沃支付支付</text>
</view>
<radio class="radio" value="1" checked></radio>
</view>
</radio-group>
<radio-group @change="radioChange" v-else>
<view class="cashierCont-way-label" :class="{active : current == 1}">
<view class="payContList-label-name">
<image class="payContList-label-img" src="/static/img/wqb.jpg"></image>
<text>沃支付支付</text>
</view>
<radio class="radio" value="1" checked></radio>
</view>
<view class="cashierCont-way-label" :class="{active : current == 2}" v-if="this.defaultType != 'unicom'">
<view class="payContList-label-name">
<image class="payContList-label-img" src="/static/img/wx.jpg"></image>
<text>微信支付</text>
</view>
<radio class="radio" value="2"></radio>
</view>
</radio-group>
</view>
<button class="payBtn" @tap="submitPay" :disabled="disabledOk">立即支付</button>
</view>
</view>
</view>
</template>
<script>
import { getAuthUrl, wpayH5Info, h5Pay } from '@/apis/interfaces/rights'
const jweixin = require('jweixin-module'); //获取微信支付
export default {
data() {
return {
defaultPrice : '', //支付金额
disabledOk : false, //支付按钮状态
current : 1, //支付下标
defaultNo : '', //权益订单编号
defaultType : '', //购买类型 school为校园活动 oil为中石油活动 default为洗车券+权益+周五福利 giftPEnv为月兑活动
activityType : '', //活动类型 welfare为周五福利日 right为权益
defaultDeliver : '' //提交方式 0为快递 1为自提
}
},
// 生命周期函数--监听页面加载
onLoad(options) {
// 判断是否微信授权登录过 只有外部游览器才用到（支付需要授权微信环境）
let status = navigator.userAgent.toLowerCase();
if (status.match(/MicroMessenger/i) == "micromessenger" && !options.code) {
let locationUrl = window.location.pathname.substr(1) + window.location.search
getAuthUrl(locationUrl).then(res=> {
window.location.href = res
})
}
this.openid = options.openid || ''
this.code = options.code || '' //用code换取oppid
// 页面跳转参数接收
this.defaultPrice = options.price
this.defaultNo = options.tradeNo
this.defaultType = options.type
this.activityType = options.activity_type
this.defaultDeliver = options.deliver
},
// 生命周期函数--监听页面显示
onShow() {
// 存储环境-月兑活动
getApp().globalData.envType = 'giftPEnv'
},
methods: {
// 支付方式选择
radioChange(e) {
this.current = e.detail.value
},
// 支付提交
submitPay() {
// this.current为1的时候为沃支付-直接跳转h5
if (this.current == 1) {
// const newUrl = "https://lifetest.ysd-bs.com/unicom/payment?trade_no=" + this.defaultNo // 测试地址
const newUrl = "https://card.ysd-bs.com/unicom/payment?trade_no=" + this.defaultNo // 正式地址
window.location.href = newUrl
}
// this.current为1的时候为微信支付
if (this.current == 2) {
// 调取微信支付
this.wechatPayment();
}
},
// 微信支付数据
wechatPayment() {
let status = navigator.userAgent.toLowerCase();
if (status.match(/MicroMessenger/i) == "micromessenger") {
// 微信浏览器-获取
this.wxBrowser();
}else {
// 普通浏览器(网址游览器)
this.outBrowser();
}
},
// 当支付环境为微信游览器情况下
wxBrowser() {
wpayH5Info({
url: location.href.split('#')[0],
list:'chooseWXPay'
}).then(wechatConfig => {
let wxConfig = JSON.parse(wechatConfig)
jweixin.config({
appId: wxConfig.appId,
debug: false,
jsApiList: wxConfig.jsApiList,
signature: wxConfig.signature,
nonceStr: wxConfig.nonceStr,
timestamp: wxConfig.timestamp
})
jweixin.ready(() => {
// activityType=right为权益 支付; activityType=welfare为周五福利日 支付
let wechaUrl = '' // 定义接口来源名称
if (this.activityType == 'welfare') wechaUrl = 'payments/welfare/wechat'// 周五福利日支付接口
if (this.activityType == 'right') wechaUrl = 'payments/wechat' //权益支付接口
h5Pay(wechaUrl, {
channel: 'h5',
trade_no: this.defaultNo,
code: this.code
}).then(wechatRes => {
let wechatPay = JSON.parse(wechatRes)
jweixin.chooseWXPay({
timestamp: wechatPay.timeStamp,
nonceStr: wechatPay.nonceStr,
package: wechatPay.package,
signType: wechatPay.signType,
paySign: wechatPay.paySign,
success: payRes => {
this.disabledOk = true
uni.showToast({
title: '支付成功',
icon : 'success'
})
// 校园活动成功跳转
if(this.defaultType == 'school') {
setTimeout(()=>{
uni.reLaunch({
url: '/pages/campus/myCoupon'
})
},3000)
}
// 中石油活动活动成功跳转
if(this.defaultType == 'oil') {
setTimeout(()=>{
uni.reLaunch({
url: '/pages/oil/myCoupon'
})
},3000)
}
// 中国联通回馈活动成功跳转
if(this.defaultType == 'unicom') {
setTimeout(()=>{
uni.reLaunch({
url: '/pages/unicom/index'
})
},3000)
}
// 月兑活动成功跳转
if(this.defaultType == 'giftPEnv') {
setTimeout(()=>{
uni.reLaunch({
url: '/pages/giftPack/index'
})
},3000)
}
// 洗车券+权益+福利成功跳转 获取
if(this.defaultType == 'default') {
this.successUrl();
}
},
cancel: () =>{
this.disabledOk = true
uni.showToast({
title: '取消支付',
icon : 'success'
})
// 校园活动失败跳转
if(this.defaultType == 'school') {
setTimeout(()=>{
uni.reLaunch({
url: '/pages/campus/index'
})
},3000)
}
// 中石油活动活动成功跳转
if(this.defaultType == 'oil') {
setTimeout(()=>{
uni.reLaunch({
url: '/pages/oil/index'
})
},3000)
}
// 月兑活动成功跳转
if(this.defaultType == 'giftPEnv') {
setTimeout(()=>{
uni.reLaunch({
url: '/pages/giftPack/index'
})
},3000)
}
// 中国联通回馈活动成功跳转
if(this.defaultType == 'unicom') {
setTimeout(()=>{
uni.reLaunch({
url: '/pages/unicom/index'
})
},3000)
}
// 洗车券+权益+福利失败跳转 获取
if(this.defaultType == 'default') {
this.failUrl();
}
}
})
})
})
}).catch(err => {
uni.showToast({
title: err.message,
icon: 'none'
})
if (!err.login) {
// 跳转校园活动登录页面
if (this.defaultType == 'school') {
uni.showModal({
title: '用户登录已过期',
content: '请重新登录',
showCancel: false,
success: res => {
if (res.confirm) {
uni.reLaunch({
url: '/pages/campus/signin'
});
}
}
})
}
// 跳转中石油活动登录页面
if (this.defaultType == 'oil') {
uni.showModal({
title: '用户登录已过期',
content: '请重新登录',
showCancel: false,
success: res => {
if (res.confirm) {
uni.reLaunch({
url: '/pages/oil/signin'
});
}
}
})
}
// 月兑活动成功跳转
if(this.defaultType == 'giftPEnv') {
uni.showModal({
title: '用户登录已过期',
content: '请重新登录',
showCancel: false,
success: res => {
if (res.confirm) {
uni.reLaunch({
url: '/pages/giftPack/signin'
});
}
}
})
}
// 中国联通回馈活动成功跳转
if (this.defaultType == 'unicom') {
uni.showModal({
title: '用户登录已过期',
content: '请重新登录',
showCancel: false,
success: res => {
if (res.confirm) {
uni.reLaunch({
url: '/pages/unicom/signin'
});
}
}
})
}
// 跳转本时生活平台登录页面
if (this.defaultType == 'default') {
uni.showModal({
title: '用户登录已过期',
content: '请重新登录',
showCancel: false,
success: res => {
if (res.confirm) {
uni.reLaunch({
url: '/pages/auth/login'
});
}
}
})
}
}
})
},
// 车券+权益+福利成功跳转 数据
successUrl() {
if(this.activityType == 'welfare'){
setTimeout(()=>{
if(this.defaultDeliver == 1) {
uni.reLaunch({
url: '/pages/order/order?orderType=welfareGoods'
})
} else {
uni.reLaunch({
url: '/pages/order/order?orderType=welfare'
})
}
},3000)
}
if(this.activityType == 'right'){
setTimeout(()=>{
if(this.defaultDeliver == 1) {
uni.reLaunch({
url: '/pages/order/order?orderType=rightsCoupons'
})
} else {
uni.reLaunch({
url: '/pages/order/order?orderType=rights'
})
}
},3000)
}
},
// 车券+权益+福利失败跳转 数据
failUrl() {
if(this.activityType == 'welfare'){
setTimeout(()=>{
if(this.defaultDeliver == 1) {
uni.reLaunch({
url: '/pages/order/order?orderType=welfareGoods&stateType=unpay'
})
} else {
uni.reLaunch({
url: '/pages/order/order?orderType=welfare&stateType=unpay'
})
}
},3000)
}
if(this.activityType == 'right'){
setTimeout(()=>{
if(this.defaultDeliver == 1) {
uni.reLaunch({
url: '/pages/order/order?orderType=rightsCoupons&stateType=unpay'
})
} else {
uni.reLaunch({
url: '/pages/order/order?orderType=rights&stateType=unpay'
})
}
},3000)
}
},
// 当为外部游览器环境
outBrowser(){
wechatH5({
channel: 'mweb',
trade_no: this.defaultNo
}).then(mwebRes => {
let url = mwebRes
let newUrl = ''
// 校园活动购买
if(this.defaultType == 'school') {
newUrl = url + '&redirect_url=' + window.location.protocol + '//' + window.location.host + '/pages/campus/myCoupon'
// #ifdef H5
window.location.href = newUrl
// #endif
}
// 中石油活动购买
if(this.defaultType == 'oil') {
newUrl = url + '&redirect_url=' + window.location.protocol + '//' + window.location.host + '/pages/oil/myCoupon'
// #ifdef H5
window.location.href = newUrl
// #endif
}
// 月兑活动成功跳转
if(this.defaultType == 'giftPEnv') {
newUrl = url + '&redirect_url=' + window.location.protocol + '//' + window.location.host + '/pages/giftPack/myCoupon'
// #ifdef H5
window.location.href = newUrl
// #endif
}
// 中国联通回馈活动购买
if(this.defaultType == 'unicom') {
newUrl = url + '&redirect_url=' + window.location.protocol + '//' + window.location.host + '/pages/unicom/index'
// #ifdef H5
window.location.href = newUrl
// #endif
}
// 洗车券+权益+福利购买
if(this.defaultType == 'default') {
if (this.activityType == 'welfare') {
if (this.defaultDeliver == 1) {
newUrl = url + '&redirect_url=' + window.location.protocol + '//' + window.location.host + '/pages/order/order?orderType=welfareGoods'
// #ifdef H5
window.location.href = newUrl
// #endif
} else {
newUrl = url + '&redirect_url=' + window.location.protocol + '//' + window.location.host + '/pages/order/order?orderType=welfare'
// #ifdef H5
window.location.href = newUrl
// #endif
}
}
if (this.activityType == 'right') {
if (this.defaultDeliver == 1) {
newUrl = url + '&redirect_url=' + window.location.protocol + '//' + window.location.host + '/pages/order/order?orderType=rightsCoupons'
// #ifdef H5
window.location.href = newUrl
// #endif
} else {
newUrl = url + '&redirect_url=' + window.location.protocol + '//' + window.location.host + '/pages/order/order?orderType=rights'
// #ifdef H5
window.location.href = newUrl
// #endif
}
}
}
}).catch(err => {
uni.showToast({
title: err.message,
icon: 'none'
})
// 跳转校园活动登录页面
if (this.defaultType == 'school') {
if (!err.login) {
uni.showModal({
title: '用户登录已过期',
content: '请重新登录',
showCancel: false,
success: res => {
if (res.confirm) {
uni.redirectTo({
url: '/pages/campus/signin'
});
}
}
})
}
}
// 跳转中石油活动登录页面
if (this.defaultType == 'oil') {
if (!err.login) {
uni.showModal({
title: '用户登录已过期',
content: '请重新登录',
showCancel: false,
success: res => {
if (res.confirm) {
uni.redirectTo({
url: '/pages/oil/signin'
});
}
}
})
}
}
// 月兑活动成功跳转
if(this.defaultType == 'giftPEnv') {
uni.showModal({
title: '用户登录已过期',
content: '请重新登录',
showCancel: false,
success: res => {
if (res.confirm) {
uni.reLaunch({
url: '/pages/giftPack/signin'
});
}
}
})
}
// 中国联通回馈活动登录页面
if (this.defaultType == 'unicom') {
if (!err.login) {
uni.showModal({
title: '用户登录已过期',
content: '请重新登录',
showCancel: false,
success: res => {
if (res.confirm) {
uni.redirectTo({
url: '/pages/unicom/signin'
});
}
}
})
}
}
// 跳转本时生活平台登录页面
if (this.defaultType == 'default') {
if (!err.login) {
uni.showModal({
title: '用户登录已过期',
content: '请重新登录',
showCancel: false,
success: res => {
if (res.confirm) {
uni.redirectTo({
url: '/pages/auth/login'
});
}
}
})
}
}
})
}
}
}
</script>
<style lang="scss" scoped>
page {
background-color: #bc1d30;
padding: 40rpx;
box-sizing: border-box;
}
.cashierTips {
background-color: #FFFFFF;
font-weight: 600;
font-size: 30rpx;
border-radius: 10rpx;
margin-bottom: 40rpx;
line-height: 80rpx;
padding: 0 30rpx;
box-sizing: border-box;
color: #e69500;
display: flex;
image {
width: 32rpx;
height: 32rpx;
margin: 24rpx 10rpx 0 0;
}
}
.cashierCont {
width: 100%;
background-color: #ffffff;
padding: 30rpx;
box-sizing: border-box;
border-radius: 20rpx;
overflow: hidden;
}
.cashierCont-title text {
color: #7e7d81;
padding-right: 30rpx;
}
.cashierCont-price {
text-align: center;
margin: 90rpx 0;
color: #bc1d30;
}
.cashierCont-price-title {
font-size: 34rpx;
margin-bottom: 10rpx;
}
.cashierCont-price-number {
font-size: 60rpx;
}
.cashierCont-pay-title {
color: #7e7d81;
margin-bottom: 40rpx;
text{
color: #bc1d30;
padding-left: 10rpx;
}
}
.cashierCont-pay-way {
height: 240rpx;
}
.cashierCont-way-label {
float: left;
border: 2rpx solid #e8e8e8;
box-sizing: border-box;
padding: 30rpx 0;
border-radius: 10rpx;
width: calc(50% - 84rpx);
text-align: center;
margin: 0 40rpx;
font-size: 30rpx;
position: relative;
&.active {
border-color: #bc1d30;
color: #bc1d30;
box-shadow: 0 10rpx 20rpx rgba(188, 29, 48 ,.3);
}
radio {
opacity: 0;
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
}
image {
width: 90rpx;
height: 90rpx;
display: block;
margin: 0 auto 20rpx;
}
}
.cashierCont-way-unicom {
width: calc(100% - 84rpx);
}
.payBtn {
background-color: #bc1d30;
color: #ffffff;
height: 90rpx;
line-height: 90rpx;
width: 100%;
font-size: 32rpx;
padding: 0;
border-radius: 80rpx;
margin: 80rpx 0 40rpx;
}
.payBtn[disabled] {
background: #eaeaea !important;
}
</style>