import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:provider/provider.dart';
import 'package:test_sa/extensions/context_extension.dart';
import 'package:test_sa/extensions/int_extensions.dart';
import 'package:test_sa/extensions/string_extensions.dart';
import 'package:test_sa/extensions/text_extensions.dart';
import 'package:test_sa/extensions/widget_extensions.dart';
import 'package:test_sa/helper/utils.dart';
import 'package:test_sa/modules/cm_module/views/components/action_button/footer_action_button.dart';
import 'package:test_sa/modules/cx_module/chat/chat_rooms_page.dart';
import 'package:test_sa/modules/cx_module/survey/questionnaire_model.dart';
import 'package:test_sa/new_views/app_style/app_color.dart';
import 'package:test_sa/new_views/common_widgets/app_filled_button.dart';
import 'package:test_sa/new_views/common_widgets/app_text_form_field.dart';
import 'package:test_sa/new_views/common_widgets/default_app_bar.dart';

import 'survey_provider.dart';

class SurveyPage extends StatefulWidget {
  // int moduleId;
  // int requestId;
  int surveyId;

  SurveyPage({Key? key,
      // required this.moduleId, required this.requestId,
      required this.surveyId}) : super(key: key);

  @override
  _SurveyPageState createState() {
    return _SurveyPageState();
  }
}

class _SurveyPageState extends State<SurveyPage> {
  // int serviceSatisfiedRating = -1;
  int serviceProvidedRating = -1;
  String comments = "";
  String message = "";

  bool loading = false;

  Questionnaire? questionnaire;

  List<SurveyAnswers> answers = [];

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

