import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_animate/flutter_animate.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_svg/svg.dart';
import 'package:gap/gap.dart';
import 'package:grocery_app/src/common_widget/network_image.dart';
import 'package:grocery_app/src/common_widget/textfield_widget.dart';
import 'package:grocery_app/src/logic/provider/addTocart_provider.dart';
import 'package:grocery_app/src/logic/provider/home_provider.dart';
import 'package:grocery_app/src/ui/bestdeal/bestdeal_screen.dart';
import 'package:grocery_app/src/ui/cart/cart_item.dart';
import 'package:grocery_app/src/ui/widgets/custom_icon_button.dart';
import 'package:grocery_app/src/ui/widgets/elevated_button.dart';
import 'package:grocery_app/utils/constants/assets_constant.dart';
import 'package:grocery_app/utils/constants/color_constant.dart';
import 'package:grocery_app/utils/constants/string_constant.dart';
import 'package:grocery_app/utils/extensions/extensions.dart';
import 'package:grocery_app/utils/extensions/uicontext.dart';
import 'package:material_design_icons_flutter/material_design_icons_flutter.dart';
import 'package:provider/provider.dart';

class Mycart extends StatefulWidget {
  const Mycart({super.key});

  @override
  State<Mycart> createState() => _MycartState();
}

class _MycartState extends State<Mycart> {
  @override
  void initState() {
    Provider.of<AddtocartProvider>(context, listen: false)
        .getItemCards(context);
    Provider.of<AddtocartProvider>(context, listen: false)
        .getCurrentLocation(context);

    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.transparent,
        centerTitle: true,
        title: Center(
          child: const Text(
            'Cart 🛒',
            style: TextStyle(
              fontSize: 20,
              fontWeight: FontWeight.w700,
            ),
          ),
        ),
      ),
      body: SingleChildScrollView(
        child: Padding(
          padding: const EdgeInsets.all(8.0),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            mainAxisAlignment: MainAxisAlignment.start,
            children: [
              cartItems(),
              Padding(
                padding: const EdgeInsets.all(8.0),
                child: Text(
                  "Before you checkout",
                  style: context.customExtraBold(Colors.black, 18),
                ),
              ),
              relatedProduct(),
              const SizedBox(
                height: 15,
              ),
              Divider(),
              cartPlace(),
            ],
          ),
        ),
      ),
    );
  }

  Widget relatedProduct() {
    return SizedBox(
      height: 222,
      child: ListView.builder(
        itemCount: 5,
        scrollDirection: Axis.horizontal,
        itemBuilder: (context, index) {
          return Padding(
            padding: const EdgeInsets.only(right: 10, bottom: 5, top: 5),
            child: Container(
              height: 215,
              width: 150,
              decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.circular(15),
                  boxShadow: [
                    BoxShadow(
                      color: Colors.grey.withOpacity(0.1),
                      blurRadius: 1,
                      offset: const Offset(5, 5),
                    ),
                  ]),
              child: Padding(
                padding: const EdgeInsets.all(5),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Container(
                      height: 100,
                      width: 150,
                      decoration: BoxDecoration(
                          color: APPCOLOR.bgGrey,
                          borderRadius: BorderRadius.circular(15)),
                      child: const Stack(
                        alignment: Alignment.center,
                        children: [
                          AppNetworkImage(
                              height: 70,
                              width: 70,
                              imageUrl:
                                  "https://5.imimg.com/data5/SELLER/Default/2024/2/385126988/OL/DA/VW/8627346/1l-fortune-sunflower-oil.jpg",
                              backGroundColor: Colors.transparent),
                          Positioned(
                              right: 5,
                              top: 5,
                              child: Icon(Icons.favorite_border))
                        ],
                      ),
                    ),
                    Text(
                      "Fortune Arhar Dal (Toor Dal)",
                      textAlign: TextAlign.left,
                      maxLines: 2,
                      overflow: TextOverflow.ellipsis,
                      style: context.customMedium(APPCOLOR.balck1A1A1A, 14),
                    ),
                    const SizedBox(
                      height: 5,
                    ),
                    Text(
                      "500 ML",
                      textAlign: TextAlign.left,
                      maxLines: 1,
                      overflow: TextOverflow.ellipsis,
                      style: context.customMedium(
                          Colors.grey.withOpacity(0.8), 12),
                    ),
                    const SizedBox(
                      height: 3,
                    ),
                    Row(
                      children: [
                        Expanded(
                            child: Row(
                          children: [
                            Text(
                              "\$12",
                              textAlign: TextAlign.left,
                              maxLines: 1,
                              overflow: TextOverflow.ellipsis,
                              style: context.customSemiBold(Colors.black, 12),
                            ),
                            const SizedBox(
                              width: 5,
                            ),
                            Text(
                              "\$14",
                              textAlign: TextAlign.left,
                              maxLines: 1,
                              overflow: TextOverflow.ellipsis,
                              style: context
                                  .customMedium(
                                      Colors.grey.withOpacity(0.8), 12)
                                  .copyWith(
                                    decoration: TextDecoration.lineThrough,
                                  ),
                            ),
                          ],
                        )),
                        Expanded(
                          child: Align(
                            alignment: Alignment.centerRight,
                            child: Container(
                              height: 30,
                              width: 50,
                              decoration: BoxDecoration(
                                color: APPCOLOR.lightGreen,
                                borderRadius: BorderRadius.circular(5),
                              ),
                              child: Center(
                                  child: Text(
                                'Add',
                                style: context.customRegular(Colors.white, 12),
                              )),
                            ),
                          ),
                        )
                      ],
                    ),
                  ],
                ),
              ),
            ),
          );
        },
      ),
    );
  }

  Widget cartItems() {
    return Consumer<AddtocartProvider>(builder: (context, provider, child) {
      print("djkhsfjh  ${provider.allitem.items}");
      if (provider.isLoaddcartItem) {
        return Padding(
          padding: const EdgeInsets.only(left: 120),
          child: CircularProgressIndicator(),
        );
      } else if (provider.allitem == null) {
        return Center(child: Text('🛒 Your Front Shop Cart is empty'));
      } else if (provider.allitem.items == null) {
        return Center(child: Text('🛒 Your Front Shop Cart is empty'));
      } else {
        return ListView.separated(
          shrinkWrap: true, // Prevents internal scrolling
          physics: NeverScrollableScrollPhysics(), // Disables inner scroll
          separatorBuilder: (_, index) => Padding(
            padding: EdgeInsets.only(top: 12.h, bottom: 24.h),
            child: const Divider(thickness: 1),
          ),
          itemCount: provider.allitem.items!.length,
          itemBuilder: (context, index) {
            var items = provider.allitem.items![index];

            print("kdfgdjfgkj  ${items}");
            return Padding(
              padding: EdgeInsets.symmetric(horizontal: 10.w),
              child: Row(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Container(
                    decoration: BoxDecoration(
                      color: Colors.greenAccent.withOpacity(0.1),
                      borderRadius: BorderRadius.circular(5),
                    ),
                    child: AppNetworkImage(
                      width: 60.w,
                      height: 70.h,
                      imageUrl: items.product!.productImages!.first.url ?? " ",
                      backGroundColor: APPCOLOR.bgGrey,
                      radius: 10,
                    ),
                  ),
                  //  Image.asset(product.image, width: 50.w, height: 40.h),

                  16.horizontalSpace,
                  Container(
                    width: 150.w,
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      mainAxisAlignment: MainAxisAlignment.start,
                      children: [
                        Text(
                          items.product!.name ?? "",
                          maxLines: 2,
                          overflow: TextOverflow.ellipsis,
                          style: context.customMedium(APPCOLOR.balck1A1A1A, 14),
                        ),
                        5.verticalSpace,
                        Text(
                          items.product!.unit ?? "",
                          style: context.customMedium(APPCOLOR.balck1A1A1A, 14),
                        ),
                        Row(
                          children: [
                            Text(
                              "\$${items.product!.discountPrice ?? ""}  ",
                              textAlign: TextAlign.left,
                              maxLines: 1,
                              overflow: TextOverflow.ellipsis,
                              style: context.customSemiBold(Colors.black, 12),
                            ),
                            Text(
                              "\$${items.product!.basePrice ?? ""}",
                              textAlign: TextAlign.left,
                              maxLines: 1,
                              overflow: TextOverflow.ellipsis,
                              style: context
                                  .customMedium(
                                    Colors.grey.withOpacity(0.8),
                                    12,
                                  )
                                  .copyWith(
                                    decoration: TextDecoration.lineThrough,
                                  ),
                            ),
                          ],
                        ),
                      ],
                    ),
                  ),
                  const Spacer(),
                  Row(
                    children: [
                      CustomIconButton(
                        width: 14.w,
                        height: 14.h,
                        onPressed: () {
                          // provider.decreaseQuantity(items);
                        },
                        icon: SvgPicture.asset(
                          APPASSETS.removeIcon,
                          fit: BoxFit.none,
                        ),
                        backgroundColor: APPCOLOR.appGreen,
                      ),
                      5.horizontalSpace,
                      Text(
                        items.quantity.toString(),
                        style: context.customMedium(APPCOLOR.balck1A1A1A, 14),
                      ),
                      5.horizontalSpace,
                      CustomIconButton(
                        width: 14.w,
                        height: 14.h,
                        onPressed: () {
                          // provider..increaseQuantity(items);
                        },
                        icon: SvgPicture.asset(
                          APPASSETS.addIcon,
                          fit: BoxFit.none,
                        ),
                        backgroundColor: APPCOLOR.appGreen,
                      ),
                    ],
                  )
                ],
              ),
            ).animate(delay: (100 * index).ms).fade().slideX(
                  duration: 300.ms,
                  begin: -1,
                  curve: Curves.easeInSine,
                );
          },
        );
      }
    });
  }

  Widget cartPlace() {
    return Consumer<AddtocartProvider>(builder: (context, provider, child) {
      print("jdhfgkdfkjg  ${provider.allitem.createdAt}");
      if (provider.isLoaddcartItem) {
        return Padding(
          padding: const EdgeInsets.only(left: 120),
          child: CircularProgressIndicator(),
        );
      } else if (provider.allitem == null) {
        return Center(child: Text('🛒 Your Front Shop Cart is empty'));
      } else if (provider.allitem.items == null) {
        return Center(
            child: ElevatedButton(
          style: ElevatedButton.styleFrom(backgroundColor: Colors.green),
          onPressed: () {},
          child: Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text('Continue Shopping',
                  style: TextStyle(fontSize: 16, color: Colors.white))
            ],
          ),
        ));
      } else {
        return Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            ListTile(
              leading: Icon(Icons.local_offer, color: Colors.green),
              title: Text('APPLY COUPON',
                  style: TextStyle(fontWeight: FontWeight.bold)),
              trailing: Icon(Icons.arrow_forward_ios),
              onTap: () {},
            ),
            SummaryRow(
                label: 'Item Total',
                value: '\$22'),
            SummaryRow(label: 'Discount', value: '\$2'),
            SummaryRow(label: 'Delivery Free', value: 'Free', isGreen: true),
            Divider(),
            SummaryRow(label: 'Grand Total', value: '\$22', isBold: true),
            ListTile(
              leading: Icon(Icons.home, color: Colors.green),
              title: provider.isDeliverable
                  ? Text('Delivering to : ${provider.pinCode}')
                  : Text(
                      'Out Of Stock : ${provider.pinCode}',
                      style: TextStyle(color: Colors.red),
                    ),
              trailing: Text('Change', style: TextStyle(color: Colors.blue)),
              onTap: () {
                _showBottomSheet(context);
              },
            ),
            SizedBox(height: 10),
            ElevatedButton(
              style: ElevatedButton.styleFrom(backgroundColor: Colors.green),
              onPressed: () {},
              child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text('\$22 Place Order', style: TextStyle(fontSize: 16))
                ],
              ),
            ),
          ],
        );
      }
    });
  }

  void _showBottomSheet(BuildContext context) {
    TextEditingController checkPinCode = TextEditingController();

    showModalBottomSheet(
      context: context,
      builder: (BuildContext context) {
        return Consumer<AddtocartProvider>(
            builder: (context, pinProvider, child) {
          return Container(
            padding: EdgeInsets.all(20.w),
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: [
                Form(
                  child: Container(
                    width: 200.h,

                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(
                          8), // Border radius for container
                      border: Border.all(color: Colors.grey, width: 1),
                    ), // Border for the container

                    child: Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: Row(
                        children: [
                          Expanded(
                            flex: 2,
                            child: Container(
                              height: 20.h,
                              child: TextFormField(
                                controller: checkPinCode,
                                keyboardType: TextInputType.phone,
                                decoration: InputDecoration(
                                  hintText: 'Enter PIN',
                                  border: InputBorder
                                      .none, // Remove the inner border
                                ),
                                validator: (value) {
                                  if (value == null || value.isEmpty) {
                                    return 'Cannot be empty';
                                  } else if (!RegExp(r'^[0-9]{4,6}$')
                                      .hasMatch(value)) {
                                    return 'Enter a valid PIN (4-6 digits)';
                                  }
                                  return null;
                                },
                              ),
                            ),
                          ),
                          InkWell(
                            onTap: () {
                              pinProvider.checkPin(context, checkPinCode.text);
                            },
                            child: Expanded(
                                flex: 1,
                                child: Text(
                                  "Check PIN",
                                  style: TextStyle(
                                      fontSize: 15,
                                      fontWeight: FontWeight.bold,
                                      color: Colors.black),
                                )),
                          ),
                        ],
                      ),
                    ),
                  ),
                ),

                Gap(10.h),
                //  if (!pinProvider.isMatch)
                Text(
                  'pin code invoild',
                  style: TextStyle(color: Colors.red),
                ),
                Gap(10.h),
                Center(
                  child: SizedBox(
                    child: SizedBox(
                      width: double.infinity,
                      child: ButtonElevated(
                          text: 'Submit',
                          onPressed: () {},
                          backgroundColor: APPCOLOR.appGreen),
                    ),
                  ),
                ),
              ],
            ),
          );
        });
      },
    );
  }
}

class SummaryRow extends StatelessWidget {
  final String label, value;
  final bool isGreen, isBold;

  SummaryRow(
      {required this.label,
      required this.value,
      this.isGreen = false,
      this.isBold = false});

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.symmetric(vertical: 4.0),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Text(label,
              style: TextStyle(
                  fontSize: 16,
                  fontWeight: isBold ? FontWeight.bold : FontWeight.normal)),
          Text(value,
              style: TextStyle(
                  fontSize: 16,
                  fontWeight: isBold ? FontWeight.bold : FontWeight.normal,
                  color: isGreen ? Colors.green : Colors.black)),
        ],
      ),
    );
  }
}