fix:新增电话号码授权，修复订单创建/取消时用户手机消失的情况

2025-07-11 17:03:34 +08:00
parent 4851e0500d
commit f8ff55758b
24 changed files with 628 additions and 70 deletions
@@ -126,6 +126,27 @@
 				@click="handleRent('wx-pay')">
 				无法免押点这里></view>
 		</view>
+		
+		<!-- 手机号授权弹窗 -->
+		<view class="phone-auth-popup" v-if="showPhoneAuthPopup">
+			<view class="popup-mask" @click.stop></view>
+			<view class="popup-content">
+				<view class="popup-header">
+					<text class="popup-title">授权获取手机号</text>
+				</view>
+				<view class="popup-body">
+					<view class="auth-desc">
+						<text>为了提供更好的服务，需要授权获取您的手机号</text>
+					</view>
+					<button class="auth-btn" open-type="getPhoneNumber" @getphonenumber="onGetPhoneNumber">
+						一键获取手机号
+					</button>
+					<view class="auth-cancel" @click="showPhoneAuthPopup = false">
+						<text>暂不授权</text>
+					</view>
+				</view>
+			</view>
+		</view>
 	</view>
 </template>

@@ -151,7 +172,9 @@
 		URL
 	} from "@/config/url.js"
 	import {
-		initiateWeChatScorePayment
+		initiateWeChatScorePayment,
+		getUserInfo,
+		getUserPhoneNumber
 	} from '@/util/index.js'

 	// 响应式状态
@@ -166,7 +189,8 @@
 	})
 	const isLoggedIn = ref(true)
 	const phoneNumber = ref('')
-
+	const showPhoneAuthPopup = ref(false)
+	
 	// 生命周期 onLoad 钩子
 	onLoad((options) => {
 		deviceId.value = options.deviceNo
@@ -174,6 +198,116 @@
 		console.log(options.deviceNo)
 		fetchDeviceInfo()
 	})
+	
+	onMounted(()=>{
+		checkUserPhone()
+	})
+	
+	const checkUserPhone = async () => {
+		try {
+			const userInfoRes = await getUserInfo()
+			console.log(userInfoRes.data.phone, 'getUserInfoPhone')
+			
+			if (userInfoRes.code == 200 && userInfoRes.data && userInfoRes.data.phone) {
+				phoneNumber.value = userInfoRes.data.phone
+			} else {
+				// 如果没有手机号，显示授权弹窗
+				showPhoneAuthPopup.value = true
+			}
+		} catch (error) {
+			console.error('获取用户信息失败:', error)
+		}
+	}
+	
+	// 处理获取手机号
+	const onGetPhoneNumber = (e) => {
+		console.log('getPhoneNumber event:', e.detail)
+		
+		// 用户拒绝授权的情况
+		if (e.detail.errMsg && e.detail.errMsg.includes('deny')) {
+			uni.showToast({
+				title: '需要授权手机号才能使用设备',
+				icon: 'none'
+			})
+			return
+		}
+		
+		// 获取到授权code
+		if (e.detail.code) {
+			uni.showLoading({
+				title: '获取中...'
+			})
+			
+			console.log('获取到的授权code:', e.detail.code)
+			
+			// 添加 try-catch 以捕获任何 Promise 外部的错误
+			try {
+				getUserPhoneNumber(e.detail.code)
+					.then(res => {
+						console.log('获取手机号API响应原始数据:', JSON.stringify(res))
+						uni.hideLoading()
+						
+						// 不立即抛出错误，而是记录问题并继续处理
+						if (!res) {
+							console.error('API返回数据为空')
+							uni.showModal({
+								title: '数据异常',
+								content: 'API返回为空',
+								showCancel: false
+							})
+							return
+						}
+						
+						// 检查响应格式
+						console.log('响应code:', res.code, '响应类型:', typeof res.code)
+						console.log('是否有data:', !!res.data, '是否有phone:', res.data && !!res.data.phone)
+						
+						if (res.code == 200 && res.data && res.data.phoneNumber) {
+							phoneNumber.value = res.data.phoneNumber
+							showPhoneAuthPopup.value = false
+							
+							uni.showToast({
+								title: '手机号获取成功',
+								icon: 'success'
+							})
+						} else {
+							// 记录详细信息，不抛出错误
+							console.warn('获取手机号响应异常:', res.msg || '未知错误')
+							uni.showModal({
+								title: '获取手机号异常',
+								content: `状态码: ${res.code}, 消息: ${res.msg || '无'}`,
+								showCancel: false
+							})
+						}
+					})
+					.catch(err => {
+						uni.hideLoading()
+						console.error('获取手机号码失败(catch):', err)
+						
+						// 显示更详细的错误信息
+						let errMsg = err.message || err.toString()
+						uni.showModal({
+							title: '获取手机号失败',
+							content: '错误信息: ' + errMsg,
+							showCancel: false
+						})
+					})
+			} catch (outerError) {
+				uni.hideLoading()
+				console.error('获取手机号外部错误:', outerError)
+				uni.showModal({
+					title: '意外错误',
+					content: '处理过程发生异常: ' + (outerError.message || outerError),
+					showCancel: false
+				})
+			}
+		} else {
+			uni.showToast({
+				title: '获取授权码失败',
+				icon: 'none'
+			})
+		}
+	}

 	// 检查登录状态和订单
 	const fetchDeviceInfo = async () => {
@@ -253,9 +387,15 @@
 			showLoginTip()
 			return
 		}
