import 'package:fis_ui/base_define/page.dart';
import 'package:fis_ui/index.dart';
import 'package:fis_ui/widgets/custom_dropdown_button.dart' as custom_widget;
import 'package:flutter/material.dart';
import 'package:fis_theme/theme.dart';
import 'package:flyinsono/architecture/define.dart';

class FSingleSelected extends FStatefulWidget implements FPage {
  final String? selectedValue;
  final double? height;
  final double? width;
  final Color? backgroundColor;
  final Color? textColor;
  final List<String>? items;
  final void Function(String) onSelectedValoue;
  final ValueCallback onChanged;
  FSingleSelected({
    Key? key,
    this.selectedValue,
    required this.onSelectedValoue,
    required this.onChanged,
    this.width,
    this.height,
    this.backgroundColor,
    this.items,
    this.textColor,
  }) : super(key: key);
  @override
  String get pageName => 'FSingleSelected';

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

class _FSingleSelectState extends FState<FSingleSelected> {
  double get _height => widget.height ?? 40;
  List<String> get _items => widget.items ?? [];

  @override
  FWidget build(BuildContext context) {
    return FSizedBox(
      height: widget.height,
      child: QuickFWidget(
        ButtonTheme(
          alignedDropdown: true,
          child: DropdownButtonHideUnderline(
            child: custom_widget.DropdownButtonFormField<String>(
              itemHeight: _height,
              isDense: true,
              style: TextStyle(color: widget.textColor),
              iconSize: 18,
              isExpanded: true,
              onChanged: (v) {
                widget.onChanged(v);
              },
              menuMaxHeight: 200,
              value: widget.selectedValue ?? _items.first,
              selectedItemBuilder: (_) => _items
                  .map(
                    (e) => _OptionRow(
                      e,
                      height: _height,
                    ),
                  )
                  .toList(),
              items: _buildItems(),
              dropdownColor: widget.backgroundColor,
            ),
          ),
        ),
      ),
    );
  }

  List<custom_widget.DropdownMenuItem<String>>? _buildItems() {
    return _items.map((String e) {
      final active = e == widget.selectedValue;
      return custom_widget.DropdownMenuItem<String>(
        child: _OptionRow(
          e,
          isActive: active,
          height: _height,
        ),
        value: e,
      );
    }).toList();
  }
}

class _OptionRow extends StatelessWidget implements FWidget {
  final String label;

  final bool isActive;
  final double? height;
  const _OptionRow(
    this.label, {
    Key? key,
    this.isActive = false,
    this.height,
  }) : super(key: key);

  @override
  FWidget build(BuildContext context) {
    return FContainer(
      margin: EdgeInsets.symmetric(horizontal: 3),
      height: height,
      alignment: Alignment.center,
      child: FText(
        label,
        style: TextStyle(
          fontFamily: FTheme.ins.localeSetting.fontFamily,
        ),
      ),
    );
  }
}
