Files
smart_grid_iot_manage_app_f…/lib/app/tabs_page.dart
T

52 lines
1.5 KiB
Dart

import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import '../core/theme/app_colors.dart';
import '../features/customer/presentation/customer_tab.dart';
import '../features/mine/presentation/mine_tab.dart';
import '../features/project/presentation/project_tab.dart';
import '../features/workbench/presentation/workbench_tab.dart';
import '../shared/widgets/x_bottom_nav.dart';
import 'tab_index.dart';
/// 4 个 Tab 的常驻容器,对应 `pages/tabs/index.vue`。
///
/// 源项目用 `v-show` 切换,不销毁重建、保留滚动位置与内部状态;
/// 这里用 [IndexedStack] 达到同样效果。
class TabsPage extends ConsumerWidget {
const TabsPage({super.key});
@override
Widget build(BuildContext context, WidgetRef ref) {
final current = ref.watch(tabIndexProvider);
return Scaffold(
backgroundColor: AppColors.bgPage,
body: Stack(
children: [
Positioned.fill(
child: IndexedStack(
index: current.index,
children: const [
WorkbenchTab(),
CustomerTab(),
ProjectTab(),
MineTab(),
],
),
),
Positioned(
left: 0,
right: 0,
bottom: 0,
child: XBottomNav(
current: current.key,
onChanged: (key) =>
ref.read(tabIndexProvider.notifier).selectByKey(key),
),
),
],
),
);
}
}