import 'package:flutter/material.dart';
import 'package:get/get.dart';


import '../../../core/constants/translation_keys.dart';
import '../../../custom_widgets/custom_app_bar.dart';
import '../../../custom_widgets/custom_button.dart';
import '../../../res/app_colors.dart';
import '../../../routes/app_pages.dart';
import '../controllers/utility_bills_payment_controller.dart';

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: DashBoardAppBar(
        title: TranslationKeys.makeTranslation(
            TranslationKeys.transUtilityBillCategory),
        onBackButtonPressed: () {
          Navigator.of(context).pop();
        },
      ),
      body: SingleChildScrollView(
        child: Padding(
          padding: const EdgeInsets.symmetric(vertical: 20, horizontal: 20),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Center(
                  child: Text(
                      TranslationKeys.makeTranslation(
                          TranslationKeys.textPTCLLandLine),
                      style: Theme.of(context).textTheme.titleSmall)),
              const SizedBox(height: 20),
              Text(
                  TranslationKeys.makeTranslation(
                      TranslationKeys.textSelectAccountDetails),
                  style: Theme.of(context).textTheme.bodyMedium?.copyWith(
                      fontSize: 14,
                      color: AppColors.colorText,
                      fontWeight: FontWeight.w400)),
              Container(
                margin: const EdgeInsets.symmetric(horizontal: 0, vertical: 10),
                height: 40,
                padding: const EdgeInsets.symmetric(horizontal: 10.0),
                decoration: BoxDecoration(
                  color: Colors.white,
                  border: Border.all(color: Colors.grey),
                  borderRadius: BorderRadius.circular(20.0),
                ),
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Expanded(
                      child: TextField(
                        style: Theme.of(context).textTheme.bodySmall?.copyWith(
                            fontWeight: FontWeight.w400, fontSize: 12),
                        decoration: InputDecoration(
                          enabledBorder: InputBorder.none,
                          border: InputBorder.none,
                          focusedBorder: InputBorder.none,
                          hintText: TranslationKeys.makeTranslation(
                              TranslationKeys.textCreditCard),
                        ),
                        // onChanged: (value) => controller.filterList(value),
                      ),
                    ),
                    const Icon(Icons.keyboard_arrow_down_sharp,
                        color: AppColors.colorText),
                  ],
                ),
              ),
              Container(
                margin: const EdgeInsets.symmetric(horizontal: 0, vertical: 5),
                height: 40,
                padding: const EdgeInsets.symmetric(horizontal: 10.0),
                decoration: BoxDecoration(
                  color: Colors.white,
                  border: Border.all(color: Colors.grey),
                  borderRadius: BorderRadius.circular(20.0),
                ),
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Expanded(
                      child: TextField(
                        style: Theme.of(context).textTheme.bodySmall?.copyWith(
                            fontWeight: FontWeight.w400, fontSize: 12),
                        decoration: InputDecoration(
                          enabledBorder: InputBorder.none,
                          border: InputBorder.none,
                          focusedBorder: InputBorder.none,
                          hintText: TranslationKeys.makeTranslation(
                              TranslationKeys.textCreditCardNumber),
                        ),
                        // onChanged: (value) => controller.filterList(value),
                      ),
                    ),
                    const Icon(Icons.credit_card_rounded,
                        color: AppColors.colorText),
                  ],
                ),
              ),
              Text(
                  TranslationKeys.makeTranslation(
                      TranslationKeys.textAmountDebit),
                  style: Theme.of(context).textTheme.bodyMedium?.copyWith(
                      fontSize: 13,
                      color: AppColors.colorText,
                      fontWeight: FontWeight.w400)),
              Container(
                margin: const EdgeInsets.symmetric(horizontal: 0, vertical: 10),
                height: 40,
                padding: const EdgeInsets.symmetric(horizontal: 3.0),
                decoration: BoxDecoration(
                  color: Colors.white,
                  border: Border.all(color: Colors.grey),
                  borderRadius: BorderRadius.circular(20.0),
                ),
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Expanded(
                      child: TextField(
                        style: Theme.of(context).textTheme.bodySmall?.copyWith(
                            fontWeight: FontWeight.w400, fontSize: 12),
                        decoration: InputDecoration(
                          enabledBorder: InputBorder.none,
                          border: InputBorder.none,
                          focusedBorder: InputBorder.none,
                          hintText: TranslationKeys.makeTranslation(
                              TranslationKeys.textEnterConsumerName),
                        ),
                        // onChanged: (value) => controller.filterList(value),
                      ),
                    ),
                  ],
                ),
              ),
              Text(
                  TranslationKeys.makeTranslation(
                      TranslationKeys.textTotalAmount),
                  style: Theme.of(context).textTheme.bodyMedium?.copyWith(
                      fontSize: 13,
                      color: AppColors.colorText,
                      fontWeight: FontWeight.w400)),
              Container(
                margin: const EdgeInsets.symmetric(horizontal: 0, vertical: 10),
                height: 40,
                padding: const EdgeInsets.symmetric(horizontal: 3.0),
                decoration: BoxDecoration(
                  color: Colors.white,
                  border: Border.all(color: Colors.grey),
                  borderRadius: BorderRadius.circular(20.0),
                ),
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Expanded(
                      child: TextField(
                        style: Theme.of(context).textTheme.bodySmall?.copyWith(
                            fontWeight: FontWeight.w400, fontSize: 12),
                        decoration: InputDecoration(
                          enabledBorder: InputBorder.none,
                          border: InputBorder.none,
                          focusedBorder: InputBorder.none,
                          hintText: TranslationKeys.makeTranslation(
                              TranslationKeys.textEnterAmount),
                        ),
                        // onChanged: (value) => controller.filterList(value),
                      ),
                    ),
                  ],
                ),
              ),
              const SizedBox(height: 10),
              Text(
                  TranslationKeys.makeTranslation(
                      TranslationKeys.textBillDetails),
                  style: Theme.of(context).textTheme.titleSmall),
              const SizedBox(height: 10),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Text(
                          TranslationKeys.makeTranslation(
                              TranslationKeys.textBillConsumerName),
                          style: Theme.of(context)
                              .textTheme
                              .bodyMedium
                              ?.copyWith(
                                  fontSize: 12,
                                  color: AppColors.colorText,
                                  fontWeight: FontWeight.w400)),
                      const SizedBox(height: 10),
                      Text(
                          TranslationKeys.makeTranslation(
                              TranslationKeys.textBillAmount),
                          style: Theme.of(context)
                              .textTheme
                              .bodyMedium
                              ?.copyWith(
                                  fontSize: 12,
                                  color: AppColors.colorText,
                                  fontWeight: FontWeight.w400)),
                      Text(
                          TranslationKeys.makeTranslation(
                              TranslationKeys.textBillAmount),
                          style: Theme.of(context)
                              .textTheme
                              .bodyMedium
                              ?.copyWith(
                                  fontSize: 12,
                                  color: AppColors.colorText,
                                  fontWeight: FontWeight.w400)),
                      const SizedBox(height: 10),
                      Text(
                          TranslationKeys.makeTranslation(
                              TranslationKeys.textDueDate),
                          style: Theme.of(context)
                              .textTheme
                              .bodyMedium
                              ?.copyWith(
                                  fontSize: 12,
                                  color: AppColors.colorText,
                                  fontWeight: FontWeight.w400)),
                      Text(
                          TranslationKeys.makeTranslation(
                              TranslationKeys.textDueDate),
                          style: Theme.of(context)
                              .textTheme
                              .bodyMedium
                              ?.copyWith(
                                  fontSize: 12,
                                  color: AppColors.colorText,
                                  fontWeight: FontWeight.w400)),
                      const SizedBox(height: 10),
                      Text(
                          TranslationKeys.makeTranslation(
                              TranslationKeys.textAmountDueAfterDueDate),
                          style: Theme.of(context)
                              .textTheme
                              .bodyMedium
                              ?.copyWith(
                                  fontSize: 12,
                                  color: AppColors.colorText,
                                  fontWeight: FontWeight.w400)),
                      const SizedBox(height: 10),
                      Text(
                          TranslationKeys.makeTranslation(
                              TranslationKeys.textBillStatus),
                          style: Theme.of(context)
                              .textTheme
                              .bodyMedium
                              ?.copyWith(
                                  fontSize: 12,
                                  color: AppColors.colorText,
                                  fontWeight: FontWeight.w400)),
                      const SizedBox(height: 10),
                      Text(
                          TranslationKeys.makeTranslation(
                              TranslationKeys.textTotalAmount),
                          style: Theme.of(context)
                              .textTheme
                              .bodyMedium
                              ?.copyWith(
                                  fontSize: 12,
                                  color: AppColors.colorText,
                                  fontWeight: FontWeight.w400)),
                    ],
                  ),
                  Column(
                    crossAxisAlignment: CrossAxisAlignment.end,
                    children: [
                      Text(
                          TranslationKeys.makeTranslation(
                              TranslationKeys.textBillDetailCustomerName),
                          style: Theme.of(context)
                              .textTheme
                              .bodyMedium
                              ?.copyWith(
                                  fontSize: 12,
                                  color: AppColors.colorText,
                                  fontWeight: FontWeight.w400)),
                      SizedBox(height: 10),
                      Text(
                          TranslationKeys.makeTranslation(
                              TranslationKeys.textBillDetailZero),
                          style: Theme.of(context)
                              .textTheme
                              .bodyMedium
                              ?.copyWith(
                                  fontSize: 12,
                                  color: AppColors.colorText,
                                  fontWeight: FontWeight.w400)),
                      SizedBox(height: 10),
                      Text(
                          TranslationKeys.makeTranslation(
                              TranslationKeys.textBillDetailDate),
                          style: Theme.of(context)
                              .textTheme
                              .bodyMedium
                              ?.copyWith(
                                  fontSize: 12,
                                  color: AppColors.colorText,
                                  fontWeight: FontWeight.w400)),
                      const SizedBox(height: 10),
                      Text(
                          TranslationKeys.makeTranslation(
                              TranslationKeys.textBillDetailZero),
                          style: Theme.of(context)
                              .textTheme
                              .bodyMedium
                              ?.copyWith(
                                  fontSize: 12,
                                  color: AppColors.colorText,
                                  fontWeight: FontWeight.w400)),
                      const SizedBox(height: 50),
                      Text(
                          TranslationKeys.makeTranslation(
                              TranslationKeys.textBillDetailUnPaid),
                          style: Theme.of(context)
                              .textTheme
                              .bodyMedium
                              ?.copyWith(
                                  fontSize: 12,
                                  color: AppColors.colorText,
                                  fontWeight: FontWeight.w400)),
                      const SizedBox(height: 10),
                      Text(
                          TranslationKeys.makeTranslation(
                              TranslationKeys.textBillDetailZero),
                          style: Theme.of(context)
                              .textTheme
                              .bodyMedium
                              ?.copyWith(
                                  fontSize: 12,
                                  color: AppColors.colorText,
                                  fontWeight: FontWeight.w400)),
                    ],
                  ),
                ],
              ),
              CustomButton(
                buttonColor: AppColors.colorButton,
                onPressed: () {
                  Get.offAllNamed(Routes.DASHBOARD_SCREEN);
                },
                buttonText:
                    TranslationKeys.makeTranslation(TranslationKeys.textPayNow),
                buttonPadding:
                    const EdgeInsets.symmetric(horizontal: 10, vertical: 10),
              ),
            ],
          ),
        ),
      ),
    );
  }
}
