import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:hexcolor/hexcolor.dart';
import 'package:hmg_nurses/classes/colors.dart';
import 'package:hmg_nurses/classes/enums.dart';
import 'package:hmg_nurses/classes/size_config.dart';
import 'package:hmg_nurses/extensions/string_extensions.dart';
import 'package:hmg_nurses/extensions/util_extensions.dart';
import 'package:hmg_nurses/extensions/widget_extensions.dart';
import 'package:hmg_nurses/generated/locale_keys.g.dart';
import 'package:hmg_nurses/ui/login/login_vm.dart';
import 'package:hmg_nurses/ui/login/widgets/verification_method_card.dart';
import 'package:hmg_nurses/widgets/button/default_button.dart';
import 'package:provider/provider.dart';
import 'package:sizer/sizer.dart';

// WhatsApp 2
// SMS 1
// Face ID 3
// Finger Print 4

class LoginMethodsPage extends StatefulWidget {
  const LoginMethodsPage({Key? key}) : super(key: key);

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

class LoginMethodsPageState extends State<LoginMethodsPage> {
  bool isMoreOption = false;
  bool onlySMSBox = false;
  late AuthMethodTypes fingerPrintBefore;
  late AuthMethodTypes selectedOption;
  late LoginViewModel loginViewModel;

