diff --git a/frontend/mobile-app/lib/features/kyc/presentation/pages/change_phone_page.dart b/frontend/mobile-app/lib/features/kyc/presentation/pages/change_phone_page.dart index ae7a5677..cefa2ea1 100644 --- a/frontend/mobile-app/lib/features/kyc/presentation/pages/change_phone_page.dart +++ b/frontend/mobile-app/lib/features/kyc/presentation/pages/change_phone_page.dart @@ -8,10 +8,11 @@ import 'kyc_entry_page.dart'; // 导入 kycServiceProvider /// 更换手机号流程步骤 enum ChangePhoneStep { - verifyOld, // 验证旧手机 - inputNew, // 输入新手机号 - verifyNew, // 验证新手机 - success, // 更换成功 + verifyOld, // 验证旧手机 + verifySuccess, // 验证成功，选择下一步操作（仅当首次验证时显示） + inputNew, // 输入新手机号 + verifyNew, // 验证新手机 + success, // 更换成功 } /// 更换手机号页面 @@ -149,15 +150,16 @@ class _ChangePhonePageState extends ConsumerState { _countdown = 0; }); - // 如果之前手机号未验证过，现在首次验证成功，显示恭喜弹窗 - if (!response.wasAlreadyVerified && mounted) { - await _showCongratulationsDialog(); - } - - // 进入下一步 + // 根据之前是否已验证决定跳转到哪个步骤 if (mounted) { setState(() { - _currentStep = ChangePhoneStep.inputNew; + if (!response.wasAlreadyVerified) { + // 首次验证成功，显示选择页面 + _currentStep = ChangePhoneStep.verifySuccess; + } else { + // 之前已验证过，直接进入更换手机号流程 + _currentStep = ChangePhoneStep.inputNew; + } }); } } catch (e) { @@ -176,114 +178,6 @@ class _ChangePhonePageState extends ConsumerState { } } - /// 显示恭喜弹窗（首次验证手机号成功） - Future _showCongratulationsDialog() async { - return showDialog( - context: context, - barrierDismissible: false, - builder: (context) => AlertDialog( - shape: RoundedRectangleBorder( - borderRadius: BorderRadius.circular(16.r), - ), - content: Column( - mainAxisSize: MainAxisSize.min, - children: [ - SizedBox(height: 16.h), - Container( - width: 64.w, - height: 64.w, - decoration: const BoxDecoration( - color: Color(0xFFE8F5E9), - shape: BoxShape.circle, - ), - child: Icon( - Icons.check_circle, - color: const Color(0xFF2E7D32), - size: 40.sp, - ), - ), - SizedBox(height: 16.h), - Text( - '恭喜您！', - style: TextStyle( - fontSize: 20.sp, - fontWeight: FontWeight.w600, - color: const Color(0xFF333333), - ), - ), - SizedBox(height: 8.h), - Text( - '您的手机号已验证成功', - style: TextStyle( - fontSize: 14.sp, - color: const Color(0xFF666666), - ), - textAlign: TextAlign.center, - ), - SizedBox(height: 8.h), - Text( - '您可以继续更换新手机号，或点击返回完成验证', - style: TextStyle( - fontSize: 12.sp, - color: const Color(0xFF999999), - ), - textAlign: TextAlign.center, - ), - SizedBox(height: 24.h), - Row( - children: [ - Expanded( - child: OutlinedButton( - onPressed: () { - Navigator.of(context).pop(); // 关闭弹窗 - this.context.pop(); // 返回上一页 - }, - style: OutlinedButton.styleFrom( - padding: EdgeInsets.symmetric(vertical: 12.h), - side: const BorderSide(color: Color(0xFF2E7D32)), - shape: RoundedRectangleBorder( - borderRadius: BorderRadius.circular(8.r), - ), - ), - child: Text( - '完成', - style: TextStyle( - fontSize: 14.sp, - color: const Color(0xFF2E7D32), - ), - ), - ), - ), - SizedBox(width: 12.w), - Expanded( - child: ElevatedButton( - onPressed: () { - Navigator.of(context).pop(); // 关闭弹窗，继续更换手机号流程 - }, - style: ElevatedButton.styleFrom( - backgroundColor: const Color(0xFF2E7D32), - padding: EdgeInsets.symmetric(vertical: 12.h), - shape: RoundedRectangleBorder( - borderRadius: BorderRadius.circular(8.r), - ), - ), - child: Text( - '继续更换', - style: TextStyle( - fontSize: 14.sp, - color: Colors.white, - ), - ), - ), - ), - ], - ), - ], - ), - ), - ); - } - /// 发送新手机验证码 Future _sendNewPhoneCode() async { final newPhone = _newPhoneController.text.trim(); @@ -415,6 +309,8 @@ class _ChangePhonePageState extends ConsumerState { switch (_currentStep) { case ChangePhoneStep.verifyOld: return _buildVerifyOldStep(); + case ChangePhoneStep.verifySuccess: + return _buildVerifySuccessStep(); case ChangePhoneStep.inputNew: return _buildInputNewStep(); case ChangePhoneStep.verifyNew: @@ -477,6 +373,159 @@ class _ChangePhonePageState extends ConsumerState { ); } + /// 验证成功选择页面（首次验证手机号后显示） + Widget _buildVerifySuccessStep() { + return SingleChildScrollView( + padding: EdgeInsets.symmetric(horizontal: 24.w), + child: Column( + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + SizedBox(height: 60.h), + // 成功图标 + Container( + width: 80.w, + height: 80.w, + decoration: const BoxDecoration( + color: Color(0xFFE8F5E9), + shape: BoxShape.circle, + ), + child: Icon( + Icons.check_circle, + color: const Color(0xFF2E7D32), + size: 50.sp, + ), + ), + SizedBox(height: 24.h), + Text( + '恭喜您！', + style: TextStyle( + fontSize: 28.sp, + fontWeight: FontWeight.w700, + color: const Color(0xFF333333), + ), + ), + SizedBox(height: 12.h), + Text( + '您的手机号已验证成功', + style: TextStyle( + fontSize: 16.sp, + color: const Color(0xFF666666), + ), + ), + if (_oldPhoneNumber != null) ...[ + SizedBox(height: 8.h), + Text( + _oldPhoneNumber!, + style: TextStyle( + fontSize: 20.sp, + fontWeight: FontWeight.w600, + color: const Color(0xFF2E7D32), + ), + ), + ], + SizedBox(height: 48.h), + Text( + '请选择下一步操作', + style: TextStyle( + fontSize: 14.sp, + color: const Color(0xFF999999), + ), + ), + SizedBox(height: 24.h), + // 仅验证手机号按钮 + SizedBox( + width: double.infinity, + child: OutlinedButton( + onPressed: () { + context.pop(); // 返回上一页 + }, + style: OutlinedButton.styleFrom( + padding: EdgeInsets.symmetric(vertical: 16.h), + side: const BorderSide(color: Color(0xFF2E7D32), width: 1.5), + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(12.r), + ), + ), + child: Row( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Icon(Icons.check, color: const Color(0xFF2E7D32), size: 20.sp), + SizedBox(width: 8.w), + Text( + '仅验证手机号，不更换', + style: TextStyle( + fontSize: 16.sp, + fontWeight: FontWeight.w600, + color: const Color(0xFF2E7D32), + ), + ), + ], + ), + ), + ), + SizedBox(height: 16.h), + // 继续更换手机号按钮 + SizedBox( + width: double.infinity, + child: ElevatedButton( + onPressed: () { + setState(() { + _currentStep = ChangePhoneStep.inputNew; + }); + }, + style: ElevatedButton.styleFrom( + backgroundColor: const Color(0xFF2E7D32), + padding: EdgeInsets.symmetric(vertical: 16.h), + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(12.r), + ), + ), + child: Row( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Icon(Icons.swap_horiz, color: Colors.white, size: 20.sp), + SizedBox(width: 8.w), + Text( + '继续更换手机号', + style: TextStyle( + fontSize: 16.sp, + fontWeight: FontWeight.w600, + color: Colors.white, + ), + ), + ], + ), + ), + ), + SizedBox(height: 32.h), + // 提示文字 + Container( + padding: EdgeInsets.all(16.w), + decoration: BoxDecoration( + color: const Color(0xFFF5F5F5), + borderRadius: BorderRadius.circular(8.r), + ), + child: Row( + children: [ + Icon(Icons.info_outline, color: const Color(0xFF999999), size: 18.sp), + SizedBox(width: 8.w), + Expanded( + child: Text( + '如需更换手机号，验证码将发送至新手机', + style: TextStyle( + fontSize: 12.sp, + color: const Color(0xFF666666), + ), + ), + ), + ], + ), + ), + ], + ), + ); + } + /// 步骤2: 输入新手机号 Widget _buildInputNewStep() { return SingleChildScrollView(