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


import '../../../core/constants/app_assets.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_selected_category_details_controller.dart';

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: DashBoardAppBar(
        title: TranslationKeys.makeTranslation(TranslationKeys.transUtilityBillCategory),
        onBackButtonPressed: () {
          Get.back();
        },
      ),
      persistentFooterButtons: [
        Padding(
          padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
          child: CustomButton(
            buttonColor: AppColors.colorButton,
            onPressed: () {
              Get.toNamed(Routes.UTILITY_BILLS_PAYMENT);
            },
            buttonText: TranslationKeys.makeTranslation(TranslationKeys.textNext),
            buttonPadding: const EdgeInsets.symmetric(horizontal: 10, vertical: 10),
          ),
        ),
      ],
      body: SingleChildScrollView(
        child: Stack(
          children: [
            Container(height: 120, decoration: BoxDecoration(color: AppColors.colorPrimary.withOpacity(0.98), borderRadius: const BorderRadius.only(bottomLeft: Radius.circular(40)))),
            Stack(
              children: [
                Padding(
                  padding: const EdgeInsets.all(8.0),
                  child: Card(
                    surfaceTintColor: Colors.white,
                    margin: const EdgeInsets.symmetric(horizontal: 20, vertical: 50),
                    elevation: 5.0,
                    child: Container(
                      // height: 360,
                      padding: const EdgeInsets.symmetric(horizontal: 15, vertical: 25),
                      decoration: const BoxDecoration(
                        borderRadius: BorderRadius.all(Radius.circular(10)),
                      ),
                      child: Column(
                        children: [
                          const SizedBox(height: 15),
                          Text(TranslationKeys.makeTranslation(TranslationKeys.textBillDetailContent), style: Theme.of(context).textTheme.titleSmall),
                          const SizedBox(height: 15),
                          Container(
                              padding: const EdgeInsets.symmetric(vertical: 10, horizontal: 75),
                              decoration: BoxDecoration(borderRadius: BorderRadius.circular(5), border: Border.all(color: AppColors.colorGrey350, width: 1.0)),
                              child: Text(
                                TranslationKeys.makeTranslation(TranslationKeys.textBillDetailBalance),
                                style: Theme.of(context).textTheme.titleSmall!.copyWith(color: AppColors.colorText),
                              )),
                          const SizedBox(height: 15),
                          Text(TranslationKeys.makeTranslation(TranslationKeys.textBillDetailCustomerName), style: Theme.of(context).textTheme.titleSmall),
                          const SizedBox(height: 15),
                          Padding(
                            padding: const EdgeInsets.symmetric(vertical: 10, horizontal: 10),
                            child: Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                Column(
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: [
                                    Text(TranslationKeys.makeTranslation(TranslationKeys.textBillDetailBillAmount), style: Theme.of(context).textTheme.bodyMedium?.copyWith(fontSize: 15, color: AppColors.colorText, fontWeight: FontWeight.w400)),
                                    const SizedBox(height: 10),
                                    Text(TranslationKeys.makeTranslation(TranslationKeys.textBillDetailBillDueDate), style: Theme.of(context).textTheme.bodyMedium?.copyWith(fontSize: 15, color: AppColors.colorText, fontWeight: FontWeight.w400)),
                                    const SizedBox(height: 10),
                                    Text(TranslationKeys.makeTranslation(TranslationKeys.textBillDetailBillAmountDue), style: Theme.of(context).textTheme.bodyMedium?.copyWith(fontSize: 15, color: AppColors.colorText, fontWeight: FontWeight.w400)),
                                    const SizedBox(height: 10),
                                    Text(TranslationKeys.makeTranslation(TranslationKeys.textBillDetailBillAfterDueDate), style: Theme.of(context).textTheme.bodyMedium?.copyWith(fontSize: 15, color: AppColors.colorText, fontWeight: FontWeight.w400)),
                                      SizedBox(height: 10),
                                    Text(TranslationKeys.makeTranslation(TranslationKeys.textBillDetailBillStatus), style: Theme.of(context).textTheme.bodyMedium?.copyWith(fontSize: 15, color: AppColors.colorText, fontWeight: FontWeight.w400)),
                                  ],
                                ),
                                const SizedBox(width: 20),
                                Column(
                                  crossAxisAlignment: CrossAxisAlignment.end,
                                  children: [
                                    Text(TranslationKeys.makeTranslation(TranslationKeys.textBillDetailZero), style: Theme.of(context).textTheme.bodyMedium?.copyWith(fontSize: 14, color: AppColors.colorText, fontWeight: FontWeight.w400)),
                                    const SizedBox(height: 10),
                                    Text(TranslationKeys.makeTranslation(TranslationKeys.textBillDetailDate), style: Theme.of(context).textTheme.bodyMedium?.copyWith(fontSize: 14, color: AppColors.colorText, fontWeight: FontWeight.w400)),
                                    const SizedBox(height: 10),
                                    Text(TranslationKeys.makeTranslation(TranslationKeys.textBillDetailZero), style: Theme.of(context).textTheme.bodyMedium?.copyWith(fontSize: 14, color: AppColors.colorText, fontWeight: FontWeight.w400)),
                                    SizedBox(height: 10),
                                    Text(TranslationKeys.makeTranslation(TranslationKeys.textBillDetailZero), style: Theme.of(context).textTheme.bodyMedium?.copyWith(fontSize: 14, color: AppColors.colorText, fontWeight: FontWeight.w400)),
                                    const SizedBox(height: 10),
                                    Text(TranslationKeys.makeTranslation(TranslationKeys.textBillDetailUnPaid), style: Theme.of(context).textTheme.bodyMedium?.copyWith(fontSize: 14, color: AppColors.colorText, fontWeight: FontWeight.w400)),
                                  ],
                                ),
                              ],
                            ),
                          ),
                        ],
                      ),
                    ),
                  ),
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Padding(
                      padding: const EdgeInsets.only(top: 25.0),
                      child: Image.asset(AppAssets.ic_government),
                    ),
                  ],
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }
}
