import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:tanami_app/core/styles/app_color.dart';

import '../../../../../core/routes/route_name.dart';
import '../../../../../core/routes/routes.dart';
import '../../../../../core/styles/app_text.dart';
import '../../../../../core/utils/language/localizations_delegate.dart';

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

  @override
  Widget build(BuildContext context) {
    var localizations = AppLocalizations.of(context);
    List data = [
      {
        'title': localizations.translate(AppText.deposit),
        'subTitle': '',
        'dateTime': '10/04/2024 22:04',
        'value': '+ SAR 100,000',
        'subValue': '',
        'onHold': false,
      },
      {
        'title': localizations.translate(AppText.withdrawal),
        'subTitle': '',
        'dateTime': '10/04/2024 22:04',
        'value': '- SAR 100,000',
        'subValue': '',
        'onHold': true,
      },
      {
        'title': localizations.translate(AppText.investment),
        'subTitle': 'Name of Investment',
        'dateTime': '10/04/2024 22:04',
        'value': '- SAR 100,000',
        'subValue': '',
        'onHold': false,
      },
      {
        'title': localizations.translate(AppText.yield),
        'subTitle': 'Name of Investment',
        'dateTime': '10/04/2024 22:04',
        'value': '+ SAR 100,000',
        'subValue': '+ \$100,00',
        'onHold': false,
      },
      {
        'title': localizations.translate(AppText.refund),
        'subTitle': '',
        'dateTime': '10/04/2024 22:04',
        'value': '- SAR 100,000',
        'subValue': '',
        'onHold': true,
      },
    ];
    return Scaffold(
      backgroundColor: AppColor.plainWhite,
      body: Padding(
        padding: const EdgeInsets.fromLTRB(18.0, 10.0, 18.0, 0.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Text(
                  localizations.translate(AppText.day),
                  style: GoogleFonts.dmSans(
                    color: const Color(0xFF8D8D8D),
                    fontSize: 11.sp,
                    fontWeight: FontWeight.w500,
                  ),
                ),
                Row(
                  children: [
                    Container(
                      decoration: const BoxDecoration(
                        color: Color(0xFFF6F6F6),
                        borderRadius: BorderRadius.all(Radius.circular(12.0)),
                      ),
                      child: Padding(
                        padding: const EdgeInsets.all(8.0),
                        child: Image.asset(
                          'assets/images/wallet_screen/search.png',
                          height: 20.h,
                        ),
                      ),
                    ),
                    SizedBox(
                      width: 5.w,
                    ),
                    GestureDetector(
                      onTap: () {
                        goRouter.pushNamed(RouteName.filterScreen);
                      },
                      child: Container(
                        decoration: const BoxDecoration(
                          color: Color(0xFFF6F6F6),
                          borderRadius: BorderRadius.all(Radius.circular(12.0)),
                        ),
                        child: Padding(
                          padding: const EdgeInsets.all(8.0),
                          child: Image.asset(
                            'assets/images/wallet_screen/filter.png',
                            height: 20.h,
                          ),
                        ),
                      ),
                    ),
                  ],
                ),
              ],
            ),
            SizedBox(
              height: 10.h,
            ),
            Expanded(
              child: ListView.builder(
                shrinkWrap: true,
                itemCount: data.length,
                itemBuilder: (context, index) {
                  return Padding(
                    padding: const EdgeInsets.only(bottom: 10.0),
                    child: GestureDetector(
                      onTap: () {
                        goRouter.pushNamed(RouteName.walletDetails,
                            pathParameters: {
                              "type": data[index]['title'],
                            });
                      },
                      child: Container(
                        height: 92.h,
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(22.r),
                          color: const Color(0xFFF6F6F6),
                        ),
                        child: Padding(
                          padding: const EdgeInsets.all(12.0),
                          child: Row(
                            children: [
                              getIcon(data[index]['title']),
                              SizedBox(width: 12.w),
                              Column(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                mainAxisAlignment: MainAxisAlignment.center,
                                children: [
                                  Text(
                                    data[index]['title'],
                                    style: GoogleFonts.dmSans(
                                      color: const Color(0xFF191B1E),
                                      fontSize: 14.sp,
                                      fontWeight: FontWeight.w700,
                                    ),
                                  ),
                                  SizedBox(height: 4.h),
                                  (data[index]['subTitle'] != '')
                                      ? Column(
                                          crossAxisAlignment:
                                              CrossAxisAlignment.start,
                                          children: [
                                            Text(
                                              data[index]['subTitle'],
                                              style: GoogleFonts.dmSans(
                                                color: const Color(0xFF191B1E),
                                                fontSize: 14.sp,
                                                fontWeight: FontWeight.w400,
                                              ),
                                            ),
                                            SizedBox(height: 4.h),
                                          ],
                                        )
                                      : Container(),
                                  Text(
                                    data[index]['dateTime'],
                                    style: GoogleFonts.dmSans(
                                      color: const Color(0xFF8D8D8D),
                                      fontSize: 11.sp,
                                      fontWeight: FontWeight.w500,
                                    ),
                                  ),
                                ],
                              ),
                              const Spacer(),
                              Column(
                                crossAxisAlignment: CrossAxisAlignment.end,
                                mainAxisAlignment: MainAxisAlignment.center,
                                children: [
                                  (data[index]['onHold'])
                                      ? Column(
                                          crossAxisAlignment:
                                              CrossAxisAlignment.start,
                                          children: [
                                            Text(
                                              localizations
                                                  .translate(AppText.onHold),
                                              style: GoogleFonts.dmSans(
                                                color: const Color(0xFF0172CB),
                                                fontSize: 14.sp,
                                                fontWeight: FontWeight.w700,
                                              ),
                                            ),
                                            SizedBox(height: 4.h),
                                          ],
                                        )
                                      : Container(),
                                  Text(
                                    data[index]['value'],
                                    style: GoogleFonts.dmSans(
                                      color: const Color(0xFF191B1E),
                                      fontSize: 14.sp,
                                      fontWeight: FontWeight.w700,
                                    ),
                                  ),
                                  SizedBox(height: 4.h),
                                  (data[index]['subValue'] != '')
                                      ? Text(
                                          data[index]['subValue'],
                                          style: GoogleFonts.dmSans(
                                            color: const Color(0xFF191B1E),
                                            fontSize: 12.sp,
                                            fontWeight: FontWeight.w500,
                                          ),
                                        )
                                      : Container(),
                                ],
                              ),
                            ],
                          ),
                        ),
                      ),
                    ),
                  );
                },
              ),
            )
          ],
        ),
      ),
    );
  }
}

