import 'package:diplomaticquarterapp/core/enum/viewstate.dart';
import 'package:diplomaticquarterapp/core/model/pharmacies/Addresses.dart';
import 'package:diplomaticquarterapp/core/model/pharmacies/ShoppingCartResponse.dart';
import 'package:diplomaticquarterapp/core/viewModels/pharmacyModule/OrderPreviewViewModel.dart';
import 'package:diplomaticquarterapp/core/viewModels/project_view_model.dart';
import 'package:diplomaticquarterapp/pages/base/base_view.dart';
import 'package:diplomaticquarterapp/pages/pharmacies/screens/cart-order-preview.dart';
import 'package:diplomaticquarterapp/pages/pharmacies/screens/pharmacy-terms-conditions-page.dart';
import 'package:diplomaticquarterapp/pages/pharmacies/widgets/ProductOrderItem.dart';
import 'package:diplomaticquarterapp/uitl/translations_delegate_base.dart';
import 'package:diplomaticquarterapp/uitl/utils.dart';
import 'package:diplomaticquarterapp/widgets/buttons/GestureIconButton.dart';
import 'package:diplomaticquarterapp/widgets/data_display/text.dart';
import 'package:diplomaticquarterapp/widgets/others/app_scaffold_widget.dart';
import 'package:diplomaticquarterapp/widgets/transitions/fade_page.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

class CartOrderPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final mediaQuery = MediaQuery.of(context);

    final height = mediaQuery.size.height - 60 - mediaQuery.padding.top;
    AppScaffold appScaffold;
    return BaseView<OrderPreviewViewModel>(
      onModelReady: (model) {
        model.getShoppingCart().then((value) {
          appScaffold.appBar
              .badgeUpdater('${model.cartResponse.quantityCount ?? 0}');
        });
      },
      builder: (_, model, wi) => ChangeNotifierProvider.value(
        value: model.cartResponse,
        child: appScaffold = AppScaffold(
          appBarTitle: TranslationBase.of(context).shoppingCart,
          isShowAppBar: true,
          isPharmacy: true,
          baseViewModel: model,
          backgroundColor: Colors.white,
          body: !(model.cartResponse.shoppingCarts == null ||
                  model.cartResponse.shoppingCarts.length == 0)
              ? Container(
                  height: height * 0.85,
                  width: double.infinity,
                  child: Consumer<ShoppingCartResponse>(
                    builder: (ctx, cart, _) => Container(
                      child: SingleChildScrollView(
                        child: Container(
                          margin: EdgeInsets.all(10),
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              GestureIconButton(
                                TranslationBase.of(context).deleteAllItems,
                                Icon(
                                  Icons.delete_outline_sharp,
                                  color: Colors.grey.shade700,
                                ),
                                onTap: () => {model.deleteShoppingCart()},
                              ),
                              const Divider(
                                color: Color(0xFFD6D6D6),
                                height: 20,
                                thickness: 1,
                                indent: 0,
                                endIndent: 0,
                              ),
                              Container(
                                child: Column(
                                  children: [
                                    ...List.generate(
                                        cart.shoppingCarts != null
                                            ? cart.shoppingCarts.length
                                            : 0,
                                        (index) => ProductOrderItem(
                                                cart.shoppingCarts[index], () {
                                              print(cart.shoppingCarts[index]
                                                  .quantity);
                                              model
                                                  .changeProductQuantity(
                                                      cart.shoppingCarts[index])
                                                  .then((value) {
                                                if (model.state !=
                                                    ViewState.Error) {
                                                  appScaffold.appBar.badgeUpdater(
                                                      '${value.quantityCount ?? 0}');
                                                }
                                                if (model.state ==
                                                    ViewState.ErrorLocal) {
                                                  Utils.showErrorToast(
                                                      model.error);
                                                }
                                              });
                                            }, () {
                                              model
                                                  .deleteProduct(
                                                      cart.shoppingCarts[index])
                                                  .then((value) {
                                                if (model.state !=
                                                    ViewState.Error) {
                                                  appScaffold.appBar.badgeUpdater(
                                                      '${value.quantityCount ?? 0}');
                                                }
                                              });
                                            }))
                                  ],
                                ),
                              ),
                              const Divider(
                                color: Color(0xFFD6D6D6),
                                height: 20,
                                thickness: 2,
                                indent: 0,
                                endIndent: 0,
                              ),
                              Row(
                                mainAxisAlignment:
                                    MainAxisAlignment.spaceBetween,
                                children: [
                                  Texts(
                                    TranslationBase.of(context).subtotal,
                                    fontSize: 14,
                                    color: Colors.black,
                                    fontWeight: FontWeight.w500,
                                  ),
                                  Texts(
                                    "${TranslationBase.of(context).sar} ${(cart.subtotal).toStringAsFixed(2)}",
                                    fontSize: 14,
                                    color: Colors.black,
                                    fontWeight: FontWeight.w500,
                                  ),
                                ],
                              ),
                              const Divider(
                                color: Color(0xFFD6D6D6),
                                height: 20,
                                thickness: 1,
                                indent: 0,
                                endIndent: 0,
                              ),
                              Row(
                                mainAxisAlignment:
                                    MainAxisAlignment.spaceBetween,
                                children: [
                                  Texts(
                                    "${TranslationBase.of(context).vat}",
                                    fontSize: 14,
                                    color: Colors.black,
                                    fontWeight: FontWeight.w500,
                                  ),
                                  Texts(
                                    "${TranslationBase.of(context).sar} ${(cart.subtotalVatAmount).toStringAsFixed(2)}",
                                    fontSize: 14,
                                    color: Colors.black,
                                    fontWeight: FontWeight.w500,
                                  ),
                                ],
                              ),
                              const Divider(
                                color: Color(0xFFD6D6D6),
                                height: 20,
                                thickness: 1,
                                indent: 0,
                                endIndent: 0,
                              ),
                              Row(
                                mainAxisAlignment:
                                    MainAxisAlignment.spaceBetween,
                                children: [
                                  Texts(
                                    TranslationBase.of(context).total,
                                    fontSize: 14,
                                    color: Colors.black,
                                    fontWeight: FontWeight.bold,
                                  ),
                                  Texts(
                                    "${TranslationBase.of(context).sar} ${(cart.subtotal).toStringAsFixed(2)}",
                                    fontSize: 14,
                                    color: Colors.black,
                                    fontWeight: FontWeight.bold,
                                  ),
                                ],
                              ),
                              const Divider(
                                color: Color(0xFFD6D6D6),
                                height: 20,
                                thickness: 1,
                                indent: 0,
                                endIndent: 0,
                              ),
                              Image.asset(
                                "assets/images/pharmacy_module/payment_image.png",
                                width: mediaQuery.size.width - 20,
                                height: 30.0,
                                fit: BoxFit.scaleDown,
                              )
                            ],
                          ),
                        ),
                      ),
                    ),
                  ),
                )
              : Center(
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Padding(
                        padding: const EdgeInsets.all(8.0),
                        child: Image.asset(
                          'assets/images/new-design/empty_box.png',
                          width: 100,
                          height: 100,
                          fit: BoxFit.cover,
                        ),
                      ),
                      Padding(
                        padding: const EdgeInsets.all(8.0),
                        child: Text(
                          TranslationBase.of(context).noData,
//                          'There is no data',
                          style: TextStyle(fontSize: 30),
                        ),
                      )
                    ],
                  ),
                ),
          bottomSheet: Container(
            height: !(model.cartResponse.shoppingCarts == null ||
                    model.cartResponse.shoppingCarts.length == 0)
                ? height * 0.15
                : 0,
            color: Colors.white,
            child: OrderBottomWidget(model.addresses, height),
          ),
        ),
      ),
    );
  }
}

class OrderBottomWidget extends StatefulWidget {
  final List<Addresses> addresses;
  final double height;

  OrderBottomWidget(this.addresses, this.height);

  @override
  _OrderBottomWidgetState createState() => _OrderBottomWidgetState();
}

class _OrderBottomWidgetState extends State<OrderBottomWidget> {
  bool isAgree = false;

