diff --git a/src/pages-booking/index.vue b/src/pages-booking/index.vue index 4e0e45b..ff6ca0b 100644 --- a/src/pages-booking/index.vue +++ b/src/pages-booking/index.vue @@ -203,96 +203,107 @@ const validateUserForms = () => { // 处理支付点击事件 const handlePayClick = ThrottleUtils.createThrottle(async (goodsData) => { - console.log("处理支付点击事件", userFormList.value); - // 判断是酒店类型 - if (goodsData.commodityTypeCode === "0") { - // 校验用户姓名 - if (!validateUserForms()) { + // 点击后立即展示 loading + uni.showLoading({ title: "正在提交订单..." }); + + try { + console.log("处理支付点击事件", userFormList.value); + // 判断是酒店类型 + if (goodsData.commodityTypeCode === "0") { + // 校验用户姓名 + if (!validateUserForms()) { + uni.hideLoading(); + return; + } + } + // 校验手机号 + if (!PhoneUtils.validatePhone(userFormList.value[0].contactPhone)) { + uni.hideLoading(); + uni.showToast({ title: "请输入正确的手机号", icon: "none" }); return; } + + // 购买的商品id + const commodityId = goodsData.commodityId; + // 消费者信息 + const consumerInfoEntityList = userFormList.value; + // 购买数量 + const purchaseAmount = consumerInfoEntityList.length; + // 支付方式 0-微信 1-支付宝 2-云闪付 + const payWay = "0"; + // 支付渠道 0-app 1-小程序 2-h5 + const paySource = "1"; + + const params = { + commodityId, + purchaseAmount, + payWay, + paySource, + consumerInfoEntityList, + }; + + //酒店类型添加入住时间、离店时间 + if (goodsData.commodityTypeCode === "0" && selectedDate.value) { + const { startDate, endDate } = selectedDate.value; + // 入住时间 + params.checkInData = startDate; + // 离店时间 + params.checkOutData = endDate; + } + + const res = await orderPay(params); + console.log("确认订单---2:", res); + + // 检查接口返回数据 + if (!res || !res.data) { + uni.hideLoading(); + uni.showToast({ title: "订单创建失败,请重试", icon: "none" }); + return; + } + + const { data } = res; + const { nonceStr, packageVal, paySign, signType, timeStamp } = data; + + // 验证支付参数是否完整 + if (!nonceStr || !packageVal || !paySign || !signType || !timeStamp) { + uni.hideLoading(); + uni.showToast({ title: "支付参数错误,请重试", icon: "none" }); + return; + } + + // 在发起微信支付前关闭 loading(避免与原生支付 UI 冲突) + uni.hideLoading(); + + // 调用微信支付 + uni.requestPayment({ + provider: "wxpay", + timeStamp: String(timeStamp), // 确保为字符串类型 + nonceStr: String(nonceStr), + package: String(packageVal), // 确保为字符串类型 + signType: String(signType), + paySign: String(paySign), + success: () => { + uni.showToast({ + title: "支付成功", + icon: "success", + success: () => { + uni.navigateTo({ + url: "/pages-order/order/list", + }); + }, + }); + }, + fail: () => { + uni.showToast({ title: "支付失败,请重试", icon: "none" }); + }, + }); + } catch (error) { + console.error(error); + uni.showToast({ title: "请求出错,请重试", icon: "none" }); + } finally { + // 防止某些分支忘记 hide,确保最终关闭 loading(requestPayment 后也可以安全调用 hide) + uni.hideLoading(); } - // 校验手机号 - if (!PhoneUtils.validatePhone(userFormList.value[0].contactPhone)) { - uni.showToast({ title: "请输入正确的手机号", icon: "none" }); - return; - } - - // 购买的商品id - const commodityId = goodsData.commodityId; - // 消费者信息 - const consumerInfoEntityList = userFormList.value; - // 购买数量 - const purchaseAmount = consumerInfoEntityList.length; - // 支付方式 0-微信 1-支付宝 2-云闪付 - const payWay = "0"; - // 支付渠道 0-app 1-小程序 2-h5 - const paySource = "1"; - - const params = { - commodityId, - purchaseAmount, - payWay, - paySource, - consumerInfoEntityList, - }; - - //酒店类型添加入住时间、离店时间 - if (goodsData.commodityTypeCode === "0" && selectedDate.value) { - const { startDate, endDate } = selectedDate.value; - // 入住时间 - params.checkInData = startDate; - // 离店时间 - params.checkOutData = endDate; - } - - const res = await orderPay(params); - console.log("确认订单---2:", res); - - // 检查接口返回数据 - if (!res || !res.data) { - uni.showToast({ title: "订单创建失败,请重试", icon: "none" }); - return; - } - - const { data } = res; - const { nonceStr, packageVal, paySign, signType, timeStamp } = data; - - // 验证支付参数是否完整 - if (!nonceStr || !packageVal || !paySign || !signType || !timeStamp) { - // console.error("支付参数不完整:", { - // nonceStr: !!nonceStr, - // packageVal: !!packageVal, - // paySign: !!paySign, - // signType: !!signType, - // timeStamp: !!timeStamp, - // }); - uni.showToast({ title: "支付参数错误,请重试", icon: "none" }); - return; - } - - // 调用微信支付 - uni.requestPayment({ - provider: "wxpay", - timeStamp: String(timeStamp), // 确保为字符串类型 - nonceStr: String(nonceStr), - package: String(packageVal), // 确保为字符串类型 - signType: String(signType), - paySign: String(paySign), - success: () => { - uni.showToast({ - title: "支付成功", - icon: "success", - success: () => { - uni.navigateTo({ - url: "/pages-order/order/list", - }); - }, - }); - }, - fail: () => { - uni.showToast({ title: "支付失败,请重试", icon: "none" }); - }, - }); }, 1000); diff --git a/src/pages-order/order/components/FooterSection/index.vue b/src/pages-order/order/components/FooterSection/index.vue index 84878a3..42975ae 100644 --- a/src/pages-order/order/components/FooterSection/index.vue +++ b/src/pages-order/order/components/FooterSection/index.vue @@ -71,10 +71,14 @@ const handleButtonClick = async (orderData) => { uni.navigateTo({ url: `/pages/goods/index?commodityId=${orderData.commodityId}`, }); + return; } // 待支付状态,调用支付接口 if (statusCode.value === "0") { + // 显示 loading + uni.showLoading({ title: "正在提交订单..." }); + const orderId = orderData.orderId; const payWay = orderData.payWay; const paySource = orderData.paySource; @@ -84,6 +88,7 @@ const handleButtonClick = async (orderData) => { // 检查接口返回数据 if (!res || !res.data) { + uni.hideLoading(); uni.showToast({ title: "订单创建失败,请重试", icon: "none" }); return; } @@ -93,17 +98,14 @@ const handleButtonClick = async (orderData) => { // 验证支付参数是否完整 if (!nonceStr || !packageVal || !paySign || !signType || !timeStamp) { - // console.error("支付参数不完整:", { - // nonceStr: !!nonceStr, - // packageVal: !!packageVal, - // paySign: !!paySign, - // signType: !!signType, - // timeStamp: !!timeStamp, - // }); + uni.hideLoading(); uni.showToast({ title: "支付参数错误,请重试", icon: "none" }); return; } + // 在发起微信支付前关闭 loading(避免与原生支付 UI 冲突) + uni.hideLoading(); + // 调用微信支付 uni.requestPayment({ provider: "wxpay", @@ -126,6 +128,7 @@ const handleButtonClick = async (orderData) => { } } catch (error) { console.error("操作失败:", error); + uni.hideLoading(); } };