import 'package:cs_resources/theme/theme_config.dart';
import 'package:flutter/services.dart';
import 'package:flutter/src/widgets/framework.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import 'package:shared/utils/ext_dart.dart';
import '../../../router/page/main_page_router.dart';
import 'package:router/ext/auto_router_extensions.dart';

@RoutePage()
class MainPage extends HookConsumerWidget {
  const MainPage({super.key});

  //启动当前页面
  static void startInstance({BuildContext? context}) {
    if (context != null) {
      context.router.popUntilRoot();
      context.router.replace(const MainPageRoute());
    } else {
      appRouter.popUntilRoot();
      appRouter.replace(const MainPageRoute());
    }
  }

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    // return AutoTabsRouter(
    //   routes: const [
    //     HomePageRoute(),
    //     VisitorPageRoute(),
    //     FeedbackPageRoute(),
    //     MePageRoute(),
    //   ],
    //   transitionBuilder: (context, child, animation) => FadeTransition(
    //     opacity: animation,
    //     child: child,
    //   ),
    //   builder: (context, child) {
    //     final tabsRouter = AutoTabsRouter.of(context);
    //     return AnnotatedRegion<SystemUiOverlayStyle>(
    //         value: ThemeConfig.getSystemUiOverlayStyleByTheme(context),
    //         child: Scaffold(
    //           body: child,
    //           bottomNavigationBar: BottomNavigationBar(
    //             backgroundColor: context.theme.primaryColor,
    //             selectedItemColor: context.theme.colorScheme.secondary,
    //             unselectedItemColor: Colors.grey[500],
    //             elevation: 20,
    //             type: BottomNavigationBarType.fixed,
    //             items: const <BottomNavigationBarItem>[
    //               BottomNavigationBarItem(
    //                 icon: Icon(Icons.home),
    //                 label: 'Home',
    //               ),
    //               BottomNavigationBarItem(
    //                 icon: Icon(Icons.card_giftcard),
    //                 label: 'Visitor',
    //               ),
    //               BottomNavigationBarItem(
    //                 icon: Icon(Icons.feed),
    //                 label: 'Feedback',
    //               ),
    //               BottomNavigationBarItem(
    //                 icon: Icon(Icons.person),
    //                 label: 'Me',
    //               ),
    //             ],
    //             onTap: tabsRouter.setActiveIndex,
    //             currentIndex: tabsRouter.activeIndex,
    //           ),
    //         ));
    //   },
    // );

    return AutoTabsScaffold(
      routes: const [
        HomePageRoute(),
        VisitorPageRoute(),
        FeedbackPageRoute(),
        MePageRoute(),
      ],
      transitionBuilder: (context, child, animation) => FadeTransition(
        opacity: animation,
        child: child,
      ),
      bottomNavigationBuilder: (context, tabsRouter) {
        return BottomNavigationBar(
          unselectedItemColor: Colors.grey[500],
          elevation: 20,
          type: BottomNavigationBarType.fixed,
          currentIndex: tabsRouter.activeIndex,
          onTap: tabsRouter.setActiveIndex,
          items: const [
            BottomNavigationBarItem(
              icon: Icon(Icons.home),
              label: 'Home',
            ),
            BottomNavigationBarItem(
              icon: Icon(Icons.card_giftcard),
              label: 'Visitor',
            ),
            BottomNavigationBarItem(
              icon: Icon(Icons.feed),
              label: 'Feedback',
            ),
            BottomNavigationBarItem(
              icon: Icon(Icons.person),
              label: 'Me',
            ),
          ],
        );
      },
    );
  }
}