import 'package:easy_refresh/easy_refresh.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:news_app/constant/size_res.dart';
import 'package:news_app/extension/base.dart';
import 'package:news_app/provider/msg_center_provider.dart';
import 'package:news_app/widget/empty_1_widget.dart';
import 'package:news_app/widget/my_txt.dart';

import '../../constant/color_res.dart';
import '../../model/msg_center_model.dart';
import '../topic/user_head_widget.dart';

/// @author: bo.zeng
/// @email: cnhbwds@gmail.com
/// @date: 2025 2025/4/9 16:00
/// @description:
class MsgCenterPage extends StatefulWidget {
  const MsgCenterPage({super.key});

  @override
  State<MsgCenterPage> createState() => _MsgCenterPageState();
}

class _MsgCenterPageState extends State<MsgCenterPage> {
  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 2,
      child: Scaffold(
        backgroundColor: Colors.white,
        appBar: AppBar(
          title: myTxt(
            text: "消息中心",
            fontSize: 18.sp,
            fontWeight: FontWeight.bold,
          ),
          // 移除阴影
          scrolledUnderElevation: 0,
          // 禁用滚动时的阴影变化
          backgroundColor: Colors.white,
          centerTitle: true,
          bottom: TabBar(
            tabAlignment: TabAlignment.center,
            isScrollable: false,
            indicatorColor: color2877FF,
            dividerHeight: 0,
            labelColor: color2877FF,
            // 选中标签颜色
            unselectedLabelColor: color7788A0,
            labelStyle: TextStyle(fontSize: 16.sp, fontWeight: FontWeight.bold),
            unselectedLabelStyle: TextStyle(
              fontSize: 16.sp,
              fontWeight: FontWeight.bold,
            ),
            tabs: [Tab(text: "获回复"), Tab(text: "被点赞")],
          ),
        ),
        body: TabBarView(children: [_ReplyListPage(), _LikeListPage()]),
      ),
    );
  }
}

class _ReplyListPage extends ConsumerStatefulWidget {
  const _ReplyListPage();

  @override
  ConsumerState<_ReplyListPage> createState() => _ReplyListPageState();
}

final msgCenterProvider =
    NotifierProvider.family<MsgCenterLikeProvider, UserMsgLike, String>(() {
      return MsgCenterLikeProvider();
    });

class _ReplyListPageState extends ConsumerState<_ReplyListPage> {
  int pageNum = 0;
  int total = 0;

  @override
  void initState() {
    super.initState();
    ref
        .read(msgCenterProvider("reply").notifier)
        .fetchMsgCenterLike(pageNum: pageNum);
  }

