YYHome/packages/cpt_services/lib/components/chooseHouseCleanContent.dart

import 'package:cpt_services/components/status_card_item.dart';
import 'package:cs_resources/theme/app_colors_theme.dart';
import 'package:domain/entity/paid_service_detail_entity.dart';
import 'package:flutter/material.dart';
import 'package:auto_route/auto_route.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/log_utils.dart';
import 'package:widgets/my_button.dart';
import 'package:widgets/my_text_view.dart';
import 'package:widgets/utils/dark_theme_util.dart';
import 'package:widgets/widget_export.dart';
import 'package:widgets/my_cart_num.dart';
import 'chooseHouseCleanContent_state.dart';
import 'chooseHouseCleanContent_vm.dart';

class ChooseHouseCleanContent extends HookConsumerWidget {
  final int id;
  final String cleanServiceType;
  final String? useScence;
  final List<PaidServiceDetailProducts> products;

  const ChooseHouseCleanContent({Key? key,required this.id, required this.cleanServiceType, required this.products, this.useScence}) : super(key: key);

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final vm = ref.read(chooseHouseCleanContentVmProvider.notifier);
    List<HouseCleanContentItem>? houseCleanList = ref.watch(chooseHouseCleanContentVmProvider.select((state) => state.houseCleanList));
    useEffect((){
      vm.setInitPageData(context, {
        'id': id,
        'cleanServiceType': cleanServiceType,
        'products': products,
        'useScence': useScence,
      });
      // 组件挂载时执行 - 执行接口请求
      // Future.microtask(() => vm.initPageData());
      return () {
        // 组件卸载时执行
      };
    },[]);

    return Container(
      padding: EdgeInsets.only(left: 0, right: 0, top: 10, bottom: 10),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.start,
        crossAxisAlignment: CrossAxisAlignment.start,
        children:  houseCleanList != null && houseCleanList.isNotEmpty? List.generate(houseCleanList!.length, (index){
          HouseCleanContentItem currentItem = houseCleanList![index];
          // 如何用ref  去watch  state中的 houseCleanList中的第index 变化
          return _buildItem(context, currentItem, index, vm, ref);
        }): [],
      ),
    );
  }


  Widget _buildItem(BuildContext context, HouseCleanContentItem HouseCleanItem, int index, ChooseHouseCleanContentVm vm, WidgetRef ref){
    final title = HouseCleanItem.name??'';
    final areaSizeRange = HouseCleanItem.areaSizeRange??'';
    final num = HouseCleanItem.num?? 1;
    final price = HouseCleanItem.price?? 0;

    // bool isMultileSelect = ref.watch(chooseHouseCleanContentVmProvider.select((state) => state.isMultileSelect))?? false;
    bool isChecked = HouseCleanItem.isChecked??false;
    bool isDisable = HouseCleanItem.isDisable??false;
    if(useScence !=null){
      isDisable = true;
    }else {
      isDisable = false;
    }
    // final isCheckedState = useState<bool>(isChecked);
    // final isDisable = useState<bool>(disabled);

    return Container(
      padding: const EdgeInsets.only(left: 10, right: 10, top: 10, bottom: 10),
      margin: const EdgeInsets.only(left: 15, right: 15, top: 0, bottom: 0),
      color: context.appColors.whiteBG,
      child: Column(
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            mainAxisSize: MainAxisSize.max,
            children: [
              Expanded(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    MyTextView(
                      title,
                      fontSize: 16,
                      isFontMedium: true,
                      textColor: context.appColors.textBlack,
                    ),
                    MyTextView(
                      areaSizeRange,
                      fontSize: 15,
                      isFontRegular: true,
                      textColor: context.appColors.textDarkGray999,
                      marginTop: 5,
                    ),
                  ],
                ),
              ),
              // MyCartNum(onChange: (value){
              //   vm.handlerChangeNum(context, value, index);
              // })
              // MyButton(
              //   text: '\$$price',
              //   onPressed: (){
              //       // vm.handlerChangeNum(context, value, index);
              //   },
              //   fontSize: 19,
              //   fontWeight: FontWeight.w500,
              // )
              MyButton(
                text: '\$$price',
                onPressed: (){
                  if(!isDisable){
                    vm.handlerChangeItemChecked(context, index);
                  }
                },
                minWidth: 80,
                minHeight: 40,
                fontSize: 19,
                fontWeight: FontWeight.w500,
                enable: !isDisable,
                textColor:  DarkThemeUtil.multiColors(context, !isChecked? context.appColors.textPrimary : context.appColors.textWhite, darkColor: isChecked? context.appColors.textPrimary :Colors.white)  ,
                backgroundColor: !isChecked ? context.appColors.textWhite : AppColorsTheme.colorPrimary,
                disabledBackgroundColor: context.appColors.disEnableGray,
                disabledTextColor: context.appColors.textWhite,
              ),
            ],
          ),
          // Divider(),
        ],
      ),
    );
  }
}