import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:gap/gap.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:tanami_app/core/routes/route_name.dart';
import 'package:tanami_app/core/routes/routes.dart';
import 'package:tanami_app/core/styles/app_color.dart';
import 'package:tanami_app/core/styles/app_text.dart';
import 'package:tanami_app/shared/components/text_widget.dart';

import '../../../../../../core/styles/app_images.dart';
import '../../../../../../core/utils/language/localizations_delegate.dart';

class DepositPreview extends StatefulWidget {
  const DepositPreview({super.key});

  @override
  State<DepositPreview> createState() => _DepositPreviewState();
}

class _DepositPreviewState extends State<DepositPreview> {
  List values = [
    'Tanami Capital W.L.L',
    '100000480779',
    'BH 23 BBKU 00100 00048 0779',
    'BBKUBHBM',
    'Bank of Bahrain and Kuwait B.S.C',
    '43 Government Avenue, Manama, Kingdom of Bahrain',
    'BH00600000',
  ];

  List titles2 = [
    AppText.amtTrans,
    AppText.paymentMethod,
    AppText.feeText,
    AppText.depositAmt,
  ];
  List values2 = [
    '',
    'Money Transfer',
    '3%',
    'SAR 253',
  ];
  @override
  Widget build(BuildContext context) {
    var localizations = AppLocalizations.of(context);
    List titles = [
      localizations.translate(AppText.accountName),
      localizations.translate(AppText.accountNo),
      localizations.translate(AppText.iban),
      localizations.translate(AppText.swiftCode),
      localizations.translate(AppText.bankName),
      localizations.translate(AppText.bankAddress),
      localizations.translate(AppText.clientId),
    ];
    return Scaffold(
      backgroundColor: Colors.white,
      appBar: AppBar(
        backgroundColor: Colors.white,
        elevation: 0,
        scrolledUnderElevation: 0.0,
        centerTitle: true,
        title: Text(
          localizations.translate(AppText.deposit),
          style: GoogleFonts.dmSans(
            color: const Color(0xFF272727),
            fontSize: 20.sp,
            fontWeight: FontWeight.w700,
          ),
        ),
      ),
      body: SingleChildScrollView(
        child: Padding(
          padding: const EdgeInsets.all(18.0),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Center(child: SvgPicture.asset(AppImages.dStep2CountIcon)),
              const Gap(30),
              TextWidget().text14W400(
                localizations
                    .translate(AppText.copyTheBankDetailsOfYourTanamiAccount),
                clr: AppColor.textLabelColor,
                txtAlign: TextAlign.start,
              ),
              const Gap(10),
              Card(
                color: AppColor.plainWhite,
                elevation: 5,
                child: Padding(
                  padding: const EdgeInsets.all(12.0),
                  child: Column(
                    mainAxisSize: MainAxisSize.min,
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Text(
                        localizations.translate(AppText.depositDetails),
                        style: GoogleFonts.dmSans(
                          color: Colors.black,
                          fontSize: 15.sp,
                          fontWeight: FontWeight.w700,
                        ),
                      ),
                      SizedBox(
                        height: 10.h,
                      ),
                      const Divider(
                        color: Color(0xFFE3E3E3),
                      ),
                      SizedBox(
                        height: 10.h,
                      ),
                      ListView.builder(
                        physics: const NeverScrollableScrollPhysics(),
                        itemCount: titles.length,
                        shrinkWrap: true,
                        itemBuilder: (context, index) {
                          return Column(
                            children: [
                              Row(
                                mainAxisAlignment:
                                    MainAxisAlignment.spaceBetween,
                                crossAxisAlignment: CrossAxisAlignment.center,
                                children: [
                                  Column(
                                    crossAxisAlignment:
                                        CrossAxisAlignment.start,
                                    children: [
                                      Text(
                                        titles[index],
                                        style: GoogleFonts.dmSans(
                                          color: Colors.black,
                                          fontSize: 14.sp,
                                          fontWeight: FontWeight.w700,
                                        ),
                                      ),
                                      SizedBox(
                                        height: 8.h,
                                      ),
                                      SizedBox(
                                        width: 0.8.sw,
                                        child: Text(
                                          values[index],
                                          style: GoogleFonts.dmSans(
                                            color: const Color(0xFF191B1E),
                                            fontSize: 14.sp,
                                            fontWeight: FontWeight.w400,
                                          ),
                                        ),
                                      ),
                                    ],
                                  ),
                                  // Image.asset(
                                  //   'assets/images/wallet_screen/copy.png',
                                  //   height: 25.h,
                                  // )
                                ],
                              ),
                              (index != titles.length - 1)
                                  ? Column(
                                      children: [
                                        SizedBox(
                                          height: 12.h,
                                        ),
                                        Divider(
                                            color: const Color(0xFFE3E3E3),
                                            height: 2.h),
                                        SizedBox(
                                          height: 12.h,
                                        ),
                                      ],
                                    )
                                  : SizedBox(
                                      height: 10.h,
                                    ),
                            ],
                          );
                        },
                      )
                    ],
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
      bottomNavigationBar: Column(
        mainAxisSize: MainAxisSize.min,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          GestureDetector(
            onTap: () {
              goRouter.pushNamed(RouteName.depositCompleteScreen);
            },
            child: Container(
              margin: const EdgeInsets.all(10.0),
              height: 65.h,
              width: double.infinity,
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(22.r),
                color: const Color(0xFF004717),
              ),
              child: Padding(
                padding: const EdgeInsets.symmetric(vertical: 20.0),
                child: Center(
                  child: Text(
                    localizations.translate(AppText.depositNoti),
                    style: GoogleFonts.dmSans(
                      color: Colors.white,
                      fontSize: 14.sp,
                      fontWeight: FontWeight.w700,
                    ),
                  ),
                ),
              ),
            ),
          ),
          const Gap(10),
          // GestureDetector(
          //   onTap: () {
          //     goRouter.pop();
          //   },
          //   child: Center(
          //     child: TextWidget().text14W700(
          //       localizations.translate(AppText.back),
          //       clr: const Color(0xFF363636),
          //       textDecoration: TextDecoration.underline,
          //     ),
          //   ),
          // ),
          // const Gap(20),
        ],
      ),
    );
  }
}
