YYHome/packages/cpt_community/lib/components/garage_card.dart

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:plugin_platform/engine/toast/toast_engine.dart';
import 'package:shared/utils/color_utils.dart';
import 'package:shared/utils/ext_dart.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://img2.baidu.com/it/u=3489233687,2364672159&fm=253&fmt=auto&app=120&f=JPEG?w=507&h=500',
// '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,'

// 定义一个 使用场景的 枚举
enum GarageCardUseType {
  // 默认
  forSale,
  forRent,
  myPostsForSale,
  myPostsForRent,
}

class GarageCard extends StatelessWidget {
  GarageCardUseType? useType;
  Map<String, dynamic> itemObj;
  double? cardHeight;
  final Function()? onTap;
  final Function(dynamic)? onClickColleciotn;

  GarageCard({
    Key? key,
    this.useType = GarageCardUseType.forSale,
    required this.itemObj,
    this.onTap,
    this.onClickColleciotn,
    double? cardHeight,
  }) : super(key: key) {
    this.cardHeight ??= 214;
  }

  @override
  Widget build(BuildContext context) {
    List? card_resources = itemObj.getValue<List>("resources", []) ?? [];
    String card_img = card_resources.length > 0 ? card_resources[0] : "";
    String card_title = itemObj.getValue("title", "");
    int card_price = itemObj.getValue("price", "");
    String card_created_at = itemObj.getValue("created_at", "");
    Map<String, dynamic>? card_account = itemObj.getValue<Map<String, dynamic>>("account", null);
    String card_avatar = card_account?['avatar'] ?? "";
    String card_publish_name = card_account?['name'] ?? "";
    bool card_liked = itemObj.getValue("liked", false);
    int card_likes_count = itemObj.getValue("likes_count", 0);
    return Column(
        mainAxisSize: MainAxisSize.max,
        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: 166.5,
                    height: 102.5.ap,
                    isCircle: false,
                    fit: BoxFit.cover,
                  ),
                ),
              ),
            ],
          ),

          // 标题
          Padding(
            padding: const EdgeInsets.only(left: 10, right: 10, top: 10, bottom: 5),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Expanded(
                  child: MyTextView(
                    card_title,
                    maxLines: 1,
                    isTextEllipsis: true,
                    textAlign: TextAlign.left,
                    textColor: context.appColors.textBlack,
                    fontSize: 16,
                    isFontRegular: true,
                  ),
                ),
              ],
            ),
          ),

          // 价格 及 收藏
          Padding(
            padding: const EdgeInsets.only(left: 10, right: 10, top: 0, bottom: 0),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceAround,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Expanded(
                  child: MyTextView(
                    '$card_price',
                    maxLines: 1,
                    isTextEllipsis: true,
                    textAlign: TextAlign.start,
                    textColor: ColorUtils.string2Color('#4161D0'),
                    fontSize: 18,
                    isFontMedium: true,
                  ),
                ),
                // 动态的 收藏数
                CollectionWidget(
                  collectionNum: card_likes_count,
                  isCollection: card_liked,
                  onClickColleciotn: onClickColleciotn,
                ),
              ],
            ),
          ),

          // 发布人信息
          Expanded(
            child: Padding(
                padding: EdgeInsets.only(
                  left: (useType == GarageCardUseType.forSale || useType == GarageCardUseType.forRent) ? 10 : 0,
                  right: 10,
                  bottom: (useType == GarageCardUseType.forSale || useType == GarageCardUseType.forRent) ? 10.5 :0,
                ),
                child: Row(mainAxisAlignment: MainAxisAlignment.spaceAround, crossAxisAlignment: CrossAxisAlignment.center, children: [
                  if (useType == GarageCardUseType.forSale || useType == GarageCardUseType.forRent)
                    MyLoadImage(
                      card_avatar,
                      width: 30,
                      height: 30,
                      isCircle: true,
                    )
                  else
                    const SizedBox.shrink(),
                  Expanded(
                      child: Column(
                          mainAxisAlignment: MainAxisAlignment.center,
                          crossAxisAlignment: CrossAxisAlignment.start,
                          mainAxisSize: MainAxisSize.min,
                          children: [
                        if (useType == GarageCardUseType.forSale || useType == GarageCardUseType.forRent)
                          MyTextView(
                            card_publish_name,
                            maxLines: 1,
                            isTextEllipsis: true,
                            textAlign: TextAlign.start,
                            marginLeft: 13,
                            fontSize: 12,
                            textColor: ColorUtils.string2Color('#2956B7'),
                            isFontRegular: true,
                          )
                        else
                          const SizedBox.shrink(),
                        MyTextView(
                          card_created_at,
                          maxLines: 1,
                          isTextEllipsis: true,
                          textAlign: TextAlign.start,
                          marginLeft: 13,
                          marginTop: 2.5,
                          marginBottom: 2.5,
                          fontSize: 10,
                          textColor: context.appColors.textBlack,
                          isFontRegular: true,
                        ),
                      ])),
                ])),
          )
        ],
      ).constrained(height: cardHeight);

  }
}

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(
        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: context.appColors.textBlack,
            fontSize: 14,
            isFontRegular: true,
            marginRight: 7,
          ),
          MyLoadImage(
            isCollectionState.value ? Assets.communityLikeActive : Assets.communityLike,
            width: 14.1,
            height: 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");
            }
          }
        }));
  }
}