+		
+		// 检查是否有手机号，如果没有则提示授权
+		if (!phoneNumber.value) {
+			showPhoneAuthPopup.value = true
+			return
+		}

-		// 直接提交订单，不显示确认对话框
-		submitRentOrder(payWay);
+		// 提交订单
+		submitRentOrder(payWay)
 	}

 	const selectedPkg = reactive({
@@ -761,4 +901,106 @@
 			}
 		}
 	}
+
+	/* 手机号授权弹窗样式 */
+	.phone-auth-popup {
+		position: fixed;
+		top: 0;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		z-index: 1000;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		background-color: rgba(0, 0, 0, 0.5);
+	}
+
+	.popup-mask {
+		position: absolute;
+		top: 0;
+		left: 0;
+		right: 0;
+		bottom: 0;
+	}
+
+	.popup-content {
+		background-color: #fff;
+		border-radius: 24rpx;
+		box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.15);
+		width: 90%;
+		max-width: 500rpx;
+		padding: 40rpx 30rpx;
+		position: relative;
+		z-index: 1001;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+	}
+
+	.popup-header {
+		margin-bottom: 30rpx;
+		text-align: center;
+	}
+
+	.popup-title {
+		font-size: 36rpx;
+		font-weight: bold;
+		color: #333;
+	}
+
+	.popup-body {
+		width: 100%;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		margin-bottom: 30rpx;
+	}
+
+	.auth-desc {
+		font-size: 28rpx;
+		color: #666;
+		text-align: center;
+		margin-bottom: 30rpx;
+		line-height: 1.6;
+	}
+
+	.auth-btn {
+		width: 100%;
+		height: 92rpx;
+		border-radius: 46rpx;
+		background: linear-gradient(135deg, #07c160, #10d673);
+		color: #fff;
+		font-size: 32rpx;
+		font-weight: 600;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		border: none;
+		margin-bottom: 20rpx;
+
+		&:active {
+			transform: scale(0.98);
+			opacity: 0.9;
+		}
+	}
+
+	.auth-cancel {
+		width: 100%;
+		height: 92rpx;
+		border-radius: 46rpx;
+		background-color: #f5f7fa;
+		color: #333;
+		font-size: 32rpx;
+		font-weight: 600;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		border: none;
+
+		&:active {
+			transform: scale(0.98);
+			opacity: 0.9;
+		}
+	}
 </style>
@@ -104,6 +104,27 @@
 				</view>
 			</view>
 		</view>
+		
+		<!-- 手机号授权弹窗 -->
+		<view class="phone-auth-popup" v-if="showPhoneAuthPopup">
+			<view class="popup-mask" @click.stop="showPhoneAuthPopup = false"></view>
+			<view class="popup-content">
+				<view class="popup-header">
+					<text class="popup-title">授权获取手机号</text>
+				</view>
+				<view class="popup-body">
+					<view class="auth-desc">
+						<text>为了提供更好的服务和紧急联系，需要授权获取您的手机号</text>
+					</view>
+					<button class="auth-btn" open-type="getPhoneNumber" @getphonenumber="onGetPhoneNumber">
+						<text>一键获取手机号</text>
+					</button>
+					<view class="auth-cancel" @click="showPhoneAuthPopup = false">
+						<text>暂不授权</text>
+					</view>
+				</view>
+			</view>
+		</view>
 	</view>
 </template>

@@ -131,8 +152,6 @@
 					console.log(scanResult.path);

 					let deviceNo = getQueryString(scanResult.path, 'deviceNo')
-					console.log('扫码路径:', scanResult.path)
-					console.log('解析到的设备号:', deviceNo)

 					if (!deviceNo) {
 						uni.showToast({
@@ -144,7 +163,7 @@

 					// 直接在当前页面查询是否有使用中的订单，避免跳转到中间页面
 					if (!uni.getStorageSync('token')) {
-						await wxLogin()
+						await wxLogin() 
 					}

 					// 检查是否有使用中的订单
@@ -157,13 +176,10 @@
 						}
 					})

-					console.log('使用中订单检查结果:', JSON.stringify(inUseRes))
-
 					if (inUseRes.statusCode == 200 && inUseRes.data.code == 200 && inUseRes.data.data) {
 						// 存在使用中的订单，跳转到归还页面
 						const inUseOrder = inUseRes.data.data
-						console.log('检测到使用中订单，准备跳转:', inUseOrder)
-
+					
 						// 直接使用reLaunch而不是navigateTo以确保页面跳转
 						uni.reLaunch({
 							url: `/pages/return/index?orderId=${inUseOrder.orderId}&deviceId=${deviceNo || inUseOrder.deviceNo}`
@@ -187,14 +203,10 @@
 					if (orderRes.statusCode == 200 && orderRes.data.code == 200 && orderRes.data.data) {
 						// 存在待支付订单，跳转到支付页面
 						const unpaidOrder = orderRes.data.data
-						console.log('检测到待支付订单，准备跳转:', unpaidOrder)
 						uni.navigateTo({
 							url: `/pages/order/payment?orderId=${unpaidOrder.orderId}`
 						})
 					} else {
-						// 修改：直接获取设备信息，而不是跳转到详情页面
-						console.log('无待支付订单，获取设备信息, deviceNo:', deviceNo)
-
 						try {
 							// 获取设备信息
 							const deviceInfoRes = await getDeviceInfo(deviceNo)