import 'package:cs_resources/generated/assets.dart';
import 'package:cs_resources/theme/app_colors_theme.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:shared/utils/color_utils.dart';
import 'package:shared/utils/log_utils.dart';
import 'package:widgets/ext/ex_widget.dart';
import 'package:widgets/my_load_image.dart';
import 'package:widgets/my_text_view.dart';

import '../modules/garage/for_sale/for_sale_vm.dart';

// 'id':1,
// 'goods_img':  'https://img.alicdn.com/tfs/TB1h.o9O4MPMeJjy1XaXXcSsFXa-640-360.jpg',
// 'title': 'Electronic keyboard',
// 'price': '\$66',
// 'isCollection': true,
// 'collection_num': '12',
// 'publisher': 'William Jefferson',
// 'publish_time': 'June 17,2016 at 7:23 p.m.',
// 'publisher_avator': Assets.communityCamera,'





class GarageCardHeader extends StatelessWidget {
  Map<String, dynamic> itemObj;
  final Function()? onTap;

  GarageCardHeader({
    Key? key,
    required this.itemObj,
    this.onTap,
  }) : super(key: key);



  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Row(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Expanded(
              child: MyLoadImage(
                itemObj['goods_img'],
                width: 166.5,
                height: 102.5,
                isCircle: false,
                fit: BoxFit.cover,
              ).onTap(() {
                // 点击头像
                // onTap?.call();
              }),
            ),
          ],
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Expanded(
              child: MyTextView(
                itemObj['title'],
                maxLines: 1,
                isTextEllipsis: true,
                textAlign: TextAlign.center,
                textColor: context.appColors.textBlack,
                fontSize: 16,
                isFontRegular: true,
                marginLeft: 12,
                marginRight: 12,
              ),
            ),
          ],
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Expanded(
              child: MyTextView(
                itemObj['price'],
                maxLines: 1,
                isTextEllipsis: true,
                textAlign: TextAlign.start,
                textColor: ColorUtils.string2Color('#4161D0'),
                fontSize: 18,
                isFontMedium: true,
              ),
            ),
            // 动态的 收藏数
            CollectionWidget(collectionNum: itemObj['collection_num'], isCollection: itemObj['isCollection']),
          ],
        ),
      ],
    );
  }
}



class CollectionWidget extends HookConsumerWidget {
  int collectionNum = 0;
  bool isCollection = false;
  CollectionWidget({
    Key? key,
    required this.collectionNum,
    required this.isCollection,
  }) : super(key: key);
  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final collectionNumState = useState(collectionNum);
    final isCollectionState = useState(isCollection);

    return Container(
      width: 60,
      height: 30,
      alignment: Alignment.center,
      decoration: BoxDecoration(
        color: ColorUtils.string2Color('#E5E5E5'),
        borderRadius: BorderRadius.circular(15),
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          MyTextView(
            '${collectionNumState.value}',
            textColor: ColorUtils.string2Color('#999999'),
            fontSize: 14,
            isFontRegular: true,
          ),
          MyLoadImage(
            isCollectionState.value? Assets.communityLikeActive: Assets.communityLike,
            width: 14,
            height: 14,
          )
        ]
      ).onTap((){
        // 点击 收餐/取消收藏
        Log.d("点击了收藏按钮");
      })
    );
  }
}