import 'package:cached_network_image/cached_network_image.dart';

import 'package:e_commerce_training/res/R.dart';
import 'package:e_commerce_training/src/model/repository/app_repository.dart';
import 'package:e_commerce_training/src/page/viewed_products/viewed_products_cubit.dart';
import 'package:e_commerce_training/src/util/util.dart';
import 'package:e_commerce_training/src/widget/custom_appbar.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:material_design_icons_flutter/material_design_icons_flutter.dart';
import 'package:pull_to_refresh/pull_to_refresh.dart';
import 'package:smooth_star_rating/smooth_star_rating.dart';
import 'package:easy_localization/easy_localization.dart';

class ViewedProducts extends StatefulWidget {
  const ViewedProducts({Key? key}) : super(key: key);

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

class _ViewedProductsState extends State<ViewedProducts> {
  late ViewedProductsCubit _cubit;
  RefreshController _refreshController = RefreshController();

  @override
  void initState() {
    AppRepository repository = AppRepository();
    _cubit = ViewedProductsCubit(repository);
    _cubit.addViewedProduct();
    // TODO: implement initState
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: R.color.white,
      appBar: appBar(context, R.string.viewed.tr(), rightIcons: [MdiIcons.cartOutline]),
      body: BlocProvider(
        create: (BuildContext context) => _cubit,
        child: BlocConsumer<ViewedProductsCubit, ViewedProductsState>(
          listener: (context, state) {
            if (state is ViewedProductFailure)
              Util.showErrorSnackBar(
                context,
                state.error,
              );
            if (!(state is ViewedProductLoading)) _refreshController.refreshCompleted();
          },
          builder: (context, state) {
            return ListView.separated(
              itemBuilder: (BuildContext context, int index) {
                return Container(
                  padding: EdgeInsets.symmetric(vertical: 5, horizontal: 5),
                  width: MediaQuery.of(context).size.width,
                  child: Row(
                    children: [
                      CachedNetworkImage(
                        height: 250.h,
                        width: 250.w,
                        imageUrl: "${_cubit.listProduct[_cubit.index].listViewedProduct![index].thumb}",
                      ),
                      Expanded(
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.start,
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Text(
                              "${_cubit.listProduct[_cubit.index].listViewedProduct![index].title}",
                              style: TextStyle(fontSize: 16.sp),
                              maxLines: 2,
                            ),
                            SizedBox(height: 5),
                            Row(
                              children: [
                                Text(
                                  "${_cubit.listProduct[_cubit.index].listViewedProduct![index].producer} ",
                                  style: TextStyle(fontSize: 14.sp, color: R.color.grey500),
                                ),
                                Text(
                                  "${_cubit.listProduct[_cubit.index].listViewedProduct![index].manufacture} ",
                                  style: TextStyle(fontSize: 14.sp, color: R.color.black),
                                ),
                              ],
                            ),
                            SizedBox(height: 5),
                            Text(
                              Util.formatMoney(
                                "${_cubit.listProduct[_cubit.index].listViewedProduct![index].price}",
                              ),
                              style: TextStyle(color: R.color.red),
                            ),
                            SizedBox(height: 5),
                            Row(
                              children: [
                                SmoothStarRating(
                                  starCount: 5,
                                  isReadOnly: false,
                                  allowHalfRating: true,
                                  rating: 5,
                                  size: 60.h,
                                  color: R.color.orange,
                                  borderColor: R.color.grey,
                                  spacing: 0.0,
                                ),
                                SizedBox(
                                  width: 3,
                                ),
                                Text(
                                  "${_cubit.listProduct[_cubit.index].listViewedProduct![index].evaluate}",
                                  style: TextStyle(fontSize: 14.sp, color: R.color.grey500),
                                )
                              ],
                            ),
                          ],
                        ),
                      )
                    ],
                  ),
                );
              },
              separatorBuilder: (BuildContext context, int index) => Divider(
                color: R.color.grey500,
              ),
              itemCount: _cubit.listProduct[_cubit.index].listViewedProduct!.length,
            );
          },
        ),
      ),
    );
  }
}
