import 'package:diplomaticquarterapp/core/model/pharmacies/PharmacyProduct.dart';
import 'package:diplomaticquarterapp/core/viewModels/pharmacyModule/order_model_view_model.dart';
import 'package:diplomaticquarterapp/pages/base/base_view.dart';
import 'package:diplomaticquarterapp/pages/pharmacy/profile/profile.dart';
import 'package:diplomaticquarterapp/uitl/app_shared_preferences.dart';
import 'package:diplomaticquarterapp/uitl/translations_delegate_base.dart';
import 'package:diplomaticquarterapp/widgets/others/app_scaffold_widget.dart';
import 'package:flutter/material.dart';
import 'package:diplomaticquarterapp/core/model/pharmacies/order_model.dart';
import 'package:flutter_svg/svg.dart';
import 'package:intl/intl.dart';
import 'package:rating_bar/rating_bar.dart';
import 'package:flutter/src/widgets/image.dart' as flutterImage;

class ProductReviewPage extends StatefulWidget {
  final PharmacyProduct product;

  ProductReviewPage(this.product);

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

class _ProductReviewPageState extends State<ProductReviewPage> {
  AppSharedPreferences sharedPref = AppSharedPreferences();
  double currentRating = 0;
  String reviewText = "";
  TextEditingController _reviewController = new TextEditingController();
  bool finishReview = false;