  void getSurveyQuestion() async {
    loading = true;
    setState(() {});
    await Provider.of<SurveyProvider>(context, listen: false).getQuestionnaire(widget.surveyId, (msg, questions) {
      message = msg;
      questionnaire = questions;
    });
    for (int i = 0; i < (questionnaire?.surveyQuestions?.length ?? 0); i++) {
      answers.add(SurveyAnswers(
        questionId: questionnaire!.surveyQuestions![i].questionId!,
        surveyAnswerRating: -1,
      ));
    }
    loading = false;
    setState(() {});
  }

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: AppColor.neutral100,
      appBar: const DefaultAppBar(title: "Survey"),
      body: loading
          ? CircularProgressIndicator(color: AppColor.loadingColor(context), strokeWidth: 3).center
          : (questionnaire == null)
              ? Column(
                  mainAxisSize: MainAxisSize.min,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    Text(
                      message.isNotEmpty ? message : "Failed to get questionnaire",
                      overflow: TextOverflow.ellipsis,
                      maxLines: 1,
                      style: AppTextStyles.heading6.copyWith(color: AppColor.neutral50, fontWeight: FontWeight.w500),
                    ),
                    24.height,
                    AppFilledButton(
                      label: message.isNotEmpty ? "Go Back " : "Retry",
                      maxWidth: true,
                      buttonColor: AppColor.primary10,
                      onPressed: () {
                        message.isNotEmpty ? Navigator.pop(context) : getSurveyQuestion();
                      },
                    ).paddingOnly(start: 48, end: 48)
                  ],
                ).center
              : Column(
                  children: [
                    SingleChildScrollView(
                      padding: const EdgeInsets.all(16),
                      child: ListView.separated(
                              shrinkWrap: true,
                              physics: const NeverScrollableScrollPhysics(),
                              itemBuilder: (cxt, index) {
                                SurveyQuestions question = questionnaire!.surveyQuestions![index];
                                return question.questionType?.value == 4
                                    ? Column(
                                        mainAxisSize: MainAxisSize.min,
                                        crossAxisAlignment: CrossAxisAlignment.start,
                                        children: [
                                          Text(
                                            question.questionText ?? "",
                                            style: AppTextStyles.bodyText.copyWith(color: context.isDark ? AppColor.neutral10 : AppColor.neutral50),
                                          ),
                                          12.height,
                                          SizedBox(
                                            height: 32,
                                            child: ListView.separated(
                                              itemBuilder: (cxt, _index) => (answers[index].surveyAnswerRating! >= _index ? 'star_filled'.toSvgAsset() : 'star_empty'.toSvgAsset()).onPress(() {
                                                setState(() {
                                                  answers[index].surveyAnswerRating = _index;
                                                  // serviceSatisfiedRating = _index;
                                                });
                                              }),
                                              shrinkWrap: true,
                                              physics: const NeverScrollableScrollPhysics(),
                                              separatorBuilder: (cxt, index) => 8.width,
                                              itemCount: 5,
                                              scrollDirection: Axis.horizontal,
                                            ),
                                          ),
                                        ],
                                      )
                                    : AppTextFormField(
                                        initialValue: answers[index].surveyAnswerText,
                                        textInputType: TextInputType.multiline,
                                        alignLabelWithHint: true,
                                        labelText: questionnaire!.surveyQuestions![index].questionText,
                                        backgroundColor: AppColor.fieldBgColor(context),
                                        style: TextStyle(fontWeight: FontWeight.w500, fontSize: context.isTablet() ? 16 : 12, color: context.isDark ? Colors.white : const Color(0xff3B3D4A)),
                                        labelStyle: TextStyle(fontWeight: FontWeight.w500, fontSize: context.isTablet() ? 16 : 12, color: context.isDark ? Colors.white : const Color(0xff767676)),
                                        floatingLabelStyle:
                                            TextStyle(fontWeight: FontWeight.w500, fontSize: context.isTablet() ? 16 : 12, color: context.isDark ? Colors.white : const Color(0xff3B3D4A)),
                                        showShadow: false,
                                        onChange: (value) {
                                          answers[index].surveyAnswerText = value;
                                        },
                                      );
                              },
                              separatorBuilder: (cxt, index) => 16.height,
                              itemCount: questionnaire?.surveyQuestions?.length ?? 0)
                          .toShadowContainer(context, borderRadius: 20, showShadow: false),
                    ).expanded,
                    FooterActionButton.footerContainer(
                      context: context,
                      child: AppFilledButton(
                        label: context.translation.submit,
                        buttonColor: AppColor.primary10,
                        onPressed: () async {
                          FocusScope.of(context).unfocus();
                          if (validateAnswers()) {
                            Map<String, dynamic> payload = {
                              "surveySubmissionId": questionnaire!.surveySubmissionId,
                              "questionnaireId": questionnaire!.questionnaireId,
                              "submittedUserId": context.userProvider.user!.userID,
                              "surveySubmissionStatusId": 0,
                              "surveyAnswers": answers.map((element) => element.toJson()).toList(),
                            };
                            Utils.showLoading(context);
                            bool isSuccess = await Provider.of<SurveyProvider>(context, listen: false).submitQuestionare(payload);
                            Utils.hideLoading(context);
                            if (isSuccess) {
                              context.showConfirmDialog("Thanks for submitting the Feedback. Its value for us to improve our system and overall experience.", title: "Thank you!", onTap: () {
                                Navigator.pop(context);
                                Navigator.pop(context);
                              });
                            } //reload Data
                          }
                        },
                      ),
                    ),
                  ],
                ),
    );
  }

  bool validateAnswers() {
    bool status = true;
    for (int i = 0; i < answers.length; i++) {
      if (questionnaire!.surveyQuestions![i].isMandatory ?? false) {
        if (questionnaire!.surveyQuestions![i].questionType!.value == 4) {
          if (answers[i].surveyAnswerRating! < 0) {
            "Please rate (${questionnaire!.surveyQuestions![i].questionText})".showToast;
            status = false;
            break;
          }
        } else if (questionnaire!.surveyQuestions![i].questionType!.value == 3) {
          answers[i].surveyAnswerRating = null;
          if ((answers[i].surveyAnswerText ?? "").isEmpty) {
            "Please answer (${questionnaire!.surveyQuestions![i].questionText})".showToast;
            status = false;
            break;
          }
        }
      }
    }
    return status;
  }
}
