import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import 'package:hmg_patient_app_new/core/app_assets.dart';
import 'package:hmg_patient_app_new/core/app_state.dart';
import 'package:hmg_patient_app_new/core/dependencies.dart';
import 'package:hmg_patient_app_new/core/enums.dart';
import 'package:hmg_patient_app_new/core/utils/size_utils.dart';
import 'package:hmg_patient_app_new/core/utils/utils.dart';
import 'package:hmg_patient_app_new/extensions/string_extensions.dart';
import 'package:hmg_patient_app_new/extensions/widget_extensions.dart';
import 'package:hmg_patient_app_new/generated/locale_keys.g.dart';
import 'package:hmg_patient_app_new/presentation/health_calculators_and_converts/health_calculator_detailed_page.dart';
import 'package:hmg_patient_app_new/presentation/health_calculators_and_converts/widgets/health_card.dart';
import 'package:hmg_patient_app_new/theme/colors.dart';
import 'package:hmg_patient_app_new/widgets/appbar/collapsing_list_view.dart';
import 'package:hmg_patient_app_new/widgets/expandable_list_widget.dart';
import 'package:hmg_patient_app_new/widgets/routes/custom_page_route.dart';

class HealthCalculatorsPage extends StatefulWidget {
  final HealthCalConEnum type;

  const HealthCalculatorsPage({super.key, required this.type});

  @override
  State<HealthCalculatorsPage> createState() => _HealthCalculatorsPageState();
}

