import 'dart:collection';
import 'dart:convert';

// import 'package:konectar_events/constants.dart';
// import 'package:konectar_events/provider_class/engagement_provider.dart';
// import 'package:konectar_events/ui_screen/bottom_sheet.dart';
// import 'package:flutter/cupertino.dart';
import 'package:konectar_events/contacts_module/constants.dart';
import 'package:konectar_events/contacts_module/provider_class/engagement_provider.dart';
import 'package:konectar_events/contacts_module/ui_screen/bottom_sheet.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:intl/intl.dart';
import 'package:provider/provider.dart';
import 'package:multi_dropdown/multiselect_dropdown.dart';

class EngagementList extends StatefulWidget {
  const EngagementList({super.key});

  @override
  State<EngagementList> createState() => _EngagementListState();
}

class _EngagementListState extends State<EngagementList> {
  List eng = [];

  List filteredList = [];
  List hcpname = [];
  List main = [];
  List rel = [];
  List level = [];

  DateTime? selectedDate;
  final TextEditingController textController = TextEditingController();

  bool calview = false;
  String start = '', end = '';

  TextEditingController _searchController = TextEditingController();

  final TextEditingController startController = TextEditingController();
  final TextEditingController endController = TextEditingController();

  String searchQuery = '';

  List<String> _dropDownValue1 = [],
      _dropDownValue2 = [],
      _dropDownValue3 = [],
      _dropDownValue4 = [],
      _dropDownValue5 = [];

