YYHome/packages/cpt_property/lib/modules/sale/page/property_sale_page.dart

import 'package:cpt_property/modules/property/page/property_page.dart';
import 'package:cs_resources/theme/app_colors_theme.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:router/ext/auto_router_extensions.dart';
import 'package:shared/utils/ext_dart.dart';
import 'package:shared/utils/log_utils.dart';
import 'package:shared/utils/color_utils.dart';
import 'package:widgets/ext/ex_widget.dart';
import 'package:widgets/load_state_layout.dart';
import 'package:widgets/my_load_image.dart';
import 'package:widgets/my_text_view.dart';
import 'package:widgets/widget_export.dart';
import 'package:cs_resources/generated/assets.dart';

import '../../../router/page/property_page_router.dart';
import '../vm/property_sale_vm.dart';

@RoutePage()
class PropertySalePage extends HookConsumerWidget {
  const PropertySalePage({Key? key}) : super(key: key);

  //启动当前页面
  static void startInstance({BuildContext? context}) {
    if (context != null) {
      context.router.push(const PropertySalePageRoute());
    } else {
      appRouter.push(const PropertySalePageRoute());
    }
  }

  Widget _buildItemLeftSection(BuildContext context,WidgetRef ref, item, _vm) {
    return Container(
      // color: Colors.blue,
        child:
          MyTextView(
            item['title'],
            fontSize: 16,
            textColor: context.appColors.textBlack,
            isFontMedium: true,
          ),
    ).marginOnly(right: 17.5);
  }

  Widget _buildItemRightSection(BuildContext context,WidgetRef ref, Map<String, dynamic>item, _vm) {
    String price = item.getValue('price', '');
    return Container(
      color: context.appColors.textWhite,
      width: 120,
      child: TextButton(
        onPressed: (){},
        style: TextButton.styleFrom(
          foregroundColor: context.appColors.textBlack,
          backgroundColor: ColorUtils.string2Color('#EFF3FF'), // 背景颜色
          // minimumSize: const Size(91.5, 44), // 最小宽度和高度
          padding: const EdgeInsets.symmetric(horizontal: 11.0, vertical: 14), // 内边距
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(5), // 圆角
            side: BorderSide(
                color: ColorUtils.string2Color('#EFF3FF'),
                width: 1.0,
            ), // 边框
          ),
        ),
        child: MyTextView(
          '\$$price',
          fontSize: 17,
          textColor: context.appColors.textBlack,
          isFontMedium: true,
        ),
      ),
    );
  }

  // listitem
  Widget _buildSaleItem(BuildContext context,WidgetRef ref, Map<String, dynamic>item, _vm) {
    return Container(
      decoration: BoxDecoration(
        color: context.appColors.backgroundWhite,
        // borderRadius: BorderRadius.circular(5),
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.center,
        mainAxisSize: MainAxisSize.max,
        children: [
          Container(
            width: MediaQuery.of(context).size.width - 30,
            height: 100,
            margin: const EdgeInsets.only(left: 15,right: 15,top: 12.5),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Expanded(child: _buildItemLeftSection(context, ref, item, _vm)),
                Container(child: _buildItemRightSection(context, ref, item, _vm)).constrained(
                  minWidth: 120,
                ),
              ],
            ),
          ),
        ],
      ).onTap((){
        // 去详情
        // _vm.goNewsDetail(item);
      }),
    ).border(color: context.appColors.dividerDefault, bottom: 0.5);
  }

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final _vm = ref.read(propertySaleVmProvider.notifier);
    final state = ref.watch(propertySaleVmProvider);
    useEffect(() {
      // 组件挂载时执行 - 执行接口请求
      Future.microtask(() => _vm.initPageData());
      return () {
        // 组件卸载时执行
        Log.d("property_sale_page 组件卸载时执行");
      };
    }, []);

    return Scaffold(
      // appBar: AppBar(title: Text("资产")),
      backgroundColor: ColorUtils.string2Color("#F2F3F6"),
      body: EasyRefresh(
        controller: _vm.refreshController,
        // 上拉加载
        onLoad: () async{
          Log.d("----onLoad");
          _vm.loadMore();
        },
        // 下拉刷新
        onRefresh: () async{
          Log.d("----onRefresh");
          _vm.onRefresh();
        },
        child: LoadStateLayout(
          state: state.loadingState,
          errorMessage: state.errorMessage,
          errorRetry: () {
            _vm.retryRequest();
          },
          successSliverWidget: [
            SliverList(
              delegate: SliverChildBuilderDelegate(
                  (context, index){
                    return _buildSaleItem(context, ref, state.list[index], _vm);
                  },
                  childCount: state.list.length
                )
              )
          ],
        ),
      ).marginOnly(top: 5, bottom: 5),
    );
  }
}