import 'package:discover_module/constants.dart';
import 'package:discover_module/ui_screen/interactionform/interactionprovider.dart';
import 'package:discover_module/ui_screen/interactionform/model/interaction_data.dart';
import 'package:discover_module/ui_screen/interactionform/model/save_interaction.dart';
import 'package:discover_module/ui_screen/interactionform/util.dart';
import 'package:discover_module/ui_screen/interactionform/widget/custombutton.dart';
import 'package:discover_module/ui_screen/interactionform/widget/responsive_ext.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

// ignore: must_be_immutable
class ViewInteractionScreen extends StatefulWidget {
  SaveInteraction saveInteraction;
  ViewInteractionScreen({super.key, required this.saveInteraction});

  @override
  State<ViewInteractionScreen> createState() => _ViewInteractionScreenState();
}

class _ViewInteractionScreenState extends State<ViewInteractionScreen> {
  List<dynamic> interactionReponseList = [];
  List<SectionList> sectionList = [];
  List<TextEditingController> textEditingControllerList = [];
  int textfieldIndex = 0;
  String dropdownvalue = 'Select value';
  String? fileName;
  final TextEditingController textEditingController = TextEditingController();
  @override
  void initState() {
    WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
      init();
    });

    super.initState();
  }

  init() async {
    await Provider.of<InteractionProvider>(context, listen: false)
        .initSavedForm(widget.saveInteraction);
    setState(() {});
  }

  @override
  Widget build(BuildContext context) {
    return Consumer<InteractionProvider>(
        builder: (BuildContext context, provider, Widget? child) {
      print("build context");
      print("${provider.interactionReponseList}");
      return GestureDetector(
        onTap: () {
          FocusScope.of(context).requestFocus(FocusNode());
        },
        child: OrientationBuilder(builder: (context, orientation) {
          return Scaffold(
              //resizeToAvoidBottomInset: false,
              appBar: AppBar(
                title: Text(
                  widget.saveInteraction.id,
                  style: TextStyle(
                      fontSize: isTablet ? 22 : 14, color: Colors.white),
                ),
                // backgroundColor: const Color(0xFF2b9af3),
                automaticallyImplyLeading: false,
                leading: InkWell(
                  onTap: () {
                    Navigator.pop(context);
                  },
                  child: const Icon(
                    Icons.arrow_back_ios,
                    color: Colors.white,
                  ),
                ),
              ),
              body: Column(
                children: [
                  Expanded(
                    child: ListView.builder(
                      itemCount: provider.interactionReponseList.length,
                      cacheExtent: double.parse(
                          provider.interactionReponseList.length.toString()),
                      itemBuilder: (context, index) {
                        var item = provider.interactionReponseList[index];
                        sectionList = item.sectionList;
                        return ExpansionTile(
                            initiallyExpanded: true,
                            title: Stack(
                                alignment: AlignmentDirectional.center,
                                children: [
                                  Container(
                                      // height: double.infinity,
                                      width: double.infinity,
                                      padding: const EdgeInsets.all(8.0),
                                      decoration: BoxDecoration(
                                        // color: Color(0xFF2b9af3),
                                        color: Constants.k2color,
                                      ),
                                      child: Text(
                                        item.sectionName,
                                        style: const TextStyle(
                                            color: Colors.white,
                                            fontWeight: FontWeight.bold,
                                            fontSize: 18.0),
                                      )),
                                ]),
                            children: [
                              Padding(
                                padding: const EdgeInsets.all(8.0),
                                child: Column(
                                  crossAxisAlignment: CrossAxisAlignment.center,
                                  children: [
                                    const SizedBox(
                                      height: 20,
                                    ),

                                    Padding(
                                      padding: isTablet
                                          ? const EdgeInsets.only(left: 18.0)
                                          : const EdgeInsets.only(
                                              left: 12.0, right: 12.0),
                                      child: GridView.count(
                                        physics:
                                            const NeverScrollableScrollPhysics(),
                                        // crossAxisCount: context.responsive<int>(
                                        //   1,
                                        //   sm: 1, // small
                                        //   md: 1, // medium
                                        //   lg: sectionList.length == 1
                                        //       ? 1
                                        //       : 4, // large
                                        //   xl: 3, // extra large screen
                                        // ),
                                        // mainAxisSpacing:
                                        //     sectionList.length == 1 || !isTablet
                                        //         ? 1
                                        //         : 3.5,
                                        // shrinkWrap: true,
                                        // padding: EdgeInsets.zero,
                                        // childAspectRatio:
                                        //     sectionList.length == 1 || !isTablet
                                        //         ? orientation ==
                                        //                 Orientation.landscape
                                        //             ? 10
                                        //             : 3.8
                                        //         : 2.8,
                                        crossAxisCount: context.responsive<int>(
                                          1,
                                          sm: 1, // small
                                          md: 2, // medium
                                          lg: sectionList.length == 1
                                              ? 1
                                              : 3, // large
                                          xl: 3, // extra large screen
                                        ),
                                        mainAxisSpacing:
                                            sectionList.length == 1 || !isTablet
                                                ? 1
                                                : 3.5,
                                        childAspectRatio:
                                            sectionList.length == 1
                                                ? orientation ==
                                                        Orientation.landscape
                                                    ? 10
                                                    : 4.8
                                                : isTablet
                                                    ? 2.8
                                                    : 3.0,
                                        shrinkWrap: true,
                                        padding: EdgeInsets.zero,
                                        children: List.generate(
                                          sectionList.length,
                                          (i) {
                                            print(sectionList);
                                            SectionList sectionItem =
                                                sectionList[i];
                                            dropdownvalue = sectionItem
                                                        .widget ==
                                                    InteractionWidget.DROPDOWN
                                                ? sectionItem.value ?? "Select"
                                                : ' ';
                                            List<InputClass> list = sectionItem
                                                            .widget ==
                                                        InteractionWidget
                                                            .DROPDOWN ||
                                                    sectionItem.widget ==
                                                        InteractionWidget
                                                            .AUTOCOMPLETE ||
                                                    sectionItem.widget ==
                                                        InteractionWidget
                                                            .MULTISELECT
                                                ? provider.getData2(sectionItem)
                                                : [];
                                            provider.checkboxlist = sectionItem
                                                        .widget ==
                                                    InteractionWidget.CHECKBOX
                                                ? provider.getData2(sectionItem)
                                                : [];

                                            return Column(
                                              crossAxisAlignment:
                                                  CrossAxisAlignment.start,
                                              children: [
                                                sectionItem.widget ==
                                                            InteractionWidget
                                                                .BUTTON &&
                                                        sectionItem.param ==
                                                            'add'
                                                    ? const SizedBox.shrink()
                                                    : Text(
                                                        '${sectionItem.name}:*',
                                                        style: TextStyle(
                                                          color: Colors
                                                              .orange.shade800,
                                                          fontSize: isTablet
                                                              ? 18
                                                              : 12,
                                                        ),
                                                      ),
                                                SizedBox(
                                                  height: isTablet ? 15 : 5,
                                                ),
                                                returnWidget(
                                                    sectionItem: sectionItem,
                                                    item: item,
                                                    provider: provider,
                                                    list: list,
                                                    gridIndex: i,
                                                    listIndex: index,
                                                    widgetData:
                                                        sectionItem.widget!),
                                                SizedBox(
                                                  height: isTablet ? 15 : 5,
                                                ),
                                              ],
                                            );
                                          },
                                        ),
                                      ),
                                    ),
                                    SizedBox(
                                      height: isTablet ? 15 : 5,
                                    ),
                                    item.multiple
                                        ? gridViewWidget(
                                            provider,
                                            item.sectionName,
                                            item.multipleList ?? [],
                                            orientation,
                                            item,
                                            index)
                                        : const SizedBox.shrink(),
                                    provider.interactionReponseList.length ==
                                            index - 1
                                        ? saveActions(provider)
                                        : const SizedBox.shrink()
                                    //const Spacer(),
                                  ],
                                ),
                              ),
                            ]);
                      },
                    ),
                  ),
                  // const Spacer(),
                  // saveActions(provider),
                ],
              ));
        }),
      );
    });
  }

  Widget returnWidget({
    required SectionList sectionItem,
    required FormFieldData item,
    required InteractionProvider provider,
    required List<InputClass> list,
    required int gridIndex,
    required int listIndex,
    required InteractionWidget widgetData,
  }) {
    switch (widgetData) {
      case InteractionWidget.CHECKBOX:
        return (sectionItem.inputList!.length >= 5)
            ? Text(sectionItem.selectedValue.toString())
            : Text(provider.getDataValue(
                sectionItem.id, sectionItem.selectedValue!.last));

      case InteractionWidget.AUTOCOMPLETE:
        return Text(provider.getDataValue(
            sectionItem.id, sectionItem.selectedValue!.last));

      case InteractionWidget.MULTISELECT:
        return Text(sectionItem.selectedValue.toString());

      case InteractionWidget.RADIO:
        return (sectionItem.inputList!.length >= 5)
            ? Text(sectionItem.selectedValue!.isNotEmpty
                ? provider.getDataValue(
                    sectionItem.id, sectionItem.selectedValue!.last)
                : " ")
            : Text(provider.getDataValue(
                sectionItem.id, sectionItem.selectedValue!.last));

      case InteractionWidget.LABEL:
        return Text(sectionItem.input!);

      case InteractionWidget.RANGESLIDER:
        return Text(sectionItem.selectedValue!.isNotEmpty
            ? sectionItem.selectedValue!.last.toString()
            : " ");

      case InteractionWidget.TEXT:
        return Text(sectionItem.selectedValue!.isNotEmpty
            ? sectionItem.selectedValue!.last.toString()
            : " ");

      case InteractionWidget.BUTTON:
        return sectionItem.input == "chooseFile"
            ? sectionItem.selectedValue!.isNotEmpty
                ? const Text("File Uploaded")
                : const Text(" ")
            : const Text(" ");
      default:
        return Text(sectionItem.selectedValue!.isNotEmpty
            ? provider.getDataValue(
                sectionItem.id, sectionItem.selectedValue!.last)
            : " ");
    }
  }

  Widget saveActions(InteractionProvider provider) {
    return Align(
      alignment: Alignment.centerRight,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: [
          CustomButton(
            backgroundColor: Colors.red.shade800,
            onPressed: () {
              //showDeleteProfileAlertDialog(context);
              for (var textcontrollers in provider.textEditingControllerList) {
                textcontrollers.text = '';
              }
            },
            textColor: Colors.white,
            title: "Reset",
            height: 40,
            width: isTablet ? 100 : 60,
            fontsize: isTablet ? 15 : 10.2,
          ),
          SizedBox(
            width: isTablet ? 20 : 4,
          ),
          CustomButton(
            backgroundColor: Colors.green.shade900,
            onPressed: () async {
              if (textFieldsValidation(provider).isEmpty) {
                //  await provider.saveJsonObject(context, widget.form);
                _displaySnackBar('Form Saved Sucessfully!');
              } else {
                _displaySnackBar(textFieldsValidation(provider));
              }
            },
            textColor: Colors.white,
            title: "Save",
            height: 40,
            width: isTablet ? 100 : 60,
            fontsize: isTablet ? 16 : 12,
          ),
          SizedBox(
            width: isTablet ? 20 : 2,
          ),
        ],
      ),
    );
  }

  Widget gridViewWidget(
      InteractionProvider provider,
      String sectionName,
      List<SectionList> sectionList,
      Orientation orientation,
      FormFieldData item,
      int listIndex) {
    return Padding(
      padding: isTablet
          ? const EdgeInsets.only(left: 22.0)
          : const EdgeInsets.only(left: 12.0, right: 12.0),
      child: GridView.count(
        physics: const NeverScrollableScrollPhysics(),
        crossAxisCount: context.responsive<int>(
          1, // default
          sm: 1, // small
          md: 1, // medium
          lg: sectionList.length == 1 ? 1 : 4, // large
          xl: 5, // extra large screen
        ),
        mainAxisSpacing: sectionList.length == 1 || !isTablet ? 1 : 2,
        shrinkWrap: true,
        padding: EdgeInsets.zero,
        childAspectRatio: sectionList.length == 1 || !isTablet
            ? orientation == Orientation.landscape
                ? 10
                : 4.2
            : 1.8,
        children: List.generate(
          sectionList.length,
          (i) {
            print(sectionList);
            SectionList sectionItem = sectionList[i];
            dropdownvalue = sectionItem.widget == InteractionWidget.DROPDOWN
                ? sectionItem.value ?? "Select"
                : ' ';
            List<InputClass> list =
                sectionItem.widget == InteractionWidget.DROPDOWN ||
                        sectionItem.widget == InteractionWidget.AUTOCOMPLETE ||
                        sectionItem.widget == InteractionWidget.MULTISELECT
                    ? provider.getData2(sectionItem)
                    : [];
            provider.checkboxlist =
                sectionItem.widget == InteractionWidget.CHECKBOX
                    ? provider.getData2(sectionItem)
                    : [];

            return Wrap(children: [
              Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  sectionItem.widget == InteractionWidget.BUTTON &&
                              sectionItem.param == 'add' ||
                          sectionItem.param == 'deletebtn'
                      ? const SizedBox.shrink()
                      : Text(
                          '${sectionItem.name}:*',
                          style: TextStyle(
                            color: Colors.orange.shade800,
                            fontSize: isTablet ? 18 : 14,
                          ),
                        ),
                  const SizedBox(
                    height: 15,
                  ),
                  returnWidget(
                      sectionItem: sectionItem,
                      item: item,
                      provider: provider,
                      list: list,
                      gridIndex: i,
                      listIndex: listIndex,
                      widgetData: sectionItem.widget!),
                ],
              ),
            ]);
          },
        ),
      ),
    );
  }

  String textFieldsValidation(InteractionProvider provider) {
    if (provider.sectionList
        .any((element) => element.controller!.text.isEmpty)) {
      return 'Fields cannot be empty';
    }

    return '';
  }

  _displaySnackBar(String msg) {
    final snackBar = SnackBar(
        content: Text(
      msg,
      style: const TextStyle(fontSize: 20.0, fontWeight: FontWeight.bold),
    ));
    ScaffoldMessenger.of(context).showSnackBar(snackBar);
    //scaffoldKeyLogin.currentState!.showSnackBar(snackBar);
  }
}