feat(pay): 添加支付成功页面

This commit is contained in:
woody 2025-07-03 09:40:07 +08:00
parent 665e18d3de
commit 2dc99ba6c2
9 changed files with 909 additions and 545 deletions

View File

@ -20,7 +20,7 @@ module.exports = vm => {
//#ifdef DEV_SERVER
console.log('DEV_SERVER')
config.baseURL = 'http://192.168.0.104:8080'
config.baseURL = 'https://b747-218-57-66-5.ngrok-free.app'
//#endif
//#ifdef QA_SERVER

View File

@ -93,13 +93,18 @@
},
"devServer": {
"https": false,
"port": 8000,
"disableHostCheck": true,
"proxy": {
"/prod-api": {
"target": "http://t-app.beida666.com",
"changeOrigin": true
"target": "http://192.168.0.104:8080",
"changeOrigin": true,
"pathRewrite": {
"^/prod-api": ""
}
}
}
}
},
"fallbackLocale": "zh-Hans"
}
}

View File

@ -5,7 +5,6 @@
"style": {
"navigationBarTitleText": "首页",
"navigationBarBackgroundColor": "#fff",
// "enablePullDownRefresh": true,
"navigationBarHidden": true,
"navigationStyle": "custom"
}
@ -364,6 +363,13 @@
"navigationBarTitleText": "绑定银行卡"
}
},
{
"path": "pages/pay/success",
"style": {
"navigationBarTitleText": "支付成功",
"navigationBarBackgroundColor": "#fff"
}
},
{
"path": "pages/mine/order/index",
"style": {

View File

@ -130,7 +130,7 @@ export default {
},
onLoad() {
let params = {
ifcz: true,
isRecharge: true,
}
this.topList[0].path =
'/pages/pay/index?paramsPost=' + JSON.stringify(params)
@ -257,7 +257,7 @@ export default {
}
} else {
let paramsPost = {
ifcz: true,
isRecharge: true,
}
uni.navigateTo({
url: `${item.path}?paramsPost=${encodeURIComponent(JSON.stringify(paramsPost))}`,

View File

@ -6,193 +6,168 @@
-->
<template>
<view class="content">
<view class="index_header">
</view>
<view class="index_header"> </view>
<view class="contxt">
<template>
<view class="tit">{{'待支付金额'}}</view>
<view class="tit">{{ '待支付金额' }}</view>
<view class="tit1">
{{ paramsPost.orderAmount | numberToCurrency }}
</view>
<view class="tit2">{{'请在'}}
<view class="tit3">{{ countDown }}</view>{{'内完成支付,否则订单将会被自动取消'}}
<view class="tit2"
>{{ '请在' }} <view class="tit3">{{ countDown }}</view
>{{ '内完成支付,否则订单将会被自动取消' }}
</view>
</template>
<!-- 暂时隐藏 -->
<view v-if="false" class="kuang">
<u-collapse :value="activeNames"
ref="collapse"
@open="change"
@close="close"
accordion
:border="false">
<u-collapse
:value="activeNames"
ref="collapse"
@open="change"
@close="close"
accordion
:border="false"
>
<u-collapse-item name="1">
<view slot="title"
class="pf"> <img src="@/static/images/under_pay.png"
alt="" />
<view>{{'在线支付'}}</view>
<view slot="title" class="pf">
<img src="@/static/images/under_pay.png" alt="" />
<view>{{ '在线支付' }}</view>
</view>
<view class="flex_ac"
v-show="this.payList.pay11">
<view class="flex_ac" v-show="this.payList.pay11">
<view class="flex_ac_i">
<img src="@/static/images/pay_i2.png"
alt="" />
<view>{{'宝付微信支付'}}</view>
<img src="@/static/images/pay_i2.png" alt="" />
<view>{{ '宝付微信支付' }}</view>
</view>
<u-radio-group v-model="whatPay">
<u-radio activeColor="red"
size="14"
label=""
:name="11">
<u-radio activeColor="red" size="14" label="" :name="11">
</u-radio>
</u-radio-group>
</view>
<view class="flex_ac"
v-show="this.payList.pay12">
<view class="flex_ac" v-show="this.payList.pay12">
<view class="flex_ac_i">
<img src="@/static/images/pay_i2.png"
alt="" />
<view>{{'宝付微信扫码'}}</view>
<img src="@/static/images/pay_i2.png" alt="" />
<view>{{ '宝付微信扫码' }}</view>
</view>
<u-radio-group v-model="whatPay">
<u-radio activeColor="red"
size="14"
label=""
:name="12">
<u-radio activeColor="red" size="14" label="" :name="12">
</u-radio>
</u-radio-group>
</view>
<view class="flex_ac"
v-show="this.payList.pay13">
<view class="flex_ac" v-show="this.payList.pay13">
<view class="flex_ac_i">
<img src="@/static/images/pay_i2.png"
alt="" />
<view>{{'汇付微信支付'}}</view>
<img src="@/static/images/pay_i2.png" alt="" />
<view>{{ '汇付微信支付' }}</view>
</view>
<u-radio-group v-model="whatPay">
<u-radio activeColor="red"
size="14"
label=""
:name="13">
<u-radio activeColor="red" size="14" label="" :name="13">
</u-radio>
</u-radio-group>
</view>
<view class="flex_ac1"
v-show="this.payList.pay15">
<view class="flex_ac1" v-show="this.payList.pay15">
<view class="flex_ac_i">
<img src="@/static/images/jdBank.jpg"
alt="" />
<view>{{'汇付银行卡'}} ({{ '暂不支持信用卡' }})</view>
<img src="@/static/images/jdBank.jpg" alt="" />
<view>{{ '汇付银行卡' }} ({{ '暂不支持信用卡' }})</view>
</view>
<view class="pad">
<view v-for="(item, index) in hfList"
:key="index"
class="pay_flax flex_bet"
@click.prevent="selPayRadio('hf' + index)">
<view
v-for="(item, index) in hfList"
:key="index"
class="pay_flax flex_bet"
@click.prevent="selPayRadio('hf' + index)"
>
<view class="flax_i">
{{ item.bankName }} ({{ item.bankNo }})
</view>
<u-radio-group v-model="whatPay">
<u-radio activeColor="red"
size="14"
label=''
:name="'hf' + index">
<u-radio
activeColor="red"
size="14"
label=""
:name="'hf' + index"
>
</u-radio>
</u-radio-group>
</view>
<view class="pay_flax flax_i"
@click="bindBank('hf')">
<img class="img1"
src="@/static/images/addto.png"
alt="" />
<view>{{'绑定银行卡'}}</view>
<view class="pay_flax flax_i" @click="bindBank('hf')">
<img class="img1" src="@/static/images/addto.png" alt="" />
<view>{{ '绑定银行卡' }}</view>
</view>
</view>
</view>
<view class="flex_ac"
v-show="this.payList.pay32">
<view class="flex_ac" v-show="this.payList.pay32">
<view class="flex_ac_i">
<img src="@/static/images/pay_i2.png"
alt="" />
<img src="@/static/images/pay_i2.png" alt="" />
<view>通联微信支付</view>
</view>
<u-radio-group v-model="whatPay">
<u-radio activeColor="red"
size="14"
label=""
:name="32">
<u-radio activeColor="red" size="14" label="" :name="32">
</u-radio>
</u-radio-group>
</view>
<view class="flex_ac1"
v-show="this.payList.pay33">
<view class="flex_ac1" v-show="this.payList.pay33">
<view class="flex_ac_i">
<img src="@/static/images/jdBank.jpg"
alt="" />
<view>{{'通联银行卡'}} ({{ '暂不支持信用卡' }})</view>
<img src="@/static/images/jdBank.jpg" alt="" />
<view>{{ '通联银行卡' }} ({{ '暂不支持信用卡' }})</view>
</view>
<view class="pad">
<view v-for="(item, index) in tlList"
:key="index"
class="pay_flax flex_bet"
@click.prevent="selPayRadio('tl' + index)">
<view
v-for="(item, index) in tlList"
:key="index"
class="pay_flax flex_bet"
@click.prevent="selPayRadio('tl' + index)"
>
<view class="flax_i">
{{ item.bankName }} ({{ item.bankNo }})
</view>
<u-radio-group v-model="whatPay">
<u-radio activeColor="red"
size="14"
label=''
:name="'tl' + index">
<u-radio
activeColor="red"
size="14"
label=""
:name="'tl' + index"
>
</u-radio>
</u-radio-group>
</view>
<view class="pay_flax flax_i"
@click="bindBank('tl')">
<img class="img1"
src="@/static/images/addto.png"
alt="" />
<view>{{'绑定银行卡'}}</view>
<view class="pay_flax flax_i" @click="bindBank('tl')">
<img class="img1" src="@/static/images/addto.png" alt="" />
<view>{{ '绑定银行卡' }}</view>
</view>
</view>
</view>
<view class="flex_ac1"
v-show="this.payList.pay4">
<view class="flex_ac1" v-show="this.payList.pay4">
<view class="flex_ac_i">
<img src="@/static/images/jdBank.jpg"
alt="" />
<view>{{'京东银行卡'}} ({{ '暂不支持信用卡' }})</view>
<img src="@/static/images/jdBank.jpg" alt="" />
<view>{{ '京东银行卡' }} ({{ '暂不支持信用卡' }})</view>
</view>
<view class="pad">
<view v-for="(item, index) in jdList"
:key="index"
class="pay_flax flex_bet"
@click.prevent="selPayRadio('jd' + index)">
<view
v-for="(item, index) in jdList"
:key="index"
class="pay_flax flex_bet"
@click.prevent="selPayRadio('jd' + index)"
>
<view class="flax_i">
{{ item.bankName }} ({{ item.bankNo }})
</view>
<u-radio-group v-model="whatPay">
<u-radio activeColor="red"
size="14"
label=''
:name="'jd' + index">
<u-radio
activeColor="red"
size="14"
label=""
:name="'jd' + index"
>
</u-radio>
</u-radio-group>
</view>
<view class="pay_flax flax_i"
@click="bindBank('jd')">
<img class="img1"
src="@/static/images/addto.png"
alt="" />
<view>{{'绑定银行卡'}}</view>
<view class="pay_flax flax_i" @click="bindBank('jd')">
<img class="img1" src="@/static/images/addto.png" alt="" />
<view>{{ '绑定银行卡' }}</view>
</view>
</view>
</view>
</u-collapse-item>
</u-collapse>
</view>
</view>
@ -200,60 +175,57 @@
<view class="footer_f">
<view class="footer">
<view class="footer_r">
<u-button type="success"
class="uBtn"
shape="circle"
:loading="isLoading"
loadingText="支付中"
@tap="quickPay(ifcz)"
color="linear-gradient(to right, #005BAC, #005BAC )">{{'立即支付'}}
<u-button
type="success"
class="uBtn"
shape="circle"
:loading="isLoading"
loadingText="支付中"
@tap="quickPay(isRecharge)"
color="linear-gradient(to right, #005BAC, #005BAC )"
>{{ '立即支付' }}
</u-button>
</view>
</view>
</view>
<!-- 输入验证码密码 -->
<u-popup :show="isPw"
mode="center"
closeable
@close="closePw">
<view class="t_tit">{{'支付验证'}}</view>
<u-popup :show="isPw" mode="center" closeable @close="closePw">
<view class="t_tit">{{ '支付验证' }}</view>
<view class="box">
<view class="c_tit">{{ '请输入短信验证码' }}</view>
<view class="c_tit">{{'请输入短信验证码'}}</view>
<u--input border="surround" v-model="codeValue"></u--input>
<u--input border="surround"
v-model="codeValue"></u--input>
<u-button type="success"
class="uBtn"
shape="circle"
:loading="isLoading"
loadingText="支付中"
@tap="payPw()"
color="linear-gradient(to right, #005BAC, #005BAC )">{{'立即支付'}} </u-button>
<u-button
type="success"
class="uBtn"
shape="circle"
:loading="isLoading"
loadingText="支付中"
@tap="payPw()"
color="linear-gradient(to right, #005BAC, #005BAC )"
>{{ '立即支付' }}
</u-button>
</view>
</u-popup>
<!-- 成功 -->
<u-modal :show="showSucce"
showConfirmButton
:content='content'
confirmColor='#DE3932'
@confirm="reset"
ref="uModal"
:asyncClose="true"></u-modal>
<u-modal
:show="showSucce"
showConfirmButton
:content="content"
confirmColor="#DE3932"
@confirm="reset"
ref="uModal"
:asyncClose="true"
></u-modal>
<!-- 二维码 -->
<u-popup :show="wxPopup"
mode="center"
closeable
@close="closewxPopup">
<view class="t_tit">{{'微信支付'}}</view>
<u-popup :show="wxPopup" mode="center" closeable @close="closewxPopup">
<view class="t_tit">{{ '微信支付' }}</view>
<view class="pay_code">
<div ref="qrCodeUrlWx"
class="qrcode"></div>
<div ref="qrCodeUrlWx" class="qrcode"></div>
</view>
</u-popup>
<hiSuccess @successClose="successClose"
ref="hiSuccess"></hiSuccess>
<hiSuccess @successClose="successClose" ref="hiSuccess"></hiSuccess>
</view>
</template>
@ -300,7 +272,7 @@ export default {
content: '支付成功',
wxPopup: false,
luckydrawData: {},
ifcz: false,
isRecharge: false,
czJe: '',
tlList: [],
}
@ -314,8 +286,8 @@ export default {
)
this.pkCountry = uni.getStorageSync('pkCountry')
// if (this.paramsPost.ifcz) {
// this.ifcz = this.paramsPost.ifcz
// if (this.paramsPost.isRecharge) {
// this.isRecharge = this.paramsPost.isRecharge
// this.businessType = 3
// uni.setNavigationBarTitle({
// title: ''
@ -324,7 +296,7 @@ export default {
// uni.setNavigationBarTitle({
// title: ''
// });
// this.ifcz = false
// this.isRecharge = false
// if (JSON.parse(options.paramsPost).orderType == 4) {
this.orderCode = this.paramsPost.orderCode
// this.luckydrawData = this.paramsPost.luckydrawData
@ -374,7 +346,7 @@ export default {
pkBaseId: this.luckydrawData.pkBaseId,
payNum: this.luckydrawData.payNum,
})
.then((res) => {
.then(res => {
if (res.code == 200) {
this.orderData.orderAmount = res.data.toBePaidMoney
this.payDetail = res.data
@ -411,7 +383,7 @@ export default {
})
},
fansOrder() {
api.fansOrder(this.orderCode).then((res) => {
api.fansOrder(this.orderCode).then(res => {
this.isLoading = false
this.isPw = false
removeToken()
@ -436,7 +408,7 @@ export default {
pkSettleCountry: this.pkCountry,
}
this.isLoading = true
url(obj).then((res) => {
url(obj).then(res => {
if (res.code == 200) {
// this.isPw = false
// this.$refs.hiSuccess.showSuccess(res.data)
@ -481,7 +453,7 @@ export default {
payType: 3, //
bindCode: this.hfList[indexed].bindCode,
}
api.unifiedorder(params).then((response) => {
api.unifiedorder(params).then(response => {
this.isBank = 'hf'
this.bindCode = this.hfList[indexed].bindCode
this.isPw = true
@ -497,7 +469,7 @@ export default {
payType: 3, //
bindCode: this.jdList[indexed].bindCode,
}
api.unifiedorder(params).then((response) => {
api.unifiedorder(params).then(response => {
this.isBank = 'jd'
this.bindCode = this.jdList[indexed].bindCode
this.isPw = true
@ -512,7 +484,7 @@ export default {
payType: 3, //
bindCode: this.tlList[indexed].bindCode,
}
api.unifiedorder(params).then((response) => {
api.unifiedorder(params).then(response => {
this.isBank = 'tl'
this.bindCode = this.tlList[indexed].bindCode
this.isPw = true
@ -530,7 +502,7 @@ export default {
payType: 2,
appletFlag: 0,
}
api.unifiedorder(params).then((res) => {
api.unifiedorder(params).then(res => {
let url =
'https://cloud1-8gp1n6uofa17e2e2-1315820965.tcloudbaseapp.com/jump_mp.html?sign=8587800b05c859700944247c03eeae1c&t=1698224973&state=' +
res.data
@ -547,7 +519,7 @@ export default {
payType: 2,
appletFlag: 0,
}
api.unifiedorder(params).then((res) => {
api.unifiedorder(params).then(res => {
let url =
'https://cloud1-1gql8u3v1fe85a37-1322999719.tcloudbaseapp.com/jump_mp.html?sign=d77deffc9e8aecd2b721f8430c376370&t=1705374125&state=' +
res.data
@ -562,7 +534,7 @@ export default {
payChannel: val,
payType: 2,
}
api.unifiedorder(params).then((res) => {
api.unifiedorder(params).then(res => {
this.wxPopup = true
this.$nextTick(() => {
new QRCode(
@ -593,7 +565,7 @@ export default {
}
},
getPayConfig() {
api.payConfig().then((res) => {
api.payConfig().then(res => {
this.payList = res.data
this.$nextTick(() => {
this.$refs.collapse.init()
@ -602,7 +574,7 @@ export default {
})
},
getBankList() {
api.jdBankList().then((res) => {
api.jdBankList().then(res => {
this.jdList = res.data
})
// api.hfBankList().then((res) => {
@ -623,7 +595,7 @@ export default {
orderCode: this.orderCode,
pkSettleCountry: this.pkCountry,
})
.then((res) => {
.then(res => {
this.orderData = res.data
this.downTime()
})
@ -645,13 +617,13 @@ export default {
orderCode: this.orderCode,
pkSettleCountry: this.pkCountry,
})
.then((res) => {
.then(res => {
// this.payDetail = res.data
this.$set(this, 'payDetail', res.data)
})
},
reset() {
this.$store.dispatch('GetInfo').then((res) => {
this.$store.dispatch('GetInfo').then(res => {
uni.reLaunch({
url: '/pages/index/index',
})
@ -669,7 +641,7 @@ export default {
// this.showSucce = true
this.fansOrder()
} else {
api.payStatus(data).then((res) => {
api.payStatus(data).then(res => {
that.sucPay = res.data
})
}
@ -710,7 +682,9 @@ export default {
.tit {
font-size: 24px;
font-family: PingFang SC-Semibold, PingFang SC;
font-family:
PingFang SC-Semibold,
PingFang SC;
font-weight: 600;
text-align: center;
color: #333333;
@ -719,7 +693,9 @@ export default {
.tit1 {
font-size: 24px;
font-family: PingFang SC-Semibold, PingFang SC;
font-family:
PingFang SC-Semibold,
PingFang SC;
font-weight: 600;
color: #e02b26;
text-align: center;
@ -728,7 +704,9 @@ export default {
.tit2 {
font-size: 11px;
font-family: PingFang SC-Regular, PingFang SC;
font-family:
PingFang SC-Regular,
PingFang SC;
font-weight: 400;
color: #666666;
display: flex;
@ -755,7 +733,9 @@ export default {
display: flex;
align-items: center;
font-size: 12px;
font-family: PingFang SC-Semibold, PingFang SC;
font-family:
PingFang SC-Semibold,
PingFang SC;
font-weight: 600;
color: #333333;
@ -793,7 +773,9 @@ export default {
display: flex;
align-items: center;
font-size: 12px;
font-family: PingFang SC-Regular, PingFang SC;
font-family:
PingFang SC-Regular,
PingFang SC;
font-weight: 400;
color: #333333;
@ -915,14 +897,18 @@ export default {
justify-content: space-between;
color: #666;
font-size: 12px;
font-family: PingFang SC-Semibold, PingFang SC;
font-family:
PingFang SC-Semibold,
PingFang SC;
font-weight: 600;
color: #999;
}
.tTit {
font-size: 12px;
font-family: PingFang SC-Semibold, PingFang SC;
font-family:
PingFang SC-Semibold,
PingFang SC;
font-weight: 600;
color: #666;
}

View File

@ -3,9 +3,9 @@
<view class="index_header"> </view>
<view class="contxt">
<!-- 充值 -->
<template v-if="ifcz">
<template v-if="isRecharge">
<div class="tit4">{{ '充值金额' }}</div>
<u-input class="czinputbox" v-model="czJe"></u-input>
<u-input class="czinputbox" v-model="rechargeAmount"></u-input>
</template>
<template v-else>
<view class="tit">{{ '待支付金额' }}</view>
@ -29,7 +29,9 @@
>
<u-collapse-item
name="1"
v-if="!ifcz && !isShare & (userInfo.memberCode != 'CN68880628')"
v-if="
!isRecharge && !isShare & (userInfo.memberCode != 'CN68880628')
"
>
<view slot="title" BD68880628 class="pf">
<img src="@/static/images/yhkzf.jpg" alt="" />
@ -172,7 +174,10 @@
<img src="@/static/images/under_pay.png" alt="" />
<view>{{ '在线支付' }}</view>
</view>
<view class="flex_ac" v-show="this.payList.pay11">
<view
class="flex_ac"
v-show="payList[PAY_AUTH[PAY_TYPE.BAO_FU_WECHAT]]"
>
<view class="flex_ac_i">
<img src="@/static/images/pay_i2.png" alt="" />
<view>{{ '宝付微信支付' }}</view>
@ -182,7 +187,10 @@
</u-radio>
</u-radio-group>
</view>
<view class="flex_ac" v-show="this.payList.pay12">
<view
class="flex_ac"
v-show="payList[PAY_AUTH[PAY_TYPE.BAO_FU_WECHAT_SCAN]]"
>
<view class="flex_ac_i">
<img src="@/static/images/pay_i2.png" alt="" />
<view>{{ '宝付微信扫码' }}</view>
@ -192,7 +200,10 @@
</u-radio>
</u-radio-group>
</view>
<view class="flex_ac" v-show="this.payList.pay13">
<view
class="flex_ac"
v-show="payList[PAY_AUTH[PAY_TYPE.HUI_FU_WECHAT]]"
>
<view class="flex_ac_i">
<img src="@/static/images/pay_i2.png" alt="" />
<view>{{ '汇付微信支付' }}</view>
@ -203,7 +214,10 @@
</u-radio-group>
</view>
<!-- 微信支付 -->
<view class="flex_ac" v-show="this.payList.pay73">
<view
class="flex_ac"
v-show="payList[PAY_AUTH[PAY_TYPE.WECHAT_PAY]]"
>
<view class="flex_ac_i">
<img src="@/static/images/pay_i2.png" alt="" />
<view>{{ '微信支付' }}</view>
@ -214,7 +228,7 @@
</u-radio-group>
</view>
<!-- 支付宝支付 -->
<view class="flex_ac" v-show="this.payList.pay74">
<view class="flex_ac" v-show="payList[PAY_AUTH[PAY_TYPE.ALI_PAY]]">
<view class="flex_ac_i">
<img src="@/static/images/pay_i3.png" alt="" />
<view>{{ '支付宝支付' }}</view>
@ -224,7 +238,10 @@
</u-radio>
</u-radio-group>
</view>
<view class="flex_ac1" v-show="this.payList.pay15">
<view
class="flex_ac1"
v-show="payList[PAY_AUTH[PAY_TYPE.HUI_FU_BANK_CARD]]"
>
<view class="flex_ac_i">
<img src="@/static/images/jdBank.jpg" alt="" />
<view>{{ '汇付银行卡' }} </view>
@ -257,7 +274,10 @@
</view>
</view>
</view>
<view class="flex_ac" v-show="this.payList.pay32">
<view
class="flex_ac"
v-show="payList[PAY_AUTH[PAY_TYPE.TONG_LIAN_WECHAT]]"
>
<view class="flex_ac_i">
<img src="@/static/images/pay_i2.png" alt="" />
<view>通联微信支付</view>
@ -267,7 +287,10 @@
</u-radio>
</u-radio-group>
</view>
<view class="flex_ac1" v-show="this.payList.pay4">
<view
class="flex_ac1"
v-show="payList[PAY_AUTH[PAY_TYPE.JING_DONG_BANK_CARD]]"
>
<view class="flex_ac_i">
<img src="@/static/images/jdBank.jpg" alt="" />
<view>{{ '京东银行卡' }}</view>
@ -298,7 +321,28 @@
</view>
</view>
</view>
<view class="flex_ac1" v-show="this.payList.pay33">
<view
class="flex_ac"
v-show="payList[PAY_AUTH[PAY_TYPE.JING_DONG_H5]]"
>
<view class="flex_ac_i">
<img src="@/static/images/jdBank.jpg" alt="" />
<view>京东收银台</view>
</view>
<u-radio-group v-model="whatPay">
<u-radio
activeColor="red"
size="14"
label=""
:name="PAY_TYPE.JING_DONG_H5"
>
</u-radio>
</u-radio-group>
</view>
<view
class="flex_ac1"
v-show="payList[PAY_AUTH[PAY_TYPE.TONG_LIAN_BANK_CARD]]"
>
<view class="flex_ac_i">
<img src="@/static/images/jdBank.jpg" alt="" />
<view>{{ '通联银行卡' }}</view>
@ -332,7 +376,7 @@
</u-collapse-item>
</u-collapse>
</view>
<view class="kuang" v-if="!ifcz">
<view class="kuang" v-if="!isRecharge">
<div v-show="specialArea == 1 || specialArea == 24">
<div class="tit4">{{ '注册会员信息' }}</div>
<div class="quan">
@ -633,7 +677,7 @@
:loading="isLoading"
loadingText="支付中"
:disabled="payBtnDisabled"
@tap="quickPay(ifcz)"
@tap="quickPay(isRecharge)"
color="linear-gradient(to right, #005BAC, #005BAC )"
>
{{ '立即支付' }}
@ -668,7 +712,12 @@
</view>
</u-popup>
<!-- 支付宝二维码 -->
<u-popup :show="wxPopup1" mode="center" closeable @close="closewxPopup">
<u-popup
:show="aliQrCodeVisible"
mode="center"
closeable
@close="closewxPopup"
>
<view class="t_tit">{{ '支付宝支付' }}</view>
<view class="pay_code">
<div ref="qrCodeUrlWx" id="qrCodeUrlWx" class="qrcode"></div>
@ -701,6 +750,12 @@ import * as api from '@/config/pay.js'
import QRCode from 'qrcodejs2'
import successDialog from '@/components/successDialog.vue'
import * as act from '@/config/activity.js'
import {
PAY_REDIRECT_URL,
PAY_TYPE,
PAY_CHANEL,
PAY_AUTH,
} from '@/util/constant.js'
var payStatus
export default {
components: {
@ -708,6 +763,8 @@ export default {
},
data() {
return {
PAY_TYPE,
PAY_AUTH,
payList: {},
isNoBind: false,
isLoading: false,
@ -738,10 +795,10 @@ export default {
sucPay: 0,
content: '支付成功',
wxPopup: false,
wxPopup1: false,
aliQrCodeVisible: false,
luckydrawData: {},
ifcz: false,
czJe: '',
isRecharge: false,
rechargeAmount: '',
qrcodeimg: '',
onlinePay: true,
unBindCode: '',
@ -749,22 +806,20 @@ export default {
},
computed: {
payBtnDisabled() {
if (this.ifcz) {
if (this.isRecharge) {
return !Object.values(this.payList).some(val => val)
}
return false
},
},
onLoad(options) {
this.paramsPost = JSON.parse(options.paramsPost)
console.log(
'%c [ this.paramsPost ]-734',
'font-size:13px; background:#777244; color:#bbb688;',
this.paramsPost
)
this.paramsPost = JSON.parse(options.paramsPost || '{}')
this.getPayConfig()
clearInterval(this.clockTime)
this.pkCountry = uni.getStorageSync('pkCountry')
if (this.paramsPost.ifcz) {
this.ifcz = this.paramsPost.ifcz
if (this.paramsPost.isRecharge) {
this.isRecharge = this.paramsPost.isRecharge
this.businessType = 3
uni.setNavigationBarTitle({
title: '充值',
@ -773,39 +828,28 @@ export default {
uni.setNavigationBarTitle({
title: '订单支付',
})
this.ifcz = false
if (JSON.parse(options.paramsPost).orderType == 4) {
this.orderCode = this.paramsPost.orderCode
this.luckydrawData = this.paramsPost.luckydrawData
//
this.businessType = 4 //
this.specialArea = this.paramsPost.specialArea
this.getLuckdrawDetail()
} else {
this.userInfo = uni.getStorageSync('User')
if (this.userInfo.registerFans == 0) {
this.isShare = true
}
this.isRecharge = false
this.userInfo = uni.getStorageSync('User')
if (this.userInfo.registerFans == 0) {
this.isShare = true
}
this.specialArea =
this.paramsPost.specialArea || this.paramsPost.orderType
this.orderCode = this.paramsPost.orderCode
this.businessType = options.businessType
this.onlinePay = this.stringToBoolean(options.onlinePay || 'true')
// this.getInfo()
this.specialArea =
this.paramsPost.specialArea || this.paramsPost.orderType
this.orderCode = this.paramsPost.orderCode
this.businessType = options.businessType
this.onlinePay = this.stringToBoolean(options.onlinePay || 'true')
// this.getInfo()
//
this.getOrderInfo()
if (!this.isShare) {
//
this.getSpendInfo()
}
//
this.getOrderInfo()
if (!this.isShare) {
//
this.getSpendInfo()
}
}
//
this.getPayConfig()
clearInterval(this.clockTime)
},
onShow() {
@ -856,7 +900,7 @@ export default {
},
closewxPopup() {
this.wxPopup = false
this.wxPopup1 = false
this.aliQrCodeVisible = false
this.$refs.qrCodeUrlWx.innerHTML = ''
clearInterval(payStatus)
},
@ -960,7 +1004,7 @@ export default {
// this.$refs.successDialog.showSuccess(res.data)
// })
} else {
if (this.ifcz) {
if (this.isRecharge) {
uni.showToast({
title: '充值成功',
icon: 'none',
@ -984,9 +1028,9 @@ export default {
})
}
},
quickPay(cz) {
if (cz) {
if (!this.czJe || this.czJe <= 0) {
async quickPay(isRecharge) {
if (isRecharge) {
if (!this.rechargeAmount || this.rechargeAmount <= 0) {
uni.showToast({
title: '请输入正确的充值金额',
})
@ -995,162 +1039,88 @@ export default {
}
if (this.activeNames == 2) {
//
if (typeof this.whatPay == 'number') {
if (cz) {
if (
![
PAY_TYPE.HUI_FU_BANK_CARD,
PAY_TYPE.JING_DONG_BANK_CARD,
PAY_TYPE.TONG_LIAN_BANK_CARD,
].includes(this.whatPay.slice(0, 2))
) {
if (isRecharge) {
//
api
.preCharge({
rechargeAmount: this.czJe,
rechargeAmount: this.rechargeAmount,
})
.then(res => {
this.paramsPost = res.data
this.orderCode = res.orderCode
if (this.whatPay == 11) {
this.scanPayBfWxJump(5)
} else if (this.whatPay == 12) {
this.scanPayBfWx(5)
} else if (this.whatPay == 13) {
this.scanPayBfWx(6)
} else if (this.whatPay == 32) {
this.scanPayTlWxJump(3)
} else if (this.whatPay == 73) {
this.scanPayWx(7)
} else if (this.whatPay == 74) {
this.scanPayAl(7)
if (this.whatPay == PAY_TYPE.JING_DONG_H5) {
this.redirectPay(PAY_CHANEL[this.whatPay])
} else if (
[PAY_TYPE.BAO_FU_WECHAT, PAY_TYPE.HUI_FU_WECHAT].includes(
this.whatPay
)
) {
this.scanPayBfWx(PAY_CHANEL[this.whatPay])
} else if (this.whatPay == PAY_TYPE.TONG_LIAN_WECHAT) {
this.weChatPay(PAY_CHANEL[this.whatPay])
}
})
} else {
if (this.whatPay == 11) {
this.scanPayBfWxJump(5)
} else if (this.whatPay == 12) {
this.scanPayBfWx(5)
} else if (this.whatPay == 13) {
this.scanPayBfWx(6)
} else if (this.whatPay == 32) {
this.scanPayTlWxJump(3)
} else if (this.whatPay == 73) {
this.scanPayWx(7)
} else if (this.whatPay == 74) {
this.scanPayAl(7)
if ([PAY_TYPE.JING_DONG_H5].includes(this.whatPay)) {
this.redirectPay(PAY_CHANEL[this.whatPay])
} else if (
[PAY_TYPE.BAO_FU_WECHAT_SCAN, PAY_TYPE.HUI_FU_WECHAT].includes(
this.whatPay
)
) {
this.scanPayBfWx(PAY_CHANEL[this.whatPay])
} else if (this.whatPay == PAY_TYPE.WECHAT_PAY) {
this.scanPayWx(PAY_CHANEL[this.whatPay])
} else if (this.whatPay == PAY_TYPE.ALI_PAY) {
this.scanPayAl(PAY_CHANEL[this.whatPay])
}
}
} else {
if (this.whatPay.slice(0, 2) == 'hf') {
let indexed = this.whatPay.slice(2, 4)
if (!cz) {
let params = {
businessType: this.businessType, //
businessCode: this.orderCode,
payChannel: 6, //
payType: 3, //
bindCode: this.hfList[indexed].bindCode,
}
api.unifiedorder(params).then(response => {
this.isBank = 'hf'
this.bindCode = this.hfList[indexed].bindCode
this.isPw = true
const indexed = this.whatPay.slice(2, 4)
const payTypeEnum = this.whatPay.slice(0, 2)
const bankListMap = {
[PAY_TYPE.HUI_FU_BANK_CARD]: this.hfList[indexed].bindCode,
[PAY_TYPE.JING_DONG_BANK_CARD]: this.jdList[indexed].bindCode,
[PAY_TYPE.TONG_LIAN_BANK_CARD]: this.tlList[indexed].bindCode,
}
this.bindCode = bankListMap[payTypeEnum]
const params = {
businessType: isRecharge ? 3 : this.businessType, //
payChannel: PAY_CHANEL[payTypeEnum],
payType: 3, //
bindCode: bankListMap[payTypeEnum],
}
if (!isRecharge) {
Object.assign(params, {
businessCode: this.orderCode,
})
} else {
try {
const orderCode = await this.preCharge()
Object.assign(params, {
businessCode: orderCode,
})
this.checkPayStatus(params)
} else {
api
.preCharge({
rechargeAmount: this.czJe,
})
.then(res => {
let params = {
businessType: 3, //
businessCode: res.orderCode,
payChannel: 6, //
payType: 3, //
bindCode: this.hfList[indexed].bindCode,
}
api.unifiedorder(params).then(response => {
this.isBank = 'hf'
this.bindCode = this.hfList[indexed].bindCode
this.orderCode = res.orderCode
this.isPw = true
})
})
this.checkPayStatus(params)
}
} else if (this.whatPay.slice(0, 2) == 'jd') {
let indexed = this.whatPay.slice(2, 4)
if (!cz) {
let params = {
businessType: this.businessType, //
businessCode: this.orderCode,
payChannel: 4, //
payType: 3, //
bindCode: this.jdList[indexed].bindCode,
}
api.unifiedorder(params).then(response => {
this.isBank = 'jd'
this.bindCode = this.jdList[indexed].bindCode
this.isPw = true
this.orderCode = orderCode
} catch (error) {
uni.showToast({
title: error,
icon: 'none',
})
this.checkPayStatus(params)
} else {
api
.preCharge({
rechargeAmount: this.czJe,
})
.then(res => {
let params = {
businessType: 3, //
businessCode: res.orderCode,
payChannel: 4, //
payType: 3, //
bindCode: this.jdList[indexed].bindCode,
}
api.unifiedorder(params).then(response => {
this.isBank = 'jd'
this.bindCode = this.jdList[indexed].bindCode
this.orderCode = res.orderCode
this.isPw = true
})
})
this.checkPayStatus(params)
}
} else if (this.whatPay.slice(0, 2) == 'tl') {
let indexed = this.whatPay.slice(2, 4)
if (!cz) {
let params = {
businessType: this.businessType, //
businessCode: this.orderCode,
payChannel: 3, //
payType: 3, //
bindCode: this.tlList[indexed].bindCode,
}
api.unifiedorder(params).then(response => {
this.isBank = 'tl'
this.bindCode = this.tlList[indexed].bindCode
this.isPw = true
})
this.checkPayStatus(params)
} else {
api
.preCharge({
rechargeAmount: this.czJe,
})
.then(res => {
let params = {
businessType: 3, //
businessCode: res.orderCode,
payChannel: 3, //
payType: 3, //
bindCode: this.tlList[indexed].bindCode,
}
api.unifiedorder(params).then(response => {
this.isBank = 'tl'
this.bindCode = this.tlList[indexed].bindCode
this.orderCode = res.orderCode
this.isPw = true
})
})
this.checkPayStatus(params)
return
}
}
api.unifiedorder(params).then(response => {
this.isBank = this.whatPay.slice(0, 2)
this.isPw = true
this.checkPayStatus(params)
})
}
} else {
if (cz) {
@ -1181,145 +1151,62 @@ export default {
},
scanPayBfWx(val) {
let params
if (this.ifcz) {
params = {
businessType: 3, //
businessCode: this.orderCode,
payChannel: val,
payType: 2,
}
} else {
params = {
businessType: this.businessType, //
businessCode: this.orderCode,
payChannel: val,
payType: 2,
}
params = {
businessType: this.isRecharge ? 3 : this.businessType, //
businessCode: this.orderCode,
payChannel: val,
payType: 2,
}
api.unifiedorder(params).then(res => {
this.wxPopup = true
let that = this
this.$nextTick(() => {
new QRCode(
this.$refs.qrCodeUrlWx,
{
width: 280,
height: 280,
text: res.data,
colorDark: '#000000',
colorLight: '#ffffff',
correctLevel: QRCode.CorrectLevel.Q,
textAlign: 'center',
},
1000
)
setTimeout(() => {
let qrcodeEle = document.getElementById('qrCodeUrlWx')
let cvs = qrcodeEle.querySelector('canvas')
that.qrcodeimg = cvs.toDataURL('image/png')
}, 1000)
})
this.drawQrcode(res.data)
this.checkPayStatus(params)
})
this.checkPayStatus(params)
},
//
scanPayWx(val) {
let params
if (this.ifcz) {
params = {
businessType: 3, //
businessCode: this.orderCode,
payChannel: val,
payType: 2,
}
} else {
params = {
businessType: this.businessType, //
businessCode: this.orderCode,
payChannel: val,
payType: 2,
}
const params = {
businessType: this.isRecharge ? 3 : this.businessType, //
businessCode: this.orderCode,
payChannel: val,
payType: 2,
}
api.unifiedorder(params).then(res => {
this.wxPopup = true
let that = this
this.$nextTick(() => {
new QRCode(
this.$refs.qrCodeUrlWx,
{
width: 280,
height: 280,
text: res.data,
colorDark: '#000000',
colorLight: '#ffffff',
correctLevel: QRCode.CorrectLevel.Q,
textAlign: 'center',
},
1000
)
setTimeout(() => {
let qrcodeEle = document.getElementById('qrCodeUrlWx')
let cvs = qrcodeEle.querySelector('canvas')
that.qrcodeimg = cvs.toDataURL('image/png')
}, 1000)
})
this.drawQrcode(res.data)
this.checkPayStatus(params)
})
this.checkPayStatus(params)
},
//
scanPayAl(val) {
let params
if (this.ifcz) {
params = {
businessType: 3, //
businessCode: this.orderCode,
payChannel: val,
payType: 1,
}
} else {
params = {
businessType: this.businessType, //
businessCode: this.orderCode,
payChannel: val,
payType: 1,
}
const params = {
businessType: this.isRecharge ? 3 : this.businessType, //
businessCode: this.orderCode,
payChannel: val,
payType: 1,
}
api.unifiedorder(params).then(res => {
this.wxPopup1 = true
let that = this
this.$nextTick(() => {
new QRCode(
this.$refs.qrCodeUrlWx,
{
width: 280,
height: 280,
text: res.data,
colorDark: '#000000',
colorLight: '#ffffff',
correctLevel: QRCode.CorrectLevel.Q,
textAlign: 'center',
},
1000
)
setTimeout(() => {
let qrcodeEle = document.getElementById('qrCodeUrlWx')
let cvs = qrcodeEle.querySelector('canvas')
that.qrcodeimg = cvs.toDataURL('image/png')
}, 1000)
})
this.aliQrCodeVisible = true
this.drawQrcode(res.data)
this.checkPayStatus(params)
})
this.checkPayStatus(params)
},
//
scanPayBfWxJump(val) {
let params
if (this.ifcz) {
params = {
businessType: 3, //
businessCode: this.orderCode,
payChannel: val,
getPayAuthToken(payChannel) {
return new Promise((resolve, reject) => {
const extParam = {
source: !!this.isRecharge,
orderCode: this.orderCode,
specialArea: this.specialArea,
}
// extParamJSONbase64
const extParamBase64 = btoa(JSON.stringify(extParam))
const params = {
payChannel: payChannel,
payType: 2,
appletFlag: 0,
businessType: this.isRecharge ? 3 : this.businessType,
businessCode: this.orderCode,
extParam: extParamBase64,
}
} else {
params = {
@ -1341,37 +1228,107 @@ export default {
})
this.checkPayStatus(params)
},
//
scanPayTlWxJump(val) {
let params
if (this.ifcz) {
params = {
businessType: 3, //
businessCode: this.orderCode,
payChannel: val,
payType: 2,
appletFlag: 0,
}
} else {
params = {
businessType: this.businessType, //
businessCode: this.orderCode,
payChannel: val,
payType: 2,
appletFlag: 0,
}
}
api.unifiedorder(params).then(res => {
let url =
'https://clooud1-5g23d3je04dda65b-1326540601.tcloudbaseapp.com/jump_mp.html?sign=20f03b022bc39e837056bdbe475632c8&t=1715569339&state=' +
res.data +
'&payment=1'
// https://clooud1-5g23d3je04dda65b-1326540601.tcloudbaseapp.com/jump_mp.html?sign=812bf9ab54292b1fb7161a3a6f7fa0f6&t=1715570889&state=' +
// res.data + '&payment=1'
window.open(url)
drawQrcode(text) {
let that = this
this.$nextTick(() => {
new QRCode(
this.$refs.qrCodeUrlWx,
{
width: 280,
height: 280,
text,
colorDark: '#000000',
colorLight: '#ffffff',
correctLevel: QRCode.CorrectLevel.Q,
textAlign: 'center',
},
1000
)
setTimeout(() => {
let qrcodeEle = document.getElementById('qrCodeUrlWx')
let cvs = qrcodeEle.querySelector('canvas')
that.qrcodeimg = cvs.toDataURL('image/png')
}, 1000)
})
this.checkPayStatus(params)
},
redirectPay(payChannel) {
this.getPayAuthToken(payChannel).then(url => {
if (navigator.userAgent.includes('MicroMessenger')) {
window.location.href = url
} else {
window.open(url)
}
})
},
weChatPay(payChannel) {
this.getPayAuthToken(payChannel)
.then(res => {
const url = PAY_REDIRECT_URL + '&state=' + res + '&payment=0'
window.open(url)
})
.catch(_ => {
const url = PAY_REDIRECT_URL + '&state=' + 'eroor' + '&payment=0'
// window.open(url)
window.location.href = url
uni.showToast({
title: url,
icon: 'none',
})
})
},
//
// scanPayBfWxJump(val) {
// let params
// if (this.isRecharge) {
// params = {
// businessType: 3, //
// businessCode: this.orderCode,
// payChannel: val,
// payType: 2,
// appletFlag: 0,
// }
// } else {
// params = {
// businessType: this.businessType, //
// businessCode: this.orderCode,
// payChannel: val,
// payType: 2,
// appletFlag: 0,
// }
// }
// api.unifiedorder(params).then(res => {
// const url = PAY_REDIRECT_URL + '&state=' + res.data + '&payment=0'
// console.log(url)
// window.open(url)
// })
// this.checkPayStatus(params)
// },
// //
// scanPayTlWxJump(val) {
// let params
// if (this.isRecharge) {
// params = {
// businessType: 3, //
// businessCode: this.orderCode,
// payChannel: val,
// payType: 2,
// appletFlag: 0,
// }
// } else {
// params = {
// businessType: this.businessType, //
// businessCode: this.orderCode,
// payChannel: val,
// payType: 2,
// appletFlag: 0,
// }
// }
// api.unifiedorder(params).then(res => {
// const url = PAY_REDIRECT_URL + '&state=' + res.data + '&payment=1'
// window.open(url)
// })
// this.checkPayStatus(params)
// },
change(e) {
this.activeNames = e
},
@ -1403,16 +1360,22 @@ export default {
this.$forceUpdate()
},
getOrderInfo() {
api
.orderInfo({
specialArea: this.specialArea,
orderCode: this.orderCode,
pkSettleCountry: this.pkCountry,
})
.then(res => {
this.orderData = res.data
this.downTime()
})
return new Promise((resolve, reject) => {
api
.orderInfo({
specialArea: this.specialArea,
orderCode: this.orderCode,
pkSettleCountry: this.pkCountry,
})
.then(res => {
this.orderData = res.data
resolve(res.data)
this.downTime()
})
.catch(err => {
reject(err)
})
})
},
downTime() {
let that = this
@ -1465,7 +1428,7 @@ export default {
})
} else {
this.wxPopup = false
this.wxPopup1 = false
this.aliQrCodeVisible = false
this.showSucce = true
}
} else {
@ -1486,6 +1449,21 @@ export default {
//
return h + ':' + m + ':' + s
},
preCharge() {
return new Promise((resolve, reject) => {
api
.preCharge({
rechargeAmount: this.rechargeAmount,
})
.then(res => {
if (res.code == 200) {
resolve(res.orderCode)
} else {
reject(res.msg)
}
})
})
},
},
}
</script>

348
pages/pay/success.vue Normal file
View File

@ -0,0 +1,348 @@
<template>
<view class="success-page">
<!-- 状态栏占位 -->
<view class="status-bar"></view>
<!-- 成功状态区域 -->
<view class="success-section">
<view class="success-icon-wrapper">
<view class="success-icon">
<text class="success-checkmark"></text>
</view>
<view class="success-rings">
<view class="ring ring1"></view>
<view class="ring ring2"></view>
<view class="ring ring3"></view>
</view>
</view>
<view class="success-title">{{ paySuccessText }}</view>
<view v-if="isRecharge === undefined" class="success-subtitle"
>您的订单已支付完成</view
>
</view>
<!-- 操作按钮区域 -->
<view class="action-section">
<view class="button-group">
<button class="btn btn-secondary" @click="goToOrderList">
查看订单
</button>
<button class="btn btn-primary" @click="goToHome">返回首页</button>
</view>
</view>
<successDialog @successClose="successClose" ref="successDialog" />
</view>
</template>
<script>
import { mapGetters } from 'vuex'
import { payStatus, registerInfo } from '@/config/pay.js'
import successDialog from '@/components/successDialog.vue'
let interval = null
export default {
name: 'PaySuccess',
components: {
successDialog,
},
data() {
return {
orderCode: '',
sucPay: 0,
specialArea: null,
isRecharge: undefined,
}
},
computed: {
...mapGetters(['userInfo']),
paySuccessText() {
if (this.isRecharge === undefined) {
return ''
}
if (this.isRecharge === true) {
return '充值成功'
}
return '支付成功'
},
},
onLoad(options) {
//
const extParam = JSON.parse(atob(options.extParam || '{}'))
this.specialArea = extParam.specialArea
this.isRecharge = extParam.source
const source = options.source || ''
if (source) {
this.orderCode = options.orderCode || ''
this.orderCode && this.checkPayStatus()
// this.goToOrderList()
return
}
//
uni.setNavigationBarTitle({
title: '支付成功',
})
},
onUnload() {
clearInterval(interval)
},
methods: {
//
checkPayStatus(orderCode) {
//
interval = setInterval(() => {
if (this.sucPay == 1) {
//
clearInterval(interval)
if (
this.specialArea == 1 ||
this.specialArea == 7 ||
this.specialArea == 24
) {
registerInfo(orderCode).then(res => {
this.$refs.successDialog.showSuccess(res.data)
})
}
} else {
payStatus({ businessCode: orderCode }).then(res => {
this.sucPay = res.data
})
}
}, 2000)
},
//
goToOrderList() {
uni.redirectTo({
url: '/pages/mine/order/index',
})
},
successClose() {
uni.redirectTo({
url: '/pages/mine/order/index',
})
},
//
goToHome() {
uni.switchTab({
url: '/pages/index/index',
})
},
},
}
</script>
<style lang="scss" scoped>
.success-page {
min-height: 100vh;
background: linear-gradient(135deg, #f8fafc 0%, #e3f2fd 100%);
position: relative;
display: flex;
flex-direction: column;
}
.status-bar {
height: var(--status-bar-height);
background: transparent;
}
.success-section {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 60rpx 40rpx 40rpx;
position: relative;
}
.success-icon-wrapper {
position: relative;
margin-bottom: 40rpx;
}
.success-icon {
width: 120rpx;
height: 120rpx;
background: #005bac;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
position: relative;
z-index: 2;
box-shadow: 0 8rpx 24rpx rgba(0, 91, 172, 0.3);
animation: successBounce 0.6s ease-out;
}
.success-checkmark {
color: #ffffff;
font-size: 60rpx;
font-weight: bold;
line-height: 1;
}
.success-rings {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 1;
}
.ring {
position: absolute;
border: 2rpx solid #005bac;
border-radius: 50%;
opacity: 0;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.ring1 {
width: 140rpx;
height: 140rpx;
animation: ripple 1.5s ease-out 0.2s infinite;
}
.ring2 {
width: 180rpx;
height: 180rpx;
animation: ripple 1.5s ease-out 0.6s infinite;
}
.ring3 {
width: 220rpx;
height: 220rpx;
animation: ripple 1.5s ease-out 1s infinite;
}
.success-title {
font-size: 48rpx;
font-weight: 600;
color: #1a1a1a;
margin-bottom: 16rpx;
text-align: center;
}
.success-subtitle {
font-size: 28rpx;
color: #666666;
text-align: center;
line-height: 1.4;
}
.action-section {
padding: 32rpx;
}
.button-group {
display: flex;
gap: 24rpx;
}
.btn {
flex: 1;
height: 88rpx;
border-radius: 44rpx;
font-size: 32rpx;
font-weight: 500;
border: none;
transition: all 0.3s ease;
position: relative;
overflow: hidden;
&::after {
border: none;
}
&.btn-secondary {
background: #ffffff;
color: #005bac;
border: 2rpx solid #005bac;
&:active {
background: #f8fafc;
transform: scale(0.98);
}
}
&.btn-primary {
background: linear-gradient(135deg, #005bac 0%, #0066cc 100%);
color: #ffffff;
box-shadow: 0 4rpx 16rpx rgba(0, 91, 172, 0.3);
&:active {
background: linear-gradient(135deg, #004691 0%, #0052a3 100%);
transform: scale(0.98);
}
}
}
//
@keyframes successBounce {
0% {
transform: scale(0);
opacity: 0;
}
50% {
transform: scale(1.2);
opacity: 1;
}
100% {
transform: scale(1);
opacity: 1;
}
}
@keyframes ripple {
0% {
opacity: 0.6;
transform: translate(-50%, -50%) scale(0.1);
}
100% {
opacity: 0;
transform: translate(-50%, -50%) scale(1);
}
}
//
@media (prefers-color-scheme: dark) {
.success-page {
background: linear-gradient(135deg, #1a1a1a 0%, #2d3748 100%);
}
.success-title {
color: #ffffff;
}
.success-subtitle {
color: #a0aec0;
}
}
//
@media screen and (max-width: 375px) {
.success-icon {
width: 100rpx;
height: 100rpx;
}
.success-checkmark {
font-size: 50rpx;
}
.success-title {
font-size: 42rpx;
}
.button-group {
flex-direction: column;
gap: 16rpx;
}
}
</style>

View File

@ -189,7 +189,7 @@
shape="circle"
:loading="isLoading"
loadingText="支付中"
@tap="quickPay(ifcz)"
@tap="quickPay(isRecharge)"
color="linear-gradient(to right, #005BAC, #005BAC )"
>{{ '立即支付' }}
</u-button>
@ -262,7 +262,7 @@ export default {
content: '支付成功',
wxPopup: false,
luckydrawData: {},
ifcz: false,
isRecharge: false,
czJe: '',
objTree: {},
account: {},
@ -273,8 +273,8 @@ export default {
title: '订单支付',
})
// this.paramsPost = JSON.parse(options.paramsPost)
// if (this.paramsPost.ifcz) {
// this.ifcz = this.paramsPost.ifcz
// if (this.paramsPost.isRecharge) {
// this.isRecharge = this.paramsPost.isRecharge
// this.businessType = 3
// uni.setNavigationBarTitle({
// title: ''
@ -284,7 +284,7 @@ export default {
// uni.setNavigationBarTitle({
// title: ''
// });
// this.ifcz = false
// this.isRecharge = false
// if (JSON.parse(options.paramsPost).orderType == 4) {
// this.orderCode = this.paramsPost.orderCode
// this.luckydrawData = this.paramsPost.luckydrawData
@ -417,7 +417,7 @@ export default {
},
scanPayBfWx(val) {
let params
if (this.ifcz) {
if (this.isRecharge) {
params = {
businessType: 3, //
businessCode: this.orderCode,

41
util/constant.js Normal file
View File

@ -0,0 +1,41 @@
export const PAY_REDIRECT_URL =
'https://cloud1-8g5amgy6c173b906-1362517604.tcloudbaseapp.com/bd-pay-web/jump-mp.html?sign=c2d1fa4dcee3f77accfd22b480128c02&t=1749175241'
export const PAY_TYPE = {
BAO_FU_WECHAT: 'BAO_FU_WECHAT',
BAO_FU_WECHAT_SCAN: 'BAO_FU_WECHAT_SCAN',
HUI_FU_WECHAT: 'HUI_FU_WECHAT',
HUI_FU_BANK_CARD: 'hf',
WECHAT_PAY: 'WECHAT_PAY',
ALI_PAY: 'ALI_PAY',
TONG_LIAN_WECHAT: 'TONG_LIAN_WECHAT',
TONG_LIAN_BANK_CARD: 'tl',
JING_DONG_BANK_CARD: 'jd',
JING_DONG_H5: 'JING_DONG_H5',
}
export const PAY_AUTH = {
[PAY_TYPE.BAO_FU_WECHAT]: 'pay11',
[PAY_TYPE.JING_DONG_H5]: 'pay5',
[PAY_TYPE.BAO_FU_WECHAT_SCAN]: 'pay12',
[PAY_TYPE.HUI_FU_WECHAT]: 'pay13',
[PAY_TYPE.WECHAT_PAY]: 'pay73',
[PAY_TYPE.ALI_PAY]: 'pay74',
[PAY_TYPE.TONG_LIAN_WECHAT]: 'pay32',
[PAY_TYPE.HUI_FU_BANK_CARD]: 'pay15',
[PAY_TYPE.TONG_LIAN_BANK_CARD]: 'pay33',
[PAY_TYPE.JING_DONG_BANK_CARD]: 'pay4',
}
export const PAY_CHANEL = {
[PAY_TYPE.BAO_FU_WECHAT]: 5,
[PAY_TYPE.JING_DONG_H5]: 4,
[PAY_TYPE.BAO_FU_WECHAT_SCAN]: 5,
[PAY_TYPE.HUI_FU_WECHAT]: 6,
[PAY_TYPE.WECHAT_PAY]: 7,
[PAY_TYPE.ALI_PAY]: 7,
[PAY_TYPE.TONG_LIAN_WECHAT]: 3,
[PAY_TYPE.HUI_FU_BANK_CARD]: 6,
[PAY_TYPE.TONG_LIAN_BANK_CARD]: 3,
[PAY_TYPE.JING_DONG_BANK_CARD]: 4,
}