Widget getIcon(String title) {
  if (title == 'Deposit' || title == 'إيداع') {
    return Container(
      decoration:
          const BoxDecoration(shape: BoxShape.circle, color: Color(0xFF0FA4A4)),
      child: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Image.asset(
          'assets/images/wallet_screen/deposit_list.png',
          height: 25.h,
        ),
      ),
    );
  } else if (title == 'Withdrawal' || title == 'انسحاب') {
    return Container(
      decoration:
          const BoxDecoration(shape: BoxShape.circle, color: Color(0xFFE6681F)),
      child: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Image.asset('assets/images/wallet_screen/withdraw_list.png',
            height: 25.h),
      ),
    );
  } else if (title == 'Investment' || title == 'استثمار') {
    return Container(
      decoration:
          const BoxDecoration(shape: BoxShape.circle, color: Color(0xFF0172CB)),
      child: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Image.asset('assets/images/wallet_screen/invest_list.png',
            height: 25.h),
      ),
    );
  } else if (title == 'Yield' || title == 'عائد') {
    return Container(
      decoration:
          const BoxDecoration(shape: BoxShape.circle, color: Color(0xFF4C4AEF)),
      child: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Image.asset('assets/images/wallet_screen/yield_list.png',
            height: 25.h),
      ),
    );
  } else {
    return Container(
      decoration:
          const BoxDecoration(shape: BoxShape.circle, color: Color(0xFF0E9445)),
      child: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Image.asset('assets/images/wallet_screen/refund_list.png',
            height: 25.h),
      ),
    );
  }
}
