import 'dart:async';

import 'package:mc_common_app/models/user/country.dart';
import 'package:mc_common_app/theme/colors.dart';
import 'package:mc_common_app/config/routes.dart';
import 'package:mc_common_app/extensions/int_extensions.dart';
import 'package:mc_common_app/extensions/string_extensions.dart';
import 'package:mc_common_app/generated/locale_keys.g.dart';
import 'package:mc_common_app/utils/navigator.dart';
import 'package:mc_common_app/view_models/user_view_model.dart';
import 'package:mc_common_app/widgets/common_widgets/app_bar.dart';
import 'package:mc_common_app/widgets/dropdown/dropdow_field.dart';
import 'package:mc_common_app/widgets/button/show_fill_button.dart';
import 'package:mc_common_app/widgets/tab/login_email_tab.dart';
import 'package:mc_common_app/widgets/txt_field.dart';
import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

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

  @override
  State<LoginWithPassword> createState() => _LoginWithPasswordState();
}

class _LoginWithPasswordState extends State<LoginWithPassword> {
  int otpType = 1;

  ClassType type = ClassType.EMAIL;
  String phoneNum = "", password = "";
  String email = "";
  String countryCode = "";
  Country? _country;

  late UserVM userVM;

  @override
  void initState() {
    super.initState();

    scheduleMicrotask(() {
      userVM = Provider.of(context, listen: false);
      getCountryList();
    });
  }

  getCountryList() async {
    _country = await userVM.getAllCountries();
    setState(() {});
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: CustomAppBar( isRemoveBackButton: true, title: ""),
      body: Container(
        width: double.infinity,
        height: double.infinity,
        padding: const EdgeInsets.all(20),
        child: SingleChildScrollView(
          child: Column(
            children: [
              12.height,
              LocaleKeys.login.tr().toText(fontSize: 20, letterSpacing: -1.44,),
              // 20.height,
              // (type == ClassType.NUMBER ? LocaleKeys.enterPhoneNumber.tr() : LocaleKeys.enterEmail.tr()).toText14(
              //   color: MyColors.lightTextColor,
              //   textAlign: TextAlign.center,
              // ),
              30.height,
              LoginEmailTab(
                onSelection: (ClassType type) {
                  setState(() {
                    this.type = type;
                  });
                },
              ),
              10.height,
              Column(
                children: [
                  if (type == ClassType.NUMBER) getCountry(context),
                  10.height,
                  TxtField(
                    hint: type == ClassType.NUMBER ? LocaleKeys.enterPhoneNumber.tr() : LocaleKeys.enterEmail.tr(),
                    value: phoneNum,
                    isSidePaddingZero: true,
                    onChanged: (v) {
                      phoneNum = v;
                    },
                  ),
                  10.height,
                  TxtField(
                    hint: LocaleKeys.EnterPass.tr(),
                    value: password,
                    isPasswordEnabled: true,
                    isSidePaddingZero: true,
                    maxLines: 1,
                    onChanged: (v) {
                      password = v;
                    },
                  ),
                ],
              ),
              20.height,
              LocaleKeys.forgetPasswordQ.tr().toText(
                    color: MyColors.textColor,
                    fontSize: 14,
                height: 23 / 24,
                    letterSpacing: -0.48,
                  ),
              ShowFillButton(
                title: LocaleKeys.recover.tr(),
                isFlatButton: true,
                isBold: false,
                fontSize: 14,
                maxHeight: 24,
                txtColor: MyColors.darkPrimaryColor,
                onPressed: () {
                  navigateWithName(context, AppRoutes.forgetPassword);
                },
              ),
              30.height,
              ShowFillButton(
                title: LocaleKeys.continu.tr(),
                maxWidth: double.infinity,
                onPressed: () {
                  userVM.performBasicOtpLoginWithPasswordPage(context, type: type, countryCode: countryCode, phoneNum: phoneNum, password: password);
                },
              ),
              20.height,
            ],
          ),
        ),
      ),
    );
  }

  Widget getCountry(BuildContext context) {
    if (_country != null) {
      List<DropValue> dropList = [];
      _country!.data?.forEach((element) {
        dropList.add(DropValue(element.id ?? 0, (element.countryName ?? "") + " " + (element.countryCode ?? ""), element.countryCode ?? ""));
      });
      return DropdownField((DropValue value) {
        countryCode = value.subValue;
      }, list: dropList, hint: LocaleKeys.selectCountryCode.tr());
    } else {
      return const Center(
        child: CircularProgressIndicator(),
      );
    }
  }
}
