import 'dart:async';

import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.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/models/user_models/country.dart';
import 'package:mc_common_app/theme/colors.dart';
import 'package:mc_common_app/utils/navigator.dart';
import 'package:mc_common_app/utils/utils.dart';
import 'package:mc_common_app/view_models/user_view_model.dart';
import 'package:mc_common_app/widgets/button/show_fill_button.dart';
import 'package:mc_common_app/widgets/dropdown/dropdow_field.dart';
import 'package:mc_common_app/widgets/txt_field.dart';
import 'package:provider/provider.dart';

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

  @override
  State<AddPhoneNumWidget> createState() => _AddPhoneNumWidgetState();
}

class _AddPhoneNumWidgetState extends State<AddPhoneNumWidget> {
  String phoneNum = "", countryCode = "";
  late UserVM userVM;
  Country? _country;

  @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 Padding(
      padding: EdgeInsets.only(bottom: MediaQuery.of(context).viewInsets.bottom),
      child: Container(
        width: double.infinity,
        padding: const EdgeInsets.only(left: 16, right: 16, bottom: 16),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          mainAxisAlignment: MainAxisAlignment.start,
          mainAxisSize: MainAxisSize.min,
          children: [
            "Enter Phone Number".toText(fontSize: 16, isBold: true),
            8.height,
            getCountry(context),
            8.height,
            TxtField(
              keyboardType: TextInputType.phone,
              hint: "546758594",
              value: phoneNum,
              isSidePaddingZero: true,
              onChanged: (v) {
                phoneNum = v;
              },
            ),
            16.height,
            Row(
              children: [
                Expanded(
                  child: ShowFillButton(
                    title: "Cancel",
                    backgroundColor: MyColors.greyButtonColor,
                    txtColor: Colors.black,
                    onPressed: () {
                      pop(context);
                    },
                  ),
                ),
                12.width,
                Expanded(
                  child: ShowFillButton(
                    title: LocaleKeys.sendOTP.tr(),
                    onPressed: () {
                      //User Role: Dealer|Manager for a branch
                      FocusScope.of(context).unfocus();
                      if (validation()) {
                        userVM.performBasicOtpRegisterPage(context, countryCode: countryCode, phoneNum: phoneNum, role: 7, isNeedToPassToken: true, reloadPage: () {
                          pop(context);
                        });
                      }
                    },
                  ),
                ),
              ],
            )
          ],
        ),
      ),
    );
  }

  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: countryCode.isNotEmpty ? countryCode.toString() : LocaleKeys.selectCountryCode.tr(),
      );
    } else {
      return const Center(
        child: CircularProgressIndicator(),
      );
    }
  }

  bool validation() {
    bool isValid = true;
    if (countryCode.isEmpty) {
      Utils.showToast(LocaleKeys.selectCountryCode.tr());
      //("Please select Country Code");
      isValid = false;
    } else if (phoneNum.isEmpty) {
      Utils.showToast(LocaleKeys.addPhoneNo.tr());
      //("Please add Phone No");
      isValid = false;
    }
    return isValid;
  }
}
