import 'dart:io';
import 'package:collection/collection.dart';
import 'package:dating_touchme_app/extension/ex_context.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

import '../../../generated/assets.dart';
import 'main_tab_btn.dart';
import 'main_tab_item.dart';

class MainTabBar extends StatefulWidget {
  const MainTabBar({super.key, this.initialIndex = 0, this.onTabChanged});

  final int initialIndex;
  final void Function(int index)? onTabChanged;

  @override
  State<MainTabBar> createState() => _MainTabBarState();
}

class _MainTabBarState extends State<MainTabBar> {
  int _selecteIndex = 0;

  final List<MainTabItem> items = const [
    MainTabItem(
      title: "首页",
      icon: Assets.imagesHomeNol,
      selectedIcon: Assets.imagesHomePre,
    ),
    MainTabItem(
      title: "找对象",
      icon: Assets.imagesDiscoverNol,
      selectedIcon: Assets.imagesDiscoverPre,
    ),
    MainTabItem(
      title: "消息",
      icon: Assets.imagesMessageNol,
      selectedIcon: Assets.imagesMessagePre,
    ),
    MainTabItem(
      title: "我的",
      icon: Assets.imagesMineNol,
      selectedIcon: Assets.imagesMinePre,
    ),
  ];

  @override
  void initState() {
    _selecteIndex = widget.initialIndex;
    super.initState();
  }

  @override
  void didUpdateWidget(covariant MainTabBar oldWidget) {
    super.didUpdateWidget(oldWidget);
    if (_selecteIndex != widget.initialIndex) {
      _selecteIndex = widget.initialIndex;
    }
  }

  @override
  Widget build(BuildContext context) {
    return Builder(builder: (context) {
      if (Platform.isIOS) {
        if (context.bottomPadding > 0) {
          return Container(
            height: 64.w,
            color: Colors.white,
            child: Stack(
              children: [
                Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: items.mapIndexed((index, item) {
                          return MainTabButton(
                            selected: index == _selecteIndex,
                            isRedDot: item.showRedDot,
                            title: item.title,
                            onTap: () {
                              if (_selecteIndex != index) {
                                _selecteIndex = index;
                                setState(() {});
                                widget.onTabChanged?.call(index);
                              }
                            },
                            icon: item.icon,
                            selectedIcon: item.selectedIcon,
                          );
                        }).toList()),
                    SizedBox(
                      height: 22.w,
                    )
                  ],
                )
              ],
            ),
          );
        } else {
          return SafeArea(
            top: false,
            child: Container(
              height: 64.w,
              color: Colors.white,
              child: Stack(
                children: [
                  Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: items.mapIndexed((index, item) {
                            return MainTabButton(
                              selected: index == _selecteIndex,
                              isRedDot: item.showRedDot,
                              title: item.title,
                              onTap: () {
                                if (_selecteIndex != index) {
                                  _selecteIndex = index;
                                  setState(() {});
                                  widget.onTabChanged?.call(index);
                                }
                              },
                              icon: item.icon,
                              selectedIcon: item.selectedIcon,
                            );
                          }).toList()),
                      SizedBox(
                        height: 14.w,
                      )
                    ],
                  )
                ],
              ),
            ),
          );
        }
      } else {
        return SafeArea(
          top: false,
          child: Container(
            // padding: EdgeInsets.only(bottom: 14.w),
            // margin: EdgeInsets.only(left: 16.w, right: 16.w, bottom: 14.w),
            height: 64.w,
            color: Colors.white,
            child: Stack(
              children: [
                Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: items.mapIndexed((index, item) {
                          return MainTabButton(
                            selected: index == _selecteIndex,
                            isRedDot: item.showRedDot,
                            title: item.title,
                            onTap: () {
                              if (_selecteIndex != index) {
                                _selecteIndex = index;
                                setState(() {});
                                widget.onTabChanged?.call(index);
                              }
                            },
                            icon: item.icon,
                            selectedIcon: item.selectedIcon,
                          );
                        }).toList()),
                    SizedBox(
                      height: 14.w,
                    )
                  ],
                )
              ],
            ),
          ),
        );
      }
    });
  }
}