  @override
  Widget build(BuildContext context) {
    final replies = ref.watch(msgCenterProvider("reply"));
    ref.listen(msgCenterProvider("reply"), (pre, next) {
      total = next.rows?.length ?? 0;
    });
    return replies.rows?.isEmpty == true
        ? Empty1widget()
        : EasyRefresh.builder(
          onRefresh: () async {
            pageNum = 0;
            await ref
                .read(msgCenterProvider("reply").notifier)
                .fetchMsgCenterLike(pageNum: pageNum);
            return IndicatorResult.success;
          },
          onLoad: () async {
            if (total >= replies.total.safeValue) {
              return IndicatorResult.noMore;
            } else {
              pageNum++;
              await ref
                  .read(msgCenterProvider("like").notifier)
                  .fetchMsgCenterLike(pageNum: pageNum);
              return IndicatorResult.success;
            }
          },
          childBuilder: (context, py) {
            return ListView.separated(
              padding: EdgeInsets.symmetric(horizontal: horizontalPadding),
              itemBuilder: (BuildContext context, int index) {
                MsgCenterModelRows data =
                    replies.rows?[index] ?? MsgCenterModelRows();
                return Padding(
                  padding: EdgeInsets.symmetric(vertical: 12.h),
                  child: Column(
                    spacing: 5.h,
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Row(
                        crossAxisAlignment: CrossAxisAlignment.center,
                        spacing: 5.w,
                        children: [
                          CircleAvatar(
                            radius: 11,
                            backgroundImage: NetworkImage(
                              data.fromMember?.avatar ?? "",
                            ), // 替换为实际头像路径
                          ),
                          myTxt(
                            text:
                                "${data.fromMember?.nickname} 回复 ${data.toMember?.nickname}",
                            fontSize: 15.sp,
                            fontWeight: FontWeight.bold,
                          ),
                        ],
                      ),
                      Padding(
                        padding: EdgeInsets.only(left: 32.w),
                        child: myTxt(text: data.content ?? "", fontSize: 15.sp),
                      ),
                      Row(
                        spacing: 20.w,
                        children: [
                          Padding(
                            padding: EdgeInsets.only(left: 32.w),
                            child: myTxt(
                              text: data.createTime ?? "",
                              fontSize: 12.sp,
                              color: Colors.grey,
                            ),
                          ),
                        ],
                      ),
                    ],
                  ),
                );
              },
              separatorBuilder: (BuildContext context, int index) {
                return Divider(height: 0.5.h, color: Colors.grey[200]);
              },
              itemCount: replies.rows?.length ?? 0,
            );
          },
        );
  }
}

class _LikeListPage extends ConsumerStatefulWidget {
  const _LikeListPage();

  @override
  ConsumerState<_LikeListPage> createState() => _LikeListPageState();
}

class _LikeListPageState extends ConsumerState<_LikeListPage> {
  int pageNum = 0;
  int currentTotal = 0;

  @override
  void initState() {
    super.initState();
    ref
        .read(msgCenterProvider("like").notifier)
        .fetchMsgCenterLike(pageNum: pageNum);
  }

  @override
  Widget build(BuildContext context) {
    final likes = ref.watch(msgCenterProvider("like"));
    ref.listen(msgCenterProvider("like"), (pre, next) {
      currentTotal = next.rows?.length ?? 0;
    });
    return likes.rows?.isEmpty == true
        ? Empty1widget()
        : EasyRefresh.builder(
          onRefresh: () async {
            pageNum = 0;
            await ref
                .read(msgCenterProvider("like").notifier)
                .fetchMsgCenterLike(pageNum: pageNum);
            return IndicatorResult.success;
          },
          onLoad: () async {
            if (currentTotal >= likes.total.safeValue) {
              return IndicatorResult.noMore;
            } else {
              pageNum++;
              await ref
                  .read(msgCenterProvider("like").notifier)
                  .fetchMsgCenterLike(pageNum: pageNum);
              return IndicatorResult.success;
            }
          },
          childBuilder: (context, py) {
            return ListView.separated(
              padding: EdgeInsets.symmetric(horizontal: horizontalPadding),
              itemBuilder: (BuildContext context, int index) {
                MsgCenterModelRows data =
                    likes.rows?[index] ?? MsgCenterModelRows();
                return Padding(
                  padding: EdgeInsets.symmetric(vertical: 10.h),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    spacing: 5.h,
                    children: [
                      UserHeadWidget(
                        nickname: data.fromMember?.nickname ?? "",
                        avatar: data.fromMember?.avatar ?? "",
                        time: data.createTime ?? "",
                      ),
                      myTxt(text: "赞了你的评论", fontSize: 14.sp),
                      Container(
                        color: colorF5F7FA,
                        padding: EdgeInsets.all(10.w),
                        alignment: Alignment.centerLeft,
                        child: myTxt(
                          text: data.relateContent ?? "",
                          fontSize: 13.sp,
                          color: color7788A0
                        ),
                      ),
                    ],
                  ),
                );
              },
              separatorBuilder: (BuildContext context, int index) {
                return SizedBox(height: 10.h);
              },
              itemCount: likes.rows?.length ?? 0,
            );
          },
        );
  }
}