feat(passport): 重构短信登录页并提供手机号授权降级入口

- 修复购物车数据库缺失 spec_info 字段问题,新增迁移脚本
- 登录页处理手机号授权失败,按错误类型弹窗引导用户改用短信登录
- 登录页新增长期显示的「使用短信验证码登录」入口,提升用户降级体验
- 注册页同步改造,去除微信小程序环境下短信按钮隐藏问题
- 短信登录页整体 UI 重构,弃用 NutUI 组件,采用原生组件实现
- 短信登录页新增渐变背景、浮动光圈、圆形 logo、卡片输入区设计
- 实现手机号输入、验证码发送、倒计时及登录校验逻辑全覆盖
- 短信登录页新增返回微信快捷登录链接,避免用户被困登录流程
- 新增配套样式文件,实现多重动效及分阶段入场动画
- 保证类型检查和编译无误,增加设计稿 HTML 预览文件
This commit is contained in:
2026-07-15 18:55:12 +08:00
parent fad7c5f58e
commit b47ea6bd90
8 changed files with 891 additions and 57 deletions

View File

@@ -150,6 +150,28 @@ const Register = () => {
await Taro.redirectTo({ url: redirectUrl })
}
/** 手机号授权失败时弹窗引导走短信注册/登录(区分原因) */
const showPhoneAuthFailedModal = (errMsg?: string) => {
let content = '请尝试使用短信验证码注册/登录'
if (errMsg?.includes('user deny')) {
content = '您已取消微信手机号授权,可改用短信验证码注册/登录'
} else if (errMsg?.includes('privacy')) {
content = '微信未授权获取手机号,可改用短信验证码注册/登录'
} else if (errMsg?.includes('no permission')) {
content = '小程序暂未获得手机号授权,可改用短信验证码注册/登录'
}
Taro.showModal({
title: '未获取到手机号',
content,
confirmText: '短信注册/登录',
cancelText: '我知道了',
confirmColor: '#07c160',
success: (res) => {
if (res.confirm) goSmsLogin()
},
})
}
const handleGetPhoneNumber = async ({ detail }: GetPhoneNumberEvent) => {
if (!isAgree) {
Taro.showToast({ title: '请先勾选同意协议', icon: 'none' })
@@ -159,7 +181,7 @@ const Register = () => {
const { code: phoneCode, encryptedData, iv, errMsg } = detail || {}
if (!phoneCode || (errMsg && errMsg.includes('fail'))) {
Taro.showToast({ title: '未授权手机号', icon: 'none' })
showPhoneAuthFailedModal(errMsg)
return
}
@@ -281,11 +303,9 @@ const Register = () => {
/
</Button>
{!isWeapp && (
<Button type='default' block disabled={!isAgree || loading} onClick={goSmsLogin}>
/
</Button>
)}
<Button type='default' block disabled={!isAgree || loading} onClick={goSmsLogin}>
/
</Button>
</View>
<View className='mt-6 flex text-sm items-center px-1'>