import 'package:betting/commom/widget/loading_custom.dart';
import 'package:betting/data/model/res/matches/matches.dart';
import 'package:betting/view/mobile/favourites_view/widgets/toast_wiget.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:intl/intl.dart';
import '../../../../../../commom/utils/color_utils.dart';
import '../../../../../../commom/widget/cache_network_custom.dart';
import '../../../../../../routes/app_pages.dart';
import 'matches_football_controller.dart';

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

  MatchesFootballPage({super.key});

  @override
  Widget build(BuildContext context) {
    return Obx(() => (controller.isLoading.value == true) ?
    const LoadingCustom() :
    SingleChildScrollView(
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Row(
              children: [
                IntrinsicWidth(
                  child: Container(
                    padding: EdgeInsets.symmetric(horizontal: 12.w, vertical: 4.h),
                    margin: EdgeInsets.symmetric(horizontal: 12.w),
                    height: 24.h,
                    decoration: BoxDecoration(border: Border.all(
                        color: const Color.fromRGBO(192, 192, 192, 1)),
                        borderRadius: BorderRadius.circular(8)),
                    child: Theme(
                      data: Theme.of(context).copyWith(
                        canvasColor: Colors.white,
                      ),
                      child: DropdownButtonHideUnderline(
                        child: DropdownButton(
                          isExpanded: true,
                          iconSize: 0,
                          icon: const Visibility(
                              visible: false,
                              child: Icon(Icons.arrow_downward)),
                          elevation: 16,
                          hint: controller.stage.value != "" ?
                          Row(
                            children: [
                              Text(
                                controller.stage.value,
                                style: TextStyle(
                                    fontSize: 14.sp,
                                    fontWeight: FontWeight.w400,
                                    color: ColorUtils.PRIMARY_COLOR),
                              ),
                             SizedBox(
                               width: 50.w,
                             ),
                             const Icon(
                               Icons.keyboard_arrow_down,
                               color: Colors.white,
                               size: 18,
                             )
                           ],
                          ) : Row(
                            children: [
                              Text(
                                'All Stages',
                                style: TextStyle(
                                    fontSize: 14.sp,
                                    fontWeight: FontWeight.w400,
                                    color: Colors.black),
                              ),
                              SizedBox(
                                width: 50.w,
                              ),
                              const Icon(
                                Icons.keyboard_arrow_down,
                                color: Colors.white,
                                size: 18,
                              )
                            ],
                          ),
                          items: ['All Stages', 'Final', 'Semi Finals',].map((value) {
                             return DropdownMenuItem<String>(
                               value: value,
                               child: Text(
                                 value,
                                 style: TextStyle(
                                   fontSize: 14.sp,
                                   fontWeight: FontWeight.w400,
                                   color: ColorUtils.PRIMARY_COLOR),
                               ),
                             );
                             },
                          ).toList(),
                          onChanged: (String? value) {},
                        ),
                      ),
                    ),
                  ),
                ),
                SizedBox(
                  width: 16.w,
                ),
                Container(
                  padding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 4.h),
                  decoration: BoxDecoration(
                    color: Colors.white,
                    borderRadius: BorderRadius.circular(24.r)),
                  child: const Text(
                    "RESULTS",
                    style: TextStyle(color: Colors.black, fontWeight: FontWeight.bold),),
                ),
              ],
            ),
            ListView.builder(
                padding: EdgeInsets.zero,
                physics: const NeverScrollableScrollPhysics(),
                itemCount: controller.schedules.length,
                shrinkWrap: true,
                itemBuilder: (context, index) {
                  return Column(
                    children: [
                      InkWell(
                        child: Container(
                          margin: EdgeInsets.symmetric(vertical: 8.h),
                          child: Row(
                            children: [
                              SizedBox(
                                width: 8.w,
                              ),
                              Column(
                                crossAxisAlignment:
                                CrossAxisAlignment.start,
                                children: [
                                  Text(
                                    controller.schedules[index].date,
                                    style: TextStyle(
                                        color: Colors.white,
                                        fontSize: 14.sp,
                                        fontWeight: FontWeight.bold),
                                  ),
                                  //Text("FA Cup Final",style: TextStyle(color: Colors.white60,fontSize: 12.sp),),
                                ],
                              ),
                            ],
                          ),
                        ),
                      ),
                      Container(
                        margin: EdgeInsets.symmetric(horizontal: 8.w),
                        child: ListView.builder(
                              itemCount: controller.schedules[index].matches.length,
                              shrinkWrap: true,
                              padding: EdgeInsets.zero,
                              physics: const NeverScrollableScrollPhysics(),
                              itemBuilder: (context, scheduleIndex) {
                                Matches item = controller.schedules[index].matches[scheduleIndex];

                                return InkWell(
                                  onTap: () {
                                    Get.toNamed(Routes.detailMatchesRegions, arguments: item);
                                    },
                                  child: Container(
                                    margin: EdgeInsets.only(bottom: 4.h),
                                    padding: EdgeInsets.symmetric(horizontal: 8.w, vertical: 8.h),
                                    decoration: BoxDecoration(
                                        color: const Color.fromRGBO(255, 255, 255, 0.1),
                                        borderRadius: BorderRadius.circular(6.r)),
                                    child: Row(
                                      children: [
                                        Column(
                                          children: [
                                            Text(
                                              DateFormat('HH:mm').format(DateFormat('HH:mm:ss').parse(item.time!)),
                                              style: const TextStyle(
                                                  color: Colors.white),
                                            ),
                                          ],
                                        ),
                                        SizedBox(
                                          width: 8.w,
                                        ),
                                        Column(
                                          crossAxisAlignment:
                                          CrossAxisAlignment.start,
                                          children: [
                                            Row(
                                              children: [
                                                SizedBox(
                                                  height: 18.h,
                                                  width: 18.h,
                                                  child: CacheNetWorkCustom(
                                                    urlImage: item.home?.logo ??
                                                        'https://upload.wikimedia.org/wikipedia/vi/thumb/5/5c/Chelsea_crest.svg/1200px-Chelsea_crest.svg.png',
                                                  ),
                                                ),
                                                SizedBox(
                                                  width: 8.w,
                                                ),
                                                Text(
                                                  item.home!.name!,
                                                  style: const TextStyle(
                                                      color: Colors.white),
                                                ),
                                              ],
                                            ),
                                            SizedBox(
                                              height: 4.h,
                                            ),
                                            Row(
                                              children: [
                                                SizedBox(
                                                  height: 18.h,
                                                  width: 18.h,
                                                  child: CacheNetWorkCustom(urlImage: item.away?.logo ?? 'https://upload.wikimedia.org/wikipedia/vi/thumb/5/5c/Chelsea_crest.svg/1200px-Chelsea_crest.svg.png',),
                                                ),
                                                SizedBox(
                                                  width: 8.w,
                                                ),
                                                Text(
                                                  item.away!.name!,
                                                  style: const TextStyle(
                                                      color: Colors.white),
                                                ),
                                              ],
                                            )
                                          ],
                                        ),
                                        const Spacer(),
                                        GestureDetector(
                                          onTap: () {
                                            item.favourite = !item.favourite!;

                                            if (item.favourite == true) {
                                              controller.addMatchesFavorites(item.sId!, index);
                                            } else {
                                              controller.deleteMatchFavorites(item.sId!, index);
                                            }

                                            CustomToast().showToast(context, 'Match', item.favourite!);
                                          },
                                          child: Icon(
                                            item.favourite == false ? Icons.star_outline_rounded : Icons.star_rounded,
                                            color: ColorUtils.PRIMARY_COLOR,
                                          ),
                                        ),
                                      ],
                                    ),
                                  ),
                                );
                              },
                            ),
                        ),
                    ],
                  );
                  },
              ),
          ],
        ),
      ),
    );
  }
}
