网络请求打通，ws 打通
This commit is contained in:
Cody
@@ -1,9 +1,16 @@
|
||||
import 'package:freezed_annotation/freezed_annotation.dart';
|
||||
|
||||
import '../../../domain/entities/user.dart';
|
||||
|
||||
part 'login_state.freezed.dart';
|
||||
|
||||
/// 登录流程的当前步骤
|
||||
enum LoginStep {
|
||||
/// 步骤 1：输入手机号
|
||||
phone,
|
||||
|
||||
/// 步骤 2：输入验证码
|
||||
otp,
|
||||
}
|
||||
|
||||
/// 登录页面状态（@freezed 自动生成 copyWith / == / toString）
|
||||
///
|
||||
/// ViewModel 通过 `state = state.copyWith(...)` 更新状态，
|
||||
@@ -12,22 +19,43 @@ part 'login_state.freezed.dart';
|
||||
/// ## 状态流转
|
||||
///
|
||||
/// ```
|
||||
/// 初始 → LoginState() isLoading: false, user: null, error: null
|
||||
/// 点击登录 → state.copyWith(isLoading: true) isLoading: true
|
||||
/// 登录成功 → state.copyWith(user: user) isLoading: false, user: User
|
||||
/// 格式错误 → state.copyWith(error: '邮箱格式不正确') isLoading: false, error: String
|
||||
/// 网络错误 → state.copyWith(error: '网络错误') isLoading: false, error: String
|
||||
/// 初始
|
||||
/// → LoginState() step: phone, isLoading: false
|
||||
/// 点击"获取验证码"
|
||||
/// → state.copyWith(isLoading: true)
|
||||
/// → 成功: state.copyWith(step: otp, contact: phone, isLoading: false)
|
||||
/// → 失败: state.copyWith(error: '...', isLoading: false)
|
||||
/// 点击"登录"
|
||||
/// → state.copyWith(isLoading: true)
|
||||
/// → 成功: authNotifierProvider.login() → 路由守卫重定向
|
||||
/// → 失败: state.copyWith(error: '...', isLoading: false)
|
||||
/// ```
|
||||
@freezed
|
||||
sealed class LoginState with _$LoginState {
|
||||
const factory LoginState({
|
||||
/// 登录成功后的用户信息（null = 未登录）
|
||||
User? user,
|
||||
const LoginState._();
|
||||
|
||||
/// 是否正在请求中（控制 loading 状态 / 按钮禁用）
|
||||
const factory LoginState({
|
||||
/// 当前步骤（手机号输入 or 验证码输入）
|
||||
@Default(LoginStep.phone) LoginStep step,
|
||||
|
||||
/// 国家代码（默认 +65，暂不支持切换）
|
||||
@Default('+65') String countryCode,
|
||||
|
||||
/// 已提交的手机号（步骤 2 用于显示和构建请求）
|
||||
@Default('') String contact,
|
||||
|
||||
/// 是否正在请求中
|
||||
@Default(false) bool isLoading,
|
||||
|
||||
/// 错误信息（null = 无错误）
|
||||
String? error,
|
||||
}) = _LoginState;
|
||||
|
||||
/// 步骤 2 显示的脱敏手机号，如 "138****0000"
|
||||
String get maskedContact {
|
||||
if (contact.length <= 4) return contact;
|
||||
final tail = contact.substring(contact.length - 4);
|
||||
final stars = '*' * (contact.length - 4);
|
||||
return '$stars$tail';
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,133 +1,101 @@
|
||||
import 'dart:convert';
|
||||
|
||||
import 'package:flutter/services.dart';
|
||||
import 'package:im_app/app/di/db_provider.dart';
|
||||
import 'package:im_app/app/di/user_provider.dart';
|
||||
import 'package:im_app/domain/entities/user.dart';
|
||||
import 'package:networks_sdk/networks_sdk.dart';
|
||||
import 'package:riverpod_annotation/riverpod_annotation.dart';
|
||||
import 'package:storage_sdk/storage_sdk.dart';
|
||||
|
||||
import '../../../app/di/app_providers.dart';
|
||||
import '../di/auth_providers.dart';
|
||||
import 'login_state.dart';
|
||||
import 'package:im_app/app/di/app_providers.dart';
|
||||
import 'package:im_app/features/login/di/auth_providers.dart';
|
||||
import 'package:im_app/features/login/presentation/login_state.dart';
|
||||
|
||||
part 'login_view_model.g.dart';
|
||||
|
||||
/// 登录 ViewModel（@riverpod 自动生成 `loginViewModelProvider`）
|
||||
///
|
||||
/// `@riverpod` 注解 → build_runner 自动生成 `login_view_model.g.dart`，
|
||||
/// 其中包含 `loginViewModelProvider`。View 层直接使用：
|
||||
/// 管理两步登录流程：手机号 → 验证码 → 完成登录。
|
||||
///
|
||||
/// ```dart
|
||||
/// // View 层读取状态
|
||||
/// final state = ref.watch(loginViewModelProvider);
|
||||
///
|
||||
/// // View 层调用方法
|
||||
/// ref.read(loginViewModelProvider.notifier).login(email, password);
|
||||
/// ref.read(loginViewModelProvider.notifier).sendOtp('+86', '13800138000');
|
||||
/// ref.read(loginViewModelProvider.notifier).verifyAndLogin('123456');
|
||||
/// ```
|
||||
///
|
||||
/// ## 手动 vs 自动 Provider 对比
|
||||
/// ## DI 链路
|
||||
///
|
||||
/// ```
|
||||
/// loginViewModelProvider ← @riverpod 自动生成（本文件）
|
||||
/// loginViewModelProvider ← @riverpod 自动生成
|
||||
/// → ref.read(loginUseCaseProvider) ← di/ 手动装配
|
||||
/// → ref.read(authRepositoryProvider) ← di/ 手动装配
|
||||
/// → ref.read(networkSdkApiProvider) ← app/di/ 手动装配
|
||||
/// ```
|
||||
///
|
||||
/// ## 数据流位置
|
||||
///
|
||||
/// ```
|
||||
/// View: ref.read(loginViewModelProvider.notifier).login(email, password)
|
||||
/// → ★ LoginViewModel.login() ★ ← 你在这里
|
||||
/// → LoginUseCase.execute() ← 格式校验 + 调 Repository
|
||||
/// → AuthRepository.login()
|
||||
/// → _client.executeRequest(LoginRequest)
|
||||
/// ← LoginResponse → User
|
||||
/// ← User
|
||||
/// → state = state.copyWith(user: user) ← 更新状态
|
||||
/// View: ref.watch → 自动 rebuild ← UI 刷新
|
||||
/// ```
|
||||
@riverpod
|
||||
class LoginViewModel extends _$LoginViewModel {
|
||||
@override
|
||||
LoginState build() => const LoginState();
|
||||
|
||||
/// Demo 登录（跳过 API，直接设置登录状态）
|
||||
/// 步骤 1：发送手机验证码
|
||||
///
|
||||
/// 仅用于演示路由守卫行为，正式 UI 就绪后删除此方法，改用 [login]。
|
||||
/// 正式 [login] 成功后同样需要调用 [AuthNotifier.login] 更新守卫状态。
|
||||
Future<void> demoLogin() async {
|
||||
// 防止连点重入：第一次调用未完成前忽略后续调用
|
||||
/// 成功后 step 切换为 [LoginStep.otp]，手机号保存到 state 供步骤 2 使用。
|
||||
Future<void> sendOtp(String countryCode, String contact) async {
|
||||
if (state.isLoading) return;
|
||||
state = state.copyWith(isLoading: true, error: null);
|
||||
final storageApi = ref.read(storageSdkProvider);
|
||||
final storageLifeCycle = storageApi as StorageSdkLifecycle;
|
||||
final repositoryProvider = ref.read(userRepositoryProvider);
|
||||
final provider = ref.read(authNotifierProvider);
|
||||
|
||||
try {
|
||||
// 读取 mock 数据（loginData.json 结构: { code, message, data: {...} }）
|
||||
// 手动拆包 data 字段，对应 SDK 内部 ApiResponseWrapper 的行为
|
||||
final raw = await rootBundle.loadString('assets/loginData.json');
|
||||
final json = jsonDecode(raw) as Map<String, dynamic>;
|
||||
final data = json['data'] as Map<String, dynamic>;
|
||||
final profile = data['profile'] as Map<String, dynamic>;
|
||||
// 生成器生成的 _$XFromJson 是 library 私有函数，外部不可调用。
|
||||
// Demo 场景直接从 JSON 字段构建 User，不依赖生成的 fromJson。
|
||||
final user = User(
|
||||
uid: profile['uid'] as int,
|
||||
uuid: profile['uuid'] as String,
|
||||
lastOnline: profile['last_online'] as int,
|
||||
profilePic: profile['profile_pic'] as String,
|
||||
profilePicGaussian: profile['profile_pic_gaussian'] as String,
|
||||
nickname: profile['nickname'] as String,
|
||||
contact: profile['contact'] as String,
|
||||
countryCode: profile['country_code'] as String,
|
||||
email: profile['email'] as String,
|
||||
recoveryEmail: profile['recovery_email'] as String,
|
||||
username: profile['username'] as String,
|
||||
bio: profile['bio'] as String,
|
||||
relationship: profile['relationship'] as int,
|
||||
userAlias: profile['user_alias'] as String?,
|
||||
hint: profile['hint'] as String,
|
||||
await ref
|
||||
.read(loginUseCaseProvider)
|
||||
.sendOtp(countryCode: countryCode, contact: contact);
|
||||
|
||||
if (!ref.mounted) return;
|
||||
state = state.copyWith(
|
||||
step: LoginStep.otp,
|
||||
countryCode: countryCode,
|
||||
contact: contact,
|
||||
isLoading: false,
|
||||
);
|
||||
|
||||
// 先完成 DB 操作，再标记登录状态（失败时不会误标为已登录）
|
||||
await storageLifeCycle.openDatabase(user.uid);
|
||||
// Save user to DB via repository
|
||||
await repositoryProvider.saveUser(user);
|
||||
|
||||
// Trigger auth state
|
||||
provider.login();
|
||||
} catch (e) {
|
||||
// 导航已发生时 provider 已被 dispose，静默丢弃，不再写 state
|
||||
state = state.copyWith(error: e.toString(), isLoading: false);
|
||||
}
|
||||
}
|
||||
|
||||
/// 执行登录
|
||||
///
|
||||
/// 1. 设置 loading 状态（UI 显示加载指示器、禁用按钮）
|
||||
/// 2. 调 UseCase（格式校验 → 登录 → 返回 User）
|
||||
/// 3. 成功：写入 user；失败：写入 error
|
||||
Future<void> login(String email, String password) async {
|
||||
state = state.copyWith(isLoading: true, error: null);
|
||||
final provider = ref.read(loginUseCaseProvider);
|
||||
|
||||
try {
|
||||
final user = await provider.execute(email: email, password: password);
|
||||
state = state.copyWith(user: user, isLoading: false);
|
||||
} on FormatException catch (e) {
|
||||
// 格式校验失败（UseCase 层抛出）
|
||||
if (!ref.mounted) return;
|
||||
state = state.copyWith(error: e.message, isLoading: false);
|
||||
} on ApiError catch (e) {
|
||||
// 网络 / 服务端错误（Repository → SDK 透传）
|
||||
if (!ref.mounted) return;
|
||||
state = state.copyWith(error: e.displayMessage, isLoading: false);
|
||||
} catch (e) {
|
||||
// 兜底：防止未预期的异常导致 isLoading 死锁
|
||||
if (!ref.mounted) return;
|
||||
state = state.copyWith(error: e.toString(), isLoading: false);
|
||||
}
|
||||
}
|
||||
|
||||
/// 步骤 2+3：校验验证码并完成登录
|
||||
///
|
||||
/// 成功后调用 [AuthNotifier.login] 触发路由守卫重定向，provider 随即被 dispose。
|
||||
Future<void> verifyAndLogin(String code) async {
|
||||
if (state.isLoading) return;
|
||||
state = state.copyWith(isLoading: true, error: null);
|
||||
|
||||
try {
|
||||
await ref.read(loginUseCaseProvider).verifyAndLogin(
|
||||
countryCode: state.countryCode,
|
||||
contact: state.contact,
|
||||
code: code,
|
||||
);
|
||||
|
||||
// 成功后触发路由守卫重定向。
|
||||
// 注意：login() 触发导航后 provider 随即被 dispose，之后不能再写 state。
|
||||
if (!ref.mounted) return;
|
||||
ref.read(authNotifierProvider).login();
|
||||
} on FormatException catch (e) {
|
||||
if (!ref.mounted) return;
|
||||
state = state.copyWith(error: e.message, isLoading: false);
|
||||
} on ApiError catch (e) {
|
||||
if (!ref.mounted) return;
|
||||
state = state.copyWith(error: e.displayMessage, isLoading: false);
|
||||
} catch (e) {
|
||||
if (!ref.mounted) return;
|
||||
state = state.copyWith(error: e.toString(), isLoading: false);
|
||||
}
|
||||
}
|
||||
|
||||
/// 返回手机号输入步骤（用户想修改手机号）
|
||||
void backToPhone() {
|
||||
state = state.copyWith(step: LoginStep.phone, error: null);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user