import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter/src/widgets/framework.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:get/get_core/src/get_main.dart';
import 'package:location/data/repositories/config_repository.dart';
import 'package:location/module/avatar/user_avatar_controller.dart';
import 'package:location/resource/assets.gen.dart';
import 'package:location/resource/string.gen.dart';
import 'package:location/utils/common_expand.dart';

import '../../handler/error_handler.dart';
import '../../resource/colors.gen.dart';
import '../../utils/common_style.dart';

class UserAvatarView extends GetView<UserAvatarController> {
  UserAvatarView({super.key, required List<String> avatarList}) {
    Get.lazyPut(() => UserAvatarController(avatarList));
  }

  static void show() {
    ConfigRepository.getInstance().requestUserAvatarList().then((list) {
      Get.bottomSheet(UserAvatarView(avatarList: list),
          isScrollControlled: true,
          barrierColor: ColorName.black55,
          backgroundColor: ColorName.transparent);
    }).catchError((error) {
      ErrorHandler.toastError(error);
    });
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      width: 1.sw,
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.only(
          topLeft: Radius.circular(10.w),
          topRight: Radius.circular(10.w),
        ),
      ),
      child: IntrinsicHeight(
        child: Column(
          children: [
            SizedBox(height: 12.w),
            buildTitleView(),
            SizedBox(height: 22.w),
            buildAvatarListView(),
            SizedBox(height: 30.w),
            buildSureBtnView(),
            SizedBox(height: 20.w),
          ],
        ),
      ),
    );
  }

  Widget buildTitleView() {
    return Row(
      children: [
        SizedBox(width: 37.w),
        Spacer(),
        Text(
          StringName.accountPleaseSelectAvatar,
          style: TextStyle(fontSize: 14.sp, color: '#404040'.color),
        ),
        Spacer(),
        GestureDetector(
            onTap: controller.onCloseClick,
            child:
                Assets.images.iconAvatarClose.image(width: 25.w, height: 25.w)),
        SizedBox(width: 12.w),
      ],
    );
  }

  Widget buildAvatarListView() {
    return Container(
        margin: EdgeInsets.symmetric(horizontal: 20.w),
        child: Builder(builder: (context) {
          return Wrap(
            spacing: 25.w,
            runSpacing: 30.w,
            children: controller.avatarList.map((url) {
              double itemWidth =
                  (MediaQuery.of(context).size.width - 25.w * 5) / 4;
              return GestureDetector(
                onTap: () {
                  controller.onSelectAvatarClick(url);
                },
                child: buildAvatarItem(itemWidth, url),
              );
            }).toList(),
          );
        }));
  }

  Widget buildAvatarItem(double itemWidth, String url) {
    return Stack(
      children: [
        Container(
          width: itemWidth,
          height: itemWidth,
          decoration: BoxDecoration(
              shape: BoxShape.circle,
              border: Border.all(width: 1.w, color: '#F0F0F0'.color)),
          child: ClipOval(
            child: CachedNetworkImage(
              width: double.infinity,
              height: double.infinity,
              imageUrl: url,
              fit: BoxFit.cover,
            ),
          ),
        ),
        Obx(() {
          return Visibility(
            visible: controller.selectedAvatar == url ||
                (controller.selectedAvatar == null &&
                    controller.mineInfo?.avatar == url),
            child: Container(
              width: itemWidth,
              height: itemWidth,
              decoration: BoxDecoration(
                  shape: BoxShape.circle,
                  border:
                      Border.all(width: 3.w, color: ColorName.colorPrimary)),
            ),
          );
        }),
        Obx(() {
          return Visibility(
            visible: controller.selectedAvatar == url ||
                (controller.selectedAvatar == null &&
                    controller.mineInfo?.avatar == url),
            child: Positioned(
                bottom: 0,
                right: 0,
                child: Assets.images.iconAvatarSelected
                    .image(width: 20.w, height: 20.w)),
          );
        })
      ],
    );
  }

  Widget buildSureBtnView() {
    return GestureDetector(
      onTap: controller.onSelectedClick,
      child: Container(
        width: 312.w,
        height: 44.w,
        decoration: getPrimaryBtnDecoration(100.r),
        child: Center(
            child: Text(StringName.accountSelectAvatarBtnTxt,
                style: TextStyle(fontSize: 15.sp, color: Colors.white))),
      ),
    );
  }
}