import 'dart:convert';
import 'dart:io';
import 'dart:ui';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:fluttertoast/fluttertoast.dart';
import 'package:huixiang/generated/l10n.dart';
import 'package:huixiang/retrofit/data/base_data.dart';
import 'package:huixiang/retrofit/data/goods.dart';
import 'package:huixiang/retrofit/data/page.dart';
import 'package:huixiang/retrofit/data/user_info.dart';
import 'package:huixiang/retrofit/retrofit_api.dart';
import 'package:huixiang/view_widget/classic_header.dart';
import 'package:huixiang/view_widget/custom_image.dart';
import 'package:huixiang/view_widget/item_title.dart';
import 'package:flutter_swiper_null_safety/flutter_swiper_null_safety.dart';
import 'package:pull_to_refresh/pull_to_refresh.dart';

import 'package:dio/dio.dart';
import 'package:shared_preferences/shared_preferences.dart';

class PointsMallPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _PointsMallPage();
  }
}

class _PointsMallPage extends State<PointsMallPage> {
  var _itemText = S.current.morenpaixu;

  ApiService client;
  RefreshController _refreshController =
      RefreshController(initialRefresh: false);
  List<String> sortString = [
    S.current.morenpaixu,
    S.current.duihuanlianggaodaodi,
    S.current.duihuanliangdidaogao,
    S.current.jifengaodaodi,
    S.current.jifendidaogao,
  ];

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

