diff --git a/pages/login/index.vue b/pages/login/index.vue index 8f66e52..e419982 100644 --- a/pages/login/index.vue +++ b/pages/login/index.vue @@ -8,20 +8,30 @@ 登录您的账号 为保障使用体验,请先完成登录 - - + + + - - + + - - 登录即表示同意 - 《用户协议》 - 和 - 《隐私政策》 - + + + + + @@ -31,6 +41,51 @@ import { wxLogin, getUserPhoneNumber, getUserInfo } from '../../util/index.js' const redirect = ref('/pages/index/index') + const isAgreed = ref(false) // 是否同意协议 + + // 勾选协议变化 + const onAgreementChange = (e) => { + isAgreed.value = e.detail.value.includes('agreed') + console.log('协议勾选状态:', isAgreed.value, e.detail.value) + } + + // 未勾选协议时点击登录按钮 + const handleLoginClick = async () => { + try { + await checkAgreement() + // 协议已同意后,按钮会自动切换为带open-type的版本 + } catch (error) { + // 用户取消了协议同意 + } + } + + // 检查是否同意协议 + const checkAgreement = () => { + return new Promise((resolve, reject) => { + if (isAgreed.value) { + resolve() + return + } + + // 未勾选,弹窗提示 + uni.showModal({ + title: '温馨提示', + content: '请先阅读并同意《用户协议》和《隐私政策》', + confirmText: '同意', + cancelText: '取消', + success: (res) => { + if (res.confirm) { + // 用户点击同意,自动勾选 + isAgreed.value = true + resolve() + } else { + // 用户点击取消 + reject(new Error('需要同意协议才能登录')) + } + } + }) + }) + } const navigateAfterLogin = async () => { try { @@ -50,11 +105,16 @@ const onWeChatLogin = async () => { try { + // 先检查是否同意协议 + await checkAgreement() + await wxLogin() uni.showToast({ title: '登录成功', icon: 'success' }) await navigateAfterLogin() } catch (error) { - uni.showToast({ title: error.message || '登录失败', icon: 'none' }) + if (error.message !== '需要同意协议才能登录') { + uni.showToast({ title: error.message || '登录失败', icon: 'none' }) + } } } @@ -63,6 +123,7 @@ uni.showToast({ title: '已取消手机号授权', icon: 'none' }) return } + try { // 先微信登录,获取 token await wxLogin() @@ -150,11 +211,43 @@ border: 2rpx solid #07c160; } - .tips { - margin-top: 24rpx; - font-size: 22rpx; - color: #999; - .link { color: #07c160; } + .agreement-box { + margin-top: 32rpx; + display: flex; + justify-content: center; + align-items: center; + left: 50%; + transform: translateX(-50%); + width: 100%; + bottom: 40rpx; + position: absolute; + + .agreement-label { + display: flex; + align-items: center; + width: 100%; + + .agreement-checkbox { + flex-shrink: 0; + // margin-right: 12rpx; + // margin-top: 2rpx; + transform:scale(0.7); + } + + .agreement-text { + flex: 1; + font-size: 24rpx; + color: #666; + line-height: 1.8; + word-break: break-all; + + .link { + color: #07c160; + font-weight: 500; + text-decoration: none; + } + } + } } }