import 'package:flutter/material.dart';
import 'package:flyinsono/lab/color/lab_colors.dart';
import 'package:flyinsono/lab/pages/lab_export/controller.dart';
import 'package:get/get.dart';

class FileTypeSelector extends GetView<LabExportController> {
  Color getFillColor(Set<MaterialState> states) {
    const Set<MaterialState> interactiveStates = <MaterialState>{
      MaterialState.pressed,
      MaterialState.hovered,
      MaterialState.focused,
    };
    if (states.any(interactiveStates.contains)) {
      return LabColors.base600;
    }
    return LabColors.base700;
  }

  @override
  Widget build(BuildContext context) {
    return GetBuilder<LabExportController>(
      id: LabExportController.fileTypeSelectorId,
      builder: (_) {
        return Container(
          width: double.maxFinite,
          height: 60,
          padding: EdgeInsets.symmetric(horizontal: 15),
          margin: EdgeInsets.only(bottom: 10),
          decoration: BoxDecoration(
            color: LabColors.base200,
            borderRadius: BorderRadius.circular(5),
            border: Border.all(
              color: LabColors.base400,
              width: 1,
            ),
          ),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Text(
                "导出格式：",
                style: TextStyle(
                  fontSize: 18,
                  fontWeight: FontWeight.bold,
                  color: LabColors.text800,
                ),
              ),
              SizedBox(width: 5),
              // 多选选择器
              _buildTypeSelected(),
            ],
          ),
        );
      },
    );
  }

  Widget _buildTypeSelected() {
    return Expanded(
      child: Wrap(
        spacing: 10,
        children: controller.exportTypeList
            .map(
              (type) => ChoiceChip(
                avatar: Checkbox(
                  checkColor: LabColors.base100,
                  fillColor: MaterialStateProperty.resolveWith(getFillColor),
                  value: controller.exportTypes.contains(type),
                  onChanged: (selected) {
                    controller.changeSelectedFileType(
                      type,
                      selected ?? false,
                    );
                  },
                ),
                label: Text(
                  controller.imageTypeToString(type),
                  style: TextStyle(
                    fontSize: 16,
                    height: 1.2,
                    color: controller.exportTypes.contains(type)
                        ? LabColors.text100
                        : LabColors.text600,
                  ),
                ),
                padding: EdgeInsets.zero,
                labelPadding: EdgeInsets.only(top: 5, bottom: 5, right: 10),
                selected: controller.exportTypes.contains(type),
                onSelected: (selected) {
                  controller.changeSelectedFileType(type, selected);
                },
                selectedColor: LabColors.base700,
                backgroundColor: LabColors.base200,
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(5),
                ),
              ),
            )
            .toList(),
      ),
    );
  }
}
