import 'package:clean/base/base_page.dart';
import 'package:clean/module/contact/contact_controller.dart';
import 'package:clean/module/more/more_controller.dart';
import 'package:clean/resource/assets.gen.dart';
import 'package:clean/router/app_pages.dart';
import 'package:flutter/Material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

class ContactPage extends BasePage<ContactController> {
  const ContactPage({super.key});

  @override
  bool immersive() {
    return true;
  }

  @override
  bool statusBarDarkFont() => false;

  @override
  Widget buildBody(BuildContext context) {
    controller.init();
    return Stack(
      children: [
        buildMain(context),
        IgnorePointer(
          child: Assets.images.bgHome.image(
            width: 360.w,
          ),
        ),
      ],
    );
  }

  Widget buildMain(BuildContext context) {
    return SafeArea(
      child: Container(
        padding: EdgeInsets.only(left: 16.w, top: 14.h, right: 16.w),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.start,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                GestureDetector(
                  onTap: () {
                    Get.back();
                  },
                  child: Assets.images.iconCommonBack
                      .image(width: 28.w, height: 28.w),
                ),
              ],
            ),
            SizedBox(
              height: 12.h,
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Text(
                  "Manage Contacts",
                  style: TextStyle(
                    color: Colors.white,
                    fontWeight: FontWeight.w700,
                    fontSize: 24.sp,
                  ),
                ),
              ],
            ),
            SizedBox(
              height: 25.h,
            ),
            Center(
              child: Assets.images.iconContactMain
                  .image(width: 138.w, height: 138.w),
            ),
            SizedBox(
              height: 33.h,
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                _buildContactBtn(
                  "All Contacts",
                  Assets.images.iconContactAll.image(
                    width: 40.w,
                    height: 40.w,
                  ),
                  onTap: () {
                    Get.toNamed(RoutePath.contactAll);
                  },
                ),
                _buildContactBtn(
                  "Duplicate",
                  Assets.images.iconContactDuplicate.image(
                    width: 40.w,
                    height: 40.w,
                  ),
                  onTap: () {
                    Get.toNamed(RoutePath.contactDuplicate);
                  },
                ),
              ],
            ),
            SizedBox(
              height: 16.h,
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                _buildContactBtn(
                  "Incomplete",
                  Assets.images.iconContactIncomplete.image(
                    width: 40.w,
                    height: 40.w,
                  ),
                  onTap: () {
                    Get.toNamed(RoutePath.contactIncomplete);
                  },
                ),
                _buildContactBtn(
                  "Backup",
                  Assets.images.iconContactBackup.image(
                    width: 40.w,
                    height: 40.w,
                  ),
                  onTap: () {
                    Get.toNamed(RoutePath.contactBackup);
                  },
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildContactBtn(String title, Image image, {required Function() onTap}) {
    return GestureDetector(
      onTap: onTap,
      child: Container(
        width: 156.w,
        height: 101.h,
        decoration: BoxDecoration(
          color: Colors.white.withOpacity(0.12),
          borderRadius: BorderRadius.all(Radius.circular(14.r)),
        ),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: [
            image,
            Text(
              title,
              style: TextStyle(
                color: Colors.white.withOpacity(0.9),
                fontSize: 16.sp,
                fontWeight: FontWeight.w500,
              ),
            ),
          ],
        ),
      ),
    );
  }
}