import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:lottie/lottie.dart';

import '../../base/base_page.dart';
import '../../resource/assets.gen.dart';
import '../../router/app_pages.dart';
import 'main_controller.dart';

class MainPage extends BasePage<MainController> {
  MainPage({super.key});

  static start({Map<String, dynamic>? arguments}) {
    return Get.offAllNamed(RoutePath.mainTab, arguments: arguments);
  }

  @override
  bool immersive() => true;

  @override
  Widget buildBody(BuildContext context) {
    return PopScope(
      child: Scaffold(
        bottomNavigationBar: buildBottomAppBar(),
        drawerEdgeDragWidth: 0,
        body: Obx(() => controller.tabBeans[controller.currentIndex].page),
      ),
    );
  }

  Widget buildBottomAppBar() {
    return Container(
      decoration: BoxDecoration(color: Colors.white),
      child: BottomAppBar(
        color: Colors.white,
        height: 56.h,
        padding: EdgeInsets.zero,
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          children: List.generate(controller.tabBeans.length, bottomAppBarItem),
        ),
      ),
    );
  }

  Widget bottomAppBarItem(int index) {
    return Expanded(
      child: GestureDetector(
        onTap: () => controller.changeIndex(index),
        behavior: HitTestBehavior.opaque,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Obx(() {
              TabBean tabBean = controller.tabBeans[index];
              bool isSelected = controller.currentIndex == index;

              return Column(
                children: [
                  isSelected
                      ? Lottie.asset(
                        tabBean.selectedIcon,
                        repeat: false,
                        width: 28.w,
                        height: 28.w,
                      )
                      : Image.asset(
                        tabBean.normalIcon,
                        width: 28.w,
                        height: 28.w,
                      ),

                  Text(
                    tabBean.title,
                    style: TextStyle(
                      fontSize: 10.sp,
                      fontWeight: FontWeight.w400,
                      color:
                          isSelected
                              ? const Color(0xFF7D46FC)
                              : Colors.black.withValues(alpha: 0.4),
                    ),
                  ),
                ],
              );
            }),
          ],
        ),
      ),
    );
  }
}
