import 'package:flutter/material.dart';
import 'package:fis_ui/base_define/page.dart';
import 'package:fis_ui/index.dart';
import 'package:fis_ui/usual/tab_button.dart';
import 'package:fis_ui/usual/tab_button_group.dart';
import 'expandable_icon_text.dart';
import 'package:fis_i18n/i18n.dart';

class IconTabList extends FStatefulWidget implements FPage {
  final Map<String, IconData> tabs;
  final String? selectedValue;
  final void Function(int) onPressed;
  IconTabList(
    this.tabs, {
    this.selectedValue,
    required this.onPressed,
  });

  @override
  FState<FStatefulWidget> createState() {
    return FIconTabListState();
  }

  @override
  String get pageName => "IconTabList";
}

class FIconTabListState extends FState<IconTabList> {
  String _selectedValue = '';
  String _focusItem = '';

  @override
  void initState() {
    super.initState();
    _selectedValue = widget.selectedValue ?? widget.tabs.keys.first;
    _focusItem = widget.tabs.keys.first;
  }

  @override
  void didUpdateWidget(covariant IconTabList oldWidget) {
    if (_selectedValue != widget.selectedValue) {
      setState(() {
        _selectedValue = widget.selectedValue ?? widget.tabs.keys.first;
        _focusItem = _selectedValue;
      });
    }

    // selectedValues.addAll(widget.value ?? []);
    super.didUpdateWidget(oldWidget);
  }

  @override
  FWidget build(BuildContext context) {
    return FContainer(
      padding: EdgeInsets.only(left: 10),
      decoration: BoxDecoration(
        border: Border(
          bottom: BorderSide(
            color: Colors.grey[300]!,
            width: 1.0,
          ),
        ),
      ),
      child: i18nBook.isCurrentChinese
          ? FTabButtonGroup(
              widget.tabs.keys.map((e) {
                var index = widget.tabs.keys.toList().indexOf(e);
                return FTabButton(
                  padding:
                      const EdgeInsets.symmetric(horizontal: 0, vertical: 8),
                  businessParent: widget,
                  width: 90,
                  activeIndex:
                      widget.tabs.keys.toList().indexOf(_selectedValue),
                  index: index,
                  tabTitle: e,
                  onCallbackTap: () {
                    widget.onPressed.call(index);
                  },
                );
              }).toList(),
            )
          : FRow(
              mainAxisAlignment: MainAxisAlignment.spaceAround,
              children: widget.tabs.keys.map((e) {
                return ExpandableIconText(
                  icon: widget.tabs[e]!,
                  isSelected: _selectedValue == e,
                  onPressed: () {
                    setState(() {
                      _selectedValue = e;
                    });
                    var index = widget.tabs.keys.toList().indexOf(e);
                    widget.onPressed.call(index);
                  },
                  onHoverChange: (v) {
                    if (v) {
                      setState(() {
                        _focusItem = e;
                      });
                    } else {
                      setState(() {
                        _focusItem = _selectedValue;
                      });
                    }
                  },
                  text: e,
                  isExpand: _focusItem == e,
                );
              }).toList(),
            ),
    );
  }
}
