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:go_router/go_router.dart';
import 'package:news_app/extension/base.dart';
import 'package:news_app/model/activity_model.dart';
import 'package:news_app/provider/activity_search_provider.dart';

import '../../constant/color_res.dart';
import '../../constant/size_res.dart';
import '../../widget/load_image.dart';
import '../../widget/my_txt.dart';
import '../activity/activity_card_widget.dart';

final searchProvider = NotifierProvider<ActivitySearchProvider, ActivitySearchData>(
      () => ActivitySearchProvider(),
);

class ActivitySearchPage extends ConsumerStatefulWidget {
  const ActivitySearchPage({super.key});

  @override
  ConsumerState<ActivitySearchPage> createState() => _ActivitySearchPageState();
}

class _ActivitySearchPageState extends ConsumerState<ActivitySearchPage> {
  int pageNum = 0;
  String keyword = '';
  int total = 0;

  final TextEditingController _searchController = TextEditingController();

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    ref.read(searchProvider.notifier)
        .fetchActivityHotWord("activity");
  }

  @override
  void dispose() {
    _searchController.dispose();
    // TODO: implement dispose
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    final result = ref.watch(searchProvider);
    ref.listen(searchProvider, (pre, next) {
      total = next.searchModel?.rows?.length ?? 0;
    });
    return Scaffold(
      appBar: AppBar(
        scrolledUnderElevation: 0,
        title: SizedBox(
          height: 40.h,
          child: TextField(
            controller: _searchController,
            textInputAction: TextInputAction.search,
            decoration: InputDecoration(
              hintText: '输入您想搜索的内容',
              hintStyle: TextStyle(color: color001842, fontSize: 16),
              border: OutlineInputBorder(
                borderRadius: BorderRadius.circular(30.r),
                borderSide: BorderSide.none,
              ),
              filled: true,
              prefixIcon: Icon(Icons.search, color: color66748E),
              fillColor: colorF9F9F9,
              contentPadding: EdgeInsets.zero,
            ),
            style: TextStyle(color: color333333, fontSize: 16),
            cursorColor: color333333,
            onSubmitted: (value) {
              keyword = value;
              if (keyword.isNotEmpty) {
                ref.read(searchProvider.notifier).fetchSearch(keyword, 0);
              }
            },
          ),
        ),
      ),
      body: EasyRefresh.builder(
        onLoad: () async {
          if (total >= (result.searchModel?.total ?? 0).safeValue) {
            return IndicatorResult.noMore;
          } else {
            pageNum++;
            await ref
                .read(searchProvider.notifier)
                .fetchSearch(keyword, pageNum);
            return IndicatorResult.success;
          }
        },
        childBuilder: (context, py) {
          return CustomScrollView(
            physics:py,
            slivers: [
              SliverToBoxAdapter(
                child: Padding(
                  padding: EdgeInsets.symmetric(
                    horizontal: horizontalPadding,
                    vertical: horizontalPadding+6.h,
                  ),
                  child: Row(
                    crossAxisAlignment: CrossAxisAlignment.center,
                    // mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      LoadAssetImage('search_hot',width: 12.w,height: 12.h,),
                      SizedBox(width: 2.w,),
                      myTxt(
                        text: "热门搜索",
                        color: Colors.black,
                        fontWeight: FontWeight.bold,
                        fontSize: 14.sp,
                      ),
                    ],
                  ),
                ),
              ),
              SliverPadding(
                padding: EdgeInsets.symmetric(
                  horizontal: horizontalPadding,
                ),
                sliver: SliverGrid.count(
                  crossAxisCount: 2,
                  mainAxisSpacing: 10.w,
                  crossAxisSpacing: 10.w,
                  childAspectRatio: 1 / 0.1,
                  children: [
                    ...List.generate(
                      (result.hotWords).length,
                          (index) {
                        return GestureDetector(
                          onTap: (){
                            pageNum = 0;
                            keyword = result.hotWords[index].word ?? '';
                            _searchController.text = keyword;
                            ref.read(searchProvider.notifier)
                                .fetchSearch(keyword, pageNum);
                          },
                          child: myTxt(
                            text: result.hotWords[index].word ?? '',
                            color: Colors.black,
                            fontWeight: FontWeight.normal,
                            fontSize: 14.sp,
                          ),
                        );
                      },
                    ),
                  ],
                ),
              ),
              SliverPadding(
                padding: EdgeInsets.all(horizontalPadding),
                sliver: SliverList.separated(
                  separatorBuilder: (context, index) {
                    return SizedBox(height: 10.h);
                  },
                  itemBuilder: (context, index) {
                    return GestureDetector(
                      onTap: (){
                        context.push(
                          "/activity/detail",
                          extra: result.searchModel?.rows?[index]?.contentId ?? '',
                        );
                      },
                        child: ActivityCardWidget(cellData:result.searchModel?.rows?[index] ?? ActivityModelRecord()));
                  },
                  itemCount: result.searchModel?.rows?.length ?? 0,
                ),
              ),
            ],
          );

          //   ListView.separated(
          //   padding: EdgeInsets.all(horizontalPadding),
          //   separatorBuilder: (context, index) {
          //     return Container(height: 10.h);
          //   },
          //   physics: py,
          //   itemBuilder: (context, index) {
          //     return ActivityCardWidget(cellData:result.searchModel?.rows?[index] ?? ActivityModelRecord());
          //   },
          //   itemCount: result.searchModel?.rows?.length ?? 0,
          // );
        },
      ),
    );
  }
}