优化首页
This commit is contained in:
@@ -64,6 +64,7 @@
|
||||
*/
|
||||
.payment-list .item-content {
|
||||
padding: 20rpx 0;
|
||||
display: flex;
|
||||
}
|
||||
.payment-list .item-content .icon {
|
||||
width: 40rpx;
|
||||
|
||||
@@ -268,7 +268,7 @@
|
||||
<view v-if="common_order_is_booking != 1 && payment_list.length > 0" :class="plugins_coin_is_valid ? 'br-t-f9' : ''">
|
||||
<view v-for="(item, index) in payment_list" :key="index">
|
||||
<view class="item flex-row jc-sb align-c" :data-value="item.id" :data-index="index" @tap="payment_event">
|
||||
<view class="item-content pr flex-1 flex-width">
|
||||
<view class="item-content flex pr flex-1 flex-width">
|
||||
<image v-if="(item.logo || null) != null" class="icon margin-right-sm va-m radius" :src="item.logo" mode="widthFix"></image>
|
||||
<text class="va-m">{{ item.name }}</text>
|
||||
<text v-if="(item.tips || null) !== null" class="pay-tips">{{ item.tips }}</text>
|
||||
@@ -508,7 +508,7 @@
|
||||
is_realstore_model: (params.realstore_id || null) != null,
|
||||
plugins_points_status: app.globalData.get_config('plugins_base.points.data.is_default_use_points', null) == 1,
|
||||
// pay_url: app.globalData.get_request_url('pay', 'order'),
|
||||
pay_url: app.globalData.get_request_url('getpayment', 'xo'),
|
||||
// pay_url: app.globalData.get_request_url('getpayment', 'xo'),
|
||||
qrcode_url: app.globalData.get_request_url('paycheck', 'order'),
|
||||
});
|
||||
|
||||
@@ -625,44 +625,54 @@
|
||||
},
|
||||
// 发起支付请求
|
||||
async onPay(order_id, payment_id = 0, payment_list) {
|
||||
console.log('发起支付请求', `${order_id}+${payment_id}+${JSON.stringify(payment_list)}`);
|
||||
let payment = payment_list.find((item) => item.id == payment_id).payment;
|
||||
if (payment == 'Weixin') {
|
||||
let web_openid = localStorage.getItem('web_openid');
|
||||
this.pay_url = app.globalData.get_request_url('getpayment', 'xo');
|
||||
if (!web_openid) {
|
||||
// 获取code换取web_openid
|
||||
const code = this.getCodeFromUrl();
|
||||
console.log('code===', code);
|
||||
if (!code) {
|
||||
this.handleAuthLogin();
|
||||
return;
|
||||
}
|
||||
uni.request({
|
||||
url: app.globalData.get_request_url('getwechatuserinfo', 'xo'),
|
||||
method: 'GET',
|
||||
data: {
|
||||
code: code,
|
||||
},
|
||||
dataType: 'json',
|
||||
success: (res) => {
|
||||
console.log('获取微信web_openid===', res.data);
|
||||
if (res.data.code == 0) {
|
||||
let data = res.data.data;
|
||||
localStorage.setItem('web_openid', data.openid);
|
||||
|
||||
let web_openid = localStorage.getItem('web_openid');
|
||||
console.log('onPay.web_openid===', web_openid);
|
||||
if (!web_openid) {
|
||||
// 获取code换取web_openid
|
||||
const code = this.getCodeFromUrl();
|
||||
console.log('code===', code);
|
||||
if (!code) {
|
||||
this.handleAuthLogin();
|
||||
return;
|
||||
this.$refs.payment.pay_handle(order_id, payment_id, payment_list);
|
||||
} else {
|
||||
this.setData({
|
||||
data_list_loding_status: 2,
|
||||
data_list_loding_msg: res.data.msg,
|
||||
});
|
||||
}
|
||||
},
|
||||
});
|
||||
} else {
|
||||
// 直接走支付流程
|
||||
console.log('直接走支付流程');
|
||||
this.$refs.payment.pay_handle(order_id, payment_id, payment_list);
|
||||
}
|
||||
uni.request({
|
||||
url: app.globalData.get_request_url('getwechatuserinfo', 'xo'),
|
||||
method: 'GET',
|
||||
data: {
|
||||
code: code,
|
||||
},
|
||||
dataType: 'json',
|
||||
success: (res) => {
|
||||
console.log('获取微信web_openid===', res.data);
|
||||
if (res.data.code == 0) {
|
||||
let data = res.data.data;
|
||||
localStorage.setItem('web_openid', data.openid);
|
||||
}
|
||||
|
||||
this.$refs.payment.pay_handle(order_id, payment_id, payment_list);
|
||||
} else {
|
||||
this.setData({
|
||||
data_list_loding_status: 2,
|
||||
data_list_loding_msg: res.data.msg,
|
||||
});
|
||||
}
|
||||
},
|
||||
if (payment == 'IEPayPoli') {
|
||||
console.log('开始无忧支付===', order_id);
|
||||
|
||||
this.pay_url = app.globalData.get_request_url('wuYouPay', 'xo');
|
||||
this.$nextTick(() => {
|
||||
this.$refs.payment.pay_handle(order_id, payment_id, payment_list);
|
||||
});
|
||||
} else {
|
||||
// 直接走支付流程
|
||||
console.log('直接走支付流程');
|
||||
this.$refs.payment.pay_handle(order_id, payment_id, payment_list);
|
||||
}
|
||||
},
|
||||
// 初始化配置
|
||||
|
||||
352
pages/buy/wu_you_status.vue
Normal file
352
pages/buy/wu_you_status.vue
Normal file
@@ -0,0 +1,352 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="loading">
|
||||
<image class="icon" src="/static/icon_paying.svg" mode="aspectFit"></image>
|
||||
<view class="t">
|
||||
{{ status }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import base64 from '../../common/js/lib/base64';
|
||||
|
||||
const app = getApp();
|
||||
export default {
|
||||
props: {
|
||||
// 支付id
|
||||
payment_id: 0,
|
||||
// 订单下标 ---- 用于处理支付成功后前端修改成功状态
|
||||
propTempPayIndex: {
|
||||
type: [Number, String],
|
||||
default: 0,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
status: '支付中...',
|
||||
pay_url: '',
|
||||
checkOrderTimer: null, // 存储定时器ID
|
||||
isChecking: false, // 请求状态标记
|
||||
checkTries: 0, // 当前尝试次数
|
||||
};
|
||||
},
|
||||
onLoad(e) {
|
||||
window.addEventListener('popstate', this.onPageBack);
|
||||
console.log('wu_you_status.onLoad===', e);
|
||||
this.pay_url = e;
|
||||
let wuyou = uni.getStorageSync('wuyouPay');
|
||||
if (this.pay_url.order_id && !wuyou.order_id) {
|
||||
uni.setStorageSync('wuyouPay', {
|
||||
order_id: this.pay_url.order_id,
|
||||
check: false,
|
||||
});
|
||||
this.payHandle();
|
||||
}
|
||||
},
|
||||
onHide() {
|
||||
console.log('页面关闭');
|
||||
if (this.checkOrderTimer) {
|
||||
console.log('清除未完成的订单查询定时器');
|
||||
clearTimeout(this.checkOrderTimer);
|
||||
}
|
||||
this.isChecking = false;
|
||||
this.checkTries = 0;
|
||||
},
|
||||
onShow() {
|
||||
let wuyou = uni.getStorageSync('wuyouPay');
|
||||
if (wuyou && wuyou.check) {
|
||||
this.checkOrderStatus();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onPageBack() {
|
||||
console.log('页面关闭');
|
||||
if (this.checkOrderTimer) {
|
||||
console.log('清除未完成的订单查询定时器');
|
||||
clearTimeout(this.checkOrderTimer);
|
||||
}
|
||||
this.isChecking = false;
|
||||
this.checkTries = 0;
|
||||
},
|
||||
// 开始支付
|
||||
payHandle() {
|
||||
console.log('开始支付00000');
|
||||
uni.request({
|
||||
url: app.globalData.get_request_url('wuYouPay', 'xo'),
|
||||
method: 'POST',
|
||||
data: {
|
||||
ids: this.pay_url.order_id,
|
||||
payment_id: this.pay_url.payment_id,
|
||||
redirect_url: this.encodeAlipayCallbackUrl(window.location.href),
|
||||
},
|
||||
dataType: 'json',
|
||||
success: (res) => {
|
||||
console.log('开始支付===', res);
|
||||
var data = res.data;
|
||||
console.log(data);
|
||||
if (data.code == 0) {
|
||||
console.log(data.data.data.h5_url);
|
||||
let wuyou2 = uni.getStorageSync('wuyouPay');
|
||||
wuyou2.check = true;
|
||||
uni.setStorageSync('wuyouPay', wuyou2);
|
||||
window.location.href = data.data.data.h5_url;
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: msg.msg,
|
||||
icon: 'none',
|
||||
mask: true,
|
||||
});
|
||||
// setTimeout(() => {
|
||||
// uni.redirectTo({
|
||||
// url: '/pages/user-order/user-order',
|
||||
// });
|
||||
// }, 1500);
|
||||
}
|
||||
},
|
||||
fail: (err) => {
|
||||
console.log(err);
|
||||
},
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 处理支付宝回调 URL 编码
|
||||
* @param {string} url - 原始回调 URL
|
||||
* @returns {string} - 经过 URL 编码和 Base64 编码后的字符串
|
||||
*/
|
||||
encodeAlipayCallbackUrl(url) {
|
||||
try {
|
||||
// 解析URL并移除查询参数
|
||||
const urlObj = new URL(url);
|
||||
const cleanUrl = new URL(urlObj.origin + urlObj.pathname);
|
||||
|
||||
// 1. Base64 编码(仅编码路径部分,不含参数)
|
||||
let base64Encoded;
|
||||
|
||||
if (typeof window !== 'undefined' && window.btoa) {
|
||||
base64Encoded = window.btoa(cleanUrl.href);
|
||||
} else if (typeof Buffer !== 'undefined') {
|
||||
base64Encoded = Buffer.from(cleanUrl.href, 'utf8').toString('base64');
|
||||
} else {
|
||||
throw new Error('无法进行 Base64 编码');
|
||||
}
|
||||
|
||||
// 2. URL 安全处理
|
||||
const safeBase64 = base64Encoded
|
||||
.replace(/\+/g, '-') // 替换 + 为 -
|
||||
.replace(/\//g, '_') // 替换 / 为 _
|
||||
.replace(/=+$/, ''); // 移除末尾的 =
|
||||
|
||||
// 3. 最终 URL 编码
|
||||
return encodeURIComponent(safeBase64);
|
||||
} catch (error) {
|
||||
console.error('URL编码失败:', error);
|
||||
throw new Error('无效的URL格式');
|
||||
}
|
||||
},
|
||||
// 检测是否支付成功
|
||||
checkOrderStatus() {
|
||||
let wuyou = uni.getStorageSync('wuyouPay');
|
||||
|
||||
// 已达到最大尝试次数或正在请求中,则返回
|
||||
if (this.checkTries >= 10 || this.isChecking) {
|
||||
if (this.checkTries >= 10) {
|
||||
console.log('checkOrderStatus.已达到最大查询次数');
|
||||
this.payFail();
|
||||
}
|
||||
return;
|
||||
}
|
||||
this.status = `查询中,请勿操作(${this.checkTries + 1}/10)...`;
|
||||
|
||||
this.checkTries++;
|
||||
this.isChecking = true;
|
||||
console.log(`checkOrderStatus.第${this.checkTries}次查询订单状态`);
|
||||
|
||||
uni.request({
|
||||
url: app.globalData.get_request_url('queryOrder', 'xo'),
|
||||
method: 'get',
|
||||
data: {
|
||||
id: wuyou.order_id,
|
||||
},
|
||||
dataType: 'json',
|
||||
success: (res) => {
|
||||
let data = res.data;
|
||||
console.log(`checkOrderStatus.第${this.checkTries}次查询结果`, res.data);
|
||||
|
||||
if (data.code == 0) {
|
||||
const status = data.data.status;
|
||||
|
||||
switch (status) {
|
||||
case 0: // 支付中,2秒后继续查询
|
||||
console.log(`checkOrderStatus.订单状态:支付中,继续查询(${this.checkTries}/10)`);
|
||||
this.checkOrderTimer = setTimeout(() => {
|
||||
this.checkOrderStatus();
|
||||
}, 2000);
|
||||
break;
|
||||
|
||||
case 1: // 支付成功,跳转到订单详情
|
||||
console.log('checkOrderStatus.订单状态:支付成功');
|
||||
uni.showToast({
|
||||
title: '支付成功,即将跳转订单详情',
|
||||
icon: 'none',
|
||||
mask: true,
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
uni.reLaunch({
|
||||
url: `/pages/user-order-detail/user-order-detail?id=${wuyou.order_id}`,
|
||||
});
|
||||
}, 1000);
|
||||
break;
|
||||
|
||||
default: // 其他状态(如-1支付失败),终止查询
|
||||
console.log(`checkOrderStatus.订单状态异常:${status}`);
|
||||
this.payFail();
|
||||
}
|
||||
} else {
|
||||
// 请求成功但业务错误,终止查询
|
||||
console.error('checkOrderStatus.业务错误:', data.message);
|
||||
this.payFail();
|
||||
}
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error(`checkOrderStatus.第${this.checkTries}次查询失败`, err);
|
||||
|
||||
// 请求失败,2秒后继续尝试(但不增加尝试次数)
|
||||
this.checkTries--; // 失败不计数
|
||||
this.checkOrderTimer = setTimeout(() => {
|
||||
this.checkOrderStatus();
|
||||
}, 2000);
|
||||
},
|
||||
complete: () => {
|
||||
// 请求完成,无论结果如何都重置状态
|
||||
this.isChecking = false;
|
||||
},
|
||||
});
|
||||
},
|
||||
payFail() {
|
||||
uni.showToast({
|
||||
title: '支付失败',
|
||||
icon: 'none',
|
||||
mask: true,
|
||||
});
|
||||
setTimeout(() => {
|
||||
uni.reLaunch({
|
||||
url: '/pages/user-order/user-order',
|
||||
});
|
||||
}, 1500);
|
||||
},
|
||||
// 支付失败数据设置 data:后台返回的参数, order_id: 订单id, msg: 错误提示信息
|
||||
order_item_pay_fail_handle(data, order_id, msg) {
|
||||
let back_data = {
|
||||
data: data,
|
||||
order_id: order_id,
|
||||
temp_pay_index: this.propTempPayIndex,
|
||||
payment_id: this.payment_id,
|
||||
};
|
||||
this.$emit('pay-fail', back_data);
|
||||
this.to_fail_page_event(msg);
|
||||
},
|
||||
// 失败跳转
|
||||
to_fail_page_event(msg) {
|
||||
let to_fail_page = this.propToFailPage || null;
|
||||
if (to_fail_page != null) {
|
||||
let join = to_fail_page.indexOf('?') == -1 ? '?' : '&';
|
||||
to_fail_page += join + 'msg=' + msg;
|
||||
if (this.propIsFailAlert) {
|
||||
// 现金支付
|
||||
uni.showModal({
|
||||
content: msg,
|
||||
showCancel: false,
|
||||
confirmText: this.$t('common.confirm'),
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
// 跳转支付页面
|
||||
app.globalData.url_open(to_fail_page, true);
|
||||
}
|
||||
},
|
||||
});
|
||||
} else {
|
||||
// 跳转支付页面
|
||||
app.globalData.url_open(to_fail_page, true);
|
||||
}
|
||||
} else {
|
||||
if (msg) {
|
||||
app.globalData.showToast(msg);
|
||||
}
|
||||
}
|
||||
},
|
||||
// 支付成功数据设置 data:后台返回的参数, order_id: 订单id,is_to_page,是否需要跳转页面的参数控制
|
||||
order_item_pay_success_handle(data, order_id, is_to_page = true) {
|
||||
let back_data = {
|
||||
data: data,
|
||||
order_id: order_id,
|
||||
temp_pay_index: this.propTempPayIndex,
|
||||
payment_id: this.payment_id,
|
||||
is_to_page: is_to_page,
|
||||
};
|
||||
this.$emit('pay-success', back_data);
|
||||
if (is_to_page) {
|
||||
this.to_success_page_event();
|
||||
}
|
||||
},
|
||||
// 支付成功数据设置 data:后台返回的参数, order_id: 订单id,is_to_page,是否需要跳转页面的参数控制
|
||||
order_item_pay_success_handle(data, order_id, is_to_page = true) {
|
||||
let back_data = {
|
||||
data: data,
|
||||
order_id: order_id,
|
||||
temp_pay_index: this.propTempPayIndex,
|
||||
payment_id: this.payment_id,
|
||||
is_to_page: is_to_page,
|
||||
};
|
||||
this.$emit('pay-success', back_data);
|
||||
if (is_to_page) {
|
||||
this.to_success_page_event();
|
||||
}
|
||||
},
|
||||
// 成功跳转
|
||||
to_success_page_event() {
|
||||
if (this.propToPage) {
|
||||
// 跳转支付页面
|
||||
app.globalData.url_open(this.propToPage, true);
|
||||
} else {
|
||||
let url_data = {
|
||||
code: '9000',
|
||||
};
|
||||
url_data = Object.assign({}, url_data, this.propToPageBack);
|
||||
// 跳转支付页面
|
||||
app.globalData.url_open('/pages/paytips/paytips?params=' + encodeURIComponent(base64.encode(JSON.stringify(url_data))), this.propIsRedirectTo);
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.container {
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
padding-bottom: 40%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-sizing: border-box;
|
||||
.loading {
|
||||
display: flex;
|
||||
gap: 20upx;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.icon {
|
||||
$size: 300upx;
|
||||
width: $size;
|
||||
height: $size;
|
||||
}
|
||||
.t {
|
||||
font-size: 36upx;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user