import 'package:dio/dio.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
import 'package:flutter_swiper/flutter_swiper.dart';
import 'package:huixiang/generated/l10n.dart';
import 'package:huixiang/main.dart';
import 'package:huixiang/retrofit/data/article.dart';
import 'package:huixiang/retrofit/data/banner.dart';
import 'package:huixiang/retrofit/data/base_data.dart';
import 'package:huixiang/retrofit/data/brand.dart';
import 'package:huixiang/retrofit/data/founder.dart';
import 'package:huixiang/retrofit/data/goods.dart';
import 'package:huixiang/retrofit/data/page.dart';
import 'package:huixiang/retrofit/retrofit_api.dart';
import 'package:huixiang/utils/event_type.dart';
import 'package:huixiang/utils/flutter_utils.dart';
import 'package:huixiang/view_widget/border_text.dart';
import 'package:huixiang/view_widget/classic_header.dart';
import 'package:huixiang/view_widget/custom_image.dart';
import 'package:huixiang/view_widget/hot_item.dart';
import 'package:huixiang/view_widget/item_title.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:huixiang/view_widget/login_tips.dart';
import 'package:pull_to_refresh/pull_to_refresh.dart';
import 'package:shared_preferences/shared_preferences.dart';

class HomePage extends StatefulWidget {
  final GestureTapCallback callback;

  HomePage(this.callback);

  @override
  State<StatefulWidget> createState() {
    return _HomePage(callback);
  }
}

class _HomePage extends State<HomePage> with AutomaticKeepAliveClientMixin {
  ApiService apiService;
  final GestureTapCallback callback;

  _HomePage(this.callback);

  @override
  void initState() {
    super.initState();

    SharedPreferences.getInstance().then((value) => {
          apiService = ApiService(Dio(),
              context: context,
              token: value.getString('token'),
              showLoading: false),
          queryHome(),
        });

    eventBus.on<EventType>().listen((event) {
      if (event.type < 3) {
        setState(() {});
      }
    });
  }

  loginTips() {
    SmartDialog.show(
      widget: LoginTips(
        click: () {
          SharedPreferences.getInstance().then((value) => value.setString("token", ""));
          Navigator.of(context)
              .pushNamed('/router/login_page', arguments: {"login": "login"});
        },
      ),
      clickBgDismissTemp: false,
    );
  }

  SwiperController controller = SwiperController();

  List<BannerData> bannerData = [];
  List<Brand> brandData = [];
  List<Article> articles = [];
  List<Goods> gooods = [];
  Founder founder;

  queryHome() async {
    SmartDialog.showLoading(msg: S.of(context).zhengzaijiazai);
    BaseData baseData = await apiService.queryBanner({
      "model": {"type": "HOME_PAGE"},
    }).catchError((onError) {
      refreshController.refreshFailed();
    });
    if (baseData != null && baseData.isSuccess) {
      bannerData.clear();
      bannerData.addAll((baseData.data["records"] as List<dynamic>)
          .map((e) => BannerData.fromJson(e))
          .toList());
      setState(() {
        controller.move(0, animation: false);
      });
    }

    BaseData brand = await apiService.queryHomeBrand().catchError((onError) {
      refreshController.refreshFailed();
    }).catchError((onError) {
      refreshController.refreshFailed();
    });
    if (brand != null && brand.isSuccess) {
      brandData.clear();
      brandData.addAll((brand.data["brandList"] as List<dynamic>)
          .map((e) => Brand.fromJson(e))
          .toList());
      founder = Founder.fromJson(brand.data["founder"]);
      setState(() {});
    }

    BaseData article = await apiService.queryArticle({
      "pageNum": 1,
      "pageSize": 10,
      "searchKey": "",
      "state": 1,
      "type": 2
    }).catchError((onError) {
      refreshController.refreshFailed();
    });
    articles.clear();
    if (article != null && article.isSuccess) {
      PageInfo pageInfo = PageInfo.fromJson(article.data);
      articles.addAll(pageInfo.list.map((e) => Article.fromJson(e)).toList());
    }

    BaseData goodsData = await apiService.creditGoods({
      "orderDesc": true,
      "orderType": 1,
      "pageNum": 1,
      "pageSize": 10,
      "state": 1
    });
    if (goodsData != null && goodsData.isSuccess) {
      PageInfo page = PageInfo.fromJson(goodsData.data);
      gooods.clear();
      gooods.addAll(page.list.map((e) => Goods.fromJson(e)));
      setState(() {});
    }
    SmartDialog.dismiss();
    if (baseData != null && baseData.isSuccess) {
      refreshController.refreshCompleted();
      if (mounted) setState(() {});
    } else {
      refreshController.refreshFailed();
    }
  }

