import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:yumi/app/constants/sc_global_config.dart';
import 'package:yumi/shared/business_logic/models/res/gift_backpack_res.dart';
import 'package:yumi/shared/data_sources/sources/repositories/sc_room_repository_imp.dart';
import 'package:yumi/ui_kit/components/sc_compontent.dart';
import 'package:yumi/ui_kit/components/sc_page_list.dart';
import 'package:yumi/ui_kit/components/text/sc_text.dart';
import 'package:yumi/ui_kit/theme/socialchat_theme.dart';
import 'package:yumi/ui_kit/widgets/store/store_bag_page_helpers.dart';

const double _kBagsGiftGridAspectRatio = 0.86;

///背包-礼物
class BagsGiftPage extends SCPageList {
  const BagsGiftPage({super.key});

  @override
  SCPageListState<SocialChatGiftBackpackRes, BagsGiftPage> createState() =>
      _BagsGiftPageState();
}

class _BagsGiftPageState
    extends SCPageListState<SocialChatGiftBackpackRes, BagsGiftPage> {
  SocialChatGiftBackpackRes? selectedGift;

  @override
  void initState() {
    super.initState();
    enablePullUp = false;
    isGridView = true;
    gridViewCount = 3;
    padding = EdgeInsets.symmetric(horizontal: 6.w);
    backgroundColor = Colors.transparent;
    gridDelegate = SliverGridDelegateWithFixedCrossAxisCount(
      crossAxisCount: gridViewCount,
      mainAxisSpacing: 12.w,
      crossAxisSpacing: 12.w,
      childAspectRatio: _kBagsGiftGridAspectRatio,
    );
    loadData(1);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.transparent,
      body:
          items.isEmpty && isLoading
              ? const SCBagGridSkeleton()
              : buildList(context),
    );
  }

  @override
  Widget buildItem(SocialChatGiftBackpackRes res) {
    final gift = res.giftConfig;
    final isSelected = selectedGift?.id == res.id;

    return GestureDetector(
      behavior: HitTestBehavior.opaque,
      onTap: () {
        selectedGift = res;
        setState(() {});
      },
      child: Container(
        decoration: BoxDecoration(
          color: const Color(0xff18F2B1).withValues(alpha: 0.1),
          border: Border.all(
            color:
                isSelected ? SocialChatTheme.primaryLight : Colors.transparent,
            width: 1.w,
          ),
          borderRadius: BorderRadius.all(Radius.circular(8.w)),
        ),
        child: Stack(
          alignment: Alignment.center,
          children: [
            Column(
              children: [
                SizedBox(height: 25.w),
                netImage(
                  url: gift?.giftPhoto ?? "",
                  width: 55.w,
                  height: 55.w,
                  fit: BoxFit.contain,
                ),
                SizedBox(height: 8.w),
                buildStoreBagItemTitle(
                  gift?.giftName ?? "",
                  textColor: Colors.white,
                  fontSize: 12,
                ),
                SizedBox(height: 6.w),
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Image.asset(
                      SCGlobalConfig.businessLogicStrategy
                          .getGiftPageGoldCoinIcon(),
                      width: 14.w,
                      height: 14.w,
                    ),
                    SizedBox(width: 3.w),
                    text(
                      _formatNumber(gift?.giftCandy),
                      fontSize: 10,
                      lineHeight: 1,
                      textColor: Colors.white,
                    ),
                  ],
                ),
              ],
            ),
            PositionedDirectional(
              top: 0,
              start: 0,
              child: Container(
                padding: EdgeInsets.symmetric(horizontal: 8.w, vertical: 2.w),
                decoration: BoxDecoration(
                  color: SocialChatTheme.primaryLight,
                  borderRadius: BorderRadiusDirectional.only(
                    topStart: Radius.circular(6.w),
                    topEnd: Radius.circular(12.w),
                    bottomEnd: Radius.circular(12.w),
                  ),
                ),
                child: text(
                  "x${_formatNumber(res.quantity)}",
                  fontSize: 10,
                  lineHeight: 1,
                  fontWeight: FontWeight.w600,
                  textColor: Colors.white,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  @override
  loadPage({
    required int page,
    required Function(List<SocialChatGiftBackpackRes>) onSuccess,
    Function? onErr,
  }) async {
    try {
      final giftList = await SCChatRoomRepository().giftBackpack();
      onSuccess(giftList.where((item) => (item.quantity ?? 0) > 0).toList());
    } catch (e) {
      if (onErr != null) {
        onErr();
      }
    }
  }

  String _formatNumber(num? value) {
    if (value == null) {
      return "0";
    }
    if (value % 1 == 0) {
      return value.toInt().toString();
    }
    return value.toString();
  }
}