  @override
  Widget build(BuildContext context) {
    ProjectViewModel projectProvider = Provider.of(context);

    return Container(
        margin: EdgeInsets.symmetric(horizontal: 10, vertical: 0),
        child: Consumer<ShoppingCartResponse>(
          builder: (ctx, cart, _) => !(cart.shoppingCarts == null ||
                  cart.shoppingCarts.length == 0)
              ? Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    const Divider(
                      color: Color(0xFFD6D6D6),
                      height: 1,
                      thickness: 1,
                      indent: 0,
                      endIndent: 0,
                    ),
                    Container(
                      height: widget.height * 0.070,
                      color: Color(0xffe6ffe0),
                      padding: EdgeInsets.symmetric(horizontal: 4),
                      child: Row(
                        children: [
                          InkWell(
                            onTap: () {
                              setState(() {
                                isAgree = !isAgree;
                              });
                            },
                            child: Container(
                              width: 25.0,
                              height: widget.height * 0.070,
                              decoration: new BoxDecoration(
                                color:
                                    !isAgree ? Color(0xffeeeeee) : Colors.green,
                                shape: BoxShape.circle,
                              ),
                              child: !isAgree
                                  ? null
                                  : Padding(
                                      padding: const EdgeInsets.all(0.0),
                                      child: Icon(
                                        Icons.check,
                                        color: Colors.white,
                                        size: 25,
                                      ),
                                    ),
                            ),
                          ),
                          Expanded(
                            child: Container(
                              padding: EdgeInsets.symmetric(horizontal: 4),
                              margin: const EdgeInsets.symmetric(vertical: 4),
                              child: Texts(
                                TranslationBase.of(context)
                                    .pharmacyServiceTermsCondition,
                                fontSize: 13,
                                color: Colors.grey.shade800,
                                fontWeight: FontWeight.normal,
                              ),
                            ),
                          ),
                          InkWell(
                            onTap: () => {
                              Navigator.push(context,
                                  FadePage(page: PharmacyTermsConditions()))
                            },
                            child: Container(
                              child: Icon(
                                Icons.info,
                                size: 25,
                                color: Color(0xff005aff),
                              ),
                            ),
                          ),
                        ],
                      ),
                    ),
                    Container(
                      height: widget.height * 0.065,
                      margin: EdgeInsets.symmetric(vertical: 2),
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: [
                          Expanded(
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: [
                                Container(
                                  margin: EdgeInsets.symmetric(
                                      horizontal: 0, vertical: 0),
                                  child: Row(
                                    children: [
                                      Texts(
                                        "${TranslationBase.of(context).sar} ${(cart.subtotal).toStringAsFixed(2)}",
                                        fontSize:
                                            projectProvider.isArabic ? 12 : 14,
                                        fontWeight: FontWeight.bold,
                                      ),
                                      Padding(
                                        padding: const EdgeInsets.symmetric(
                                            horizontal: 4),
                                        child: Texts(
                                          "${TranslationBase.of(context).inclusiveVat}",
                                          fontSize: 8,
                                          color: Colors.grey,
                                          fontWeight: FontWeight.bold,
                                        ),
                                      ),
                                    ],
                                  ),
                                ),
                                Texts(
                                  "${cart.quantityCount} ${TranslationBase.of(context).items}",
                                  fontSize: 10,
                                  color: Colors.grey,
                                  fontWeight: FontWeight.bold,
                                ),
                              ],
                            ),
                          ),
                          RaisedButton(
                            onPressed: isAgree
                                ? () => {
                                      Navigator.push(
                                          context,
                                          FadePage(
                                              page: OrderPreviewPage(
                                                  widget.addresses)))
                                    }
                                : null,
                            child: new Text(
                              "${TranslationBase.of(context).checkOut}",
                              style: new TextStyle(
                                  color: isAgree
                                      ? Colors.white
                                      : Colors.grey.shade300,
                                  fontSize: 14),
                            ),
                            color: Color(0xff005aff),
                            disabledColor: Color(0xff005aff),
                          ),
                        ],
                      ),
                    ),
                  ],
                )
              : Container(),
        ));
  }
}
