import 'package:cs_resources/generated/assets.dart';
import 'package:flutter/material.dart';
import 'package:auto_route/auto_route.dart';
import 'package:flutter/rendering.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/color_utils.dart';
import 'package:shared/utils/log_utils.dart';
import 'package:widgets/my_button.dart';
import 'package:widgets/my_load_image.dart';
import 'package:widgets/ext/ex_widget.dart';
import 'package:widgets/my_text_view.dart';
import 'package:widgets/my_appbar.dart';
import 'package:cs_resources/theme/app_colors_theme.dart';
import 'package:widgets/widget_export.dart';

import '../../../components/newfeed_card_header.dart';
import '../../../components/newsfeed_card_content.dart';
import '../../../components/newsfeed_card_footer.dart';
import '../../../router/page/community_page_router.dart';
import '../community_vm.dart';
import 'news_vm.dart';

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

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

  bool _isPreventScroll(ScrollNotification notification, WidgetRef ref){
    // 检查当前页面是否是可见的
    bool isDownOrUp = notification.metrics.axis == Axis.vertical;


    if (notification is ScrollUpdateNotification) {
      // 检查滚动位置变化
      double currentScrollPosition = notification.metrics.pixels;
      double maxScrollExtent = notification.metrics.maxScrollExtent;

      // 判断是否满足某个条件
      if (currentScrollPosition > 0 && currentScrollPosition < maxScrollExtent) {
        print('Current scroll position: $currentScrollPosition');
        // 在这里添加你的条件判断逻辑
      }

      // 只有当上下滚动时才拦截通知
      if (isDownOrUp) {
        final vm = ref.read(communityVmProvider.notifier);
        final currentTabRouter = vm.state!.tabsRouter;
        if(currentTabRouter!.activeIndex == 0){
          return false;  // false 不拦截
        }else {
          Log.d("----news_page 滚动时---拦截了其他的");
          return true;   // true 拦截
        }
      }else {
        return false;
      }
    }else if (notification is ScrollEndNotification) {
      // 检查滚动位置变化
      double currentScrollPosition = notification.metrics.pixels;
      double maxScrollExtent = notification.metrics.maxScrollExtent;

      // 判断是否满足某个条件
      if (currentScrollPosition > 0 && currentScrollPosition < maxScrollExtent) {
        print('Current scroll position: $currentScrollPosition');
        // 在这里添加你的条件判断逻辑
      }

      // 只有当上下滚动时才拦截通知
      if (isDownOrUp) {
        final vm = ref.read(communityVmProvider.notifier);
        final currentTabRouter = vm.state!.tabsRouter;
        if(currentTabRouter!.activeIndex == 0){
          return false;  // false 不拦截
        }else {
          Log.d("----news_page 滚动时---拦截了其他的");
          return true;   // true 拦截
        }
      }else {
        return true;
      }
    }else {
      return false;
    }
    // return false;
  }


  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final vm = ref.read(newsVmProvider.notifier);
    return Scaffold(
      // appBar: MyAppBar.appBar(
      //   context,
      //   "news",
      //   backgroundColor: context.appColors.whiteBG,
      // ),
      // backgroundColor: ColorUtils.string2Color("#F2F3F6"),
      body: NotificationListener<ScrollNotification>(
        onNotification: (ScrollNotification notification) {
          // 是否拦截滚动  false 表示不拦截通知
          return _isPreventScroll(notification, ref);
          // return false;
        },
        child: EasyRefresh(
          controller: EasyRefreshController(),
          key: UniqueKey(),
          // 上拉加载
          onLoad: () async{
            Log.d("----onLoad");
            vm.onLoadData();
          },
          // 下拉刷新
          onRefresh: () async{
            Log.d("----onRefresh");
            vm.refreshListData();
          },
          child: _buildNewsFeedList(context, ref, vm),
        ),
      )
    );
  }

  Widget _buildNewsItem(BuildContext context, WidgetRef ref, item, vm){
    return SizedBox(
      width: double.infinity,
      //   color: Colors.yellow,
      child: Stack(
        children: [
          Container(
            margin: const EdgeInsets.only(left: 15, right: 15,top: 14,bottom: 14),
            color: Colors.white,
            padding: const EdgeInsets.only(left: 15, right: 15,top: 17,bottom: 17),
            height: 280,
            child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  // 卡片头部(头像 标题 时间)
                  NewsFeedCardHeader(
                    key: UniqueKey(),
                    title: item['title'],
                    avator: item['avator'],
                    time: item['time'],
                  ),
                  const SizedBox(height: 15),
                  // 卡片中间 （文字和图片）
                  Expanded(
                    child: NewsFeedCardContent(
                      key: UniqueKey(),
                      content: item['content'],
                      imageUrls: item['imageUrls'],
                    ),
                  ),
                  const SizedBox(height: 26),
                  // // 卡片底部 (点赞 评论 分享)
                  NewsFeedCardFooter(
                      key: UniqueKey(),
                      isLike: item['isLike'],
                      onLike: (){
                        vm.handlerClickActionBtn('like', item);
                      },
                      onComment: (){
                        vm.handlerClickActionBtn('comments', item);
                      },
                      onShare: (){
                        vm.handlerClickActionBtn('share', item);
                      },
                  ),
                ]
            ),
          ),
          // 右上角 关注/取消关注 按钮
          Visibility(
            visible: !item['isFollow'],
            child: Positioned(
              right: 40,
              top: 35,
              child: Container(
                width: 83.5,
                height: 45.5,
                alignment: Alignment.center,
                // decoration: BoxDecoration(
                //   color:  ColorUtils.string2Color('#4161D0'),
                //   borderRadius: BorderRadius.circular(5),
                // ),
                child: MyButton(
                  text: '+Follow',
                  textColor: Colors.white,
                  backgroundColor: ColorUtils.string2Color('#4161D0'),
                  radius: 8,
                  minHeight: 27.5,
                  padding: const EdgeInsets.only(left: 5, right: 5,top:9,bottom:9),
                  fontWeight: FontWeight.w400,
                  fontSize: 14,
                  onPressed: (){
                    // Navigator.pop(context);
                  },
                ),
              )
            ),
          )
        ],
      ),
    ).onTap((){
      vm.handlerClickActionBtn(null, item);
    });
  }

  Widget _buildNewsFeedList(BuildContext context, WidgetRef ref, vm){
    final itemList = vm.state.list?? [];
    if(itemList.isEmpty){
      return const Center(child: Text('No Data'));
    }else {
      List itemsList = vm.state.list.toList();
      return ListView.builder(
        key: UniqueKey(),
        itemCount: itemsList.length,
        itemBuilder: (context, index) {
          return _buildNewsItem(context, ref, itemsList[index], vm);
        },
      );
    }
    // return Text("879424");
  }
}