  @override
  void dispose() {
    super.dispose();
    refreshController.dispose();
  }

  RefreshController refreshController = RefreshController();

  @override
  Widget build(BuildContext context) {
    super.build(context);
    return Container(
      child: SmartRefresher(
        controller: refreshController,
        enablePullDown: true,
        enablePullUp: false,
        header: MyHeader(),
        physics: BouncingScrollPhysics(),
        onRefresh: queryHome,
        child: SingleChildScrollView(
          physics: NeverScrollableScrollPhysics(),
          child: Column(
            children: [
              banner(),
              SizedBox(
                height: 20,
              ),
              ItemTitle(
                text: S.of(context).jinrihuiyuanrenwu,
                imgPath: "assets/image/icon_today_task.png",
                moreText: S.of(context).renwuzhongxin,
                onTap: () {
                  SharedPreferences.getInstance().then((value) {
                    if (value.getString('token') == null) {
                      loginTips();
                    } else {
                      Navigator.of(context).pushNamed('/router/integral_page');
                    }
                  });
                },
              ),
              InkWell(
                onTap: () {
                  SharedPreferences.getInstance().then((value) {
                    if (value.getString('token') == null) {
                      loginTips();
                    } else {
                      Navigator.of(context).pushNamed('/router/integral_page');
                    }
                  });
                },
                child: signIn(),
              ),
              SizedBox(
                height: 12,
              ),
              ItemTitle(
                text: S.of(context).huixiangtoutiao,
                imgPath: "assets/image/icon_today_video.png",
                moreText: S.of(context).chakangengduo,
                onTap: () {
                  Navigator.of(context).pushNamed('/router/hot_article_page');
                },
              ),
              hotList(),
              // ItemTitle(
              //   text: S.of(context).chuangshirendegushi1,
              //   imgPath: "assets/image/icon_founder.png",
              // ),
              GestureDetector(
                onTap: () {
                  Navigator.of(context).pushNamed('/router/founder_story_page');
                },
                child: founderStore(),
              ),
              ItemTitle(
                text: S.of(context).pinpaijieshao,
                imgPath: "assets/image/icon_brand_introduction.png",
              ),
              brands(),
              // ban(),
              Container(
                margin:
                    EdgeInsets.only(left: 16.5.w, right: 16.5.w, bottom: 40.h,top: 20.h),
                padding: EdgeInsets.only(bottom: 10.h, top: 16.h),
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.all(
                    Radius.circular(4),
                  ),
                  boxShadow: [
                    BoxShadow(
                      color: Colors.black.withAlpha(12),
                      offset: Offset(0, 3),
                      blurRadius: 14,
                      spreadRadius: 0,
                    )
                  ],
                  color: Colors.white,
                ),
                child: Column(
                  children: [
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: [
                        Expanded(
                            flex: 1,
                            child: ItemTitle(
                              text: S.of(context).jifenshangcheng,
                              imgPath: "assets/image/icon_points_mall.png",
                            )),
                        GestureDetector(
                          onTap: callback,
                          child: Container(
                            padding: EdgeInsets.only(
                                left: 8.w, right: 8.w, top: 3.h, bottom: 3.h),
                            margin: EdgeInsets.only(right: 16.w),
                            decoration: BoxDecoration(
                              borderRadius: BorderRadius.circular(11.5),
                              color: Color(0xFF32A060),
                            ),
                            child: Row(
                              children: [
                                Text(
                                  "GO",
                                  style: TextStyle(
                                    fontSize: 14.sp,
                                    fontWeight: FontWeight.bold,
                                    color: Colors.white,
                                  ),
                                ),
                                Icon(
                                  Icons.chevron_right,
                                  color: Colors.white,
                                  size: 18,
                                ),
                              ],
                            ),
                          ),
                        ),
                      ],
                    ),
                    SizedBox(
                      height: 14.h,
                    ),
                    Divider(
                      // indent: 0.0,
                      thickness: 1,
                      color: Color(0xffF2F2F2),
                    ),
                    integralStore(),
                  ],
                ),
              ),
              // integralStore(),
            ],
          ),
        ),
      ),
    );
  }

  Widget hotList() {
    return Container(
      child: ListView.builder(
          shrinkWrap: true,
          itemCount: articles != null
              ? ((articles.length > 3) ? 3 : articles.length)
              : 0,
          physics: BouncingScrollPhysics(),
          scrollDirection: Axis.vertical,
          padding: EdgeInsets.symmetric(vertical: 12.h),
          itemBuilder: (context, position) {
            return AspectRatio(
              aspectRatio: 2.47,
              child: Container(
                height: 151.h,
                margin: EdgeInsets.symmetric(vertical: 6.h, horizontal: 16.w),
                child: HotArticleItem(article: articles[position]),
              ),
            );
          }),
      // child: Swiper(
      //   key: UniqueKey(),
      //   itemCount: articles != null ? articles.length : 0,
      //   viewportFraction: 0.8,
      //   scale: 1,
      //   loop: false,
      //   physics: BouncingScrollPhysics(),
      //   itemBuilder: (context, position) {
      //     return Container(
      //       margin: EdgeInsets.symmetric(vertical: 15.h, horizontal: 4.5.w),
      //       child: HotArticleItem(article: articles[position]),
      //     );
      //   },
      // ),
    );
  }

  Widget founderStore() {
    return Container(
      margin: EdgeInsets.only(left: 16.w, right: 16.w, top: 22.h, bottom: 28.h),
      decoration: BoxDecoration(
        boxShadow: [
          BoxShadow(
            color: Colors.black.withAlpha(25),
            offset: Offset(0, 3),
            blurRadius: 14,
            spreadRadius: 0,
          )
        ],
      ),
      child: Stack(
        alignment: Alignment.bottomCenter,
        clipBehavior: Clip.hardEdge,
        children: [
          MImage(
            founder != null ? founder.imgUrl : "",
            aspectRatio: 2,
            radius: BorderRadius.circular(4.w),
            fit: BoxFit.cover,
            errorSrc: "assets/image/default_2_1.png",
            fadeSrc: "assets/image/default_2_1.png",
          ),
          Container(
            padding: EdgeInsets.all(8.w),
            decoration: BoxDecoration(
              color: Colors.black.withAlpha(153),
              borderRadius: BorderRadius.only(
                bottomLeft: Radius.circular(4.w),
                bottomRight: Radius.circular(4.w),
              ),
            ),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.baseline,
              textBaseline: TextBaseline.alphabetic,
              children: [
                Expanded(
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.end,
                    crossAxisAlignment: CrossAxisAlignment.baseline,
                    textBaseline: TextBaseline.alphabetic,
                    children: [
                      Expanded(
                        child: Row(
                          children: [
                            Text(
                              S.of(context).chuangshirendegushi,
                              style: TextStyle(
                                fontSize: 14.sp,
                                fontWeight: FontWeight.bold,
                                color: Colors.white,
                              ),
                            ),
                            Text(
                              founder != null ? founder.name : "",
                              style: TextStyle(
                                fontSize: 14.sp,
                                fontWeight: FontWeight.bold,
                                color: Colors.white,
                              ),
                            ),
                          ],
                        ),
                        flex: 1,
                      ),
                      Row(
                        children: [
                          Text(
                            S.of(context).chakanxiangqing,
                            style: TextStyle(
                              fontSize: 10.sp,
                              fontWeight: FontWeight.w500,
                              color: Colors.white,
                            ),
                          ),
                          Icon(
                            Icons.keyboard_arrow_right,
                            size: 12,
                            color: Colors.white,
                          ),
                        ],
                      ),
                    ],
                  ),
                  flex: 1,
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  // Widget points() {
  //   return Container(
  //     child: integralStore(),
  //   );
  // }

  Widget integralStore() {
    return GridView.builder(
      itemCount: gooods != null ? gooods.length : 0,
      padding: EdgeInsets.only(left: 13, right: 13, top: 13, bottom: 13),
      shrinkWrap: true,
      physics: NeverScrollableScrollPhysics(),
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
        //一行的Widget数量
        crossAxisCount: 2,
        //水平子Widget之间间距
        crossAxisSpacing: 13,
        //垂直子Widget之间间距
        mainAxisSpacing: 16,
        //子Widget宽高比例
        childAspectRatio: 1 - (AppUtils.textScale(context) - 1),
      ),
      itemBuilder: (contetx, index) {
        return GestureDetector(
          onTap: () {
            Navigator.of(context).pushNamed('/router/integral_store_page',
                arguments: {"goodsId": gooods[index].id});
          },
          child: buildItem(gooods[index]),
        );
      },
    );
  }

  Widget buildItem(Goods goods) {
    return Container(
      alignment: Alignment.center,
      child: Column(
        children: [
          MImage(
            goods.mainImgPath,
            aspectRatio: 5 / 3,
            radius: BorderRadius.circular(4),
            fit: BoxFit.cover,
            errorSrc: "assets/image/default_1.png",
            fadeSrc: "assets/image/default_1.png",
          ),
          SizedBox(
            height: 4.h,
          ),
          Container(
            margin: EdgeInsets.only(left: 8.w, right: 8.w),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                SizedBox(
                  height: 14.h,
                ),
                Row(
                  children: [
                    Expanded(
                      flex: 1,
                      child: Text(
                        goods.name,
                        overflow: TextOverflow.ellipsis,
                        style: TextStyle(
                          color: Color(0xff353535),
                          fontWeight: FontWeight.w400,
                          fontSize: 14.sp,
                        ),
                      ),
                    ),
                    BorderText(
                      padding: EdgeInsets.all(2.h),
                      text: S.of(context).haowu,
                      fontSize: 12.sp,
                      fontWeight: FontWeight.bold,
                      textColor: Color(0xFF32A060),
                      borderColor: Color(0xFF32A060),
                      borderWidth: 1.w,
                    ),
                  ],
                ),
                SizedBox(
                  height: 5.h,
                ),
                Text(
                  goods.description,
                  overflow: TextOverflow.ellipsis,
                  maxLines: 2,
                  style: TextStyle(
                    color: Color(0xFF727272),
                    fontSize: 12.sp,
                    fontWeight: FontWeight.w400,
                  ),
                ),
              ],
            ),
          )
        ],
      ),
    );
  }

  ///签到view
  Widget signIn() {
    return Container(
      padding: EdgeInsets.only(left: 12.w, top: 8.h, bottom: 8.h, right: 12.w),
      margin: EdgeInsets.all(16),
      decoration: BoxDecoration(
        color: Colors.white,
        boxShadow: [
          BoxShadow(
            color: Colors.black.withAlpha(12),
            offset: Offset(0, 3),
            blurRadius: 14,
            spreadRadius: 0,
          )
        ],
        borderRadius: BorderRadius.circular(4),
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              Image.asset(
                "assets/image/icon_calendar_today_sharp.png",
                width: 20,
                height: 20.h,
              ),
              SizedBox(
                width: 8,
              ),
              Text(
                S.of(context).qiandaolingqujinfen,
                style: TextStyle(
                    color: Colors.black,
                    fontSize: 14,
                    fontWeight: FontWeight.w400),
              ),
            ],
          ),
          Text(
            S.of(context).quqiandao,
            style: TextStyle(
                color: Color(0xFF727272),
                fontSize: 12,
                fontWeight: FontWeight.w400),
          ),
        ],
      ),
    );
  }

  brands() {
    return Container(
      height: 90.h,
      margin: EdgeInsets.only(bottom: 18.h),
      child: ListView.builder(
        padding: EdgeInsets.only(left: 10.w, right: 10.w),
        scrollDirection: Axis.horizontal,
        physics: BouncingScrollPhysics(),
        itemBuilder: (context, position) {
          return Container(
            height: 60.h,
            width: 120.w,
            margin: EdgeInsets.symmetric(horizontal: 3.w, vertical: 15.h),
            decoration: BoxDecoration(
              color: Colors.white,
              boxShadow: [
                BoxShadow(
                  color: Colors.black.withAlpha(37),
                  offset: Offset(0, 2),
                  blurRadius: 5,
                  spreadRadius: 0,
                )
              ],
              borderRadius: BorderRadius.circular(8),
            ),
            child: MImage(
              brandData != null ? brandData[position].image : "",
              radius: BorderRadius.circular(8),
              fit: BoxFit.cover,
              errorSrc: "assets/image/default_2_1.png",
              fadeSrc: "assets/image/default_2_1.png",
            ),
          );
        },
        itemCount:
            (brandData != null && brandData.length > 0) ? brandData.length : 0,
      ),
    );
  }

  // ban() {
  //   return Container(
  //     // height: 90.h,
  //     margin: EdgeInsets.only(bottom: 18.h),
  //     child: AspectRatio(
  //       aspectRatio:4/1,
  //       child: Swiper(
  //           viewportFraction: 0.5,
  //           scale: 0.5,
  //           // loop: false,
  //           // scrollDirection: Axis.horizontal,
  //           itemBuilder: (context, position) {
  //             return Container(
  //               height: 50.h,
  //               width: 106.w,
  //               margin: EdgeInsets.symmetric(horizontal: 3.w, vertical: 15.h),
  //               decoration: BoxDecoration(
  //                 color: Colors.white,
  //                 boxShadow: [
  //                   BoxShadow(
  //                     color: Colors.black.withAlpha(37),
  //                     offset: Offset(0, 2),
  //                     blurRadius: 5,
  //                     spreadRadius: 0,
  //                   )
  //                 ],
  //                 borderRadius: BorderRadius.circular(8),
  //               ),
  //               child: MImage(
  //                 brandData != null ? brandData[position].image : "",
  //                 radius: BorderRadius.circular(8),
  //                 fit: BoxFit.cover,
  //                 errorSrc: "assets/image/default_2_1.png",
  //                 fadeSrc: "assets/image/default_2_1.png",
  //               ),
  //             );
  //           },
  //           itemCount: bannerData != null ? bannerData.length : 0),
  //     ),
  //   );
  // }

  banner() {
    return Container(
      child: AspectRatio(
        aspectRatio: 2,
        child: Swiper(
          pagination: SwiperPagination(
            margin: EdgeInsets.only(bottom: 20.h),
            alignment: Alignment.bottomCenter,
            builder: DotSwiperPaginationBuilder(
              size: 8,
              activeSize: 8,
              space: 5,
              activeColor: Colors.white,
              color: Colors.white.withAlpha(76),
            ),
          ),
          controller: controller,
          physics: BouncingScrollPhysics(),
          itemBuilder: (context, position) {
            return InkWell(
              onTap: () {
                bannerClick(bannerData[position]);
              },
              child: Container(
                margin: EdgeInsets.all(16),
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(8),
                ),
                child: MImage(
                  (bannerData != null && position < bannerData.length)
                      ? bannerData[position].imgUrl ?? ""
                      : "",
                  radius: BorderRadius.circular(8),
                  fit: BoxFit.cover,
                  errorSrc: "assets/image/default_2_1.png",
                  fadeSrc: "assets/image/default_2_1.png",
                ),
              ),
            );
          },
          itemCount: bannerData != null ? bannerData.length : 1,
        ),
      ),
    );
  }

  /// contentType     跳转类型（0：不跳转，1：积分商品，2：活动，3：文章）
  bannerClick(BannerData bannerData) async {
    switch (bannerData.contentType) {
      case 1:
        Navigator.of(context).pushNamed('/router/integral_store_page',
            arguments: {"goodsId": bannerData.content});
        break;
      case 2:
        Navigator.of(context)
            .pushNamed('/router/store_detail_page', arguments: {
          "activityId": bannerData.content,
        });
        break;
      case 3:
        Navigator.of(context)
            .pushNamed('/router/store_detail_page', arguments: {
          "articleId": bannerData.content,
        });
        break;
    }
  }

  @override
  bool get wantKeepAlive => true;
}