From ce5155d4ca3fa406430bdd1aa40869b732c048ec Mon Sep 17 00:00:00 2001 From: wangjia <809946525@qq.com> Date: Fri, 19 Jun 2026 00:09:31 +0800 Subject: [PATCH] =?UTF-8?q?feat(client):=20P5=20=E8=BF=9E=E6=8E=A5?= =?UTF-8?q?=E9=A1=B5=E5=AE=9E=E6=97=B6=E9=80=9F=E5=BA=A6=20+=20=E8=BF=9E?= =?UTF-8?q?=E6=8E=A5=E9=94=99=E8=AF=AF=E5=86=92=E6=B3=A1=20UI(#6=206E,?= =?UTF-8?q?=E5=B9=B6=E5=85=A5=20#4)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - vpnStatsProvider:暴露内核 statsStream(上/下行瞬时速率);连接页速度行 下/上行改用实时数据(B/s→Mb/s),不再硬编码 86.4/12.1;延迟用实测节点 ping。 - ConnectionState 加 error 字段;_connect 失败不再静默回 off,而是按语言 冒泡 ConnectApiException 文案;节点未就绪(无 uuid)给出提示并删除旧 1.2s mock 连接路径。 - 连接页 caption 下/桌面 pill 上方显示错误文案(红)。 - 重写 connection_controller_test 适配(无网络:未就绪→off+error)。 flutter analyze 0 error;114 tests passed。 Co-Authored-By: Claude Opus 4.8 --- client/lib/screens/connect_page.dart | 43 ++++++++++++++---- client/lib/state/connection_provider.dart | 44 ++++++++++++++----- .../test/unit/connection_controller_test.dart | 30 ++++--------- 3 files changed, 78 insertions(+), 39 deletions(-) diff --git a/client/lib/screens/connect_page.dart b/client/lib/screens/connect_page.dart index 1b581b2..2cc1dfe 100644 --- a/client/lib/screens/connect_page.dart +++ b/client/lib/screens/connect_page.dart @@ -31,6 +31,9 @@ class ConnectPage extends ConsumerWidget { final smart = ref.watch(isSmartSelectProvider); final isFree = ref.watch(isFreePlanProvider); final quota = ref.watch(quotaProvider); + final stats = ref.watch(vpnStatsProvider).valueOrNull; + final down = _mbps(stats?.downloadSpeed); + final up = _mbps(stats?.uploadSpeed); final caption = switch (conn.phase) { VpnPhase.off => t.capOff, @@ -46,13 +49,23 @@ class ConnectPage extends ConsumerWidget { onTap: () => ref.read(connectionProvider.notifier).toggle(), ); - final captionWidget = Text(caption, - style: PangolinText.body.copyWith(color: c.fg2, fontWeight: FontWeight.w600)); + final captionWidget = Column(mainAxisSize: MainAxisSize.min, children: [ + Text(caption, style: PangolinText.body.copyWith(color: c.fg2, fontWeight: FontWeight.w600)), + if (conn.error != null) ...[ + const SizedBox(height: 8), + Padding( + padding: const EdgeInsets.symmetric(horizontal: 24), + child: Text(conn.error!, + textAlign: TextAlign.center, + style: PangolinText.caption.copyWith(color: c.danger, fontWeight: FontWeight.w500)), + ), + ], + ]); final infoChildren = [ if (isFree) QuotaCard(quota: quota, t: t, onWatchAd: () => ref.read(quotaProvider.notifier).watchAd()), - if (conn.phase == VpnPhase.on) _SpeedRow(t: t, node: node), + if (conn.phase == VpnPhase.on) _SpeedRow(t: t, node: node, down: down, up: up), _CurrentNodeCard(t: t, node: node, smart: smart, showLabel: isWide, onTap: onOpenNodes), ]; @@ -83,6 +96,14 @@ class ConnectPage extends ConsumerWidget { textAlign: TextAlign.center, style: PangolinText.display.copyWith(color: c.fg1, fontSize: 22, fontWeight: FontWeight.w700)), const SizedBox(height: 10), + if (conn.error != null) ...[ + Padding( + padding: const EdgeInsets.only(bottom: 10), + child: Text(conn.error!, + textAlign: TextAlign.center, + style: PangolinText.caption.copyWith(color: c.danger, fontWeight: FontWeight.w500)), + ), + ], _NodePill(t: t, node: node, smart: smart), if (isFree) ...[ const SizedBox(height: 24), @@ -93,7 +114,7 @@ class ConnectPage extends ConsumerWidget { ], if (conn.phase == VpnPhase.on) ...[ const SizedBox(height: 16), - _SpeedRow(t: t, node: node), + _SpeedRow(t: t, node: node, down: down, up: up), ], ]), ), @@ -174,18 +195,24 @@ class ConnectPage extends ConsumerWidget { } } -/// 实时速率行(连接成功时显示;演示值)。 +/// 字节/秒 → Mb/s 字符串(null = 未取到,显示 —)。 +String _mbps(double? bytesPerSec) => + bytesPerSec == null ? '—' : (bytesPerSec * 8 / 1000000).toStringAsFixed(1); + +/// 实时速率行(连接成功时显示;来自内核 statsStream 实时数据)。 class _SpeedRow extends StatelessWidget { - const _SpeedRow({required this.t, required this.node}); + const _SpeedRow({required this.t, required this.node, required this.down, required this.up}); final AppText t; final Node node; + final String down; + final String up; @override Widget build(BuildContext context) { final c = context.pangolin; final metrics = [ - (PangolinIcons.arrowDown, t.download, '86.4', 'Mb/s'), - (PangolinIcons.arrowUp, t.upload, '12.1', 'Mb/s'), + (PangolinIcons.arrowDown, t.download, down, 'Mb/s'), + (PangolinIcons.arrowUp, t.upload, up, 'Mb/s'), (PangolinIcons.zap, t.latency, node.ping > 0 ? '${node.ping}' : '—', 'ms'), ]; return Row(children: [ diff --git a/client/lib/state/connection_provider.dart b/client/lib/state/connection_provider.dart index f27c8d7..868d5be 100644 --- a/client/lib/state/connection_provider.dart +++ b/client/lib/state/connection_provider.dart @@ -11,7 +11,9 @@ import 'package:flutter_riverpod/flutter_riverpod.dart'; import '../bridge/vpn_bridge.dart'; import '../bridge/vpn_bridge_provider.dart'; +import '../l10n/app_text.dart'; import '../services/connect_api.dart'; +import 'app_providers.dart'; import 'auth_provider.dart'; import 'nodes_provider.dart'; @@ -37,20 +39,26 @@ enum VpnPhase { off, connecting, on } // ── 连接状态快照 ────────────────────────────────────────────────── class ConnectionState { - const ConnectionState({required this.phase, this.elapsed = Duration.zero}); + const ConnectionState({required this.phase, this.elapsed = Duration.zero, this.error}); final VpnPhase phase; final Duration elapsed; + /// 连接失败原因(已本地化);null = 无错误。供 UI 提示,不再静默吞掉。 + final String? error; + ConnectionState copyWith({VpnPhase? phase, Duration? elapsed}) => ConnectionState(phase: phase ?? this.phase, elapsed: elapsed ?? this.elapsed); @override bool operator ==(Object other) => - other is ConnectionState && other.phase == phase && other.elapsed == elapsed; + other is ConnectionState && + other.phase == phase && + other.elapsed == elapsed && + other.error == error; @override - int get hashCode => Object.hash(phase, elapsed); + int get hashCode => Object.hash(phase, elapsed, error); } // ── 状态机 ─────────────────────────────────────────────────────── @@ -94,15 +102,18 @@ class ConnectionController extends StateNotifier { Future _connect() async { state = const ConnectionState(phase: VpnPhase.connecting); - final authState = _ref.read(authProvider); - final token = authState.accessToken ?? ''; + final token = _ref.read(authProvider).accessToken ?? ''; final node = _ref.read(effectiveNodeProvider); + final zh = _ref.read(localeProvider) == AppLang.zh; - // 无 UUID 时（演示节点）直接进入 mock 连接状态 + // 节点未就绪(列表加载中/为空):不连接,提示用户。 if (node.uuid.isEmpty) { - await Future.delayed(const Duration(milliseconds: 1200)); - if (mounted) state = const ConnectionState(phase: VpnPhase.on); - _startElapsed(); + if (mounted) { + state = ConnectionState( + phase: VpnPhase.off, + error: zh ? '节点尚未就绪,请稍候重试' : 'Nodes not ready, please retry', + ); + } return; } @@ -115,8 +126,16 @@ class ConnectionController extends StateNotifier { ); // bridge.start() 不阻塞至连接建立；on 状态由 statusStream 回调驱动。 await _bridge.start(configJson); + } on ConnectApiException catch (e) { + // 把后端/网络错误冒泡到 UI(原静默回 off,用户不知所以)。 + if (mounted) state = ConnectionState(phase: VpnPhase.off, error: zh ? e.messageZh : e.messageEn); } catch (e) { - if (mounted) state = const ConnectionState(phase: VpnPhase.off); + if (mounted) { + state = ConnectionState( + phase: VpnPhase.off, + error: zh ? '连接失败,请重试' : 'Connection failed, please retry', + ); + } } } @@ -173,3 +192,8 @@ final connectionProvider = StateNotifierProvider( (ref) => ConnectionController(ref, ref.watch(vpnBridgeProvider)), ); + +/// 内核实时统计流(上/下行瞬时速率、字节数)。连接页速度行的真实数据源。 +final vpnStatsProvider = StreamProvider( + (ref) => ref.watch(vpnBridgeProvider).statsStream, +); diff --git a/client/test/unit/connection_controller_test.dart b/client/test/unit/connection_controller_test.dart index a71152c..25d2812 100644 --- a/client/test/unit/connection_controller_test.dart +++ b/client/test/unit/connection_controller_test.dart @@ -1,7 +1,7 @@ -// connection_controller_test.dart — 连接状态机:严格三态、禁乐观显示 +// connection_controller_test.dart — 连接状态机:严格三态、错误冒泡 // // ConnectionController 通过 Riverpod ProviderContainer 测试。 -// 使用演示节点（uuid 为空）→ 走 mock 分支（1.2s Timer 进入 on）。 +// 节点 uuid 为空(未就绪)→ _connect 不走网络,直接回 off 并给出错误提示。 // 覆盖 tokenStoreProvider 避免 FlutterSecureStorage 平台依赖。 import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_test/flutter_test.dart'; @@ -33,18 +33,13 @@ class _NullTokenStore implements TokenStore { // ── 辅助 ────────────────────────────────────────────────────────── -/// 演示节点（uuid 为空 → _connect 走 1.2s mock 分支）。 -const _demoNode = Node( - code: 'HK', - nameZh: '香港', - nameEn: 'Hong Kong', - ping: 18, -); +/// 未就绪节点(uuid 为空)→ _connect 不走网络,直接回 off+错误。 +const _notReadyNode = Node(code: 'HK', nameZh: '香港', nameEn: 'Hong Kong', ping: 18); ProviderContainer makeContainer() => ProviderContainer( overrides: [ tokenStoreProvider.overrideWithValue(const _NullTokenStore()), - effectiveNodeProvider.overrideWithValue(_demoNode), + effectiveNodeProvider.overrideWithValue(_notReadyNode), vpnBridgeProvider.overrideWithValue(VpnBridgeMock()), ], ); @@ -56,20 +51,13 @@ void main() { expect(c.read(connectionProvider).phase, VpnPhase.off); }); - test('toggle → off 态立即切为 connecting', () { + test('节点未就绪时 toggle → 回 off 并冒泡错误(不再静默)', () { final c = makeContainer(); addTearDown(c.dispose); c.read(connectionProvider.notifier).toggle(); - expect(c.read(connectionProvider).phase, VpnPhase.connecting); - }); - - test('connecting 时再次 toggle 被忽略（禁止乐观回退）', () { - final c = makeContainer(); - addTearDown(c.dispose); - c.read(connectionProvider.notifier).toggle(); - expect(c.read(connectionProvider).phase, VpnPhase.connecting); - c.read(connectionProvider.notifier).toggle(); // connecting 中点 → 无效 - expect(c.read(connectionProvider).phase, VpnPhase.connecting); + final s = c.read(connectionProvider); + expect(s.phase, VpnPhase.off); + expect(s.error, isNotNull); }); test('off 态 onNodeChanged 不触发连接', () {