import 'package:diplomaticquarterapp/core/model/packages_offers/responses/PackagesResponseModel.dart';
import 'package:diplomaticquarterapp/pages/packages_offers/OfferAndPackageDetailPage.dart';
import 'package:diplomaticquarterapp/theme/colors.dart';
import 'package:diplomaticquarterapp/uitl/translations_delegate_base.dart';
import 'package:diplomaticquarterapp/uitl/utils_new.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:rating_bar/rating_bar.dart';

bool wide = true;

class PackagesItemCard extends StatefulWidget {
  final double itemWidth;
  final double itemHeight;
  final double itemContentPadding;
  final PackagesResponseModel itemModel;
  final Function(PackagesResponseModel product) onCartClick;

  const PackagesItemCard({this.itemWidth, this.itemHeight, @required this.itemModel, @required this.itemContentPadding, @required this.onCartClick, Key key}) : super(key: key);

  @override
  State<StatefulWidget> createState() => PackagesItemCardState();
}

class PackagesItemCardState extends State<PackagesItemCard> {
  imageUrl() => widget.itemModel.images.isNotEmpty ? widget.itemModel.images.first.src : "https://wallpaperaccess.com/full/30103.jpg";

  @override
  Widget build(BuildContext context) {
    wide = !wide;
    return InkWell(
      onTap: () {
        Navigator.of(context).push(MaterialPageRoute(builder: (BuildContext context) => OfferAndPackagesDetail(itemModel: widget.itemModel, onCartClick: widget.onCartClick)));
      },
      child: AspectRatio(
        aspectRatio: 162 / 279,
        child: Container(
          // width: widget.itemWidth,
          // color: Colors.transparent,
          decoration: cardRadius(15.0),
          padding: const EdgeInsets.all(9.0),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              AspectRatio(
                aspectRatio: 144 / 144,
                child: ClipRRect(
                  borderRadius: BorderRadius.circular(12.0),
                  child: Image.network(widget.itemModel.images.isNotEmpty ? widget.itemModel.images[0].src : "https://mdlaboratories.com/offersdiscounts/images/thumbs/0000162_dermatology-testing.jpeg", fit: BoxFit.fill, height: 180.0, width: 180.0),
                ),
              ),
              SizedBox(height: 6),
              Text(
                widget.itemModel.name,
                maxLines: 1,
                style: TextStyle(
                  fontSize: 14.0,
                  fontWeight: FontWeight.bold,
                  letterSpacing: -0.56,
                  color: Color(0xff2B353E),
                ),
              ),
              Text(widget.itemModel.shortDescription,
                  maxLines: 2,
                  style: TextStyle(
                    fontSize: 12.0,
                    fontWeight: FontWeight.w600,
                    letterSpacing: -0.48,
                    color: Color(0xff535353),
                  ),
                  overflow: TextOverflow.ellipsis),
              if (widget.itemModel.hasDiscountsApplied)
                Container(
                  margin: const EdgeInsets.only(top: 19.0),
                  child: Text(
                    widget.itemModel.oldPrice.toString() + " " + TranslationBase.of(context).sar,
                    style: TextStyle(
                      fontSize: 9.0,
                      fontWeight: FontWeight.w600,
                      letterSpacing: -0.36,
                      decoration: TextDecoration.lineThrough,
                      color: Color(0xffA0A0A0),
                    ),
                  ),
                ),
              Container(
                margin: widget.itemModel.hasDiscountsApplied ? const EdgeInsets.only(top: 0.0) : const EdgeInsets.only(top: 19.0),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Container(
                          margin: const EdgeInsets.only(top: 0.0),
                          child: Text(
                            widget.itemModel.price.toString().trim() + " " + TranslationBase.of(context).sar,
                            style: TextStyle(fontSize: 12.0, fontWeight: FontWeight.bold, color: Color(0xff2B353E), letterSpacing: -0.48),
                          ),
                        ),
                        RatingBar.readOnly(
                          initialRating: 4.5, // todo ask haroon about parameter for rating
                          size: 18.0,
                          filledColor: Color(0XFFD02127),
                          emptyColor: Color(0XFFD02127),
                          isHalfAllowed: true,
                          halfFilledIcon: Icons.star_half,
                          filledIcon: Icons.star,
                          emptyIcon: Icons.star_border,
                        ),
                      ],
                    ),
                    if(widget.onCartClick != null)
                      InkWell(
                        child: SvgPicture.asset("assets/images/new/add_to_cart.svg"),
                        onTap: () {
                          widget.onCartClick(widget.itemModel);
                        },
                      ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );

    return InkWell(
      onTap: () {
        Navigator.of(context).push(MaterialPageRoute(builder: (BuildContext context) => OfferAndPackagesDetail(itemModel: widget.itemModel, onCartClick: widget.onCartClick)));
      },
      child: Container(
        // width: widget.itemWidth,
        // color: Colors.transparent,
        decoration: cardRadius(15.0),
        width: MediaQuery.of(context).size.width * 0.46,
        padding: const EdgeInsets.all(9.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            ClipRRect(
              borderRadius: BorderRadius.circular(15.0),
              child: Image.network("https://mdlaboratories.com/offersdiscounts/images/thumbs/0000162_dermatology-testing.jpeg", fit: BoxFit.fill, height: 180.0, width: 180.0),
            ),
            Container(margin: const EdgeInsets.only(top: 8.0), child: Text(widget.itemModel.name, maxLines: 1, style: TextStyle(fontSize: 14.0, fontWeight: FontWeight.bold, letterSpacing: -0.56))),
            Container(
                width: MediaQuery.of(context).size.width * 0.4,
                child: Text("Special discount for all HMG Employees and their first…",
                    maxLines: 2, style: TextStyle(fontSize: 10.0, fontWeight: FontWeight.w600, letterSpacing: -0.4, color: CustomColors.textColor), overflow: TextOverflow.clip)),
            if (widget.itemModel.hasDiscountsApplied)
              Container(
                  margin: const EdgeInsets.only(top: 19.0),
                  child: Text(widget.itemModel.oldPrice.toString() + " " + TranslationBase.of(context).sar,
                      style: TextStyle(fontSize: 9.0, fontWeight: FontWeight.w600, letterSpacing: -0.36, decoration: TextDecoration.lineThrough, color: CustomColors.grey2))),
            Container(
              margin: widget.itemModel.hasDiscountsApplied ? const EdgeInsets.only(top: 0.0) : const EdgeInsets.only(top: 19.0),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Container(
                          margin: const EdgeInsets.only(top: 0.0),
                          child: Text(widget.itemModel.price.toString().trim() + " " + TranslationBase.of(context).sar,
                              style: TextStyle(fontSize: 12.0, fontWeight: FontWeight.bold, letterSpacing: -0.56))),
                      RatingBar.readOnly(
                        initialRating: 4.5,
                        size: 18.0,
                        filledColor: Color(0XFFD02127),
                        emptyColor: Color(0XFFD02127),
                        isHalfAllowed: true,
                        halfFilledIcon: Icons.star_half,
                        filledIcon: Icons.star,
                        emptyIcon: Icons.star_border,
                      ),
                    ],
                  ),
                  InkWell(
                    child: SvgPicture.asset("assets/images/new/add-to-cart.svg"),
                    onTap: () {
                      widget.onCartClick(widget.itemModel);
                    },
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}
