import 'dart:async';

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/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/models/resp_models/patient_appointment_history_response_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/theme/colors.dart';
import 'package:hmg_patient_app_new/widgets/buttons/custom_button.dart';
import 'package:hmg_patient_app_new/widgets/shimmer/movies_shimmer_widget.dart';
import 'package:provider/provider.dart';
import 'package:smooth_corner/smooth_corner.dart';

class AppointmentPaymentPage extends StatefulWidget {
  AppointmentPaymentPage({super.key, required this.patientAppointmentHistoryResponseModel});

  PatientAppointmentHistoryResponseModel patientAppointmentHistoryResponseModel;

  @override
  State<AppointmentPaymentPage> createState() => _AppointmentPaymentPageState();
}

class _AppointmentPaymentPageState extends State<AppointmentPaymentPage> {
  late MyAppointmentsViewModel myAppointmentsViewModel;

  @override
  void initState() {
    scheduleMicrotask(() {
      myAppointmentsViewModel.getPatientShareAppointment(
        widget.patientAppointmentHistoryResponseModel.projectID,
        widget.patientAppointmentHistoryResponseModel.clinicID,
        widget.patientAppointmentHistoryResponseModel.appointmentNo.toString(),
      );
    });
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    myAppointmentsViewModel = Provider.of<MyAppointmentsViewModel>(context);
    return Scaffold(
      backgroundColor: AppColors.bgScaffoldColor,
      appBar: AppBar(
        title: "Appointment Payment".needTranslation.toText18(),
        backgroundColor: AppColors.bgScaffoldColor,
      ),
      body: Consumer<MyAppointmentsViewModel>(builder: (context, myAppointmentsVM, child) {
        return myAppointmentsVM.isAppointmentPatientShareLoading
            ? const MoviesShimmerWidget().paddingAll(24.h)
            : Column(
                children: [
                  Expanded(
                    child: SingleChildScrollView(
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          "Appointment Payment".needTranslation.toText24(isBold: true).paddingSymmetrical(24.h, 0.h),
                          SizedBox(height: 24.h),
                          Container(
                            decoration: RoundedRectangleBorder().toSmoothCornerDecoration(
                              color: AppColors.whiteColor,
                              borderRadius: 20.h,
                              hasShadow: false,
                            ),
                            child: Row(
                              mainAxisSize: MainAxisSize.max,
                              children: [
                                Column(
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: [
                                    Image.asset(AppAssets.mada, width: 72.h, height: 25.h),
                                    SizedBox(height: 16.h),
                                    "Mada".needTranslation.toText16(isBold: true),
                                  ],
                                ),
                                SizedBox(width: 8.h),
                                const Spacer(),
                                Utils.buildSvgWithAssets(
                                  icon: AppAssets.forward_arrow_icon,
                                  iconColor: AppColors.blackColor,
                                  width: 18.h,
                                  height: 13.h,
                                  fit: BoxFit.contain,
                                ),
                              ],
                            ).paddingSymmetrical(16.h, 16.h),
                          ).paddingSymmetrical(24.h, 0.h),
                          SizedBox(height: 16.h),
                          Container(
                            decoration: RoundedRectangleBorder().toSmoothCornerDecoration(
                              color: AppColors.whiteColor,
                              borderRadius: 20.h,
                              hasShadow: false,
                            ),
                            child: Row(
                              mainAxisSize: MainAxisSize.max,
                              children: [
                                Column(
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: [
                                    Row(
                                      children: [
                                        Image.asset(AppAssets.visa, width: 50.h, height: 50.h),
                                        SizedBox(width: 8.h),
                                        Image.asset(AppAssets.Mastercard, width: 40.h, height: 40.h),
                                      ],
                                    ),
                                    SizedBox(height: 16.h),
                                    "Visa or Mastercard".needTranslation.toText16(isBold: true),
                                  ],
                                ),
                                SizedBox(width: 8.h),
                                const Spacer(),
                                Utils.buildSvgWithAssets(
                                  icon: AppAssets.forward_arrow_icon,
                                  iconColor: AppColors.blackColor,
                                  width: 18.h,
                                  height: 13.h,
                                  fit: BoxFit.contain,
                                ),
                              ],
                            ).paddingSymmetrical(16.h, 16.h),
                          ).paddingSymmetrical(24.h, 0.h),
                          SizedBox(height: 16.h),
                          Container(
                            decoration: RoundedRectangleBorder().toSmoothCornerDecoration(
                              color: AppColors.whiteColor,
                              borderRadius: 20.h,
                              hasShadow: false,
                            ),
                            child: Row(
                              mainAxisSize: MainAxisSize.max,
                              children: [
                                Column(
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: [
                                    Image.asset(AppAssets.tamara_en, width: 72.h, height: 25.h),
                                    SizedBox(height: 16.h),
                                    "Tamara".needTranslation.toText16(isBold: true),
                                  ],
                                ),
                                SizedBox(width: 8.h),
                                const Spacer(),
                                Utils.buildSvgWithAssets(
                                  icon: AppAssets.forward_arrow_icon,
                                  iconColor: AppColors.blackColor,
                                  width: 18.h,
                                  height: 13.h,
                                  fit: BoxFit.contain,
                                ),
                              ],
                            ).paddingSymmetrical(16.h, 16.h),
                          ).paddingSymmetrical(24.h, 0.h),
                        ],
                      ),
                    ),
                  ),
                  Container(
                    // height: 200.h,
                    // width: double.infinity,
                    decoration: RoundedRectangleBorder().toSmoothCornerDecoration(
                      color: AppColors.whiteColor,
                      borderRadius: 24.h,
                      hasShadow: false,
                    ),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        (myAppointmentsVM.patientAppointmentShareResponseModel!.isCash ?? true)
                            ? Container(
                                height: 50.h,
                                decoration: ShapeDecoration(
                                  color: AppColors.secondaryLightRedBorderColor,
                                  shape: SmoothRectangleBorder(
                                    borderRadius: BorderRadius.only(topLeft: Radius.circular(24), topRight: Radius.circular(24)),
                                    smoothness: 1,
                                  ),
                                ),
                                child: Row(
                                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                  children: [
                                    "Insurance expired or inactive".needTranslation.toText14(color: AppColors.primaryRedColor, weight: FontWeight.w500).paddingSymmetrical(24.h, 0.h),
                                    CustomButton(
                                      text: LocaleKeys.updateInsurance.tr(context: context),
                                      onPressed: () {},
                                      backgroundColor: AppColors.primaryRedColor,
                                      borderColor: AppColors.secondaryLightRedBorderColor,
                                      textColor: AppColors.whiteColor,
                                      fontSize: 10,
                                      fontWeight: FontWeight.w500,
                                      borderRadius: 8,
                                      padding: EdgeInsets.fromLTRB(15, 0, 15, 0),
                                      height: 30.h,
                                    ).paddingSymmetrical(24.h, 0.h),
                                  ],
                                ),
                              )
                            : const SizedBox(),
                        SizedBox(height: 24.h),
                        "Total amount to pay".needTranslation.toText18(isBold: true).paddingSymmetrical(24.h, 0.h),
                        SizedBox(height: 17.h),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            "Total amount to pay".needTranslation.toText14(isBold: true),
                            Utils.getPaymentAmountWithSymbol(myAppointmentsVM.patientAppointmentShareResponseModel!.patientShare!.toString().toText16(isBold: true), AppColors.blackColor, 13,
                                isSaudiCurrency: true),
                          ],
                        ).paddingSymmetrical(24.h, 0.h),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            "VAT 15%".needTranslation.toText14(isBold: true, color: AppColors.greyTextColor),
                            Utils.getPaymentAmountWithSymbol(
                                myAppointmentsVM.patientAppointmentShareResponseModel!.patientTaxAmount!.toString().toText14(isBold: true, color: AppColors.greyTextColor), AppColors.greyTextColor, 13,
                                isSaudiCurrency: true),
                          ],
                        ).paddingSymmetrical(24.h, 0.h),
                        SizedBox(height: 17.h),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            "".needTranslation.toText14(isBold: true),
                            Utils.getPaymentAmountWithSymbol(myAppointmentsVM.patientAppointmentShareResponseModel!.patientShareWithTax!.toString().toText24(isBold: true), AppColors.blackColor, 17,
                                isSaudiCurrency: true),
                          ],
                        ).paddingSymmetrical(24.h, 0.h),
                        Utils.buildSvgWithAssets(
                          icon: AppAssets.apple_pay_button,
                          width: 200.h,
                          height: 80.h,
                          fit: BoxFit.contain,
                        ).paddingSymmetrical(24.h, 0.h),
                        SizedBox(height: 12.h),
                      ],
                    ),
                  ),
                ],
              );
      }),
    );
  }
}