import 'package:cpt_rewards/modules/rewards_address/rewards_address_page.dart';
import 'package:cpt_rewards/modules/rewards_code/rewards_code_page.dart';
import 'package:cpt_rewards/modules/rewards_history/rewards_history_page.dart';
import 'package:cpt_rewards/modules/rewards_home/rewards_home_page.dart';
import 'package:cpt_rewards/modules/rewards_list/rewards_list_page.dart';
import 'package:cpt_rewards/modules/rewards_my/rewards_my_page.dart';
import 'package:cs_resources/generated/assets.dart';
import 'package:flutter/material.dart';
import 'package:auto_route/auto_route.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:plugin_platform/engine/image/image_nine_grid.dart';
import 'package:router/ext/auto_router_extensions.dart';
import 'package:shared/utils/color_utils.dart';
import 'package:widgets/ext/ex_widget.dart';
import 'package:widgets/my_load_image.dart';

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

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

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

  Widget _buildTop(BuildContext context, WidgetRef ref, _vm) {
    // List itemsList = _vm.state.list.toList();
    return Container(
        decoration: BoxDecoration(
          border: Border(
              bottom: BorderSide(
            color: ColorUtils.string2Color('#4161D0'), // 设置bottom边框的颜色
            width: 45.0, // 设置bottom边框的宽度
          )),
          borderRadius: const BorderRadius.only(
            topLeft: Radius.circular(0.0),
            topRight: Radius.circular(0.0),
            bottomLeft: Radius.circular(30.0),
            bottomRight: Radius.circular(30.0),
          ), // 圆角
        ),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            const MyAssetImage(
              Assets.rewardsRewardsBack,
              width: 44,
              height: 44,
            ),
            // const Text(
            //   '1526 Available Points',
            //   style: TextStyle(
            //       fontSize: 18.0,
            //       color: Colors.white,
            //       fontWeight: FontWeight.w500), // 设置字体大小
            // ).paddingOnly(left: 10, top: 20, bottom: 18),
            Row(
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                const Text(
                  'Available Points',
                  style: TextStyle(
                      fontSize: 17.0,
                      color: Colors.white,
                      fontWeight: FontWeight.w500), // 设置字体大小
                ),
                Container(
                  decoration: BoxDecoration(
                    border: Border.all(color: Colors.white, width: 1), // 边框
                    borderRadius: BorderRadius.circular(8), // 圆角
                  ),
                  child: Row(
                    children: [
                      const MyAssetImage(
                        Assets.rewardsRewardsIconJb,
                        width: 23,
                        height: 23,
                      ).marginOnly(right: 5),
                      const Text(
                        '1022',
                        style: TextStyle(
                            fontSize: 15.0,
                            color: Colors.white,
                            fontWeight: FontWeight.w400), // 设置字体大小
                      ),
                    ],
                  ).paddingOnly(left: 10, top: 7, bottom: 7, right: 10),
                ),
              ],
            ).paddingOnly(left: 10, top: 20, bottom: 18),
          ],
        )
            .paddingOnly(top: 15, left: 5, right: 15, bottom: 0)
            .border(bottom: 0, color: ColorUtils.string2Color('#4161D0'))
            .backgroundColor(ColorUtils.string2Color('#4161D0')));
  }

  Widget _buildSearch(BuildContext context, WidgetRef ref, _vm) {
    // List itemsList = _vm.state.list.toList();
    return Container(
      width: MediaQuery.of(context).size.width - 30,
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(10),
        boxShadow: const [
          BoxShadow(color: Color.fromRGBO(184, 191, 217, 0.3), blurRadius: 6)
        ],
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Text(
            'Continuous Login 8 Day',
            style: TextStyle(
                fontSize: 15.0,
                color: ColorUtils.string2Color('#000000'),
                fontWeight: FontWeight.w500), // 设置字体大小
          ),
          Flex(
            direction: Axis.horizontal,
            children: [
              Expanded(
                flex: 1,
                child: Container(
                  decoration: BoxDecoration(
                    color: ColorUtils.string2Color('#F2F3F6'),
                    borderRadius: BorderRadius.circular(10),
                    border: Border.all(
                        color: ColorUtils.string2Color('#4161D0'), width: 1),
                  ),
                  height: 78,
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.center,
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Text(
                        '11/01',
                        style: TextStyle(
                            fontSize: 13.0,
                            color: ColorUtils.string2Color('#4161D0'),
                            fontWeight: FontWeight.w400), // 设置字体大小
                      ),
                      const MyAssetImage(
                        Assets.rewardsRewardsIconJb,
                        width: 23,
                        height: 23,
                      ),
                      Text(
                        '+2',
                        style: TextStyle(
                            fontSize: 15.0,
                            color: ColorUtils.string2Color('#4161D0'),
                            fontWeight: FontWeight.w500), // 设置字体大小
                      ),
                    ],
                  ),
                ),
              ),
              const SizedBox(width: 15.0),
              Expanded(
                flex: 1,
                child: Container(
                  decoration: BoxDecoration(
                    color: ColorUtils.string2Color('#4161D0'),
                    borderRadius: BorderRadius.circular(10),
                    border: Border.all(
                        color: ColorUtils.string2Color('#4161D0'), width: 1),
                  ),
                  height: 78,
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.center,
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Text(
                        'Today',
                        style: TextStyle(
                            fontSize: 13.0,
                            color: ColorUtils.string2Color('#ffffff'),
                            fontWeight: FontWeight.w400), // 设置字体大小
                      ),
                      const MyAssetImage(
                        Assets.rewardsRewardsIconJb,
                        width: 23,
                        height: 23,
                      ),
                      Text(
                        '+2',
                        style: TextStyle(
                            fontSize: 15.0,
                            color: ColorUtils.string2Color('#ffffff'),
                            fontWeight: FontWeight.w500), // 设置字体大小
                      ),
                    ],
                  ),
                ),
              ),
              const SizedBox(width: 15.0),
              Expanded(
                flex: 1,
                child: Container(
                  decoration: BoxDecoration(
                    color: ColorUtils.string2Color('#F2F3F6'),
                    borderRadius: BorderRadius.circular(10),
                    border: Border.all(
                        color: ColorUtils.string2Color('#F2F3F6'), width: 1),
                  ),
                  height: 78,
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.center,
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Text(
                        'Today',
                        style: TextStyle(
                            fontSize: 13.0,
                            color: ColorUtils.string2Color('#000000'),
                            fontWeight: FontWeight.w400), // 设置字体大小
                      ),
                      const MyAssetImage(
                        Assets.rewardsRewardsIconJb,
                        width: 23,
                        height: 23,
                      ),
                      Text(
                        '+2',
                        style: TextStyle(
                            fontSize: 15.0,
                            color: ColorUtils.string2Color('#000000'),
                            fontWeight: FontWeight.w500), // 设置字体大小
                      ),
                    ],
                  ),
                ),
              ),
              const SizedBox(width: 15.0),
              Expanded(
                flex: 1,
                child: Container(
                  decoration: BoxDecoration(
                    color: ColorUtils.string2Color('#F2F3F6'),
                    borderRadius: BorderRadius.circular(10),
                    border: Border.all(
                        color: ColorUtils.string2Color('#F2F3F6'), width: 1),
                  ),
                  height: 78,
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.center,
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Text(
                        'Today',
                        style: TextStyle(
                            fontSize: 13.0,
                            color: ColorUtils.string2Color('#000000'),
                            fontWeight: FontWeight.w400), // 设置字体大小
                      ),
                      const MyAssetImage(
                        Assets.rewardsRewardsIconJb,
                        width: 23,
                        height: 23,
                      ),
                      Text(
                        '+2',
                        style: TextStyle(
                            fontSize: 15.0,
                            color: ColorUtils.string2Color('#000000'),
                            fontWeight: FontWeight.w500), // 设置字体大小
                      ),
                    ],
                  ),
                ),
              ),
            ],
          ).marginOnly(top: 13, bottom: 13),
          Flex(
            direction: Axis.horizontal,
            children: [
              Expanded(
                flex: 1,
                child: Container(
                  decoration: BoxDecoration(
                    color: ColorUtils.string2Color('#F2F3F6'),
                    borderRadius: BorderRadius.circular(10),
                    border: Border.all(
                        color: ColorUtils.string2Color('#F2F3F6'), width: 1),
                  ),
                  height: 78,
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.center,
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Text(
                        'Today',
                        style: TextStyle(
                            fontSize: 13.0,
                            color: ColorUtils.string2Color('#000000'),
                            fontWeight: FontWeight.w400), // 设置字体大小
                      ),
                      const MyAssetImage(
                        Assets.rewardsRewardsIconJb,
                        width: 23,
                        height: 23,
                      ),
                      Text(
                        '+2',
                        style: TextStyle(
                            fontSize: 15.0,
                            color: ColorUtils.string2Color('#000000'),
                            fontWeight: FontWeight.w500), // 设置字体大小
                      ),
                    ],
                  ),
                ),
              ),
              const SizedBox(width: 15.0),
              Expanded(
                flex: 1,
                child: Container(
                  decoration: BoxDecoration(
                    color: ColorUtils.string2Color('#F2F3F6'),
                    borderRadius: BorderRadius.circular(10),
                    border: Border.all(
                        color: ColorUtils.string2Color('#F2F3F6'), width: 1),
                  ),
                  height: 78,
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.center,
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Text(
                        'Today',
                        style: TextStyle(
                            fontSize: 13.0,
                            color: ColorUtils.string2Color('#000000'),
                            fontWeight: FontWeight.w400), // 设置字体大小
                      ),
                      const MyAssetImage(
                        Assets.rewardsRewardsIconJb,
                        width: 23,
                        height: 23,
                      ),
                      Text(
                        '+2',
                        style: TextStyle(
                            fontSize: 15.0,
                            color: ColorUtils.string2Color('#000000'),
                            fontWeight: FontWeight.w500), // 设置字体大小
                      ),
                    ],
                  ),
                ),
              ),
              const SizedBox(width: 15.0),
              Expanded(
                flex: 2,
                child: Container(
                  decoration: BoxDecoration(
                    color: ColorUtils.string2Color('#F2F3F6'),
                    borderRadius: BorderRadius.circular(10),
                    border: Border.all(
                        color: ColorUtils.string2Color('#F2F3F6'), width: 1),
                  ),
                  height: 78,
                  child: Row(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Column(
                        crossAxisAlignment: CrossAxisAlignment.center,
                        // mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          Text(
                            'Today',
                            style: TextStyle(
                                fontSize: 13.0,
                                color: ColorUtils.string2Color('#000000'),
                                fontWeight: FontWeight.w400), // 设置字体大小
                          ),
                          Text(
                            '+ More',
                            style: TextStyle(
                                fontSize: 12.0,
                                color: ColorUtils.string2Color('#000000'),
                                fontWeight: FontWeight.w500), // 设置字体大小
                          ),
                        ],
                      ),
                      const MyAssetImage(
                        Assets.rewardsRewardsIconYdjb,
                        width: 67,
                        height: 57,
                      ).paddingOnly(top: 7),
                    ],
                  ).paddingOnly(top: 8, left: 13, right: 4),
                ),
              ),
            ],
          ),
        ],
      ).paddingOnly(left: 15, right: 15, top: 15, bottom: 15),
    );
  }

  Widget _buildSwiper(BuildContext context, WidgetRef ref, _vm) {
    return Container(
      // color: Colors.white,
      height: 55,
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(10),
        boxShadow: const [
          BoxShadow(color: Color.fromRGBO(184, 191, 217, 0.3), blurRadius: 6)
        ],
      ),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.center,
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Text(
            'How To Get Rewards?',
            style: TextStyle(
                fontSize: 15.0,
                color: ColorUtils.string2Color('#000000'),
                fontWeight: FontWeight.w500), // 设置字体大小
          ),
          Container(
            padding:
                const EdgeInsets.only(top: 10, bottom: 10, left: 17, right: 17),
            decoration: BoxDecoration(
              color: ColorUtils.string2Color('#4161D0'),
              borderRadius: BorderRadius.circular(5),
            ),
            child: Text(
              'Rewards',
              style: TextStyle(
                  fontSize: 14.0,
                  color: ColorUtils.string2Color('#ffffff'),
                  fontWeight: FontWeight.w400), // 设置字体大小
            ).onTap(() {
              RewardsHomePage.startInstance();
            }),
          ),
        ],
      ).paddingOnly(left: 15, right: 15),
    ).marginOnly(top: 12, bottom: 12);
  }

  Widget _buildList(BuildContext context, WidgetRef ref, _vm) {
    return Container(
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(10),
        boxShadow: const [
          BoxShadow(color: Color.fromRGBO(184, 191, 217, 0.3), blurRadius: 6)
        ],
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.center,
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Container(
            padding:
                const EdgeInsets.only(top: 15, bottom: 15, left: 15, right: 15),
            decoration: BoxDecoration(
                border: Border(
                    bottom: BorderSide(
              width: 1.0, // 底边边框的宽度
              color: ColorUtils.string2Color('#F2F3F6'), // 底边边框的颜色
            ))),
            child: Row(
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Row(
                  children: [
                    Container(
                      padding: const EdgeInsets.only(
                          top: 10, bottom: 10, left: 17, right: 17),
                      decoration: BoxDecoration(
                        color: ColorUtils.string2Color('#f2f3f6'),
                        borderRadius: BorderRadius.circular(5),
                      ),
                      child: const MyAssetImage(
                        Assets.rewardsRewardsIconIm,
                        width: 29,
                        height: 24,
                      ),
                    ).marginOnly(right: 12),
                    Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        Text(
                          'Daily Login',
                          style: TextStyle(
                              fontSize: 15.0,
                              color: ColorUtils.string2Color('#000000'),
                              fontWeight: FontWeight.w500), // 设置字体大小
                        ).marginOnly(bottom: 6),
                        Row(
                          children: [
                            Text(
                              '+2',
                              style: TextStyle(
                                  fontSize: 15.0,
                                  color: ColorUtils.string2Color('#4161D0'),
                                  fontWeight: FontWeight.w500), // 设置字体大小
                            ),
                            const MyAssetImage(
                              Assets.rewardsRewardsIconJb,
                              width: 14,
                              height: 14,
                            )
                          ],
                        )
                      ],
                    )
                  ],
                ),
                Container(
                  width: 86,
                  height: 30,
                  decoration: BoxDecoration(
                    color: ColorUtils.string2Color('#ffffff'),
                    borderRadius: BorderRadius.circular(5),
                    border: Border.all(
                        color: ColorUtils.string2Color('#4161D0'), width: 1),
                  ),
                  child: Center(
                    child: Text(
                      'Check In',
                      style: TextStyle(
                          fontSize: 14.0,
                          color: ColorUtils.string2Color('#4161D0'),
                          fontWeight: FontWeight.w400), // 设置字体大小
                    ),
                  ),
                ),
              ],
            ),
          ),
          Container(
            padding:
                const EdgeInsets.only(top: 15, bottom: 15, left: 15, right: 15),
            decoration: BoxDecoration(
                border: Border(
                    bottom: BorderSide(
              width: 1.0, // 底边边框的宽度
              color: ColorUtils.string2Color('#F2F3F6'), // 底边边框的颜色
            ))),
            child: Row(
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Row(
                  children: [
                    Container(
                      padding: const EdgeInsets.only(
                          top: 10, bottom: 10, left: 17, right: 17),
                      decoration: BoxDecoration(
                        color: ColorUtils.string2Color('#f2f3f6'),
                        borderRadius: BorderRadius.circular(5),
                      ),
                      child: const MyAssetImage(
                        Assets.rewardsRewardsIconIm,
                        width: 29,
                        height: 24,
                      ),
                    ).marginOnly(right: 12),
                    Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        Text(
                          'Daily Login',
                          style: TextStyle(
                              fontSize: 15.0,
                              color: ColorUtils.string2Color('#000000'),
                              fontWeight: FontWeight.w500), // 设置字体大小
                        ).marginOnly(bottom: 6),
                        Row(
                          children: [
                            Text(
                              '+2',
                              style: TextStyle(
                                  fontSize: 15.0,
                                  color: ColorUtils.string2Color('#4161D0'),
                                  fontWeight: FontWeight.w500), // 设置字体大小
                            ),
                            const MyAssetImage(
                              Assets.rewardsRewardsIconJb,
                              width: 14,
                              height: 14,
                            )
                          ],
                        )
                      ],
                    )
                  ],
                ),
                Container(
                  width: 86,
                  height: 30,
                  decoration: BoxDecoration(
                    color: ColorUtils.string2Color('#ffffff'),
                    borderRadius: BorderRadius.circular(5),
                    border: Border.all(
                        color: ColorUtils.string2Color('#4161D0'), width: 1),
                  ),
                  child: Center(
                    child: Text(
                      'Check In',
                      style: TextStyle(
                          fontSize: 14.0,
                          color: ColorUtils.string2Color('#4161D0'),
                          fontWeight: FontWeight.w400), // 设置字体大小
                    ),
                  ),
                ),
              ],
            ),
          ),
          Container(
            padding:
                const EdgeInsets.only(top: 15, bottom: 15, left: 15, right: 15),
            decoration: BoxDecoration(
                border: Border(
                    bottom: BorderSide(
              width: 1.0, // 底边边框的宽度
              color: ColorUtils.string2Color('#F2F3F6'), // 底边边框的颜色
            ))),
            child: Row(
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Row(
                  children: [
                    Container(
                      padding: const EdgeInsets.only(
                          top: 10, bottom: 10, left: 17, right: 17),
                      decoration: BoxDecoration(
                        color: ColorUtils.string2Color('#f2f3f6'),
                        borderRadius: BorderRadius.circular(5),
                      ),
                      child: const MyAssetImage(
                        Assets.rewardsRewardsIconIm,
                        width: 29,
                        height: 24,
                      ),
                    ).marginOnly(right: 12),
                    Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        Text(
                          'Daily Login',
                          style: TextStyle(
                              fontSize: 15.0,
                              color: ColorUtils.string2Color('#000000'),
                              fontWeight: FontWeight.w500), // 设置字体大小
                        ).marginOnly(bottom: 6),
                        Row(
                          children: [
                            Text(
                              '+2',
                              style: TextStyle(
                                  fontSize: 15.0,
                                  color: ColorUtils.string2Color('#4161D0'),
                                  fontWeight: FontWeight.w500), // 设置字体大小
                            ),
                            const MyAssetImage(
                              Assets.rewardsRewardsIconJb,
                              width: 14,
                              height: 14,
                            )
                          ],
                        )
                      ],
                    )
                  ],
                ),
                Container(
                  width: 86,
                  height: 30,
                  decoration: BoxDecoration(
                    color: ColorUtils.string2Color('#ffffff'),
                    borderRadius: BorderRadius.circular(5),
                    border: Border.all(
                        color: ColorUtils.string2Color('#4161D0'), width: 1),
                  ),
                  child: Center(
                    child: Text(
                      'Check In',
                      style: TextStyle(
                          fontSize: 14.0,
                          color: ColorUtils.string2Color('#4161D0'),
                          fontWeight: FontWeight.w400), // 设置字体大小
                    ),
                  ),
                ),
              ],
            ),
          )
        ],
      ),
    ).marginOnly(bottom: 12);
  }

  Widget _buildHistory(BuildContext context, WidgetRef ref, _vm) {
    return Container(
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(10),
        boxShadow: const [
          BoxShadow(color: Color.fromRGBO(184, 191, 217, 0.3), blurRadius: 6)
        ],
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.center,
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Row(
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Text(
                  'Points History',
                  style: TextStyle(
                      fontSize: 15.0,
                      color: ColorUtils.string2Color('#000000'),
                      fontWeight: FontWeight.w500), // 设置字体大小
                ),
                Text(
                  'More >',
                  style: TextStyle(
                      fontSize: 15.0,
                      color: ColorUtils.string2Color('#4161D0'),
                      fontWeight: FontWeight.w500), // 设置字体大小
                ).onTap(() {
                  RewardsHistoryPage.startInstance();
                })
              ]).paddingOnly(left: 15, right: 15, top: 15, bottom: 5),
          Container(
            padding:
                const EdgeInsets.only(top: 15, bottom: 15, left: 15, right: 15),
            decoration: BoxDecoration(
                border: Border(
                    bottom: BorderSide(
              width: 1.0, // 底边边框的宽度
              color: ColorUtils.string2Color('#F2F3F6'), // 底边边框的颜色
            ))),
            child: Row(
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Text(
                      'Daily Login',
                      style: TextStyle(
                          fontSize: 15.0,
                          color: ColorUtils.string2Color('#000000'),
                          fontWeight: FontWeight.w500), // 设置字体大小
                    ).marginOnly(bottom: 6),
                    Text(
                      '14 Oct 2024  10:00PM',
                      style: TextStyle(
                          fontSize: 13.0,
                          color: ColorUtils.string2Color('#808DAF'),
                          fontWeight: FontWeight.w400), // 设置字体大小
                    ),
                  ],
                ),
                Text(
                  '+2',
                  style: TextStyle(
                      fontSize: 20.0,
                      color: ColorUtils.string2Color('#FDB429'),
                      fontWeight: FontWeight.w500), // 设置字体大小
                ),
              ],
            ),
          ),
          Container(
            padding:
                const EdgeInsets.only(top: 15, bottom: 15, left: 15, right: 15),
            decoration: BoxDecoration(
                border: Border(
                    bottom: BorderSide(
              width: 1.0, // 底边边框的宽度
              color: ColorUtils.string2Color('#F2F3F6'), // 底边边框的颜色
            ))),
            child: Row(
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Text(
                      'Daily Login',
                      style: TextStyle(
                          fontSize: 15.0,
                          color: ColorUtils.string2Color('#000000'),
                          fontWeight: FontWeight.w500), // 设置字体大小
                    ).marginOnly(bottom: 6),
                    Text(
                      '14 Oct 2024  10:00PM',
                      style: TextStyle(
                          fontSize: 13.0,
                          color: ColorUtils.string2Color('#808DAF'),
                          fontWeight: FontWeight.w400), // 设置字体大小
                    ),
                  ],
                ),
                Text(
                  '+2',
                  style: TextStyle(
                      fontSize: 20.0,
                      color: ColorUtils.string2Color('#FDB429'),
                      fontWeight: FontWeight.w500), // 设置字体大小
                ),
              ],
            ),
          ),
          Container(
            padding:
                const EdgeInsets.only(top: 15, bottom: 15, left: 15, right: 15),
            decoration: BoxDecoration(
                border: Border(
                    bottom: BorderSide(
              width: 1.0, // 底边边框的宽度
              color: ColorUtils.string2Color('#F2F3F6'), // 底边边框的颜色
            ))),
            child: Row(
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Text(
                      'Daily Login',
                      style: TextStyle(
                          fontSize: 15.0,
                          color: ColorUtils.string2Color('#000000'),
                          fontWeight: FontWeight.w500), // 设置字体大小
                    ).marginOnly(bottom: 6),
                    Text(
                      '14 Oct 2024  10:00PM',
                      style: TextStyle(
                          fontSize: 13.0,
                          color: ColorUtils.string2Color('#808DAF'),
                          fontWeight: FontWeight.w400), // 设置字体大小
                    ),
                  ],
                ),
                Text(
                  '+2',
                  style: TextStyle(
                      fontSize: 20.0,
                      color: ColorUtils.string2Color('#FDB429'),
                      fontWeight: FontWeight.w500), // 设置字体大小
                ),
              ],
            ),
          ),
        ],
      ),
    ).marginOnly(bottom: 12);
  }

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final _vm = ref.read(rewardsVmProvider.notifier);

    return Scaffold(
      // appBar: AppBar(title: Text("奖励")),
      body: Column(children: [
        Expanded(
          child: SingleChildScrollView(
              scrollDirection: Axis.vertical,
              physics: const BouncingScrollPhysics(),
              clipBehavior: Clip.none,
              child: Column(
                children: [
                  _buildTop(context, ref, _vm),
                  Container(
                    transform: Matrix4.translationValues(0.0, -45.0, 0.0),
                    child: Column(
                      children: [
                        _buildSearch(context, ref, _vm),
                        _buildSwiper(context, ref, _vm),
                        _buildList(context, ref, _vm),
                        _buildHistory(context, ref, _vm),
                      ],
                    ), // 使用负数margin
                  ).paddingOnly(left: 15, right: 15),
                ],
              )),
        ),
      ]).backgroundColor(ColorUtils.string2Color('#F2F3F6')),
    );
  }
}