import 'dart:async';

import 'package:dropdown_button2/dropdown_button2.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import '/screen/input_pekerjaan/input_lain_lain_screen.dart';

import '../../app/constant.dart';
import 'input_pengambilan_bahan_screen.dart';
import 'input_pengantaran_hasil_dokter_screen.dart';
import 'input_pengantaran_hasil_instansi_screen.dart';
import 'input_pengantaran_hasil_pasien_screen.dart';

class DummyDropdownTipe {
  final String options;
  final int id;

  DummyDropdownTipe(this.options, this.id);
}

class DummyRadioTipe {
  final String text;
  final int id;

  DummyRadioTipe(this.text, this.id);
}

class InputPekerjaanPekerjaanLainLain extends HookConsumerWidget {
  const InputPekerjaanPekerjaanLainLain({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final selectedDropdown =
        useState<DummyDropdownTipe>(DummyDropdownTipe("", 0));
    final dropdownItems =
        useState<List<DummyDropdownTipe>>(List.empty(growable: true));

    final radioButtonItems =
        useState<List<DummyRadioTipe>>(List.empty(growable: true));
    final selectedRadio = useState<DummyRadioTipe>(DummyRadioTipe("", 0));

    useEffect(() {
      dropdownItems.value = [
        DummyDropdownTipe("Pengantaran Hasil", 1),
        DummyDropdownTipe("Pengambilan Bahan", 2),
        DummyDropdownTipe("Lain-lain", 3),
      ];

      selectedDropdown.value = dropdownItems.value[2];
      // selectedDropdown.value = dropdownItems.value[1];
    }, []);

    final isLoading = useState(false);
    final isMounted = useIsMounted();

    return GestureDetector(
      onTap: () => FocusManager.instance.primaryFocus?.unfocus(),
      child: Scaffold(
        backgroundColor: Constant.backgroundWhite,
        appBar: AppBar(
          toolbarHeight: Constant.getActualY(context: context, y: 110),
          backgroundColor: Constant.backgroundWhite,
          elevation: 0,
          titleSpacing: 0,
          centerTitle: false,
          title: Text(
            'Kembali',
            style: Constant.body1(context: context).copyWith(
              color: Constant.textBlack,
              fontWeight: FontWeight.w600,
            ),
          ),
          leading: GestureDetector(
            child: Icon(
              Icons.arrow_back_ios,
              color: Constant.textBlack,
              size: Constant.getActualY(context: context, y: 16),
            ),
            onTap: () {
              Navigator.pop(context);
            },
          ),
          automaticallyImplyLeading: true,
        ),
        body: SingleChildScrollView(
          child: SizedBox(
            width: Constant.getActualX(context: context, x: 390),
            height: Constant.getActualY(context: context, y: 760),
            child: Padding(
              padding: EdgeInsets.only(
                left: Constant.getActualX(context: context, x: 35),
                right: Constant.getActualX(context: context, x: 35),
                // bottom: Constant.getActualY(context: context, y: 40)
              ),
              child: Column(
                children: [
                  // dropdown
                  if (dropdownItems.value.isEmpty) ...[
                    Text('Dropdown No Data')
                  ] else ...[
                    DropdownButtonHideUnderline(
                      child: DropdownButton2<DummyDropdownTipe>(
                        isExpanded: true,
                        hint: Row(
                          children: [
                            Expanded(
                              child: Text(
                                'Select Item',
                                style: Constant.body1(context: context)
                                    .copyWith(
                                        fontWeight: FontWeight.w600,
                                        color: Constant.primaryDark),
                                overflow: TextOverflow.ellipsis,
                              ),
                            ),
                          ],
                        ),
                        items:
                            dropdownItems.value.map((DummyDropdownTipe option) {
                          return DropdownMenuItem<DummyDropdownTipe>(
                            value: option,
                            child: Text(
                              option.options,
                              style: Constant.body1(context: context).copyWith(
                                  color: Constant.primaryBlue,
                                  fontWeight: FontWeight.w600),
                            ),
                          );
                        }).toList(),
                        value: selectedDropdown.value,
                        // onChanged: (DummyDropdownTipe? newValue) {
                        //   // if (newValue) {
                        //   selectedDropdown.value = newValue!;
                        //   print(selectedDropdown.value.id);
                        //   // }
                        // },
                        onChanged: null,
                        buttonStyleData: ButtonStyleData(
                          height: Constant.getActualY(context: context, y: 56),
                          width: Constant.getActualX(context: context, x: 320),
                          padding: EdgeInsets.only(
                            left: Constant.getActualX(context: context, x: 10),
                            right: Constant.getActualX(context: context, x: 10),
                          ),
                          decoration: BoxDecoration(
                            color: Constant.backgroundWhite,
                            border:
                                Border.all(color: Constant.textBlack, width: 1),
                            borderRadius: BorderRadius.circular(8),
                          ),
                          elevation: 2,
                        ),
                        iconStyleData: IconStyleData(
                          icon: Icon(
                            Icons.keyboard_arrow_down_outlined,
                          ),
                          iconSize: 24,
                          iconEnabledColor: Constant.textBlack,
                          iconDisabledColor: Colors.grey,
                        ),
                        dropdownStyleData: DropdownStyleData(
                          maxHeight:
                              Constant.getActualY(context: context, y: 200),
                          width: Constant.getActualX(context: context, x: 320),
                          padding: EdgeInsets.only(
                            top: Constant.getActualY(context: context, y: 10),
                            left: Constant.getActualX(context: context, x: 10),
                            right: Constant.getActualX(context: context, x: 10),
                            bottom:
                                Constant.getActualY(context: context, y: 10),
                          ),
                          decoration: BoxDecoration(
                            color: Constant.backgroundWhite,
                            borderRadius: BorderRadius.circular(8),
                            boxShadow: [
                              BoxShadow(
                                color: Colors.grey,
                                blurRadius: 20.0,
                                spreadRadius: 2.0,
                                offset: Offset(0.0, 0.0),
                              ),
                            ],
                          ),
                          elevation: 8,
                          offset: const Offset(0, -10),
                          scrollbarTheme: ScrollbarThemeData(
                            radius: const Radius.circular(40),
                            thickness: MaterialStateProperty.all<double>(6),
                            thumbVisibility:
                                MaterialStateProperty.all<bool>(true),
                          ),
                        ),
                        menuItemStyleData: MenuItemStyleData(
                          height: Constant.getActualY(context: context, y: 56),
                          padding: EdgeInsets.only(
                            top: Constant.getActualY(context: context, y: 10),
                            left: Constant.getActualX(context: context, x: 10),
                            right: Constant.getActualX(context: context, x: 10),
                          ),
                        ),
                      ),
                    ),
                  ],

                  SizedBox(
                    height: Constant.getActualY(context: context, y: 32),
                  ),

                  // form
                  Container(
                    width: Constant.getActualX(context: context, x: 320),
                    height: Constant.getActualY(context: context, y: 612),
                    // color: Colors.green,
                    child: Column(
                      children: [
                        if (selectedDropdown.value.id == 3) ...[
                          const InputLainLain(
                            data: {
                              "tipePekerjaan": "4",
                              "tipePengantaranHasil": ""
                            },
                          )
                        ]
                      ],
                    ),
                  ),

                  // spacing
                  SizedBox(
                    height: Constant.getActualY(context: context, y: 32),
                  ),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}
