import 'package:betting/routes/app_pages.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

import '../../../../../commom/widget/cache_network_custom.dart';
import 'detail_regions_controller.dart';

class DetailRegionsPage extends GetWidget<DetailRegionsController>{
  final controller = Get.put(DetailRegionsController());

  @override
  Widget build(BuildContext context) {
    return
      Stack(
        children: [
          Image.asset(
            "assets/images/background_app_betting.jpg",
            height: MediaQuery.of(context).size.height,
            width: MediaQuery.of(context).size.width,
            fit: BoxFit.cover,
          ),
          Scaffold(
            backgroundColor: Colors.transparent,
            appBar: AppBar(
              backgroundColor: Colors.transparent,
              leading: InkWell(
                onTap: (){
                  Get.back();
                },
                child: const Icon(CupertinoIcons.back),
              ),
            ),
            body:
            SingleChildScrollView(
              child:   Container(
                color: Colors.transparent,
                margin: const EdgeInsets.symmetric(horizontal:16),
                child:
                ListView.builder(
                    itemCount: 2,
                    shrinkWrap: true,
                    physics: const NeverScrollableScrollPhysics(),
                    itemBuilder: (context, index){
                  return Column(
                    children: [
                      const SizedBox(height: 8,),
                      Row(
                        children: [
                          Row(
                            children: [
                              const SizedBox(
                                  width: 24,
                                  height: 24,
                                  child: CacheNetWorkCustom(urlImage: 'https://upload.wikimedia.org/wikipedia/vi/thumb/a/a1/Man_Utd_FC_.svg/1200px-Man_Utd_FC_.svg.png')
                              ),
                               SizedBox(width: 4.w),
                              Column(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  Text('Primier League', style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold, fontSize: 12.sp),),
                                  Text('Endland', style: TextStyle(color: Colors.white, fontWeight: FontWeight.w300, fontSize: 12.sp),),
                                ],
                              )
                            ],
                          ),
                          const Spacer(),
                          const Icon(Icons.navigate_next_outlined, color: Colors.white,),
                        ],
                      ),
                      const SizedBox(height: 8,),
                      ListView.builder(
                          itemCount: 10,
                          physics: const NeverScrollableScrollPhysics(),
                          shrinkWrap: true,
                          itemBuilder: (context, index){
                            return InkWell(
                                onTap: (){
                                  Get.toNamed(Routes.detailMatchesRegions);
                                },
                                child: Container(
                                  margin: const EdgeInsets.only(top: 4),
                                  decoration: BoxDecoration(
                                      color: Colors.white10,
                                      borderRadius: BorderRadius.circular(6)
                                  ),

                                  padding:const EdgeInsets.all(8),
                                  child: Row(
                                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                    children: [
                                      Row(
                                        children: [
                                          Column(
                                            children: [
                                              Text('25 May',
                                                style: TextStyle(
                                                    fontSize: 12.sp,
                                                    fontWeight: FontWeight.w500,
                                                    color: Colors.grey),
                                              ),
                                              const SizedBox(height: 8,),
                                              Text('FT',
                                                style:
                                                TextStyle(fontSize: 12.sp,
                                                    fontWeight: FontWeight.w500,
                                                    color: Colors.grey),
                                              ),
                                            ],
                                          ),
                                          const SizedBox(width: 4,),
                                          Column(
                                            crossAxisAlignment: CrossAxisAlignment.start,
                                            children: [
                                              Row(
                                                children: [
                                                  const SizedBox(
                                                      width: 24,
                                                      height: 24,
                                                      child: CacheNetWorkCustom(urlImage: 'https://upload.wikimedia.org/wikipedia/vi/thumb/a/a1/Man_Utd_FC_.svg/1200px-Man_Utd_FC_.svg.png')
                                                  ),
                                                   SizedBox(width: 4.w),
                                                  Text('Manchester United',
                                                    style: TextStyle(
                                                        fontSize: 12.sp,
                                                        fontWeight: FontWeight.w500,
                                                        color: Colors.grey,
                                                    ),
                                                  ),
                                                ],
                                              ),
                                              const SizedBox(height: 8,),
                                              Row(
                                                children: [
                                                  const SizedBox(
                                                      width: 24,
                                                      height: 24,
                                                      child: CacheNetWorkCustom(urlImage: 'https://upload.wikimedia.org/wikipedia/en/thumb/e/eb/Manchester_City_FC_badge.svg/1200px-Manchester_City_FC_badge.svg.png')
                                                  ),
                                                  SizedBox(width: 4.w,),
                                                  Text('Manchester City',
                                                    style: TextStyle(
                                                        fontSize: 12.sp,
                                                        fontWeight: FontWeight.w500,
                                                        color: Colors.grey
                                                    ),
                                                  ),
                                                ],
                                              ),
                                            ],
                                          ),
                                        ],
                                      ),
                                      Row(
                                        children: [
                                          Column(
                                            children: [
                                              Text('5',
                                                style: TextStyle(
                                                    fontSize: 12.sp,
                                                    fontWeight: FontWeight.w500,
                                                    color: Colors.white),
                                              ),
                                              const SizedBox(height: 8,),
                                              Text('0',
                                                style: TextStyle(
                                                    fontSize: 12.sp,
                                                    fontWeight: FontWeight.w500,
                                                    color: Colors.white),
                                              ),
                                            ],
                                          ),
                                          const SizedBox(width: 8,),
                                          const Icon(CupertinoIcons.star, color: Colors.white,size: 20,),
                                        ],
                                      ),
                                    ],
                                  ),
                                ),
                              );
                          }
                          ),
                    ],
                  );
                }),
              ),
            ),
          )
        ],
      );
  }
}