import 'package:betting/commom/utils/color_utils.dart';
import 'package:betting/view/mobile/find/detail_matches_in_regions/feed_match/commentary_view/commentary_view.dart';
import 'package:betting/view/mobile/find/detail_matches_in_regions/feed_match/feed_match_controller.dart';
import 'package:betting/view/mobile/find/detail_matches_in_regions/feed_match/highlights_view/highlights_view.dart';
import 'package:betting/view/mobile/home_page/home_controller.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

class FeedMatchView extends StatelessWidget {
  FeedMatchView({Key? key}) : super(key: key);
  final feedMatchController = Get.put(FeedMatchController());

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 10),
      child: RefreshIndicator(
        onRefresh: () async{
          Get.find<HomeController>().onRefreshPressed();

        },
        color: ColorUtils.PRIMARY_COLOR,
        child: SingleChildScrollView(
          physics: const ClampingScrollPhysics(),
          child: SizedBox(
            height: Get.height,
            width: Get.width,
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                const SizedBox(height: 10,),
                SizedBox(
                  height: 30,
                  child: ListView.builder(
                    shrinkWrap: true,
                    itemCount: feedMatchController.options.length,
                    scrollDirection: Axis.horizontal,
                    physics: const NeverScrollableScrollPhysics(),
                    itemBuilder: (context, index) {
                      return InkWell(
                        onTap: () {
                          feedMatchController.indexClick.value = index;
                          feedMatchController.pageController.animateToPage(index,
                              duration: const Duration(seconds: 1),
                              curve: Curves.easeOutBack);
                        },
                        child: Obx(() => Container(
                            margin: const EdgeInsets.only(right: 8),
                            padding: const EdgeInsets.symmetric(
                                horizontal: 12, vertical: 0),
                            decoration: BoxDecoration(
                                color: feedMatchController.indexClick.value == index?Colors.white:Colors.transparent,
                                borderRadius: BorderRadius.circular(24.r),
                                border: Border.all(color: feedMatchController.indexClick.value == index?Colors.transparent:Colors.white60)
                            ),
                            alignment: Alignment.center,
                            child: Text(feedMatchController.options[index],
                                textAlign: TextAlign.center,
                                style: TextStyle(
                                    color:
                                    feedMatchController.indexClick.value == index
                                        ? Colors.black
                                        : Colors.white54,
                                    fontSize: 14,
                                    fontWeight: FontWeight.w600)),
                          ),
                        ),
                      );
                    },
                  ),
                ),
                const SizedBox(
                  height: 25,
                ),
                Expanded(
                  child: PageView(
                    controller: feedMatchController.pageController,
                    onPageChanged: (value) {
                      feedMatchController.onPageViewChange(value);
                    },
                    physics: const NeverScrollableScrollPhysics(),
                    children: [
                      CommentaryView(),
                      HighlightsView(),
                    ],
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}
