import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

import '../../../app.dart';
import 'cart_item.dart';

class ProductListWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return GetX<CartController>(
      init: CartController(),
      builder: (cc) => Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Padding(
            padding: EdgeInsets.only(left: 30.w, right: 30.w, bottom: 10.h, top: 20.h),
            child: Text(
              'cart'.tr,
              style: AppTheme.subHeaderTxtStyle,
            ),
          ),
          Padding(
            padding: EdgeInsets.only(left: 30.w, right: 30.w),
            child: AppTheme.appColorDivider,
          ),
          Expanded(
            child: Padding(
              padding: EdgeInsets.only(left: 16.w, right: 16.w),
              child: cc.loginStatusController.loginStatus
                  ? VendorListView()
                  : Center(
                      child: OutlinedButton(
                        onPressed: cc.navigateToLogin,
                        child: Text('please_login'.tr),
                        style: OutlinedButton.styleFrom(
                          side: BorderSide(color: Colors.blue),
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(10),
                          ),
                        ),
                      ),
                    ),
            ),
          ),
        ],
      ),
    );
  }
}

// displays vendor list
class VendorListView extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return GetX<CartController>(
      init: CartController(),
      builder: (cc) {
        final CartModel? model = cc.state.cartModel.value;
        return cc.state.isLoading.value
            ? CustomLoader()
            : model != null
                ? ListView.builder(
                    padding: const EdgeInsets.only(top: 10),
                    itemBuilder: (_, int index) => Column(
                      children: [
                        // Vendors part
                        Container(
                          margin: const EdgeInsets.all(8),
                          width: double.infinity,
                          decoration: new BoxDecoration(
                            color: ThemeColor.white,
                            borderRadius: BorderRadius.all(Radius.circular(8)),
                            border: Border.all(
                              color: Colors.grey.withOpacity(0.50),
                            ),
                          ),
                          child: Column(
                            children: [
                              Container(
                                padding: EdgeInsets.symmetric(horizontal: 12.w, vertical: 12.h),
                                child: Row(
                                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                  children: [
                                    Text(
                                      model.vendors[index].name,
                                      style: TextStyle(
                                        color: ThemeColor.black,
                                        fontSize: 16.sp,
                                        fontWeight: FontWeight.w500,
                                      ),
                                    ),

                                    // shows total cart count
                                    Container(
                                      height: 25.h,
                                      width: 25.w,
                                      decoration: BoxDecoration(
                                        color: ThemeColor.grey.withOpacity(0.20),
                                        shape: BoxShape.circle,
                                      ),
                                      child: Center(
                                        child: Text(
                                          // cc.cartList[index].totalProductCount.toString(),
                                          model.vendors[index].totalQuantity.toString(),
                                          style: new TextStyle(
                                            color: ThemeColor.black,
                                            fontWeight: FontWeight.w500,
                                            fontSize: 14.sp,
                                          ),
                                        ),
                                      ),
                                    ),
                                  ],
                                ),
                              ),

                              Divider(
                                color: ThemeColor.black.withAlpha(16),
                                height: 0.5,
                                thickness: 1.5,
                              ),
                              // ListView
                              ProductListView(
                                items: model.vendors[index].items,
                              ),
                            ],
                          ),
                        ),

                        // Cart info part
                        AppTheme.appSizeDivider20H,
                        Padding(
                          padding: const EdgeInsets.all(8.0),
                          child: OrderDetailWidget(),
                        ),
                        AppTheme.appSizeDivider20H,
                        ColoredButton(
                          title: 'checkout'.tr,
                          btnColor: ThemeColor.mainColor,
                          callback: cc.onOrderNowTapped,
                        ),
                        AppTheme.appSizeDivider20H,
                      ],
                    ),
                    itemCount: model.vendors.length,
                  )
                : Center(child: retryBuilder(() => cc.get()));
      },
    );
  }
}

// displays vendor product list
class ProductListView extends StatelessWidget {
  final List<CartItemModel> items;

  ProductListView({
    required this.items,
  });

  @override
  Widget build(BuildContext context) {
    return ListView.separated(
      shrinkWrap: true,
      physics: ClampingScrollPhysics(),
      itemCount: items.length,
      itemBuilder: (_, index) => CartItem(item: items[index]),
      separatorBuilder: (_, int index) => Divider(
        color: ThemeColor.black.withAlpha(16),
        height: 0.5,
        thickness: 1.5,
      ),
    );
  }
}
