import 'package:cs_resources/generated/assets.dart';
import 'package:cs_resources/theme/app_colors_theme.dart';
import 'package:domain/entity/paid_service_entity.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/ext_dart.dart';
import 'package:widgets/ext/ex_widget.dart';
import 'package:widgets/my_load_image.dart';
import 'package:widgets/my_text_view.dart';

class HomeServiceCard extends StatelessWidget {
  String? cleanServiceType;
  PaidServiceList itemEntity;
  double? cardHeight;
  final Function()? onTap;
  final Function(dynamic)? onClickColleciotn;

  HomeServiceCard({
    Key? key,
    this.cleanServiceType,
    required this.itemEntity,
    this.onTap,
    this.onClickColleciotn,
    double? cardHeight,
  }) : super(key: key) {
    this.cardHeight ??= 180;
  }

  @override
  Widget build(BuildContext context) {
    List? card_resources = itemEntity.resources?? [];
    int card_id = itemEntity.id?? 0;
    String card_img = card_resources.length>0? card_resources[0]:"";
    String card_name = itemEntity.name?? "";

    int card_price = itemEntity.lowestPrice?? 0;
    bool card_liked = itemEntity.liked??false;
    int card_likes_count = itemEntity.likesCount?? 0;

    final company_name = itemEntity.merchant?.name?? "";
    return Container(
      height: cardHeight!,
      child: Column(
        children: [
          // 图片
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              Expanded(
                child: ClipRRect(
                  borderRadius: const BorderRadius.only(topLeft: Radius.circular(8), topRight: Radius.circular(8),),
                  child: MyLoadImage(
                    card_img,
                    width: 172.5,
                    height: 75,
                    isCircle: false,
                    fit: BoxFit.fitWidth,
                  ),
                ),
              ),
            ],
          ),
          // 标题
          Padding(
            padding:  EdgeInsets.only(left: 10, right: 10, top: 5,),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Expanded(
                  child: SizedBox(
                    child: MyTextView(
                      '$card_name',
                      maxLines: 2,
                      isTextEllipsis: true,
                      textAlign: TextAlign.left,
                      textColor: context.appColors.textBlack,
                      fontSize: 14,
                      isFontRegular: true,
                    ),
                  ),
                ),
              ],
            ),
          ),
          // 价格 及 收藏
          Padding(
            padding:  const EdgeInsets.only(left: 10, right: 10,top: 10),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceAround,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Expanded(
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.start,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: [
                      MyTextView(
                        'from',
                        maxLines: 1,
                        isTextEllipsis: true,
                        textAlign: TextAlign.start,
                        textColor: ColorUtils.string2Color('#666666'),
                        fontSize: 11,
                        isFontMedium: true,
                      ),
                      MyTextView(
                        '\$$card_price',
                        maxLines: 1,
                        isTextEllipsis: true,
                        textAlign: TextAlign.start,
                        textColor: ColorUtils.string2Color('#4161D0'),
                        fontSize: 15,
                        isFontMedium: true,
                        marginLeft: 2,
                      ),
                      // MyTextView(
                      //   '$',
                      //   maxLines: 1,
                      //   isTextEllipsis: true,
                      //   textAlign: TextAlign.start,
                      //   textColor: ColorUtils.string2Color('#666666'),
                      //   fontSize: 11,
                      //   isFontMedium: true,
                      // ),
                    ],
                  ),
                ),
                // 动态的 收藏数
                CollectionWidget(
                  collectionNum: card_likes_count,
                  isCollection: card_liked,
                  onClickColleciotn: onClickColleciotn,
                ),
              ],
            ),
          ),
          // 公司名称
          Expanded(
            child: MyTextView(
              company_name,
              maxLines: 1,
              isTextEllipsis: true,
              textAlign: TextAlign.start,
              marginLeft: 10,
              fontSize: 11,
              textColor: ColorUtils.string2Color('#666666'),
              alignment: Alignment.centerLeft,
              isFontRegular: true,
            ),
          )
        ],
      ),
    );
  }
}



class CollectionWidget extends HookConsumerWidget {
  int collectionNum = 0;
  bool isCollection = false;
  final Function(dynamic)? onClickColleciotn;
  CollectionWidget({
    Key? key,
    required this.collectionNum,
    required this.isCollection,
    this.onClickColleciotn,
  }) : super(key: key);
  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final collectionNumState = useState(collectionNum);
    final isCollectionState = useState(isCollection);
    return Container(
        alignment: Alignment.center,
        // decoration: BoxDecoration(
        //   color: ColorUtils.string2Color('#E5E5E5'),
        //   borderRadius: BorderRadius.circular(15),
        // ),
        child: Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              MyTextView(
                '${collectionNumState.value}',
                textColor: context.appColors.textBlack,
                fontSize: 14,
                isFontRegular: true,
                marginRight: 7,
              ),
              MyLoadImage(
                isCollectionState.value? Assets.communityLikeActive: Assets.communityLike,
                width: isCollectionState.value? 15.5:14.1,
                height: isCollectionState.value? 14:14,
              )
            ]
          // 点击 收餐/取消收藏
        ).onTap(() async{
          // Log.d("点击了收藏按钮  ${isCollectionState.value}");
          // ToastEngine.show("点击了收藏按钮 ${isCollectionState.value}");
          final result = await onClickColleciotn?.call(isCollectionState.value);
          if(result !=null && result){
            isCollectionState.value = !isCollectionState.value;
            collectionNumState.value = (collectionNumState.value + (isCollectionState.value? 1: -1))<0? 0: (collectionNumState.value + (isCollectionState.value? 1: -1));
            if(isCollectionState.value){
              // ToastEngine.show("Collect Success");
            }else {
              // ToastEngine.show("Cancel Collect Success");
            }
          }
        })
    );
  }
}