import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:mc_common_app/classes/consts.dart';
import 'package:mc_common_app/extensions/string_extensions.dart';
import 'package:mc_common_app/theme/colors.dart';
import 'package:mc_common_app/utils/utils.dart';
import 'package:mc_common_app/widgets/extensions/extensions_widget.dart';

class DropValue {
  int id;
  String value;
  String subValue;
  bool? isEnabled;

  DropValue(this.id, this.value, this.subValue, {this.isEnabled = true});

  bool operator ==(o) => o is DropValue && o.value == value && o.id == id;

  @override
  String toString() {
    return 'DropValue{id: $id, value: $value, subValue: $subValue, isEnabled: $isEnabled}';
  }
}

class DropdownField extends StatefulWidget {
  final String? hint;
  final String errorValue;
  final List<DropValue>? list;
  final DropValue? dropdownValue;
  final Function(DropValue) onSelect;
  final bool showAppointmentPickerVariant;
  final TextStyle? textStyle;
  final bool isSelectAble;

  const DropdownField(this.onSelect, {Key? key, this.hint, this.list, this.dropdownValue, this.errorValue = "", this.showAppointmentPickerVariant = false, this.textStyle, this.isSelectAble = true}) : super(key: key);

  @override
  State<DropdownField> createState() => _DropdownFieldState();
}

class _DropdownFieldState extends State<DropdownField> {
  DropValue? dropdownValue;
  List<DropValue> defaultV = [
    DropValue(1, "One", ""),
    DropValue(2, "Two", ""),
  ];

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    dropdownValue = widget.dropdownValue;
    return Column(
      children: [
        IgnorePointer(
          ignoring: !widget.isSelectAble,
          child: Container(
            decoration: widget.showAppointmentPickerVariant ? null : Utils.containerColorRadiusBorderWidth(MyColors.white, 0, widget.isSelectAble ? MyColors.darkPrimaryColor : MyColors.greyACColor, 2),
            margin: const EdgeInsets.all(0),
            padding: const EdgeInsets.only(left: 8, right: 8),
            width: widget.showAppointmentPickerVariant ? 170 : null,
            child: DropdownButton<DropValue>(
              value: dropdownValue,
              icon: Icon(Icons.keyboard_arrow_down_sharp, color: !widget.isSelectAble ? Colors.transparent : null, size: 21,),
              elevation: 16,
              iconSize: widget.showAppointmentPickerVariant ? 26 : 16,
              iconEnabledColor: borderColor,
              iconDisabledColor: borderColor,
              isExpanded: true,
              style: const TextStyle(
                color: borderColor,
                fontSize: 15,
              ),
              hint: (widget.hint ?? "").toText(color: borderColor, fontSize: 15, fontWeight: MyFonts.Medium),
              underline: Container(height: 0),
              onChanged: (DropValue? newValue) {
                setState(() {
                  dropdownValue = newValue!;
                  widget.onSelect(newValue);
                });
              },
              items: (widget.list ?? defaultV).map<DropdownMenuItem<DropValue>>(
                (DropValue value) {
                  return DropdownMenuItem<DropValue>(
                    value: value,
                    enabled: value.isEnabled ?? true,
                    child: value.value.toText(fontSize: 15, color: value.isEnabled == false ? MyColors.darkTextColor : null, fontWeight: MyFonts.Medium),
                  );
                },
              ).toList(),
            ),
          ),
        ),
        if (widget.errorValue != "")
          Row(
            mainAxisAlignment: MainAxisAlignment.end,
            children: [
              widget.errorValue.toText(fontSize: 14, color: Colors.red),
            ],
          ).paddingOnly(right: 10),
      ],
    );
  }
}
