import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.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/utils/size_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/rate_appointment_clinic.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 RateAppointmentDoctor extends StatefulWidget {

  bool isFromRegistration;

  RateAppointmentDoctor({Key? key, this.isFromRegistration = false}) : super(key: key);

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

class _RateAppointmentDoctorState extends State<RateAppointmentDoctor> {
  final formKey = GlobalKey<FormState>();
  String note = "";
  int rating = 0;

  // ProjectViewModel? projectViewModel;
  AppointmentRatingViewModel? appointmentRatingViewModel;
  MyAppointmentsViewModel? myAppointmentsViewModel;

  @override
  void initState() {

    super.initState();
  }


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

    final sheetHeight = ResponsiveExtension.screenHeight * 0.60;

    return Selector<AppointmentRatingViewModel, bool>(
        selector: (_, vm) => vm.isRateClinic,
        builder: (context, isRateClinic, child) =>
            // isRateClinic ? RateAppointmentClinic(doctorNote: note,  doctorRate: rating,)
            //     :
            SizedBox(
              height: sheetHeight,
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    // Scrollable main 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: false,
                                    appointmentDetails: appointmentRatingViewModel!.appointmentDetails,
                                  )),

                              SizedBox(height: 16),

                              // Rating box
                              Container(
                                decoration: RoundedRectangleBorder().toSmoothCornerDecoration(
                                  color: AppColors.whiteColor,
                                  borderRadius: 24.r,
                                  hasShadow: false,
                                ),
                                width: double.infinity,
                                child: Padding(
                                  padding: const EdgeInsets.all(12.0),
                                  child: Column(
                                    crossAxisAlignment: CrossAxisAlignment.start,
                                    children: [
                                      LocaleKeys.rateTheDoctor.tr(context: context).toText16(isBold: true),
                                      SizedBox(height: 12),
                                      Row(
                                        mainAxisAlignment: MainAxisAlignment.center,
                                        children: <Widget>[
                                          ...List.generate(
                                            5,
                                            (index) => AnimatedSwitcher(
                                              duration: Duration(milliseconds: 1000),
                                              switchInCurve: Curves.elasticOut,
                                              switchOutCurve: Curves.elasticIn,
                                              transitionBuilder: (Widget child, Animation<double> animation) {
                                                return ScaleTransition(child: child, scale: animation);
                                              },
                                              child: Container(
                                                key: ValueKey<int>(rating),
                                                child: IconButton(
                                                    iconSize: 45.0,
                                                    onPressed: () {
                                                      setState(() {
                                                        rating = index + 1;
                                                      });
                                                    },
                                                    color: rating >= (index + 1)
                                                        ? Color.fromRGBO(255, 186, 0, 1.0)
                                                        : Colors.grey[400],
                                                    icon: Icon(rating >= (index + 1) ? Icons.star : Icons.star)),
                                              ),
                                            ),
                                          )
                                        ],
                                      ),
                                    ],
                                  ),
                                ),
                              ),

                              SizedBox(height: 12),

                              // Note text field
                              Container(
                                  decoration: RoundedRectangleBorder().toSmoothCornerDecoration(
                                    color: AppColors.whiteColor,
                                    borderRadius: 24.r,
                                    hasShadow: false,
                                  ),
                                  child: Padding(
                                      padding: EdgeInsets.all(16.0),
                                      child: TextField(
                                        maxLines: 4,
                                        // style: TextStyle(
                                        //   fontSize: 14.f,
                                        //   fontWeight: FontWeight.w400,
                                        //   color: Color(0xff2B353E),
                                        //   letterSpacing: 0,
                                        //   fontFamily: getIt.get<AppState>().getLanguageCode() == "ar" ? 'CairoArabic' : 'Poppins',
                                        // ),
                                        decoration: InputDecoration.collapsed(
                                            hintText: LocaleKeys.notes.tr(context: context),
                                            hintStyle: TextStyle(
                                              fontSize: 16.f,
                                              fontWeight: FontWeight.w600,
                                              letterSpacing: -0.4,
                                              fontFamily: getIt.get<AppState>().getLanguageCode() == "ar" ? 'CairoArabic' : 'Poppins',
                                            ),
                                         ),
                                        onChanged: (value) {
                                          setState(() {
                                            note = value;
                                          });
                                        },
                                      ))),


                            ],
                          ),
                        ),

                    ),
                    // Bottom action buttons pinned to bottom
                    SafeArea(
                      top: false,
                      child: Padding(
                        padding: const EdgeInsets.symmetric(vertical: 12.0),
                        child: Row(
                          children: [
                            Expanded(
                              child: CustomButton(
                                text: LocaleKeys.later.tr(context: context),
                                backgroundColor: Color(0xffFEE9EA),
                                borderColor: Color(0xffFEE9EA),
                                textColor: Color(0xffED1C2B),
                                onPressed: () {
                                  Navigator.pop(context);
                                },
                              ),
                            ),
                            SizedBox(width: 10),
                            Expanded(
                              child: CustomButton(
                                text: LocaleKeys.submitRating.tr(context: context),
                                onPressed: rating > 0
                                    ? () {
                                        LoaderBottomSheet.showLoader();
                                        appointmentRatingViewModel!.submitDoctorRating(docRate: rating, docNote: note).then((_) {
                                          LoaderBottomSheet.hideLoader();
                                          Navigator.pop(context);
                                        });
                                      }
                                    : null,
                              ),
                            ),
                          ],
                        ),
                      ),
                    ),
                  ],
                ),
              ));

    // DoctorList getDoctorObject(AppointmentRateViewModel model) {
    //   DoctorList doctor = new DoctorList();
    //
    //   doctor.name = model.appointmentDetails.doctorName;
    //   doctor.doctorImageURL = model.appointmentDetails.doctorImageURL;
    //   doctor.clinicName = model.appointmentDetails.clinicName;
    //   doctor.projectName = model.appointmentDetails.projectName;
    //   doctor.date = model.appointmentDetails.appointmentDate;
    //   doctor.actualDoctorRate = 5;
    //
    //   return doctor;
    // }
  }


}
