import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:uco_mobile_poc/app/modules/add_money/views/shared/currency_list_screen.dart';
import 'package:uco_mobile_poc/app/modules/add_money/views/shared/payment_method_view.dart';


import '../../../core/constants/app_assets.dart';
import '../../../core/constants/form_field_constants.dart';
import '../../../core/constants/translation_keys.dart';
import '../../../custom_widgets/Fields/input_field.dart';
import '../../../custom_widgets/custom_app_bar.dart';
import '../../../custom_widgets/custom_button.dart';
import '../../../res/app_colors.dart';
import '../../../res/app_theme.dart';
import '../controllers/add_money_controller.dart';

class AddMoneyView extends GetView<AddMoneyController> {
  const AddMoneyView({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    //
    String className = runtimeType.toString().split('.').last;

    return Scaffold(
      appBar: DashBoardAppBar(
        title: "Add Money",
        onBackButtonPressed: () {
          Get.back();
        },
      ),
      persistentFooterButtons: [
        Padding(
          padding: const EdgeInsets.only(left: 20, right: 30, bottom: 10),
          child: CustomButton(
            onPressed: () {
              controller.navigateToNextScreen();
            },
            buttonText: TranslationKeys.makeTranslation(TranslationKeys.textContinue),
            buttonColor: AppColors.colorButton,
            buttonPadding: const EdgeInsets.only(top: 12, bottom: 12),
          ),
        )
      ],
      body: Padding(
        padding: const EdgeInsets.only(left: 20, right: 20, top: 20),
        child: SingleChildScrollView(
          child: Obx(() {
            return Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                const Text("You send exactly"),
                const SizedBox(height: 8),
                controller.amountFeild = InputField(
                  refKey: FormFieldConstants.instance().getFormKey("${className}amountFeild"),
                  controller: FormFieldConstants.instance().getController("${className}amountFeild"),
                  hintText: "Enter amount",
                  radius: 10,
                  inputFontSize: 20.0,
                  inputColor: AppColors.black,
                  inputFontWeight: FontWeight.w600,
                  keyboardType: const TextInputType.numberWithOptions(decimal: true),
                  inputFormatters: InputType.maxValueFilter(InputType.INT_MAX_VALUE_, true, 2),
                  isTopMarginRequired: false,
                  showLabel: false,
                  textInputAction: TextInputAction.done,
                  onChanged: (value) {
                    Future.delayed(const Duration(milliseconds: 500), () => controller.getConversionAmount());
                  },
                  onSubmitted: (value) {
                    controller.getConversionAmount();
                  },
                  suffixIcon: GestureDetector(
                    onTap: () {
                      controller.selectFromAccountCurrency();
                    },
                    child: Container(
                      color: AppColors.transparent,
                      child: SizedBox(
                        width: 130,
                        height: 60,
                        child: Row(
                          children: [
                            // Image.asset(controller.getFlagWithCurrencyCode(controller.selectedFromAccountCurrency.value.pcrCurrcode), width: 22),
                            // const SizedBox(width: 6),
                            // Text(
                            //   controller.selectedFromAccountCurrency.value.dmpProdshort,
                            //   style: context.textTheme.bodyMedium!.copyWith(fontSize: 16, color: AppColors.colorPrimary, fontWeight: FontWeight.w600),
                            // ),
                            const SizedBox(width: 105),
                            Image.asset(AppAssets.drop_down_ic, width: 10, height: 10),
                            const SizedBox(width: 6),
                          ],
                        ),
                      ),
                    ),
                  ),
                ),
                const SizedBox(height: 17),
                Text(
                  "Paying with",
                  style: context.textTheme.bodyMedium!.copyWith(fontSize: 14, fontWeight: FontWeight.w400, color: AppColors.colorTitle),
                ),
                const SizedBox(height: 8),
                InkWell(
                  onTap: () {
                    Get.to(() => const PaymentMethodView())!.then(
                      (value) {
                        controller.getConversionAmount();
                      },
                    );
                  },
                  child: Container(
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(15),
                      color: AppColors.colorGrey200,
                    ),
                    padding: const EdgeInsets.only(left: 13, top: 17, bottom: 17, right: 15),
                    child: Row(
                      children: [
                        Text(
                          controller.paymnetController.paymentMethod.value.title.isNotEmpty ? TranslationKeys.makeTranslation(controller.paymnetController.paymentMethod.value.title) : "Select a payment method",
                          style: context.textTheme.bodyMedium!.copyWith(fontSize: 15, fontWeight: FontWeight.w500, color: AppColors.F0F0D),
                        ),
                        const Spacer(),
                        Card(
                          elevation: 0.0,
                          shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(50), side: BorderSide(color: AppColors.CFCFCF)),
                          child: Padding(
                            padding: const EdgeInsets.only(
                              left: 15,
                              right: 15,
                              top: 5,
                              bottom: 5,
                            ),
                            child: Center(
                              child: Text(
                                "Select",
                                style: context.textTheme.bodyLarge!.copyWith(fontSize: 11, fontWeight: FontWeight.w500),
                              ),
                            ),
                          ),
                        ),
                      ],
                    ),
                  ),
                ),
                const SizedBox(height: 17),
                Text(
                  "Recipient Get",
                  style: context.textTheme.bodyMedium!.copyWith(fontSize: 14, fontWeight: FontWeight.w400, color: AppColors.colorTitle),
                ),
                const SizedBox(height: 8),
                Container(
                  height: 60,
                  decoration: BoxDecoration(
                    shape: BoxShape.rectangle,
                    borderRadius: const BorderRadius.all(Radius.circular(10)),
                    border: Border.all(color: AppColors.colorGrey500, width: 1.5),
                  ),
                  child: Row(
                    // mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Expanded(
                        flex: 4,
                        child: TextField(
                          style: AppThemeData.inputStyle.copyWith(height: 1, fontSize: 20.0, fontWeight: FontWeight.w600, color: AppColors.black),
                          controller: controller.recipientController,
                          decoration: const InputDecoration(border: InputBorder.none),
                          enabled: false,
                        ),
                      ),
                      GestureDetector(
                        onTap: () {
                          Get.to(() => CurrencyListScreen())!.then(
                            (value) {
                              controller.getConversionAmount();
                            },
                          );
                        },
                        child: Container(
                          color: Colors.transparent,
                          child: Row(
                            children: [
                              Image.asset(
                                controller.getFlagWithCurrencyCode(controller.selectRecepientAccount.value.pcrCurrcode),
                                width: 22,
                                errorBuilder: (context, error, stackTrace) => const SizedBox(),
                              ),
                              const SizedBox(width: 6),
                              Text(controller.selectRecepientAccount.value.pcrCurrshort, style: context.textTheme.bodyMedium!.copyWith(fontSize: 16, color: AppColors.colorPrimary, fontWeight: FontWeight.w500)),
                              const SizedBox(width: 6),
                              Image.asset(AppAssets.drop_down_ic, width: 10, height: 10),
                              const SizedBox(width: 15),
                            ],
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
                const SizedBox(height: 15),
                ...(controller.checkForNull())
                    ? []
                    : [
                        detailsTile(controller.evaluatedCurrencyModel.value.serviceCharges.toString(), "Our fee"),

                        detailsTile(controller.evaluatedCurrencyModel.value.sgtGntramtfc!.toString(), "Total amount we’ll convert"),

                        //{"title": "344.598", "subtitle": ""},
                        detailsTile(
                          controller.evaluatedCurrencyModel.value.targetPerEratrateact.toString(),
                          "Guaranteed exchange rate (2h)",
                          subTitleStyle: Get.context?.textTheme.bodyMedium!.copyWith(fontSize: 14, fontWeight: FontWeight.w400, color: AppColors.colorPrimary, decoration: TextDecoration.underline),
                        ),
                        const SizedBox(height: 35),
                        Text(
                          "Usually arrives in seconds. Because this is your first transfer, things may take a little longer.",
                          style: context.textTheme.bodyMedium!.copyWith(
                            fontSize: 15,
                            fontWeight: FontWeight.w400,
                          ),
                        ),
                        const SizedBox(height: 20),
                      ],
              ],
            );
          }),
        ),
      ),
    );
  }

  Widget detailsTile(String title, String subTitle, {TextStyle? subTitleStyle}) {
    return Padding(
      padding: const EdgeInsets.only(top: 20),
      child: Row(
        children: [
          Container(
            width: 13,
            height: 13,
            decoration: BoxDecoration(color: AppColors.colorTitle, borderRadius: BorderRadius.circular(20)),
          ),
          const SizedBox(width: 6),
          Text(
            title,
            style: Get.context?.textTheme.bodyMedium!.copyWith(
              fontSize: 14,
              fontWeight: FontWeight.w700,
            ),
          ),
          const Spacer(),
          Text(
            subTitle,
            style: subTitleStyle ??
                Get.context?.textTheme.bodyMedium!.copyWith(
                  fontSize: 14,
                  fontWeight: FontWeight.w400,
                ),
          ),
        ],
      ),
    );
  }
}

showCurrencyBtm() {
  Get.bottomSheet(
    Container(
      decoration: BoxDecoration(color: Colors.white, border: Border.all(color: AppColors.colorGrey800, width: 1), borderRadius: const BorderRadius.only(topLeft: Radius.circular(30), topRight: Radius.circular(30))),
      margin: const EdgeInsets.only(left: 20, right: 20),
      child: const Text("data"),
    ),
    backgroundColor: Colors.transparent,
    isScrollControlled: true,
    shape: const RoundedRectangleBorder(borderRadius: BorderRadius.only(topLeft: Radius.circular(10), topRight: Radius.circular(10))),
  );
}