diff --git a/client/lib/screens/shell/app_shell.dart b/client/lib/screens/shell/app_shell.dart index dda9e8c..9300bc2 100644 --- a/client/lib/screens/shell/app_shell.dart +++ b/client/lib/screens/shell/app_shell.dart @@ -84,6 +84,34 @@ class _AppShellState extends ConsumerState { bool _forceDialogShown = false; bool _licenseDialogShown = false; final GlobalKey _scaffoldKey = GlobalKey(); + // 侧栏底部用户区,用于实测宽度让弹出菜单等宽 + 定位(向上弹,不溢出内容区) + final GlobalKey _sideUserKey = GlobalKey(); + + /// 打开账号菜单(个人设置 / 退出登录)。菜单宽度 = 用户区实测宽度(自动与侧栏 + /// 内容等宽、绝不溢出到内容区);底部空间不足时 showMenu 自动向上弹。 + void _openUserMenu(BuildContext context) { + final t = context.tokens; + final rb = _sideUserKey.currentContext?.findRenderObject() as RenderBox?; + final overlay = + Overlay.of(context).context.findRenderObject() as RenderBox?; + if (rb == null || overlay == null) return; + final topLeft = rb.localToGlobal(Offset.zero, ancestor: overlay); + final rect = topLeft & rb.size; + showMenu( + context: context, + position: RelativeRect.fromRect(rect, Offset.zero & overlay.size), + constraints: BoxConstraints.tightFor(width: rb.size.width), + color: t.menuUserBg, + elevation: 8, + shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(6)), + items: [ + _userMenuItem('profile', Icons.manage_accounts_outlined, '个人设置', t), + _userMenuItem('logout', Icons.logout, '退出登录', t), + ], + ).then((v) { + if (v == 'logout') _logout(); + }); + } /// 切换到第 index 个分支;再次点当前栏目则回到该分支初始页。 void _goBranch(int index) { @@ -286,24 +314,11 @@ class _AppShellState extends ConsumerState { ), Padding( padding: const EdgeInsets.only(bottom: 8), - child: PopupMenuButton( - tooltip: '账号菜单', - position: PopupMenuPosition.over, - // 菜单与侧栏等宽(218),左对齐到侧栏左缘(抵消侧栏 12 内边距) - offset: const Offset(-12, -8), - constraints: const BoxConstraints.tightFor(width: 218), - shape: - RoundedRectangleBorder(borderRadius: BorderRadius.circular(6)), - color: t.menuUserBg, - elevation: 8, - onSelected: (v) { - if (v == 'logout') _logout(); - }, - itemBuilder: (_) => [ - _userMenuItem('profile', Icons.manage_accounts_outlined, '个人设置', t), - _userMenuItem('logout', Icons.logout, '退出登录', t), - ], + child: GestureDetector( + behavior: HitTestBehavior.opaque, + onTap: () => _openUserMenu(context), child: Container( + key: _sideUserKey, padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 9), decoration: BoxDecoration( borderRadius: BorderRadius.circular(6), diff --git a/client/test/user_menu_width_test.dart b/client/test/user_menu_width_test.dart new file mode 100644 index 0000000..2c4dcb7 --- /dev/null +++ b/client/test/user_menu_width_test.dart @@ -0,0 +1,107 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_riverpod/flutter_riverpod.dart'; +import 'package:flutter_test/flutter_test.dart'; +import 'package:go_router/go_router.dart'; +import 'package:shared_preferences/shared_preferences.dart'; +import 'package:jiu_client/core/auth/auth_state.dart'; +import 'package:jiu_client/core/theme/themes.dart'; +import 'package:jiu_client/models/shop.dart'; +import 'package:jiu_client/providers/shop_provider.dart'; +import 'package:jiu_client/providers/license_provider.dart'; +import 'package:jiu_client/providers/update_provider.dart'; +import 'package:jiu_client/providers/connectivity_provider.dart'; +import 'package:jiu_client/providers/session_heartbeat.dart'; +import 'package:jiu_client/screens/shell/app_shell.dart'; +import 'package:jiu_client/widgets/app_status_bar.dart'; + +/// 弹出态回归:侧栏底部「账号菜单」弹出后宽度 = 触发器宽(与侧栏内容等宽), +/// 且不溢出侧栏右缘(218)——修复「菜单比按钮宽、盖住内容区」。 + +class _FakeAuth extends AuthNotifier { + _FakeAuth() { + state = const AuthState( + user: AuthUser( + accessToken: 't', refreshToken: 'r', id: 1, username: 'wang', + realName: '王经理', shopNo: 'DSJH-001', shopId: 1, role: 'admin'), + ); + } +} + +class _FakeUpdate extends UpdateNotifier { + @override + Future build() async => null; +} + +class _FakeLicense extends LicenseNotifier { + @override + Future build() async => null; +} + +const _shop = ShopInfo( + id: 1, code: 'DSJH-001', name: '鼎晟酒行', + address: '浙江省杭州市', phone: '0571-88886666', managerName: '王经理'); + +GoRouter _router() => GoRouter( + initialLocation: '/inventory', + routes: [ + StatefulShellRoute.indexedStack( + builder: (ctx, state, shell) => AppShell(navigationShell: shell), + branches: [ + for (final p in const [ + '/stock-in', '/stock-out', '/inventory', '/finance', + '/partners', '/products', '/devices', '/settings', '/about' + ]) + StatefulShellBranch(routes: [ + GoRoute(path: p, builder: (_, __) => const SizedBox.expand()), + ]), + ], + ), + ], + ); + +void main() { + TestWidgetsFlutterBinding.ensureInitialized(); + SharedPreferences.setMockInitialValues({}); + AppStatusBar.ticking = false; + + testWidgets('账号菜单宽度=触发器宽,不溢出侧栏(218)', (tester) async { + tester.view.physicalSize = const Size(2560, 1800); + tester.view.devicePixelRatio = 2.0; + addTearDown(tester.view.resetPhysicalSize); + addTearDown(tester.view.resetDevicePixelRatio); + + await tester.pumpWidget(ProviderScope( + overrides: [ + authStateProvider.overrideWith((ref) => _FakeAuth()), + shopInfoProvider.overrideWith((ref) => _shop), + licenseProvider.overrideWith(() => _FakeLicense()), + updateProvider.overrideWith(() => _FakeUpdate()), + connectivityProvider + .overrideWith((ref) => ConnectivityNotifier(skipInit: true)), + sessionHeartbeatProvider.overrideWith((ref) => SessionHeartbeat(ref)), + appVersionProvider.overrideWith((ref) => 'v1.0.72'), + isReadonlyProvider.overrideWithValue(false), + ], + child: MaterialApp.router( + debugShowCheckedModeBanner: false, + theme: buildTheme('a'), + routerConfig: _router(), + ), + )); + await tester.pumpAndSettle(); + + // 点开账号菜单(side-user 含「· 管理员」) + await tester.tap(find.textContaining('管理员')); + await tester.pumpAndSettle(); + + expect(find.text('个人设置'), findsOneWidget); + expect(find.text('退出登录'), findsOneWidget); + + // 菜单项填满菜单宽:宽 ≈ 侧栏内容宽(194),右缘不超过侧栏右缘(218) + final itemRect = tester.getRect(find.byType(PopupMenuItem).first); + expect(itemRect.width, inInclusiveRange(180, 200), + reason: '菜单应与触发器等宽(~194),不应外扩到 218 而溢出'); + expect(itemRect.right, lessThanOrEqualTo(219), + reason: '菜单右缘不得越过侧栏右缘(218)盖住内容区'); + }); +}