  final TextEditingController textController1 = TextEditingController();

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    init();
  }

  Future<void> init() async {
    var engagement =
        await Provider.of<EnagagementProvider>(context, listen: false);
    final data = engagement.getengagementdata();

    final data1 = engagement.engagementdata;

    engagement.gethcpname();
    hcpname = engagement.engagementhcppname;

    print("getnewData: ${hcpname}");

    engagement.getmaintherepeutic();

    engagement.getrelationship();

    engagement.getrelationlevel();

    setState(() {
      eng = data1;

      filteredList = eng;

      main = engagement.enagementhcppmain;

      rel = engagement.enagementhcpprel;
      level = engagement.enagementhcplevel;
    });
  }

  void _filterList(String query) {
    print('filteredList_is: $filteredList');
    setState(() {
      searchQuery = query;
      filteredList = eng
          .where((item) => item['main thereutic area']
              .toLowerCase()
              .contains(query.toLowerCase()))
          .toList();
    });
  }

  void filtermulti(List<String> query, List<String> query2, List<String> query3,
      List<String> query4, String startt, String endd) {
    print("query: $query");
    print("query2: $query2");
    print("query3: $query3");
    print("query4: $query4");
    print("startt: $startt");
    print("endd: $endd");

    // Apply Filters to Each List
    // List<String> filteredQuery1 = filterList(query);
    // List<String> filteredQuery2 = filterList(query2);
    // List<String> filteredQuery3 = filterList(query3);
    // List<String> filteredQuery4 = filterList(query4);

    // // Print Results
    // print('Filtered Query 1: $filteredQuery1');
    // print('Filtered Query 2: $filteredQuery2');
    // print('Filtered Query 3: $filteredQuery3');
    // print('Filtered Query 4: $filteredQuery4');

// Function to filter a list based on each element being used as a keyword

//  filteredList = eng.where((map) {
//     String value = map['main thereutic area']?.toLowerCase() ?? '';
//     return query.any((keyword) => value.contains(keyword.toLowerCase()));
//   }).toList();

    final DateFormat formatter = DateFormat('dd-MM-yyyy');

    //DateTime itemDate = formatter.parse(map['date']);

    setState(() {
      filteredList = eng
          .where((map) =>
                  //    String value = map['main thereutic area'].toLowerCase();

                  //print("Vlaueee_isss: ${value} ${query2}");
                  query2.any((keyword) => map['main thereutic area']
                      .toLowerCase()
                      .contains(keyword.toLowerCase())) ||
                  query.any((keyword) => map['hcpname']
                      .toLowerCase()
                      .contains(keyword.toLowerCase())) ||
                  query3.any((keyword) => map['relationship with chiesi']
                      .toLowerCase()
                      .contains(keyword.toLowerCase())) ||
                  query4.any((keyword) => map['level of engagement']
                      .toLowerCase()
                      .contains(keyword.toLowerCase()))
              //||
              // formatter
              //         .parse(map['date'])
              //         .isAfter(formatter.parse(startt)) &&
              //     formatter
              //         .parse(map['date'])
              //         .isBefore(formatter.parse(endd))
              //      ||
              // (DateTime.parse(map['date']).isAfter(DateTime.parse(startt)) &&
              //     DateTime.parse(map['date'])
              //         .isBefore(DateTime.parse(endd).add(Duration(days: 1))))
              )
          .toList();
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Enagagement"),
      ),
      endDrawer: Drawer(
        child: ListView(
          children: [
            Row(
              children: [
                Expanded(
                  flex: 1,
                  child: Padding(
                    padding: const EdgeInsets.all(8.0),
                    child: TextFormField(
                      controller: startController,
                      readOnly: true, // Make the TextFormField read-only
                      decoration: InputDecoration(
                          isDense: true,
                          labelText: 'Start Date',
                          //  suffixIcon: Icon(Icons.calendar_today),
                          enabledBorder: OutlineInputBorder(
                              borderSide: BorderSide(color: Colors.black),
                              borderRadius: BorderRadius.circular(10))),
                      onTap: () =>
                          _selectDate(context), // Show date picker on tap
                    ),
                  ),
                ),
                Expanded(
                  flex: 1,
                  child: Padding(
                    padding: const EdgeInsets.all(8.0),
                    child: TextFormField(
                      controller: endController,
                      readOnly: true, // Make the TextFormField read-only
                      decoration: InputDecoration(
                          isDense: true,
                          labelText: 'End Date',
                          // suffixIcon: Icon(Icons.calendar_today),
                          enabledBorder: OutlineInputBorder(
                              borderSide: BorderSide(color: Colors.black),
                              borderRadius: BorderRadius.circular(10))),
                      onTap: () =>
                          _selectDate1(context), // Show date picker on tap
                    ),
                  ),
                ),
              ],
            ),
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: MultiSelectDropDown.network(
                borderColor: Colors.black,
                fieldBackgroundColor: Colors.transparent,
                hint: "Select Employee Name",
                dropdownHeight: 300,
                onOptionSelected: (options) {
                  debugPrint("checkking" + options.toString());

                  //  String label = options[0].label;
                  List<String> label1 = [];

                  // var label;
                  //  debugPrint("checkking " + label);

                  // for (var option in options) {
                  //   label1.add(option.label);
                  //   debugPrint("Selected label: $label");
                  // }

                  for (var option in options) {
                    print("Options_isssssss: ${option}");
                    if (option.label.isNotEmpty) {
                      label1.add(option.label);
                    } else {
                      label1.clear();
                    }
                    debugPrint("Selected label: $label1, ${option.label}");
                  }
                  setState(() {
                    _dropDownValue1 = label1;
                  });
                },
                searchEnabled: true,
                networkConfig: NetworkConfig(
                  url: '${Constants.url}/engagement',
                  method: RequestMethod.get,
                  headers: {
                    'Content-Type': 'application/json',
                  },
                ),
                chipConfig: const ChipConfig(wrapType: WrapType.wrap),
                responseParser: (response) {
                  final list = (response as List<dynamic>).map((e) {
                    final item = e as Map<String, dynamic>;
                    return ValueItem(
                      label: item['hcpname'],
                      value: item['id'].toString(),
                    );
                  }).toList();

                  return Future.value(list);
                },
                responseErrorBuilder: ((context, body) {
                  return const Padding(
                    padding: EdgeInsets.all(16.0),
                    child: Text('Error fetching the data'),
                  );
                }),
              ),
            ),
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: MultiSelectDropDown.network(
                borderColor: Colors.black,
                fieldBackgroundColor: Colors.transparent,
                hint: "Select Main Therapeutic Area",
                dropdownHeight: 300,
                onOptionSelected: (options) {
                  debugPrint(options.toString());

                  // String label = options[0].label;
                  List<String> label1 = [];

                  // var label;
                  // debugPrint("checkking " + label);

                  // for (var option in options) {
                  //   label1.add(option.label);
                  //   debugPrint("Selected label: $label");
                  // }

                  for (var option in options) {
                    print("Options_isssssss: ${option}");
                    if (option.label.isNotEmpty) {
                      label1.add(option.label);
                    } else {
                      label1.clear();
                    }
                    debugPrint("Selected label: $label1, ${option.label}");
                  }
                  setState(() {
                    _dropDownValue2 = label1;
                  });
                },
                searchEnabled: true,
                networkConfig: NetworkConfig(
                  url: '${Constants.url}/engagement',
                  method: RequestMethod.get,
                  headers: {
                    'Content-Type': 'application/json',
                  },
                ),
                chipConfig: const ChipConfig(wrapType: WrapType.wrap),
                responseParser: (response) {
                  final list = (response as List<dynamic>).map((e) {
                    final item = e as Map<String, dynamic>;
                    return ValueItem(
                      label: item['main thereutic area'],
                      value: item['id'].toString(),
                    );
                  }).toList();

                  return Future.value(list);
                },
                responseErrorBuilder: ((context, body) {
                  return const Padding(
                    padding: EdgeInsets.all(16.0),
                    child: Text('Error fetching the data'),
                  );
                }),
              ),
            ),
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: MultiSelectDropDown.network(
                borderColor: Colors.black,
                fieldBackgroundColor: Colors.transparent,
                hint: "Select Relationship with Chiesi",
                dropdownHeight: 300,
                onOptionSelected: (options) {
                  debugPrint(options.toString());

                  //  String label = options[0].label;
                  List<String> label1 = [];

                  // var label;
                  // debugPrint("checkking " + label);

                  // for (var option in options) {
                  //   label1.add(option.label);
                  //   debugPrint("Selected label: $label");
                  // }
                  for (var option in options) {
                    print("Options_isssssss: ${option}");
                    if (option.label.isNotEmpty) {
                      label1.add(option.label);
                    } else {
                      label1.clear();
                    }
                    debugPrint("Selected label: $label1, ${option.label}");
                  }

                  setState(() {
                    _dropDownValue3 = label1;
                  });
                },
                searchEnabled: true,
                networkConfig: NetworkConfig(
                  url: '${Constants.url}/engagement',
                  method: RequestMethod.get,
                  headers: {
                    'Content-Type': 'application/json',
                  },
                ),
                chipConfig: const ChipConfig(wrapType: WrapType.wrap),
                responseParser: (response) {
                  final list = (response as List<dynamic>).map((e) {
                    final item = e as Map<String, dynamic>;
                    return ValueItem(
                      label: item['relationship with chiesi'],
                      value: item['id'].toString(),
                    );
                  }).toList();

                  return Future.value(list);
                },
                responseErrorBuilder: ((context, body) {
                  return const Padding(
                    padding: EdgeInsets.all(16.0),
                    child: Text('Error fetching the data'),
                  );
                }),
              ),
            ),
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: MultiSelectDropDown.network(
                borderColor: Colors.black,
                fieldBackgroundColor: Colors.transparent,
                hint: "Select Level of Engagement",
                dropdownHeight: 300,
                onOptionSelected: (options) {
                  debugPrint(options.toString());

                  // String label = options[0].label.toString();
                  List<String> label1 = [];

                  // var label;
                  // debugPrint("checkking " + label);
                  //debugPrint("checkking " + label.isNotEmpty);

                  // if (label.isNotEmpty) {
                  for (var option in options) {
                    print("Options_isssssss: ${option}");
                    if (option.label.isNotEmpty) {
                      label1.add(option.label);
                    } else {
                      label1.clear();
                    }
                    debugPrint("Selected label: $label1, ${option.label}");
                  }
                  // } else {
                  //   debugPrint("DESelected label: $label");

                  //   label1.clear();
                  // }

                  setState(() {
                    _dropDownValue4 = label1;
                  });
                },
                searchEnabled: true,
                networkConfig: NetworkConfig(
                  url: '${Constants.url}/engagement',
                  method: RequestMethod.get,
                  headers: {
                    'Content-Type': 'application/json',
                  },
                ),
                chipConfig: const ChipConfig(wrapType: WrapType.wrap),
                responseParser: (response) {
                  final list = (response as List<dynamic>).map((e) {
                    final item = e as Map<String, dynamic>;
                    return ValueItem(
                      label: item['level of engagement'],
                      value: item['id'].toString(),
                    );
                  }).toList();

                  return Future.value(list);
                },
                responseErrorBuilder: ((context, body) {
                  return const Padding(
                    padding: EdgeInsets.all(16.0),
                    child: Text('Error fetching the data'),
                  );
                }),
              ),
            ),
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: OutlinedButton(
                onPressed: () {
                  print(
                      "$_dropDownValue1 , $_dropDownValue2, $_dropDownValue3, $_dropDownValue4");

                  filtermulti(_dropDownValue1, _dropDownValue2, _dropDownValue3,
                      _dropDownValue4, start, end);
                  // filtermulti(_dropDownValue1 ?? null, _dropDownValue2 ?? null,
                  //     _dropDownValue3 ?? null, _dropDownValue4 ?? null);

                  //                setState(() {
                  //  // searchQuery = query;

                  //   filteredList = eng
                  //       .where((item) => item['level of engagement']
                  //           .toLowerCase()
                  //           .contains(_dropDownValue4!.toLowerCase())||
                  //           item['relationship with chiesi'].toLowerCase().contains(_dropDownValue3!.toLowerCase()) ||
                  //           item['main thereutic area'].toLowerCase().contains(_dropDownValue2!.toLowerCase())||
                  //           item['recorded by'].toLowerCase().contains(_dropDownValue1!.toLowerCase()) )
                  //       .toList();
                  // });
                },
                child: Text(
                  'Apply Filters',
                  style: TextStyle(color: Constants.k2color),
                ),
                style: OutlinedButton.styleFrom(
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(12),
                  ),
                ),
              ),
            ),
          ],
        ),
        //child: // Populate the Drawer in the next step.
      ),
      body: Column(children: [
        Padding(
          padding: const EdgeInsets.only(
              top: 15.0, bottom: 0.0, left: 20.0, right: 20.0),
          child: Center(
            child: TextField(
              controller: _searchController,
              onChanged: _filterList,
              decoration: InputDecoration(
                fillColor: Constants.k2color,
                contentPadding: EdgeInsets.symmetric(vertical: 9.0),
                border: OutlineInputBorder(),
                labelText: ' Search',
                prefixIcon: Icon(
                  Icons.search,
                ),
              ),
            ),
          ),
        ),
        Scrollbar(
          child: SingleChildScrollView(
            scrollDirection: Axis.horizontal,
            child: Container(
              // width:
              //     MediaQuery.of(context)
              //         .size
              //         .width,
              constraints:
                  BoxConstraints(minWidth: MediaQuery.of(context).size.width),
              color: Colors.white,
              child: DataTable(
                showCheckboxColumn: false,
                columns: const [
                  // DataColumn(
                  //     label: Expanded(
                  //         child: Text(
                  //             '',
                  //             softWrap:
                  //                 true))),
                  DataColumn(
                      label: Expanded(
                    child: Text(
                      'Main Therapeutic Area',
                      style: TextStyle(fontWeight: FontWeight.w600),
                    ),
                  )),
                  // DataColumn(
                  //     label: Expanded(
                  //         child: Text(
                  //             'Department'))),
                  // DataColumn(
                  //     label: Expanded(
                  //         child: Text(
                  //             'Role'))),
                  DataColumn(
                      label: Expanded(
                          child: Text('Date',
                              style: TextStyle(fontWeight: FontWeight.w600)))),
                  // DataColumn(
                  //     label: Expanded(
                  //         child: Text(
                  //             'Org Type'))),
                  // DataColumn(
                  //     label: Expanded(
                  //         child: Text(
                  //             'Eng Type'))),

                  // Add more columns as needed
                ],
                rows: List.generate(
                  filteredList.length,
                  (index) => DataRow(
                    onSelectChanged: (value) {
                      // =======> Use onSelectChanged for tab
                      //   print("message ${eng[index]}");

                      // bsheet(
                      //     publication_data[
                      //         index]);
                      showModalBottomSheet(
                        useRootNavigator: true,
                        isScrollControlled: false,
                        enableDrag: true,
                        useSafeArea: true,
                        constraints: const BoxConstraints(
                          maxWidth: double.infinity,
                        ),
                        shape: RoundedRectangleBorder(
                          borderRadius: BorderRadius.vertical(
                            top: Radius.circular(0),
                          ),
                        ),
                        clipBehavior: Clip.antiAliasWithSaveLayer,
                        context: context,
                        builder: (context) {
                          return bsheet(filteredList[index]);
                        },
                      );
                      // showBottomSheet(
                      //     context:
                      //         context,
                      //     builder:
                      //         (BuildContext
                      //             context) {
                      // return bsheet(
                      //     publication_data[
                      //         index]); // returns your BottomSheet widget
                      //     });
                    },
                    color: MaterialStateProperty.resolveWith<Color?>(
                        (Set<MaterialState> states) {
                      if (index.isEven) {
                        return Colors.grey.withOpacity(0.1);
                      }
                      return null;
                    }),
                    cells: [
                      DataCell(Text(
                          filteredList[index]['main thereutic area'].toString(),
                          softWrap: true)),
                      // DataCell(Text(
                      //     affiliation_data[
                      //                 index]
                      //             [
                      //             'dept']
                      //         .toString(),
                      //     softWrap:
                      //         true)),
                      // DataCell(Text(
                      //     affiliation_data[
                      //                 index]
                      //             [
                      //             'role']
                      //         .toString(),
                      //     softWrap:
                      //         true)),
                      DataCell(Text(filteredList[index]['date'].toString(),
                          softWrap: true)),
                      // DataCell(Text(
                      //     affiliation_data[
                      //                 index]
                      //             [
                      //             'org_type']
                      //         .toString(),
                      //     softWrap:
                      //         true)),
                      // DataCell(Text(
                      //     affiliation_data[
                      //                 index]
                      //             [
                      //             'emg_type']
                      //         .toString(),
                      //     softWrap:
                      //         true)),

                      // Add more DataCells as needed
                    ],
                  ),
                ),
              ),
            ),
          ),
        ),
      ]),
    );
  }

  Future<Null> _selectDate(BuildContext context) async {
    final DateTime? picked = await showDatePicker(
        context: context,
        initialDate: selectedDate,
        firstDate: DateTime(1901, 1),
        lastDate: DateTime(2100));
    if (picked != null && picked != selectedDate) {
      setState(() {
        selectedDate = picked;
        String convertedDateTime =
            "${picked.day.toString().padLeft(2, '0')}-${picked.month.toString().padLeft(2, '0')}-${picked.year.toString()}";
        // widget.textController.value = TextEditingValue(text: picked.toString());
        startController.value = TextEditingValue(text: convertedDateTime);
        //  textController1.value = TextEditingValue(text: convertedDateTime);

        start = convertedDateTime;

        print("Iam__Start: $start");
      });
    }
  }

  Future<Null> _selectDate1(BuildContext context) async {
    final DateTime? picked = await showDatePicker(
        context: context,
        initialDate: selectedDate,
        firstDate: DateTime(1901, 1),
        lastDate: DateTime(2100));
    if (picked != null && picked != selectedDate) {
      setState(() {
        selectedDate = picked;
        String convertedDateTime =
            "${picked.day.toString().padLeft(2, '0')}-${picked.month.toString().padLeft(2, '0')}-${picked.year.toString()}";
        // widget.textController.value = TextEditingValue(text: picked.toString());
        endController.value = TextEditingValue(text: convertedDateTime);

        end = convertedDateTime;
      });
    }
  }

  String _convertDateStringToISO(String dateString) {
    DateTime dateTime = DateTime.parse(DateTime.tryParse(
            dateString.split('/').reversed.join('-') + 'T00:00:00Z')!
        .toIso8601String());

    print("dateTimedateTime: $dateTime");
    return dateTime.toIso8601String();
  }
  // List<String> filterList(List<String> list) {
  //   return list
  //       .where((item) => list.any((keyword) => item.contains(keyword)))
  //       .toList();
  // }
}