import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.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/features/my_appointments/appointment_rating_view_model.dart';
import 'package:hmg_patient_app_new/features/my_appointments/my_appointments_view_model.dart';
import 'package:hmg_patient_app_new/generated/locale_keys.g.dart';
import 'package:hmg_patient_app_new/presentation/rate_appointment/widget/doctor_row.dart';
import 'package:hmg_patient_app_new/theme/colors.dart';
import 'package:hmg_patient_app_new/widgets/buttons/custom_button.dart';
import 'package:hmg_patient_app_new/widgets/loader/bottomsheet_loader.dart';
import 'package:provider/provider.dart';

class RateAppointmentClinic extends StatefulWidget {

 late final String? doctorNote;
  late final int? doctorRate;

  RateAppointmentClinic({this.doctorRate, this.doctorNote});

  @override
  _RateAppointmentClinicState createState() => _RateAppointmentClinicState();
}

class _RateAppointmentClinicState extends State<RateAppointmentClinic> {
  final formKey = GlobalKey<FormState>();
  String note = "";
  int rating = 5;
  AppointmentRatingViewModel? appointmentRatingViewModel;
  MyAppointmentsViewModel? myAppointmentsViewModel;

  @override
  Widget build(BuildContext context) {
    myAppointmentsViewModel = Provider.of<MyAppointmentsViewModel>(context, listen: false);
    appointmentRatingViewModel = Provider.of<AppointmentRatingViewModel>(context, listen: false);

    // Make the sheet a fixed height and keep content scrollable while pinning buttons to bottom
    final sheetHeight = ResponsiveExtension.screenHeight * 0.60;

    return SizedBox(
      height: sheetHeight,
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          // Scrollable content
          Expanded(
            child:  Padding(
                padding: const EdgeInsets.only(top: 0.0, left: 0, right: 0),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: <Widget>[
                    // Doctor row
                    Container(
                      decoration: RoundedRectangleBorder().toSmoothCornerDecoration(
                        color: AppColors.whiteColor,
                        borderRadius: 24.r,
                        hasShadow: false,
                      ),
                      child: BuildDoctorRow(
                        isForClinic: true,
                        appointmentDetails: appointmentRatingViewModel!.appointmentDetails,
                      ),
                    ),
                    SizedBox(height: 16),

                    // Rate clinic box
                    SizedBox(
                      width: double.infinity,
                      child: Container(
                        decoration: RoundedRectangleBorder().toSmoothCornerDecoration(
                          color: AppColors.whiteColor,
                          borderRadius: 24.r,
                          hasShadow: false,
                        ),
                        child: Padding(
                          padding: const EdgeInsets.all(12.0),
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                                LocaleKeys.rateClinic.tr(context: context).toText16(isBold: true),
                              SizedBox(height: 12),
                              Row(
                                mainAxisAlignment: MainAxisAlignment.center,
                                children: <Widget>[
                                  ...List.generate(
                                    5,
                                    (index) => rating == (index + 1)
                                        ? Container(
                                            margin: EdgeInsets.only(left: 3.0, right: 3.0),
                                            child: IconButton(
                                              onPressed: () {
                                                setState(() {
                                                  rating = index + 1;
                                                });
                                              },
                                              iconSize: 35,
                                              icon: Utils.buildSvgWithAssets(
                                                icon: 'assets/images/svg/rate_${index + 1}.svg',
                                                iconColor: getRatingColor(rating),
                                                width: 35,
                                                height: 35,
                                                applyThemeColor: false,
                                              ),
                                            ),
                                          )
                                        : IconButton(
                                            onPressed: () {
                                              setState(() {
                                                rating = index + 1;
                                              });
                                            },
                                            iconSize: 35,
                                            icon: Utils.buildSvgWithAssets(
                                              icon: 'assets/images/svg/rate_${index + 1}.svg',
                                              width: 35,
                                              height: 35,
                                              applyThemeColor: false,
                                            ),
                                          ),
                                  ),
                                ],
                              ),
                            ],
                          ),
                        ),
                      ),
                    ),

                    SizedBox(height: 12),

                    // Extra content area (keeps any other widgets that were previously below)
                    Container(
                      padding: EdgeInsets.symmetric(vertical: 20),
                      child: Row(
                        mainAxisSize: MainAxisSize.min,
                        children: [
                          // Placeholder for in-content widgets if needed in future
                        ],
                      ),
                    ),

                    // Add bottom spacing so last content isn't obscured by the fixed buttons
                    SizedBox(height: 12),
                  ],
                ),
              ),

          ),

          // Bottom action buttons pinned to bottom of the sheet
          SafeArea(
            top: false,
            child: Padding(
              padding: const EdgeInsets.symmetric( vertical: 12.0),
              child: Row(
                children: [
                  Expanded(
                    child: CustomButton(
                      text: LocaleKeys.back.tr(context: context),
                      backgroundColor: Color(0xffFEE9EA),
                      borderColor: Color(0xffFEE9EA),
                      textColor: Color(0xffED1C2B),
                      onPressed: () {
                        appointmentRatingViewModel!.setTitle(LocaleKeys.rateDoctor.tr(context: context));
                        appointmentRatingViewModel!.setSubTitle(LocaleKeys.howWasYourLastVisitWithDoctor.tr(context: context));
                        appointmentRatingViewModel!.setClinicOrDoctor(false);
                        setState(() {

                        });
                      },
                    ),
                  ),
                  SizedBox(width: 10),
                  Expanded(
                    child: CustomButton(
                      text: LocaleKeys.submit.tr(context: context),
                      onPressed: () {

                        submitRating();

                      },
                    ),
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }

  Color getRatingColor(int rating) {
    switch (rating) {
      case 5:
        return AppColors.bgGreenColor;
      case 4:
        return Colors.greenAccent;
      case 3:
        return AppColors.warningLightColor;
      case 2:
        return Colors.orange;
      case 1:
        return AppColors.primaryRedColor;
      default:
        return AppColors.greyColor;
    }
  }

  ColorFilter getColors(int rating){

    switch(rating){
      case 5:
      return  ColorFilter.mode(AppColors.bgGreenColor, BlendMode.srcIn);
      case 4:
        return  ColorFilter.mode(Colors.greenAccent, BlendMode.srcIn);
      case 3:
        return  ColorFilter.mode(AppColors.warningLightColor, BlendMode.srcIn);
      case 2:
        return  ColorFilter.mode(Colors.orange, BlendMode.srcIn);
      case 1:
        return  ColorFilter.mode(AppColors.primaryRedColor, BlendMode.srcIn);

      default:
        return ColorFilter.mode(AppColors.greyColor, BlendMode.srcIn);
    }
  }

  submitRating() async{
    LoaderBottomSheet.showLoader();
   await appointmentRatingViewModel!.submitDoctorRating(docRate: widget.doctorRate!, docNote: widget.doctorNote!);
   await  appointmentRatingViewModel!.submitClinicRating(clinicRate: rating, clinicNote: note);
    LoaderBottomSheet.hideLoader();
    Navigator.pop(context);
  }

}