  @override
  Widget build(BuildContext context) {
    loginViewModel = context.read<LoginViewModel>();
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.transparent,
        leading: IconButton(
          icon: const Icon(Icons.arrow_back_ios, color: MyColors.darkIconColor),
          onPressed: () => Navigator.pop(context),
        ),
        // actions: [Center(child: "Employee Digital ID".toText12(color: MyColors.textMixColor, isUnderLine: true).onPress(() {})), 21.width],
      ),
      body: SingleChildScrollView(
        child: Center(
          child: FractionallySizedBox(
            widthFactor: 0.9,
            child: SingleChildScrollView(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  SizedBox(height: 1.h),
                  if (loginViewModel.isFromLogin)
                    InkWell(
                        onTap: () {
                          loginViewModel.setUnverified(false, isFromLogin: false);
                          loginViewModel.setAppStatus(APPSTATUS.unAuthenticated);
                        },
                        child: const Icon(Icons.arrow_back_ios, color: MyColors.darkTextColor)),
                  Column(
                    children: <Widget>[
                      SizedBox(height: 1.h),

                      isMoreOption != null && isMoreOption == false
                          ? Column(
                              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: <Widget>[
                                LocaleKeys.welcomeBack.tr().toText12(),
                                SizedBox(height: 1.h),
                                "Faiz Hashmi".toText24(isBold: true),
                                SizedBox(height: 3.h),
                                LocaleKeys.wouldYouLikeToLoginWithCurrentUsername.tr().toText18(),
                                SizedBox(height: 3.h),
                                Container(
                                  padding: const EdgeInsets.all(12),
                                  decoration: BoxDecoration(
                                    color: Colors.white,
                                    borderRadius: const BorderRadius.all(Radius.circular(10)),
                                    border: Border.all(color: HexColor('#707070'), width: 0.1),
                                  ),
                                  child: Row(
                                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                    crossAxisAlignment: CrossAxisAlignment.start,
                                    children: <Widget>[
                                      Column(
                                        mainAxisAlignment: MainAxisAlignment.start,
                                        crossAxisAlignment: CrossAxisAlignment.start,
                                        children: [
                                          Text(
                                            LocaleKeys.lastLoginDetails.tr(),
                                            overflow: TextOverflow.ellipsis,
                                            style: TextStyle(
                                                fontFamily: 'Poppins',
                                                fontSize: SizeConfig.getTextMultiplierBasedOnWidth() * 4.8,
                                                color: Color(0xFF2E303A),
                                                fontWeight: FontWeight.w600,
                                                letterSpacing: -0.4),
                                          ),
                                          Container(
                                            width: MediaQuery.of(context).size.width * 0.55,
                                            child: RichText(
                                              text: TextSpan(
                                                  text: "${LocaleKeys.verificationType.tr()} ",
                                                  style: TextStyle(
                                                      color: const Color(0xFF575757),
                                                      fontSize: SizeConfig.getTextMultiplierBasedOnWidth() * 3.5,
                                                      fontFamily: 'Poppins',
                                                      fontWeight: FontWeight.w600,
                                                      letterSpacing: -0.4),
                                                  children: <TextSpan>[
                                                    TextSpan(
                                                      text: loginViewModel.getType(1),
                                                      style: TextStyle(
                                                          color: MyColors.darkTextColor,
                                                          fontSize: SizeConfig.getTextMultiplierBasedOnWidth() * 3.5,
                                                          fontFamily: 'Poppins',
                                                          fontWeight: FontWeight.w600,
                                                          letterSpacing: -0.48),
                                                    )
                                                  ]),
                                            ),
                                          ),
                                        ],
                                      ),
                                      Column(
                                        mainAxisAlignment: MainAxisAlignment.start,
                                        crossAxisAlignment: CrossAxisAlignment.end,
                                        children: [
                                          Text(
                                            "12 NOV, 2022",
                                            overflow: TextOverflow.ellipsis,
                                            style: TextStyle(
                                                fontFamily: 'Poppins',
                                                fontSize: SizeConfig.getTextMultiplierBasedOnWidth() * 4.2,
                                                color: Color(0xFF2E303A),
                                                fontWeight: FontWeight.bold,
                                                letterSpacing: -0.4),
                                          ),

                                          Text(
                                            "09:56 AM",
                                            overflow: TextOverflow.ellipsis,
                                            style: TextStyle(
                                                fontFamily: 'Poppins',
                                                fontSize: SizeConfig.getTextMultiplierBasedOnWidth() * 3.5,
                                                color: Color(0xFF2E303A),
                                                fontWeight: FontWeight.w600,
                                                letterSpacing: -0.4),
                                          ),
                                          // AppText(
                                          //   loginViewModel.user.editedOn != null
                                          //       ? AppDateUtils.getDayMonthYearDateFormatted(AppDateUtils.convertStringToDate(loginViewModel.user.editedOn), isMonthShort: true)
                                          //       : loginViewModel.user.createdOn != null
                                          //           ? AppDateUtils.getDayMonthYearDateFormatted(AppDateUtils.convertStringToDate(loginViewModel.user.createdOn), isMonthShort: true)
                                          //           : '--',
                                          //   textAlign: TextAlign.right,
                                          //   fontSize: SizeConfig.getTextMultiplierBasedOnWidth() * 4.5,
                                          //   color: Color(0xFF2E303A),
                                          //   fontWeight: FontWeight.w700,
                                          //   letterSpacing: -0.48,
                                          // ),
                                          // AppText(
                                          //   loginViewModel.user.editedOn != null
                                          //       ? AppDateUtils.getHour(AppDateUtils.convertStringToDate(loginViewModel.user.editedOn))
                                          //       : loginViewModel.user.createdOn != null
                                          //           ? AppDateUtils.getHour(AppDateUtils.convertStringToDate(loginViewModel.user.createdOn))
                                          //           : '--',
                                          //   textAlign: TextAlign.right,
                                          //   fontSize: SizeConfig.getTextMultiplierBasedOnWidth() * 3.5,
                                          //   fontWeight: FontWeight.w600,
                                          //   letterSpacing: -0.48,
                                          //   color: Color(0xFF575757),
                                          // )
                                        ],
                                      )
                                    ],
                                  ),
                                ),
                                SizedBox(height: SizeConfig.heightMultiplier! * 3),
                                Row(
                                  children: [
                                    //todo add translation
                                    LocaleKeys.pleaseVerify.tr().toText18().paddingOnly(left: 8),
                                  ],
                                ),
                                SizedBox(
                                  height: SizeConfig.heightMultiplier! * 2,
                                ),
                              ],
                            )
                          : Column(mainAxisAlignment: MainAxisAlignment.spaceEvenly, crossAxisAlignment: CrossAxisAlignment.start, children: <Widget>[
                              onlySMSBox == true
                                  ? Container(
                                      margin: const EdgeInsets.only(bottom: 20, top: 30),
                                      child: LocaleKeys.pleaseVerify.tr().toText16(),
                                    )
                                  : LocaleKeys.pleaseVerify.tr().toText16(),
                            ]),
                      isMoreOption != null && isMoreOption == false
                          ? Column(mainAxisAlignment: MainAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start, children: <Widget>[
                              Row(mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[
                                Expanded(
                                  child: VerificationMethodsList(
                                    loginViewModel: loginViewModel,
                                    authMethodType: SelectedAuthMethodTypesService.getMethodsTypeService(1),
                                    authenticateUser: (AuthMethodTypes authMethodType, isActive) {
                                      loginViewModel.startSMSService(authMethodType, context: context);
                                    },
                                  ),
                                ),
                                Expanded(
                                    child: VerificationMethodsList(
                                  loginViewModel: loginViewModel,
                                  authMethodType: AuthMethodTypes.moreOptions,
                                  onShowMore: () {
                                    setState(() {
                                      isMoreOption = true;
                                    });
                                  },
                                ))
                              ]),
                            ])
                          : Column(mainAxisAlignment: MainAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start, children: <Widget>[
                              onlySMSBox == false
                                  ? Row(
                                      mainAxisAlignment: MainAxisAlignment.center,
                                      children: <Widget>[
                                        Expanded(
                                            child: VerificationMethodsList(
                                          loginViewModel: loginViewModel,
                                          authMethodType: AuthMethodTypes.fingerPrint,
                                          authenticateUser: (AuthMethodTypes authMethodType, isActive) {
                                            loginViewModel.startSMSService(authMethodType, context: context);
                                          },
                                        )),
                                        Expanded(
                                            child: VerificationMethodsList(
                                          loginViewModel: loginViewModel,
                                          authMethodType: AuthMethodTypes.faceID,
                                          authenticateUser: (AuthMethodTypes authMethodType, isActive) {
                                            loginViewModel.startSMSService(authMethodType, context: context);
                                          },
                                        ))
                                      ],
                                    )
                                  : const SizedBox(),
                              Row(
                                mainAxisAlignment: MainAxisAlignment.center,
                                children: <Widget>[
                                  Expanded(
                                      child: VerificationMethodsList(
                                    loginViewModel: loginViewModel,
                                    authMethodType: AuthMethodTypes.sms,
                                    authenticateUser: (AuthMethodTypes authMethodType, isActive) {
                                      loginViewModel.startSMSService(authMethodType, context: context);
                                    },
                                  )),
                                  Expanded(
                                      child: VerificationMethodsList(
                                    loginViewModel: loginViewModel,
                                    authMethodType: AuthMethodTypes.whatsApp,
                                    authenticateUser: (AuthMethodTypes authMethodType, isActive) {
                                      loginViewModel.startSMSService(authMethodType, context: context);
                                    },
                                  ))
                                ],
                              ),
                            ]),

                      // )
                    ],
                  ),
                ],
              ),
            ),
          ),
        ),
      ),
      bottomSheet: !isMoreOption
          ? null
          : Container(
              height: 10.h,
              color: MyColors.backgroundColor,
              width: double.infinity,
              child: Center(
                child: FractionallySizedBox(
                  widthFactor: 0.9,
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.end,
                    children: <Widget>[
                      Padding(
                        padding: EdgeInsets.symmetric(horizontal: 4.w),
                        child: DefaultButton(LocaleKeys.useAnotherAccount.tr(), () {}, colors: const [MyColors.redColor, MyColors.redColor]),
                      ),
                      SizedBox(height: 3.h)
                    ],
                  ),
                ),
              ),
            ),
    );
  }
}
