import 'package:cs_resources/theme/app_colors_theme.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:auto_route/auto_route.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:router/ext/auto_router_extensions.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/my_appbar.dart';
import 'package:widgets/my_load_image.dart';
import 'package:widgets/shatter/picker_container.dart';
import 'package:widgets/widget_export.dart';
import 'package:cs_resources/generated/assets.dart';

import '../../../router/page/rewards_page_router.dart';
import './rewards_address_vm.dart';

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

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

  Widget _buildItemLeftSection(BuildContext context, WidgetRef ref, item, _vm) {
    return Column(
      children: [
        Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            const Text(
              maxLines: 1, // 设置最大行数为2
              overflow: TextOverflow.ellipsis, // 超出部分用省略号表示
              'Delibowl Group',
              style: TextStyle(
                  fontSize: 16.0,
                  color: Colors.black,
                  fontWeight: FontWeight.w500),
            ),
            Row(
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                const MyAssetImage(
                  Assets.rewardsRewardsIconAddes,
                  width: 15,
                  height: 19,
                ).marginOnly(right: 10),
                const Expanded(
                  child: Text(
                    maxLines: 2, // 设置最大行数为2
                    overflow: TextOverflow.ellipsis,
                    softWrap: true, // 启用自动换行
                    '176 Orchard Rd, #02-29/30 Song Fa Bak Kut Teh The Centrepoint, Singapore 238843',
                    style: TextStyle(
                        fontSize: 15.0,
                        color: Color.fromARGB(255, 69, 33, 33),
                        fontWeight: FontWeight.w400),
                  ),
                ),
              ],
            ).marginOnly(top: 10, bottom: 10),
            Container(
              height: 40,
              decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: const BorderRadius.all(Radius.circular(6.0)),
                border: Border.all(
                    color: ColorUtils.string2Color('#4161D0'), width: 1.0),
              ),
              child: Center(
                child: Text(
                  '+65 26593458',
                  style: TextStyle(
                      fontSize: 15.0,
                      color: ColorUtils.string2Color('#4161D0'),
                      fontWeight: FontWeight.w500),
                ),
              ),
            ),
          ],
        ),
      ],
    );
  }

  // listitem
  Widget _buildSaleItem(BuildContext context, WidgetRef ref, item, _vm) {
    return Container(
      decoration: const BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.all(Radius.circular(6.0)),
        boxShadow: [
          BoxShadow(color: Color.fromRGBO(184, 191, 217, 0.3), blurRadius: 6)
        ],
      ),
      child: Column(
        children: [
          SizedBox(
            width: MediaQuery.of(context).size.width - 30,
            height: 160,
            // margin: const EdgeInsets.only(left: 15, right: 15, top: 12.5),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              mainAxisAlignment: MainAxisAlignment.start,
              children: [_buildItemLeftSection(context, ref, item, _vm)],
            ).paddingOnly(left: 20, right: 20, top: 15),
          ).constrained(
            minHeight: 160,
          ),
        ],
      ),
    ).marginOnly(left: 15, bottom: 15, right: 15);
  }

  // list
  Widget _buildSaleList(BuildContext context, WidgetRef ref, _vm) {
    List itemsList = _vm.state.list.toList();
    return ListView.builder(
      itemCount: itemsList.length,
      itemBuilder: (context, index) {
        return _buildSaleItem(context, ref, itemsList[index], _vm);
      },
    );
  }

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final _vm = ref.read(rewardsAddressVmProvider.notifier);
    final state = ref.watch(rewardsAddressVmProvider);
    return Scaffold(
      appBar: MyAppBar.appBar(
        context,
        "Redeem Deal At",
        backgroundColor: context.appColors.whiteBG,
      ),
      body: Container(
        child: Column(
          children: [
            Expanded(
              child: EasyRefresh(
                // 上拉加载
                onLoad: () async {
                  Log.d("----onLoad");
                  _vm.onLoadData();
                },
                // 下拉刷新
                onRefresh: () async {
                  Log.d("----onRefresh");
                  _vm.refreshListData();
                },
                child: Container(
                    color: ColorUtils.string2Color('#F2F3F6'),
                    padding: const EdgeInsets.only(top: 15),
                    child: _buildSaleList(context, ref, _vm)),
              ),
            )
          ],
        ),
      ),
    );
  }
}