class _HealthCalculatorsPageState extends State<HealthCalculatorsPage> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return CollapsingListView(
        isLeading: Navigator.canPop(context),
        title: widget.type == HealthCalConEnum.calculator ? LocaleKeys.healthCalculators.tr(context: context) : LocaleKeys.healthConverters.tr(),
        child: widget.type == HealthCalConEnum.calculator
            ? CustomExpandableList(
                expansionMode: ExpansionMode.exactlyOne,
                dividerColor: AppColors.dividerColor,
                itemPadding: EdgeInsets.symmetric(vertical: 16.h, horizontal: 14.h),
                items: [
                  ExpandableListItem(
                    title: LocaleKeys.womensHealth.tr(context: context).toText18(isBold: true),
                    expandedBackgroundColor: Colors.transparent,
                    initiallyExpanded: true,
                    children: [showCalculatorsItems(type: HealthCalculatorEnum.women)],
                  ),
                  ExpandableListItem(
                    title: LocaleKeys.generalHealth.tr(context: context).toText18(isBold: true),
                    expandedBackgroundColor: Colors.transparent,
                    initiallyExpanded: true,
                    children: [showCalculatorsItems(type: HealthCalculatorEnum.general)],
                  ),
                ],
                theme: ExpandableListTheme.custom(
                  defaultTrailingIcon:
                      Utils.buildSvgWithAssets(icon: AppAssets.arrow_down, height: 22.h, width: 22.w, iconColor: AppColors.textColor),
                ),
              ).paddingSymmetrical(16.w, 0.0)
            // ? Column(
            //     children: [
            //       Container(
            //               decoration: RoundedRectangleBorder().toSmoothCornerDecoration(color: AppColors.whiteColor, borderRadius: 20.r),
            //               child: Row(
            //                 children: [
            //                   Utils.buildSvgWithAssets(icon: AppAssets.general_health, height: 40.h, width: 40.w, fit: BoxFit.none, applyThemeColor: false),
            //                   SizedBox(width: 12.w),
            //                   Flexible(
            //                     child: Column(
            //                       crossAxisAlignment: CrossAxisAlignment.start,
            //                       mainAxisAlignment: MainAxisAlignment.center,
            //                       children: [LocaleKeys.generalHealth.tr().toText16(isBold: true), LocaleKeys.relatedToBMICalories.tr().toText12(isBold: true, color: Color(0xFF8F9AA3))],
            //                     ),
            //                   ),
            //                   SizedBox(
            //                     width: 12.w,
            //                   ),
            //                   Transform.flip(
            //                       flipX: getIt.get<AppState>().isArabic(),
            //                       child: Utils.buildSvgWithAssets(icon: AppAssets.arrowRight, width: 24.w, height: 24.h, fit: BoxFit.contain, iconColor: AppColors.textColor)),
            //                 ],
            //               ).paddingAll(16.w))
            //           .onPress(() {
            //         dialogService.showFamilyBottomSheetWithoutHWithChild(
            //           label: LocaleKeys.selectCalculator.tr(),
            //           message: "",
            //           child: showCalculatorsItems(type: HealthCalculatorEnum.general),
            //           onOkPressed: () {},
            //         );
            //       }),
            //       SizedBox(height: 16.h),
            //       Container(
            //               decoration: RoundedRectangleBorder().toSmoothCornerDecoration(color: AppColors.whiteColor, borderRadius: 20.r),
            //               child: Row(
            //                 children: [
            //                   Utils.buildSvgWithAssets(icon: AppAssets.women_health, height: 40.h, width: 40.w, fit: BoxFit.none, applyThemeColor: false),
            //                   SizedBox(width: 12.w),
            //                   Flexible(
            //                     child: Column(
            //                       crossAxisAlignment: CrossAxisAlignment.start,
            //                       mainAxisAlignment: MainAxisAlignment.center,
            //                       children: [LocaleKeys.womensHealth.tr().toText16(isBold: true), LocaleKeys.relatedToPeriodsOvulation.tr().toText12(isBold: true, color: Color(0xFF8F9AA3))],
            //                     ),
            //                   ),
            //                   SizedBox(width: 12.w),
            //                   Transform.flip(
            //                       flipX: getIt.get<AppState>().isArabic(),
            //                       child: Utils.buildSvgWithAssets(icon: AppAssets.arrowRight, width: 24.w, height: 24.h, fit: BoxFit.contain, iconColor: AppColors.textColor)),
            //                 ],
            //               ).paddingAll(16.w))
            //           .onPress(() {
            //         dialogService.showFamilyBottomSheetWithoutHWithChild(
            //           label: LocaleKeys.selectCalculator.tr(),
            //           message: "",
            //           child: showCalculatorsItems(type: HealthCalculatorEnum.women),
            //           onOkPressed: () {},
            //         );
            //       }),
            //     ],
            //   ).paddingSymmetrical(20.w, 24.h)
            : Column(
                children: [
                  Container(
                          decoration: RoundedRectangleBorder().toSmoothCornerDecoration(color: AppColors.whiteColor, borderRadius: 20.r),
                          child: Row(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              Utils.buildSvgWithAssets(
                                  icon: AppAssets.bloodSugar, height: 40.h, width: 40.w, fit: BoxFit.none, applyThemeColor: false),
                              SizedBox(width: 12.w),
                              Flexible(
                                child: Column(
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  mainAxisAlignment: MainAxisAlignment.center,
                                  children: [
                                    LocaleKeys.bloodSugar.tr(context: context).toText16(isBold: true),
                                    LocaleKeys.trackYourGlucoseLevels.tr(context: context).toText12(
                                          isBold: true,
                                          color: Color(0xFF8F9AA3),
                                        )
                                  ],
                                ),
                              ),
                              SizedBox(
                                width: 12.w,
                              ),
                              Transform.flip(
                                flipX: getIt.get<AppState>().isArabic(),
                                child: Utils.buildSvgWithAssets(
                                    icon: AppAssets.arrowRight, width: 24.w, height: 24.h, fit: BoxFit.contain, iconColor: AppColors.textColor),
                              ),
                            ],
                          ).paddingAll(16.w))
                      .onPress(() {
                    Navigator.of(context).push(
                      CustomPageRoute(
                        page: HealthCalculatorDetailedPage(calculatorType: HealthCalculatorsTypeEnum.bloodSugar),
                      ),
                    );
                  }),
                  SizedBox(height: 16.h),
                  Container(
                          decoration: RoundedRectangleBorder().toSmoothCornerDecoration(color: AppColors.whiteColor, borderRadius: 20.r),
                          child: Row(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              Utils.buildSvgWithAssets(
                                  icon: AppAssets.bloodCholestrol, height: 40.h, width: 40.w, fit: BoxFit.none, applyThemeColor: false),
                              SizedBox(width: 12.w),
                              Flexible(
                                child: Column(
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  mainAxisAlignment: MainAxisAlignment.center,
                                  children: [
                                    LocaleKeys.bloodCholesterol.tr(context: context).toText16(isBold: true),
                                    LocaleKeys.monitorCholesterolLevels.tr(context: context).toText12(isBold: true, color: Color(0xFF8F9AA3))
                                  ],
                                ),
                              ),
                              SizedBox(width: 12.w),
                              Transform.flip(
                                flipX: getIt.get<AppState>().isArabic(),
                                child: Utils.buildSvgWithAssets(
                                    icon: AppAssets.arrowRight, width: 24.w, height: 24.h, fit: BoxFit.contain, iconColor: AppColors.textColor),
                              ),
                            ],
                          ).paddingAll(16.w))
                      .onPress(() {
                    Navigator.of(context).push(
                      CustomPageRoute(
                        page: HealthCalculatorDetailedPage(calculatorType: HealthCalculatorsTypeEnum.bloodCholesterol),
                      ),
                    );
                  }),
                  SizedBox(height: 16.h),
                  Container(
                          decoration: RoundedRectangleBorder().toSmoothCornerDecoration(color: AppColors.whiteColor, borderRadius: 20.r),
                          child: Row(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              Utils.buildSvgWithAssets(
                                  icon: AppAssets.triglycerides, height: 40.h, width: 40.w, fit: BoxFit.none, applyThemeColor: false),
                              SizedBox(width: 12.w),
                              Flexible(
                                child: Column(
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  mainAxisAlignment: MainAxisAlignment.center,
                                  children: [
                                    LocaleKeys.triglyceridesFatBlood.tr(context: context).toText16(isBold: true),
                                    LocaleKeys.understandTriglyceridesImpact.tr(context: context).toText12(isBold: true, color: Color(0xFF8F9AA3))
                                  ],
                                ),
                              ),
                              SizedBox(width: 12.w),
                              Transform.flip(
                                flipX: getIt.get<AppState>().isArabic(),
                                child: Utils.buildSvgWithAssets(
                                    icon: AppAssets.arrowRight, width: 24.w, height: 24.h, fit: BoxFit.contain, iconColor: AppColors.textColor),
                              ),
                            ],
                          ).paddingAll(16.w))
                      .onPress(() {
                    Navigator.of(context).push(
                      CustomPageRoute(
                        page: HealthCalculatorDetailedPage(calculatorType: HealthCalculatorsTypeEnum.triglycerides),
                      ),
                    );
                  }),
                ],
              ).paddingSymmetrical(20.w, 24.h));
  }

  Widget showCalculatorsItems({required HealthCalculatorEnum type}) {
    return ListView.separated(
        physics: NeverScrollableScrollPhysics(),
        shrinkWrap: true,
        itemCount: type == HealthCalculatorEnum.general ? generalHealthServices.length : womenHealthServices.length,
        padding: EdgeInsets.zero,
        itemBuilder: (BuildContext context, int index) {
          return HealthCard(
            icon: type == HealthCalculatorEnum.general ? generalHealthServices[index].icon : womenHealthServices[index].icon,
            labelText: type == HealthCalculatorEnum.general ? generalHealthServices[index].title : womenHealthServices[index].title,
            subtitle: type == HealthCalculatorEnum.general ? generalHealthServices[index].subTitle ?? "" : womenHealthServices[index].subTitle ?? "",
            iconColor: type == HealthCalculatorEnum.general ? generalHealthServices[index].iconColor : womenHealthServices[index].iconColor,
            iconBgColor: type == HealthCalculatorEnum.general ? generalHealthServices[index].bgColor : womenHealthServices[index].bgColor,
            onTap: () {
              Navigator.of(context).push(
                CustomPageRoute(
                  page: HealthCalculatorDetailedPage(
                    calculatorType: type == HealthCalculatorEnum.general ? generalHealthServices[index].type : womenHealthServices[index].type,
                    clinicID: type == HealthCalculatorEnum.general ? generalHealthServices[index].clinicID : womenHealthServices[index].clinicID,
                    calculationID:
                        type == HealthCalculatorEnum.general ? generalHealthServices[index].calculationID : womenHealthServices[index].calculationID,
                  ),
                ),
              );
            },
          );
        },
        separatorBuilder: (BuildContext context, int index) {
          return SizedBox(height: 16.h);
        });
  }

  final List<HealthComponentModel> generalHealthServices = [
    HealthComponentModel(
        title: LocaleKeys.bmiCalculator.tr(),
        subTitle: LocaleKeys.bmiCalculatorDesc.tr(),
        icon: AppAssets.bmicalc,
        type: HealthCalculatorsTypeEnum.bmi,
        clinicID: 108,
        bgColor: AppColors.bmiCalculatorColor,
        calculationID: null),
    HealthComponentModel(
        title: LocaleKeys.caloriesCalculator.tr(),
        subTitle: LocaleKeys.caloriesCalculatorDesc.tr(),
        icon: AppAssets.bmicalc,
        type: HealthCalculatorsTypeEnum.calories,
        clinicID: null,
        bgColor: AppColors.caloriesCalculatorColor,
        calculationID: 2),
    HealthComponentModel(
        title: LocaleKeys.bmrCalculator.tr(),
        subTitle: LocaleKeys.bmrCalculatorDesc.tr(),
        icon: AppAssets.bmrcalc,
        type: HealthCalculatorsTypeEnum.bmr,
        clinicID: null,
        bgColor: AppColors.bmrCalculatorColor,
        calculationID: 3),
    HealthComponentModel(
        title: LocaleKeys.idealBodyWeight.tr(),
        subTitle: LocaleKeys.idealBodyWeightDesc.tr(),
        icon: AppAssets.idealbodyweightcacl,
        type: HealthCalculatorsTypeEnum.idealBodyWeight,
        bgColor: AppColors.idealBodyWeightColor,
        clinicID: null,
        calculationID: 4),
    HealthComponentModel(
        title: LocaleKeys.bodyFatCalculator.tr(),
        subTitle: LocaleKeys.bodyFatCalculatorDesc.tr(),
        icon: AppAssets.bodyfatcalc,
        type: HealthCalculatorsTypeEnum.bodyFat,
        clinicID: null,
        bgColor: AppColors.bodyFatCalculatorColor,
        calculationID: 5),
    HealthComponentModel(
        title: LocaleKeys.carbsProteinFat.tr(),
        subTitle: LocaleKeys.carbsProteinFatDesc.tr(),
        icon: AppAssets.bmicalc,
        type: HealthCalculatorsTypeEnum.crabsProteinFat,
        clinicID: null,
        bgColor: AppColors.carbsProteinFatColor,
        calculationID: 11),
  ];

  final List<HealthComponentModel> womenHealthServices = [
    HealthComponentModel(
        title: LocaleKeys.ovulationPeriod.tr(),
        subTitle: LocaleKeys.ovulationPeriodDesc.tr(),
        icon: AppAssets.ovluationperiod,
        type: HealthCalculatorsTypeEnum.ovulation,
        clinicID: null,
        calculationID: 6,
        bgColor: AppColors.ovulationPeriodColor),
    HealthComponentModel(
        title: LocaleKeys.deliveryDueDate.tr(),
        subTitle: LocaleKeys.deliveryDueDateDesc.tr(),
        icon: AppAssets.duedatecalc,
        type: HealthCalculatorsTypeEnum.deliveryDueDate,
        clinicID: null,
        bgColor: AppColors.deliveryDueDateColor,
        calculationID: 6),
  ];
}

class HealthComponentModel {
  String title;
  String? subTitle;
  String icon;
  Color? iconColor;
  Color? bgColor;
  Color? textColor;
  HealthCalculatorsTypeEnum type;
  int? clinicID;
  int? calculationID;

  HealthComponentModel(
      {required this.title,
      this.subTitle,
      required this.icon,
      this.iconColor,
      this.bgColor,
      this.textColor,
      required this.type,
      this.clinicID,
      this.calculationID});
}
