import 'package:diplomaticquarterapp/core/model/packages_offers/responses/PackagesCartItemsResponseModel.dart';
import 'package:diplomaticquarterapp/core/model/packages_offers/responses/PackagesResponseModel.dart';
import 'package:diplomaticquarterapp/core/viewModels/packages_offers/PackagesOffersViewModel.dart';
import 'package:diplomaticquarterapp/theme/colors.dart';
import 'package:diplomaticquarterapp/uitl/translations_delegate_base.dart';
import 'package:diplomaticquarterapp/uitl/utils.dart';
import 'package:diplomaticquarterapp/uitl/utils_new.dart';
import 'package:diplomaticquarterapp/widgets/CounterView.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';

bool wide = true;

class PackagesOrderHistoryItemCard extends StatefulWidget {
  final PackagesResponseModel itemModel;
  final PackagesViewModel viewModel;
  final Function getCartItems;

  const PackagesOrderHistoryItemCard({@required this.itemModel, @required this.viewModel, this.getCartItems, Key key}) : super(key: key);

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

class PackagesOrderHistoryItemCardState extends State<PackagesOrderHistoryItemCard> {
  @override
  Widget build(BuildContext context) {
    wide = !wide;
    return Container(
      decoration: cardRadius(15.0),
      height: 95,
      padding: EdgeInsets.all(9),
      child: Row(
        mainAxisSize: MainAxisSize.max,
        children: [
          _image(widget.itemModel),
          SizedBox(width: 7),
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                _itemName(widget.itemModel.name),
                Expanded(child: _itemDescription(widget.itemModel.shortDescription)),
                Row(
                  mainAxisSize: MainAxisSize.max,
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    _itemPrice(widget.itemModel.price, context: context),
                    _cancelButton(context, itemModel: widget.itemModel)
                  ],
                ),
              ],
            ),
          )
        ],
      ),
    );
  }
}

Widget _cancelButton(BuildContext context, {@required PackagesResponseModel itemModel, VoidCallback onClick}) => InkWell(
      onTap:onClick,
      child: Padding(
        padding: const EdgeInsets.only(right: 3, bottom: 3),
        child: Row(
          mainAxisSize: MainAxisSize.min,
          children: [
            // Text(
            //   TranslationBase.of(context).removeMember,
            //   style: TextStyle(
            //     fontSize: 10,
            //     color: CustomColors.accentColor,
            //     fontWeight: FontWeight.w600,
            //     letterSpacing: -0.36,
            //   ),
            // ),
            // SizedBox(width: 2),
            // SvgPicture.asset("assets/images/new-design/delete.svg", color: CustomColors.accentColor),
          ],
        ),
      ),
    );

Widget _image(PackagesResponseModel model) => AspectRatio(
      aspectRatio: 1 / 1,
      child: ClipRRect(
          borderRadius: BorderRadius.circular(15), child: ((model.images ?? []).isNotEmpty) ? Utils.loadNetworkImage(url: model.images.first.src, fitting: BoxFit.fill) : Container(color: Colors.grey[200])),
    );

Widget _itemName(String name) => Text(
      name,
      style: TextStyle(
        fontSize: 14,
        fontWeight: FontWeight.bold,
        color: Color(0xff2B353E),
        letterSpacing: -0.56,
      ),
    );

Widget _itemDescription(String desc) => Text(
      desc,
      maxLines: 2,
      overflow: TextOverflow.ellipsis,
      style: TextStyle(
        fontSize: 10,
        fontWeight: FontWeight.w500,
        color: Color(0xff535353),
        letterSpacing: -0.4,
      ),
    );

Widget _itemPrice(double price, {@required BuildContext context}) {
  final prc = (price ?? 0.0).toStringAsFixed(2);
  return Text(
    '$prc ${TranslationBase.of(context).sar}',
    style: TextStyle(
      fontSize: 11,
      fontWeight: FontWeight.w600,
      color: Color(0xff5D5D5D),
      letterSpacing: -0.44,
    ),
  );
}