import 'package:car_customer_app/api/api_client.dart';
import 'package:car_customer_app/api/client/user_api_client.dart';
import 'package:car_customer_app/classes/utils.dart';
import 'package:car_customer_app/config/routes.dart';
import 'package:car_customer_app/models/user/basic_otp.dart';
import 'package:car_customer_app/models/user/country.dart';
import 'package:car_customer_app/models/user/register_user.dart';
import 'package:car_customer_app/models/user/role.dart';

import 'package:car_customer_app/utils/navigator.dart';
import 'package:car_customer_app/utils/utils.dart';
import 'package:car_customer_app/widgets/app_bar.dart';
import 'package:car_customer_app/widgets/dialog/dialogs.dart';
import 'package:car_customer_app/widgets/dialog/otp_dialog.dart';
import 'package:car_customer_app/widgets/dropdown/dropdow_field.dart';
import 'package:car_customer_app/widgets/show_fill_button.dart';
import 'package:car_customer_app/extensions/int_extensions.dart';
import 'package:car_customer_app/extensions/string_extensions.dart';
import 'package:car_customer_app/extensions/widget_extensions.dart';
import 'package:car_customer_app/widgets/txt_field.dart';
import 'package:flutter/material.dart';

class RegisterPage extends StatelessWidget {
  String phoneNum = "", countryCode = "";
  int role = 4, countryId = -1;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: appBar(title: "Sign Up"),
      body: Container(
        width: double.infinity,
        height: double.infinity,
        padding: EdgeInsets.all(40),
        child: Column(
          children: [
            "Enter Phone Number".toText24(),
            // 12.height,
            // FutureBuilder<Role>(
            //   future: UserApiClent().getRoles(),
            //   builder: (context, snapshot) {
            //     if (snapshot.hasData) {
            //       List<DropValue> dropList = [];
            //       snapshot.data?.data?.forEach((element) {
            //         dropList.add(new DropValue(element.id ?? 0, element.roleName ?? "", ""));
            //       });
            //       return DropdownField((DropValue value) {
            //         role = value.id;
            //       }, list: dropList, hint: "Chosse Role");
            //     } else {
            //       return CircularProgressIndicator();
            //     }
            //   },
            // ),
            12.height,
            FutureBuilder<Country>(
              future: UserApiClent().getAllCountries(),
              builder: (context, snapshot) {
                if (snapshot.hasData) {
                  List<DropValue> dropList = [];
                  snapshot.data?.data?.forEach((element) {
                    dropList.add(new DropValue(element.id ?? 0, (element.countryName ?? "") + " " + (element.countryCode ?? ""), element.countryCode ?? ""));
                  });
                  return DropdownField((DropValue value) {
                    countryCode = value.subValue;
                    countryId = value.id;
                  }, list: dropList, hint: "Select Country");
                } else {
                  return CircularProgressIndicator();
                }
              },
            ),
            TxtField(
              hint: "5********",
              onChanged: (v) {
                phoneNum = v;
              },
            ),
            50.height,
            ShowFillButton(
              title: "Continue",
              width: double.infinity,
              onPressed: () {
                if (validation()) performBasicOtp(context);
              },
            ),
          ],
        ),
      ),
    );
  }

  Future<void> performBasicOtp(BuildContext context) async {
    Utils.showLoading(context);
    BasicOtp basicOtp = await UserApiClent().basicOtp(countryCode + phoneNum, roleId: role);
    Utils.hideLoading(context);
    if (basicOtp.messageStatus == 1) {
      showMDialog(context, child: OtpDialog(
        onClick: (String code) async {
          pop(context);
          Utils.showLoading(context);
          RegisterUser user = await UserApiClent().basicVerify(countryCode + phoneNum, code, basicOtp.data!.userToken ?? "");
          Utils.hideLoading(context);
          if (user.messageStatus == 1) {
            Utils.showToast(user.message ?? "");
            navigateReplaceWithName(context, AppRoutes.completeProfile, arguments: user);
          } else {
            Utils.showToast(user.message ?? "");
          }
        },
      ));
    } else {
      Utils.showToast(basicOtp.message ?? "");
    }
  }

  bool validation() {
    bool isValid = true;
    if (role == -1) {
      Utils.showToast("Please select Provider Role");
      isValid = false;
    } else if (countryCode.isEmpty) {
      Utils.showToast("Please select Country Code");
      isValid = false;
    } else if (phoneNum.isEmpty) {
      Utils.showToast("Please add Phone No");
      isValid = false;
    }
    return isValid;
  }
}