  @override
  Widget build(BuildContext context) {
    double ratingValue = double.parse("${widget.product.approvedRatingSum}");
    return BaseView<OrderModelViewModel>(
      builder: (_, model, wi) => AppScaffold(
        appBarTitle: TranslationBase.of(context).writeReview,
        isShowAppBar: true,
        isPharmacy: true,
        body: Container(
          color: Colors.white,
          child: !finishReview ? SingleChildScrollView(
            child: Column(
              children: <Widget>[
                Container(
                  margin: EdgeInsets.symmetric(vertical: 8, horizontal: 16),
                  child: Row(
                      mainAxisAlignment: MainAxisAlignment.start,
                      children: [
                        widget.product.images != null
                            ? flutterImage.Image.network(
                                widget.product.images[0].src,
                                fit: BoxFit.cover,
                                height: 80,
                              )
                            : flutterImage.Image.asset(
                                "assets/images/no_image.png",
                                fit: BoxFit.cover,
                                height: 80,
                              ),
                        Expanded(
                          child: Container(
                            child: Column(
                              children: [
                                Container(
                                  margin: EdgeInsets.all(5),
                                  child: Align(
                                    alignment: Alignment.topLeft,
                                    child: RichText(
                                      text: TextSpan(
                                        text: widget.product.name,
                                        style: TextStyle(
                                            color: Colors.black,
                                            fontSize: 14,
                                            fontWeight: FontWeight.normal),
                                      ),
                                    ),
                                  ),
                                ),
                                Container(
                                  margin: EdgeInsets.all(5),
                                  child: Align(
                                    alignment: Alignment.topLeft,
                                    child: RichText(
                                      text: TextSpan(
                                        text:
                                            '${widget.product.price} ${TranslationBase.of(context).sar}',
                                        style: TextStyle(
                                            fontWeight: FontWeight.bold,
                                            color: Colors.black,
                                            fontSize: 13),
                                      ),
                                    ),
                                  ),
                                ),
                                Row(
                                  mainAxisAlignment: MainAxisAlignment.start,
                                  children: [
                                    Container(
                                      child: Align(
                                        alignment: Alignment.topLeft,
                                        child: RatingBar.readOnly(
                                          initialRating: ratingValue,
                                          size: 15.0,
                                          filledColor: Colors.yellow[700],
                                          emptyColor: Colors.grey[500],
                                          isHalfAllowed: true,
                                          halfFilledIcon: Icons.star_half,
                                          filledIcon: Icons.star,
                                          emptyIcon: Icons.star,
                                        ),
                                      ),
                                    ),
                                    SizedBox(
                                      width: 20,
                                    ),
                                    Container(
                                      child: Align(
                                        child: RichText(
                                          text: TextSpan(
                                            text:
                                                '(${widget.product.approvedTotalReviews} reviews)',
                                            style: TextStyle(
                                                fontWeight: FontWeight.bold,
                                                color: Colors.grey,
                                                fontSize: 13),
                                          ),
                                        ),
                                      ),
                                    ),
                                  ],
                                ),
                              ],
                            ),
                          ),
                        ),
                      ]),
                ),
                Divider(
                  color: Colors.grey[350],
                  height: 20,
                  thickness: 8,
                  indent: 0,
                  endIndent: 0,
                ),
                Container(
                  margin: EdgeInsets.only(top: 12.0),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.center,
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    mainAxisSize: MainAxisSize.max,
                    children: <Widget>[
                      RatingBar(
                        size: 40.0,
                        filledColor: Colors.yellow[700],
                        emptyColor: Colors.grey[500],
                        isHalfAllowed: true,
                        halfFilledIcon: Icons.star_half,
                        filledIcon: Icons.star,
                        emptyIcon: Icons.star,
                        onRatingChanged: (rating) {
                          currentRating = rating;
                        },
                      ),
                    ],
                  ),
                ),
                Container(
                  padding: EdgeInsets.symmetric(horizontal: 16, vertical: 16),
                  child: Column(
                    children: <Widget>[
                      TextFormField(
                        controller: _reviewController,
                        maxLines: 6,
                        minLines: 4,
                        decoration: InputDecoration(
                          border: InputBorder.none,
                          hintText: 'Tell us more about product!',
                          focusedBorder: OutlineInputBorder(
                            borderRadius: BorderRadius.circular(5.0),
                            borderSide:
                                BorderSide(width: 1, color: Colors.grey[400]),
                          ),
                          enabledBorder: OutlineInputBorder(
                            borderRadius:
                                BorderRadius.all(Radius.circular(5.0)),
                            borderSide:
                                BorderSide(color: Colors.grey[400], width: 1),
                          ),
                        ),
                        onChanged: (value) {
                          setState(() {
                            reviewText = value;
                          });
                        },
                        textAlign: TextAlign.start,
                        textAlignVertical: TextAlignVertical.top,
                      ),
                    ],
                  ),
                ),
                InkWell(
                  onTap: reviewText != null && reviewText != ""
                      ? () {
                          model
                              .makeReview(
                                  widget.product, ratingValue, reviewText)
                              .then((value) {
                            setState(() {
                              finishReview = true;
                            });
                          });
                        }
                      : null,
                  child: Container(
                    margin: EdgeInsets.symmetric(vertical: 8, horizontal: 16),
                    height: 50.0,
                    width: 400.0,
                    color: Colors.transparent,
                    child: Container(
                      decoration: BoxDecoration(
                          border: Border.all(
                              color: _reviewController.value.text != null &&
                                      _reviewController.value.text != ""
                                  ? Colors.yellow[700]
                                  : Color(0xFFf5d69c),
                              style: BorderStyle.solid,
                              width: 1.0),
                          color: _reviewController.value.text != null &&
                                  _reviewController.value.text != ""
                              ? Colors.yellow[700]
                              : Color(0xFFf5d69c),
                          borderRadius: BorderRadius.circular(5.0)),
                      child: Center(
                        child: Text(
                          TranslationBase.of(context).shareReview,
                          style: TextStyle(
                            color: Colors.white,
                            fontSize: 16.0,
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ) : getReviewedProduct(),
        ),
      ),
    );
  }

  //new screen is showing after submitting the review
  Widget getReviewedProduct() {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            SvgPicture.asset(
              'assets/images/pharmacy/check_icon.svg',
              width: 28,
              height: 28,
            ),
            Container(
              margin: EdgeInsets.symmetric(horizontal: 8),
              child: Text(
                TranslationBase.of(context).reviewSuccessful,
                style: TextStyle(
                  fontSize: 20.0,
                  fontWeight: FontWeight.bold,
                ),
              ),
            ),
          ],
        ),
        Container(
          margin: EdgeInsets.symmetric(horizontal: 8, vertical: 8),
          child: Text(
            TranslationBase.of(context).reviewShared,
            style: TextStyle(
              fontSize: 15.0,
            ),
          ),
        ),
        Container(
          margin: EdgeInsets.only(bottom: 30.0, top: 30.0),
          child: SvgPicture.asset(
            'assets/images/pharmacy/success_review_icon.svg',
            width: 100,
            height: 100,
          ),
        ),
        Container(
          margin: EdgeInsets.symmetric(horizontal: 16),
          child: Column(
            children: <Widget>[
              Row(
                mainAxisAlignment: MainAxisAlignment.start,
                children: <Widget>[
                  SvgPicture.asset(
                    'assets/images/pharmacy/quote_start.svg',
                    width: 15,
                    height: 15,
                  ),
                ],
              ),
              Text(
                TranslationBase.of(context).reviewComment,
                style: TextStyle(
                  fontSize: 15.0,
                ),
              ),
              Row(
                mainAxisAlignment: MainAxisAlignment.end,
                children: <Widget>[
                  SvgPicture.asset(
                    'assets/images/pharmacy/quote_end.svg',
                    width: 15,
                    height: 15,
                  ),
                ],
              ),
            ],
          ),
        ),
        Container(
          margin: EdgeInsets.only(top: 20.0),
          child: InkWell(
            onTap: () {
              Navigator.push(
                context,
                MaterialPageRoute(builder: (context) {
                  return PharmacyProfilePage();
                }),
              );
            },
            child: Container(
              height: 50.0,
              color: Colors.transparent,
              child: Container(
                decoration: BoxDecoration(
                    border: Border.all(
                        color: Colors.orange,
                        style: BorderStyle.solid,
                        width: 1.0),
                    color: Colors.transparent,
                    borderRadius: BorderRadius.circular(5.0)),
                child: Center(
                  child: Text(
                    TranslationBase.of(context).backMyAccount,
                    style: TextStyle(
                      color: Colors.orange,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ),
              ),
            ),
          ),
        ),
      ],
    );
  }

}