    SharedPreferences.getInstance().then((value) => {
          client = ApiService(Dio(), token: value.getString('token')),
          creditGoods(),
          queryUser(),
        });
  }

  int pageNum = 1;

  //排序类型枚举：1-自然排序，2-销量，3-价格
  int orderType = 1;

  //是否降序排列
  bool orderDesc = true;
  PageInfo page;
  List<Goods> gooods = [];
  UserInfo userinfo;

  queryUser() async {
    BaseData baseData = await client.queryInfo();
    if (baseData.isSuccess) {
      userinfo = UserInfo.fromJson(baseData.data);
      SharedPreferences.getInstance().then((value) => {
            value.setString('user', jsonEncode(baseData.data)),
          });
      setState(() {});
    } else {
      Fluttertoast.showToast(msg: baseData.msg);
    }
  }

  creditGoods() async {
    var param = {
      "orderDesc": orderDesc,
      "orderType": orderType,
      "pageNum": pageNum,
      "pageSize": 10,
      "state": 1
    };
    BaseData baseData = await client.creditGoods(param);
    if (baseData.isSuccess) {
      page = PageInfo.fromJson(baseData.data);
      if (pageNum == 1) {
        gooods.clear();
      }
      gooods.addAll(page.list.map((e) => Goods.fromJson(e)));
      setState(() {
        _refreshController.refreshCompleted();
        _refreshController.loadComplete();
        if (page.pageNum == page.pages) {
          _refreshController.loadNoData();
        } else {
          pageNum += 1;
        }
      });
    } else {
      _refreshController.loadFailed();
      _refreshController.refreshFailed();
      Fluttertoast.showToast(msg: baseData.msg);
    }
  }

  _refresh() {
    pageNum = 1;
    creditGoods();
    queryUser();
  }

  @override
  Widget build(BuildContext context) {
    List<DropdownMenuItem<String>> sortItems = [];
    sortString.forEach((element) {
      sortItems.add(DropdownMenuItem(value: element, child: Text(element)));
    });
    return SmartRefresher(
      enablePullDown: true,
      enablePullUp: true,
      header: MyHeader(),
      footer: CustomFooter(
        builder: (BuildContext context, LoadStatus mode) {
          Widget body;
          if (mode == LoadStatus.idle) {
            body = Text("pull up load");
          } else if (mode == LoadStatus.loading) {
            body = CupertinoActivityIndicator();
          } else if (mode == LoadStatus.failed) {
            body = Text("Load Failed!Click retry!");
          } else if (mode == LoadStatus.canLoading) {
            body = Text("release to load more");
          } else {
            body = Text("No more Data");
          }
          return Container(
            height: 55.0,
            child: Center(child: body),
          );
        },
      ),
      controller: _refreshController,
      onRefresh: _refresh,
      onLoading: creditGoods,
      child: SingleChildScrollView(
        physics: BouncingScrollPhysics(),
        child: Container(
          color: Color(0xFFFAFAFA),
          child: Column(
            children: [
              banner(),
              userItem(),
              ItemTitle(
                text: S.of(context).jifenshangcheng,
                imgPath: "assets/image/icon_points_mall.png",
                moreText: _itemText,
                moreType: 1,
                items: sortItems,
                onChanged: _sortChange,
              ),
              GridView.builder(
                  itemCount: gooods.length,
                  padding: EdgeInsets.only(left: 16, right: 16, top: 16),
                  shrinkWrap: true,
                  physics: NeverScrollableScrollPhysics(),
                  gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                    //一行的Widget数量
                    crossAxisCount: 2,
                    //水平子Widget之间间距
                    crossAxisSpacing: 11.0,
                    //垂直子Widget之间间距
                    mainAxisSpacing: 16,
                    //子Widget宽高比例
                    childAspectRatio: Platform.isAndroid ? 0.56 : 0.60,
                  ),
                  itemBuilder: (contetx, index) {
                    return GestureDetector(
                      onTap: () {
                        _toDetails(index);
                      },
                      child: buildItem(gooods[index]),
                    );
                  })
            ],
          ),
        ),
      ),
    );
  }

  _toDetails(index) async {
    await Navigator.of(context).pushNamed('/router/integral_store_page',
        arguments: {"goodsId": gooods[index].id});
    queryUser();
  }

  _sortChange(item) {
    var index = sortString.indexOf(item);
    switch (index) {
      case 0:
        orderType = 1;
        break;
      case 1:
        orderType = 2;
        orderDesc = true;
        break;
      case 2:
        orderType = 2;
        orderDesc = false;
        break;
      case 3:
        orderType = 3;
        orderDesc = true;
        break;
      case 4:
        orderType = 3;
        orderDesc = false;
        break;
    }
    creditGoods();
    setState(() {
      _itemText = item;
    });
  }

  Widget buildItem(Goods goods) {
    return Container(
      alignment: Alignment.center,
      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: Stack(
        alignment: AlignmentDirectional.topEnd,
        fit: StackFit.loose,
        children: [
          Column(
            children: [
              MImage(
                goods.mainImgPath,
                aspectRatio: 1,
                radius: BorderRadius.only(
                  topLeft: Radius.circular(4),
                  topRight: Radius.circular(4),
                ),
                fit: BoxFit.cover,
                errorSrc: "assets/image/default_1.png",
                fadeSrc: "assets/image/default_1.png",
              ),
              // Container(
              //   child: AspectRatio(
              //     aspectRatio: 1,
              //     child: ClipRRect(
              //       borderRadius: BorderRadius.only(
              //           topLeft: Radius.circular(4),
              //           topRight: Radius.circular(4)),
              //       child: Image.network(
              //         goods.mainImgPath,
              //         fit: BoxFit.cover,
              //         errorBuilder: (context, error, stackTrace) {
              //           return Image.asset(
              //             "assets/image/default_avatar.png",
              //             fit: BoxFit.cover,
              //           );
              //         },
              //         frameBuilder:
              //             (context, child, frame, wasSynchronousLoaded) {
              //           if (wasSynchronousLoaded) {
              //             return child;
              //           } else {
              //             return AnimatedCrossFade(
              //               firstChild: child,
              //               layoutBuilder: (widgetFirst, keyFirst, widgetSecond, keySecond) {
              //                 return Stack(
              //                   clipBehavior: Clip.none,
              //                   children: <Widget>[
              //                     Positioned(
              //                       key: keySecond,
              //                       left: 0.0,
              //                       top: 0.0,
              //                       right: 0.0,
              //                       bottom: 0.0,
              //                       child: widgetSecond,
              //                     ),
              //                     Positioned(
              //                       key: keyFirst,
              //                       left: 0.0,
              //                       top: 0.0,
              //                       right: 0.0,
              //                       bottom: 0.0,
              //                       child: widgetFirst,
              //                     ),
              //                   ],
              //                 );
              //               },
              //               secondChild: Image.asset(
              //                 "assets/image/default_avatar.png",
              //                 fit: BoxFit.cover,
              //               ),
              //               crossFadeState: frame != null
              //                   ? CrossFadeState.showFirst
              //                   : CrossFadeState.showSecond,
              //               duration: Duration(milliseconds: 500),
              //             );
              //           }
              //         },
              //         excludeFromSemantics: true,
              //       ),
              //     ),
              //   ),
              // )
              Container(
                margin:
                    EdgeInsets.only(left: 12, right: 12, bottom: 16, top: 10),
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      crossAxisAlignment: CrossAxisAlignment.end,
                      children: [
                        Text(
                          goods.name,
                          style: TextStyle(
                              color: Colors.black,
                              fontWeight: FontWeight.bold,
                              fontSize: 16),
                        ),
                        Text(
                          S.of(context).yiduihuanjian("${goods.sales}万"),
                          style: TextStyle(
                            color: Color(0xFFA29E9E),
                            fontSize: 10,
                          ),
                        ),
                      ],
                    ),
                    SizedBox(
                      height: 8,
                    ),
                    Container(
                      height: 34,
                      child: Text(
                        goods.description,
                        maxLines: 2,
                        style: TextStyle(
                          color: Color(0xFF727272),
                          fontSize: 12,
                        ),
                      ),
                    ),
                    SizedBox(
                      height: 12,
                    ),
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      crossAxisAlignment: CrossAxisAlignment.end,
                      children: [
                        Text(
                          S.of(context).yuan(goods.worth),
                          style: TextStyle(
                              color: Color(0xFF585858),
                              decoration: TextDecoration.lineThrough,
                              decorationColor: Color(0xFF585858),
                              fontSize: 12),
                        ),
                        Text(
                          S.of(context).jifen_(goods.price),
                          style: TextStyle(
                              color: Color(0xFF32A060),
                              fontSize: 14,
                              fontWeight: FontWeight.bold),
                        ),
                      ],
                    ),
                  ],
                ),
              )
            ],
          ),
          Visibility(
            visible: goods.isHot,
            child: ClipRRect(
              borderRadius: BorderRadius.only(topRight: Radius.circular(4)),
              child: Image.asset(
                "assets/image/icon_hot_right_top.png",
                width: 36,
                height: 36,
              ),
            ),
          ),
        ],
      ),
    );
  }

  Widget userItem() {
    return Container(
      margin: EdgeInsets.all(16),
      child: Row(
        children: [
          MImage(
            userinfo != null ? userinfo.headimg : "",
            width: 50,
            height: 50,
            radius: BorderRadius.all(Radius.circular(2)),
            fit: BoxFit.cover,
            errorSrc: "assets/image/default_1.png",
            fadeSrc: "assets/image/default_1.png",
          ),
          Expanded(
            child: Container(
              margin: EdgeInsets.only(left: 15),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    userinfo != null ? userinfo.nickname : "",
                    style: TextStyle(
                        fontSize: 14,
                        fontWeight: FontWeight.bold,
                        color: Color(0xFF353535)),
                  ),
                  Row(
                    children: [
                      Image.asset(
                        "assets/image/icon_an_crown.png",
                        width: 13,
                        height: 13,
                      ),
                      SizedBox(
                        width: 5,
                      ),
                      Text(
                        (userinfo != null && userinfo.memberRankVo != null)
                            ? userinfo.memberRankVo.rankName
                            : "",
                        style:
                            TextStyle(fontSize: 12, color: Color(0xFF353535)),
                      ),
                    ],
                  ),
                ],
              ),
            ),
            flex: 1,
          ),
          Container(
            margin: EdgeInsets.only(left: 15),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              crossAxisAlignment: CrossAxisAlignment.end,
              children: [
                Text(
                  S.of(context).yiyoujifen,
                  style: TextStyle(
                      fontSize: 12,
                      fontWeight: FontWeight.bold,
                      color: Color(0xFF4C4C4C)),
                ),
                Text(
                  (userinfo != null) ? "${userinfo.points}" : "",
                  style: TextStyle(
                      fontSize: 16,
                      color: Color(0xFFF8BA61),
                      fontWeight: FontWeight.bold),
                ),
              ],
            ),
          )
        ],
      ),
    );
  }

  banner() {
    var images = [
      "https://t7.baidu.com/it/u=963301259,1982396977&fm=193&f=GIF",
      "https://t7.baidu.com/it/u=1819248061,230866778&fm=193&f=GIF",
      "https://t7.baidu.com/it/u=1297102096,3476971300&fm=193&f=GIF",
      "https://t7.baidu.com/it/u=91673060,7145840&fm=193&f=GIF",
      "https://t7.baidu.com/it/u=3655946603,4193416998&fm=193&f=GIF",
    ];
    return Container(
      margin: EdgeInsets.only(top: 16, bottom: 16),
      child: AspectRatio(
        aspectRatio: 2.0,
        child: Swiper(
            pagination: SwiperPagination(
                alignment: Alignment.bottomCenter,
                builder: DotSwiperPaginationBuilder(
                    size: 8,
                    activeSize: 8,
                    space: 5,
                    activeColor: Colors.black,
                    color: Colors.black.withAlpha(76))),
            viewportFraction: 0.7,
            scale: 0.7,
            loop: true,
            itemBuilder: (context, position) {
              return Container(
                  margin: EdgeInsets.only(bottom: 40),
                  decoration: BoxDecoration(
                      borderRadius: BorderRadius.all(Radius.circular(8))),
                  child: ClipRRect(
                    borderRadius: BorderRadius.all(Radius.circular(8)),
                    child: Image(
                        fit: BoxFit.cover,
                        image: NetworkImage(images.elementAt(position))),
                  ));
            },
            itemCount: images.length),
      ),
    );
  }
}