flutterApp/lib/features/main_container/presentation/pages/custom_main_container.dart

import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:maibu_satabot_v2/components/tcp_status_indicator.dart';
import 'package:maibu_satabot_v2/components/device_status_modal.dart';
import 'package:maibu_satabot_v2/features/ai/presentation/pages/ai_page.dart';
import 'package:maibu_satabot_v2/features/home/presentation/pages/home_page.dart';
import 'package:maibu_satabot_v2/features/my/presentation/pages/my_page.dart';
import 'package:maibu_satabot_v2/features/main_container/presentation/cubit/tab_config_cubit.dart';
import 'package:maibu_satabot_v2/features/main_container/presentation/widgets/custom_bottom_nav_bar.dart';
import 'package:maibu_satabot_v2/features/v2/home/presentation/pages/home_v2_page.dart';
import 'package:maibu_satabot_v2/features/v2/device_list/presentation/pages/device_status_page.dart';
import 'package:maibu_satabot_v2/features/v2/workorder/presentation/pages/workorder_page.dart';
import 'package:maibu_satabot_v2/features/v2/report/presentation/pages/report_page.dart';

import '../../../v2/waring_center/presentation/pages/alarm_center_page.dart';
import 'package:maibu_satabot_v2/features/devices/presentation/bloc/device_status_bloc.dart';

class CustomMainContainer extends StatefulWidget {
  const CustomMainContainer({super.key});

  @override
  State<CustomMainContainer> createState() => _CustomMainContainerState();
}

class _CustomMainContainerState extends State<CustomMainContainer>
    with AutomaticKeepAliveClientMixin {
  @override
  bool get wantKeepAlive => true; // 保持页面状态

  @override
  Widget build(BuildContext context) {
    super.build(context);

    debugPrint('🔍 [CustomMainContainer] build 被调用');

    return BlocBuilder<TabConfigCubit, TabConfigState>(
      builder: (context, state) {
        if (state is! TabConfigLoaded) {
          return const Scaffold(
            body: Center(child: CircularProgressIndicator()),
          );
        }

        final enabledTabs = state.config.enabledItems;
        final currentIndex = state.selectedIndex;

        debugPrint(
          '🔍 [CustomMainContainer] enabledTabs=${enabledTabs.length}, currentIndex=$currentIndex',
        );
        debugPrint(
          '🔍 [CustomMainContainer] enabledTabs IDs=${enabledTabs.map((e) => e.id).toList()}',
        );

        if (enabledTabs.isEmpty) {
          return const Scaffold(body: Center(child: Text('请至少启用一个Tab')));
        }

        return Scaffold(
          body: Stack(
            children: [
              IndexedStack(
                index: currentIndex,
                children: _buildPages(enabledTabs),
              ),
              // TCP状态指示灯 - 右上角，带白色背景确保可见，点击弹出设备状态模态框
              Positioned(
                top: 40,
                right: 16,
                child: InkWell(
                  onTap: () => _showDeviceStatusModal(context),
                  borderRadius: BorderRadius.circular(12),
                  child: Container(
                    padding: const EdgeInsets.symmetric(
                      horizontal: 8,
                      vertical: 4,
                    ),
                    decoration: BoxDecoration(
                      color: Colors.black.withOpacity(0.5), // 透明灰色背景
                      borderRadius: BorderRadius.circular(12),
                    ),
                    child: Row(
                      mainAxisSize: MainAxisSize.min,
                      children: [
                        TcpStatusIndicator(size: 12),
                        const SizedBox(width: 6),
                        const Text(
                          'TCP',
                          style: TextStyle(fontSize: 12, color: Colors.white),
                        ),
                      ],
                    ),
                  ),
                ),
              ),
            ],
          ),
          bottomNavigationBar: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              // 调试信息：显示当前 Tab ID
              Container(
                color: Colors.yellow.withOpacity(0.8),
                padding: const EdgeInsets.all(4),
                child: Text(
                  '当前选中Tab索引: $currentIndex, ID: ${enabledTabs[currentIndex].id}',
                  style: const TextStyle(fontSize: 10, color: Colors.black),
                ),
              ),
              const CustomBottomNavBar(),
            ],
          ),
        );
      },
    );
  }

  List<Widget> _buildPages(List<dynamic> enabledTabs) {
    return enabledTabs.map((tab) {
      debugPrint('🔍 [buildPages] Tab ID: ${tab.id}, Name: ${tab.name}');
      switch (tab.id) {
        case 'home_v2':
          debugPrint('✅ 匹配到 home_v2');
          return const HomeV2Page(key: ValueKey('home_v2'));
        case 'device':
          debugPrint('✅ 匹配到 device');
          return const DeviceStatusPage(key: ValueKey('device'));
        case 'ai':
          debugPrint('✅ 匹配到 ai');
          return const AiPage(key: ValueKey('ai'));
        case 'warning':
          debugPrint('✅ 匹配到 warning');
          return const AlarmCenterPage(key: ValueKey('warning'));
        case 'workorder':
          debugPrint('✅ 匹配到 workorder');
          return const WorkOrderPage(key: ValueKey('workorder'));
        case 'report':
          debugPrint('✅ 匹配到 report');
          return const ReportPage(key: ValueKey('report'));
        case 'my':
          debugPrint('✅ 匹配到 my');
          return const MyPage(key: ValueKey('my'));
        default:
          debugPrint('❌ 未匹配到 Tab ID: ${tab.id}');
          return const SizedBox();
      }
    }).toList();
  }

  // 显示设备状态模态框 - 从底部滑出
  void _showDeviceStatusModal(BuildContext context) {
    showModalBottomSheet(
      context: context,
      isScrollControlled: true,
      backgroundColor: Colors.transparent,
      shape: const RoundedRectangleBorder(
        borderRadius: BorderRadius.only(
          topLeft: Radius.circular(16),
          topRight: Radius.circular(16),
        ),
      ),
      builder: (BuildContext context) {
        return BlocProvider.value(
          value: context.read<DeviceStatusBloc>(),
          child: const DeviceStatusModal(),
        );
      },
    );
  }
}