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/routes.dart';
import 'package:tanami_app/core/styles/app_images.dart';
import 'package:tanami_app/shared/components/text_widget.dart';

import '../../../../../../core/styles/app_color.dart';
import '../../../../../../core/styles/app_text.dart';
import '../../../../../../core/utils/language/localizations_delegate.dart';
import '../../../../../../shared/components/button_widget.dart';

class DepositeCompleteScreen extends StatelessWidget {
  const DepositeCompleteScreen({super.key});

  @override
  Widget build(BuildContext context) {
    var localizations = AppLocalizations.of(context);

    return Scaffold(
      backgroundColor: Colors.white,
      bottomNavigationBar: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          Container(
            margin: const EdgeInsets.symmetric(
              horizontal: 16,
              vertical: 16,
            ),
            width: 1.sw,
            height: 56.h,
            child: ButtonWidget().elevatedBtn(
              txtClr: AppColor.plainWhite,
              function: () {
                goRouter.pop();
                goRouter.pop();
                goRouter.pop();
                goRouter.pop();
                goRouter.pop();
              },
              text: localizations.translate(AppText.closeText),
              clr: AppColor.primaryColor2,
            ),
          ),
          InkWell(
            onTap: () {
              goRouter.pop();
              goRouter.pop();
              goRouter.pop();
              goRouter.pop();
              goRouter.pop();
            },
            child: Container(
              width: 1.sw,
              height: 56.h,
              margin: const EdgeInsets.only(
                bottom: 16,
                left: 16,
                right: 16,
              ),
              padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 16),
              decoration: ShapeDecoration(
                shape: RoundedRectangleBorder(
                  side: const BorderSide(width: 1, color: Color(0xFFE3E3E3)),
                  borderRadius: BorderRadius.circular(30),
                ),
              ),
              child: Row(
                mainAxisSize: MainAxisSize.min,
                mainAxisAlignment: MainAxisAlignment.center,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  TextWidget().text14W700(
                      localizations
                          .translate(AppText.manageDepositNotifications),
                      clr: AppColor.textLabelColor,
                      textDecoration: TextDecoration.underline),
                ],
              ),
            ),
          )
        ],
      ),
      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: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Center(child: SvgPicture.asset(AppImages.dStep3CountIcon)),
            const Gap(15),
            Center(
              child: TextWidget().text14W400(
                  localizations.translate(AppText.youAreAllSet),
                  clr: AppColor.textLabelColor,
                  txtAlign: TextAlign.center),
            ),
            const Gap(50),
            Stack(
              alignment: Alignment.topCenter,
              children: [
                Padding(
                  padding: const EdgeInsets.only(top: 45),
                  child: Container(
                    width: 1.sw,
                    clipBehavior: Clip.antiAlias,
                    decoration: ShapeDecoration(
                      color: AppColor.plainWhite,
                      shape: RoundedRectangleBorder(
                        borderRadius: BorderRadius.circular(22),
                      ),
                      shadows: const [
                        BoxShadow(
                          color: Color(0x14000000),
                          blurRadius: 8,
                          offset: Offset(-2, -2),
                          spreadRadius: 0.50,
                        ),
                        BoxShadow(
                          color: Color(0x3391978E),
                          blurRadius: 8,
                          offset: Offset(2, 2),
                          spreadRadius: 4,
                        )
                      ],
                    ),
                    child: Padding(
                      padding: const EdgeInsets.all(12.0),
                      child: Column(
                        mainAxisSize: MainAxisSize.min,
                        children: [
                          Align(
                            alignment: Alignment.topRight,
                            child: TextWidget().text12W400('17th of June, 2024',
                                clr: const Color(0xFF787878)),
                          ),
                          const Gap(25),
                          TextWidget().text20W700(
                              localizations.translate(
                                  AppText.depositNotificationCreated),
                              clr: AppColor.plainBlack),
                          const Gap(18),
                          TextWidget().text12W400(
                              localizations.translate(AppText.amountDeposited),
                              clr: AppColor.plainBlack),
                          const Gap(8),
                          Row(
                            mainAxisAlignment: MainAxisAlignment.center,
                            crossAxisAlignment: CrossAxisAlignment.center,
                            children: [
                              Container(
                                margin: const EdgeInsets.only(top: 2),
                                child: TextWidget().text15W400("SAR",
                                    clr: AppColor.investTextColor),
                              ),
                              const Gap(5),
                              TextWidget().text32W700("1000",
                                  clr: AppColor.investTextColor),
                            ],
                          ),
                          const Gap(40),
                        ],
                      ),
                    ),
                  ),
                ),
                Positioned(
                  child: SvgPicture.asset(AppImages.depositCheckIcon),
                ),
              ],
            ),
            const Gap(50),
            TextWidget().text14W400(
              localizations.translate(
                  AppText.pleaseEnsureTheFundsAreTransferredFromBank),
              clr: AppColor.textLabelColor,
              txtAlign: TextAlign.start,
            ),
          ],
        ),
      ),
    );
  }
}
