import 'package:betting/commom/utils/color_utils.dart';
import 'package:betting/routes/app_pages.dart';
import 'package:betting/view/mobile/home_page/home_controller.dart';
import 'package:betting/view/mobile/scores/football/football_controller.dart';
import 'package:betting/view/mobile/scores/scores_controller.dart';
import 'package:date_picker_timeline/date_picker_timeline.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import '../../../commom/constants/date_format.dart';
import '../../../commom/utils/date_time_picker.dart';
import '../../../commom/utils/time_utils.dart';
import '../favourites_view/favourite_controller.dart';


class ScoresPage extends GetView<ScoresController> {
  @override
  final controller = Get.put(ScoresController());

  ScoresPage({super.key});

  @override
  Widget build(BuildContext context) {
    return GetBuilder<ScoresController>(builder: (controller) {
      return Obx(() => Container(
        margin: EdgeInsets.symmetric(horizontal: 8.w),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            controller.favouriteTeams.isNotEmpty
                ? SizedBox(
              height: 24.h,
              child: ListView.builder(
                itemCount: controller.favouriteTeams.length,
                shrinkWrap: true,
                scrollDirection: Axis.horizontal,
                itemBuilder: (context, index) {
                  return

                    InkWell(
                      onTap: (){
                        if(controller.favouriteTeams[index].name == "EDIT"){
                          Get.find<HomeController>().currentIndex.value  = 1;
                          Get.find<HomeController>().update();
                          Get.find<FavouriteController>().tabController.animateTo(2);
                        }else{
                          Get.toNamed(Routes.detailTeams, arguments: controller.favouriteTeams[index]);

                        }
                      },
                      child:  Container(
                        padding: EdgeInsets.symmetric(horizontal: 8.w),
                        decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(8.r),
                            color: Colors.white24
                        ),
                        margin: EdgeInsets.only(right: 8.w),
                        child: Row(
                          children: [
                            controller.favouriteTeams[index].name =='EDIT'? const Icon(Icons.compare_arrows,color: Colors.white) :  const Icon(Icons.logo_dev_outlined,color: Colors.white,),
                            SizedBox(width: 4.w,),
                            Text(controller.favouriteTeams[index].name,style:  TextStyle(color: Colors.white,fontSize: 10.sp)),
                          ],
                        ),),);



                },),
            ):const SizedBox() ,
            SizedBox(height: 8.h,),
            Container(
              decoration: const BoxDecoration(
                  border: Border(bottom: BorderSide(color: Colors.white60))
              ),
              child: Row(
                children: [
                  InkWell(
                    onTap: (){
                      Get.find<FootballController>().getListMatchesOnDay('', controller.outputDateToDateFormat.format(DateTime.now()),"IN PLAY");
                    },
                    child:   Container(
                      decoration: BoxDecoration(
                        color: controller.startColor.value,
                        borderRadius: BorderRadius.circular(6.r),
                      ),
                      padding: EdgeInsets.symmetric(horizontal: 8.w,vertical: 4.h),
                      child:  Text("LIVE",style: TextStyle(color: Colors.black,fontSize: 10.sp),),
                    ),
                  ),
                  Expanded(child:
                  DatePicker(
                    DateTime.now().subtract(const Duration(days: 60)),
                    initialSelectedDate:DateTime.now(),
                    selectionColor: Colors.transparent,
                    selectedTextColor: ColorUtils.PRIMARY_COLOR,
                    height: 63.h,
                    width: 48.w,
                    controller: controller.controllerDatePicker,
                    monthTextStyle: TextStyle(color: Colors.white,fontSize: 10.sp),
                    dayTextStyle: TextStyle(color: Colors.white,fontSize: 10.sp),
                    dateTextStyle: TextStyle(color: Colors.white,fontSize: 12.sp),
                    onDateChange: (date) {
                      controller.selectedDay.value = controller.outputDateToDateFormat.format(date) ;
                      Get.find<FootballController>().getListMatchesOnDay('', controller.selectedDay,'');
                      controller.selectDate = date;
                    },

                  )),
                  InkWell(
                    onTap: () {
                      selectDate(controller.controllerDate.value.text,
                          DateTimeFormat.formatDateShort,
                          context);
                    },
                    child: const Row(
                      children: [
                        Icon(Icons.calendar_month_outlined,color: Colors.white,),
                        Icon(Icons.arrow_drop_down,color: Colors.white,)
                      ],
                    ),
                  )
                ],
              ),
            ),
            Expanded(child:
            controller.sport!),
            SizedBox(
              height: 60.h,
            )
          ],
        ),
      ) );
    },);
  }
  selectDate(stringTime, format, context) async {
    var current = controller.selectDate;
    if (!stringTime.isEmpty) {
      current = TimeUtils.convertStringToDate(stringTime, format);
    }
    var date = "";
    await DateTimePicker.showDatePicker(Get.context!, current,
        initialDate: DateTime(DateTime.now().year - 10))
        .then((value) async {
      date = TimeUtils.convertDateTimeToFormat(value, DateTimeFormat.formatDateBetting);

    });

    if (date.isNotEmpty) {
      controller.selectDate= DateTime.parse(date);
      controller.controllerDatePicker.setDateAndAnimate(DateTime.parse(date));
      controller.update();
      Get.find<FootballController>().getListMatchesOnDay('', date, '');
      Get.find<FootballController>().listMatches.refresh();

    }
    FocusScope.of(context).requestFocus(FocusNode());
  }

}

