// import 'dart:html';

import 'package:flustars/flustars.dart' as flustars;
import 'package:flutter/services.dart';
import 'package:flutter_spinkit/flutter_spinkit.dart';
import 'package:liftmanager/internal/bbs/model/expert_model.dart'
    as ExportModel;
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_swiper/flutter_swiper.dart';
import 'package:liftmanager/common/common.dart';
import 'package:liftmanager/common/user_db.dart';
import 'package:liftmanager/internal/account/account_router.dart';
import 'package:liftmanager/internal/account/provider/user_provider.dart';
import 'package:liftmanager/internal/bbs/provide/websocket.dart';
import 'package:liftmanager/internal/wode/model/privilege_model.dart';
import 'package:liftmanager/internal/wode/model/vipfee_model.dart';
import 'package:liftmanager/internal/wode/wode_router.dart';
import 'package:liftmanager/net/api_service.dart';
import 'package:liftmanager/res/colors.dart';
import 'package:liftmanager/routers/fluro_navigator.dart';
import 'package:liftmanager/utils/fast_notification.dart';
import 'package:liftmanager/utils/theme_utils.dart';
import 'package:liftmanager/utils/time_format.dart';
import 'package:liftmanager/utils/toast.dart';
import 'package:liftmanager/widgets/app_bar.dart';
import 'package:liftmanager/widgets/load_image.dart';
import 'package:liftmanager/widgets/round_widget.dart';
import 'package:oktoast/oktoast.dart';
import 'package:provider/provider.dart';

class Vip extends StatefulWidget {
  Vip(this.id);

  final String id;
  @override
  State<StatefulWidget> createState() {
    return VipState();
  }
}

class VipState extends State<Vip> with AutomaticKeepAliveClientMixin {
  UserProvider provider = UserProvider();

  int currentIndex = -1;

  /// 月卡季卡年卡
  int selectVipType = 0;

  ///选中的套餐
  Records selectedRecord = Records();

  List<PrivilegeModel> vipList = [];

  ///推荐套餐列表
  List<Records> moneyList = [];

  ExportModel.Records _userInfo = ExportModel.Records();

  TextEditingController _vipnumController = TextEditingController();

  void getUserInfo() {
    NewApiService().getExpertDetail(flustars.SpUtil.getString(Constant.userId),
        onSuccess: (res) {
      _userInfo = res;
      setState(() {});
      print("res");
    }, onError: (code, msg) {
      toasts(msg);
    });
    ApiService(context: context).userInfo(
      onSuccess: (data) {
        provider.setUser(data);
        // setUser(data);
      },
      onError: (code, msg) {},
    );
  }

  void getMemberAllMenu() {
    NewApiService().getVipFeeList(widget.id, onSuccess: (res) {
      moneyList = res.records;
      selectedRecord = moneyList[0];
      setState(() {});
    }, onError: (code, msg) {
      toasts(msg);
    });

    NewApiService().getMemberAllMenu(onSuccess: (res) {
      vipList = res;
      currentIndex = res.length > 0 ? 0 : -1;
      setState(() {});
    }, onError: (code, msg) {
      vipList = [];
      toasts(msg);
    });
  }

  bool vip = false;
  Future isVipOrExpert() async {
    await NewApiService().getIsVipOrExpert(onSuccess: (res) {
      if (res != null) {
        vip = true;
      }
    }, onError: (code, msg) {
      toasts(msg);
    });
  }

  Future becomeLowerMember() async {
    await NewApiService().getUserRebates(widget.id, onSuccess: (res) {
      toastsF(context, "你已成功接受${res != null ? res.toString() : ''}的邀请，立即成为会员！",
          timeInSecForIos: 3);
      // toasts("您已成为${res!=null?res.toString():''}的下级用户");
    }, onError: (code, msg) {
      toasts(msg);
    });
  }

  void updateVip(userLevel) {
    NewApiService().updateVip(userLevel, onSuccess: (res) {
      toasts("充值成功，请重新登录");
      setState(() {});
      User().clearUser();
      Provider.of<WebSocketProvide>(context, listen: false).closeWebSocket();
      // removeSocket();
      // _push.unbindAccount(account: flustars.SpUtil.getString(Constant.phone));
      NavigatorUtils.push(context, AccountRouter.loginPage, clearStack: true);
    }, onError: (code, msg) {
      toasts(msg);
    });
  }

  @override
  void initState() {
    getMemberAllMenu();
    getUserInfo();
    super.initState();
    print(widget.id);
    print(66666);

    FastNotification.addListener("initUserMoney", (initThisUserMoney) {
      if (mounted) {
        getUserInfo();
        setState(() {});
      }
    });
    if (widget.id != null && widget.id != "") {
      print("触发绑定");
      becomeLowerMember();
    }
  }

  @override
  void dispose() {
    // provider.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    double width = MediaQuery.of(context).size.width;
    double height = MediaQuery.of(context).size.height;

    return ChangeNotifierProvider<UserProvider>(
      create: (_) => provider,
      child: Container(
        child: Scaffold(
          // resizeToAvoidBottomPadding: false,
          appBar: MyAppBar(
            centerTitle: "会员中心",
            titleColor: Colors.white,
            bgColors: [Color(0xff3B3633), Color(0xff5B5350)],
          ),
          body: Consumer<UserProvider>(
            builder: (_, provider, __) {
              return Container(
                color: Color(0xfff5f5f5),
                child: ListView(
                  padding: EdgeInsets.all(0.0),
                  children: <Widget>[
                    _headeWidget(),
                    _vipTip(),
                    _setMeal(),
                    _frindes(),
                    _buybtn(),
                    // Container(
                    //   padding:
                    //       EdgeInsets.only(left: 20.0, right: 20.0, top: 10.0),
                    //   // height: ScreenUtil().setWidth(345),
                    //   child: Column(
                    //     children: <Widget>[
                    //       vipList.length > 0
                    //           ? SwipeWidget(
                    //               banners: vipList,
                    //               onClickItem: (index, item) {
                    //                 // showAlert(
                    //                 //   context,
                    //                 //   "提示",
                    //                 //   "您确定需要充值升级为Vip吗？",
                    //                 //   "确认",
                    //                 //   () {
                    //                 //     // updateVip(item.id);
                    //                 //     // NavigatorUtils.goBack(context);

                    //                 //   },
                    //                 //   txt2: "取消",
                    //                 //   onPre2: () {
                    //                 //     NavigatorUtils.goBack(context);
                    //                 //   },
                    //                 // );
                    //                 // print(333);
                    //                 // print(provider);
                    //                 NavigatorUtils.push(context,
                    //                     "${WodeRouter.vipService}?id=${item.id.toString()}");
                    //               },
                    //               onChangItem: (index, item) {
                    //                 currentIndex = index;
                    //                 setState(() {});
                    //               },
                    //             )
                    //           : Container()
                    //     ],
                    //   ),
                    // ),

                    // LabelTitle(
                    //   title: "会员特权",
                    //   isMore: true,
                    //   userTap: () {
                    //     if (currentIndex != -1) {
                    //       NavigatorUtils.push(context,
                    //           "${WodeRouter.privilege}?id=${vipList[currentIndex].id.toString()}");
                    //     }
                    //   },
                    // ),
                    // Container(
                    //   color: ThemeUtils.getTabsBg(context),
                    //   height: ScreenUtil().setWidth(150),
                    //   padding: EdgeInsets.only(
                    //     top: ScreenUtil().setWidth(5),
                    //     left: ScreenUtil().setWidth(10),
                    //     right: ScreenUtil().setWidth(10),
                    //   ),
                    //   child: Privilege(
                    //       initList: currentIndex != -1
                    //           ? vipList[currentIndex].menuList
                    //           : []),
                    // ),
                    // LabelTitle(
                    //   title: "邀请好友",
                    //   isMore: false,
                    //   userTap: () {},
                    // ),
                    // GestureDetector(
                    //   onTap: () async {
                    //     await isVipOrExpert();
                    //     if (vip) {
                    //       NavigatorUtils.push(context, "${WodeRouter.qrshare}");
                    //       vip = false;
                    //     } else {
                    //       print(999);
                    //       toasts("请开通会员或成为专家");
                    //     }
                    //   },
                    //   child: Container(
                    //     color: ThemeUtils.getTabsBg(context),
                    //     height: ScreenUtil().setWidth(110),
                    //     padding: EdgeInsets.only(
                    //       top: ScreenUtil().setWidth(10),
                    //       left: ScreenUtil().setWidth(10),
                    //       right: ScreenUtil().setWidth(10),
                    //     ),
                    //     child: LoadAssetImage(
                    //       "wode/invite_friends",
                    //       width: ScreenUtil().setWidth(724),
                    //       height: ScreenUtil().setWidth(183),
                    //     ),
                    //   ),
                    // )
                  ],
                ),
              );
            },
          ),
        ),
      ),
    );
  }

  _headeWidget() {
    return Stack(
      children: [
        Positioned(
            // left: 10,
            // right: 10,
            // bottom: 0,
            child: Container(
          // margin: EdgeInsets.only(left: 10,right: 10),
          width: double.infinity,
          height: 160,
          decoration: BoxDecoration(
              gradient: const LinearGradient(
            colors: [Color(0xff3B3633), Color(0xff5B5350)],
          )),
        )),
        Positioned(
          bottom: 0,
          left: 10,
          right: 10,
          child: LoadAssetImage(
            "img_vipcenter_bg",
            width: 350,
            height: 152,
            fit: BoxFit.fill,
          ),
        ),
        Positioned(
          // top: 50,
          bottom: 10,
          left: 10,
          right: 20,
          // left: 0,
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            // crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
              GestureDetector(
                onTap: () {
                  NavigatorUtils.push(context, WodeRouter.personalPage);
                },
                child: Container(
                  padding: EdgeInsets.only(
                    left: ScreenUtil().setWidth(10),
                  ),
                  child: Row(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: <Widget>[
                      Container(
                          padding: EdgeInsets.only(
                            right: ScreenUtil().setWidth(10),
                          ),
                          child: ClipRRect(
                              borderRadius: BorderRadius.circular(
                                  ScreenUtil().setWidth(35)),
                              child: Container(
                                child: LoadNetworkImage(
                                  provider.user?.avatarUrl,
                                  // fit: BoxFit.fitWidth,
                                  width: ScreenUtil().setWidth(40),
                                  height: ScreenUtil().setWidth(40),
                                ),
                              ))),
                      Column(
                        mainAxisAlignment: MainAxisAlignment.start,
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: <Widget>[
                          Text(
                            provider.user?.showWhichName == 1
                                ? (provider.user?.nickName ?? "")
                                : (provider.user?.userName ?? ""),
                            // _userInfo.name ?? '',
                            // '小小维修工',
                            textAlign: TextAlign.left,
                            style: TextStyle(
                              fontSize: ScreenUtil().setSp(16),
                              color: Color(0xff2F2B29),
                            ),
                          ),
                          Text(
                            _userInfo.vipFlag == 2 ? '尊敬的会员，您好!' : '',
                            textAlign: TextAlign.left,
                            style: TextStyle(
                              fontSize: ScreenUtil().setSp(13),
                              color: Color(0xffAB7223),
                            ),
                          ),
                          SizedBox(height: 3),
                          _userInfo.vipFlag == 2
                              ? InkWell(
                                  onTap: () {
                                    if (_userInfo.vipId != null) {
                                      showToast('您已经填写了会员id哦');
                                      return;
                                    }
                                    showDialog(
                                      barrierDismissible: false,
                                      context: context,
                                      builder: (context) => new AlertDialog(
                                        title: Text('输入幸运数字'),
                                        content: Container(
                                          child: TextField(
                                            inputFormatters: <
                                                TextInputFormatter>[
                                              LengthLimitingTextInputFormatter(
                                                  8),
                                              FilteringTextInputFormatter
                                                  .digitsOnly //限制长度
                                            ],
                                            maxLength: 8,
                                            controller: _vipnumController,
                                            keyboardType: TextInputType.phone,
                                          ),
                                        ),
                                        actions: <Widget>[
                                          FlatButton(
                                            onPressed: () {
                                              NavigatorUtils.goBack(context);
                                            },
                                            child: new Text("取消"),
                                          ),
                                          FlatButton(
                                            onPressed: () {
                                              if (_vipnumController.text ==
                                                  '') {
                                                showToast('请输入幸运数字');
                                                return;
                                              }
                                              NewApiService().upLoadVipluckNum(
                                                  vipId: _vipnumController.text,
                                                  onSuccess: (res) {
                                                    showToast(res);
                                                    getUserInfo();
                                                    print("res");
                                                    NavigatorUtils.goBack(
                                                        context);
                                                  },
                                                  onError: (code, msg) {
                                                    toasts(msg);
                                                  });
                                            },
                                            child: new Text('确认'),
                                          ),
                                        ],
                                      ),
                                    );
                                  },
                                  child: Container(
                                    padding: EdgeInsets.all(2),
                                    decoration: BoxDecoration(
                                        borderRadius: BorderRadius.all(
                                            Radius.circular(8.0)),
                                        gradient: LinearGradient(
                                          colors: [
                                            Color(0xffF3D99E),
                                            Color(0xffF4EDCE)
                                          ],
                                        )),
                                    child: Text(_userInfo.vipId == null
                                        ? ' 抢占自己的幸运id '
                                        : ' ID:${_userInfo.vipId} '),
                                  ),
                                )
                              : Container()
                        ],
                      ),
                    ],
                  ),
                ),
              ),
              Expanded(child: Container()),
              InkWell(
                onTap: () {
                  NavigatorUtils.push(context,
                      "${WodeRouter.vipService}?id=&selectid=${selectedRecord.id.toString()}");
                  // NavigatorUtils.push(context, WodeRouter.walletPage);
                },
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.end,
                  // mainAxisAlignment: MainAxisAlignment.end,
                  children: [
                    Container(
                      // alignment: Alignment.centerRight,
                      child: Text(
                        _userInfo.vipFlag == 2
                            ? "您的会员到期日：${DateUtils.instance.getFormartData(timeSamp: _userInfo.vipEndTime, format: 'yyyy/MM/dd')}"
                            : "",
                        style: TextStyle(
                            color: Color(0xff252426),
                            fontSize: ScreenUtil().setSp(11)),
                      ),
                    ),
                    SizedBox(
                      height: 20,
                    ),
                    Container(
                      decoration: BoxDecoration(
                        color: Color(0xff272527),
                        borderRadius: BorderRadius.all(Radius.circular(15)),
                      ),
                      padding: EdgeInsets.all(5),
                      child: Text(
                        '   立即续费   ',
                        style: TextStyle(
                            color: Color(0xffFFDBB7),
                            fontSize: ScreenUtil().setSp(12)),
                      ),
                    )
                  ],
                ),
              )
            ],
          ),
        ),
      ],
    );

    // Container(
    //   decoration: BoxDecoration(
    //     gradient: LinearGradient(
    //       colors: [Color(0xff3B3633), Color(0xff5B5350)],
    //     ),
    //   ),
    //   // width: double.infinity,
    //   // color: Colors.redAccent,
    //   child:
    // );
  }

  _vipTip() {
    const OrderTypeList = [
      {
        'id': 2,
        "title": "题库问答",
        "img": "wode/icon_viptag_0",
      },
      {
        'id': 3,
        "title": "海量学堂",
        "img": "wode/icon_viptag_1",
      },
      {
        'id': 4,
        "title": "商品专区",
        "img": "wode/icon_viptag_2",
      },
      {
        'id': 5,
        "title": "招聘特权",
        "img": "wode/icon_viptag_3",
      },
      {
        'id': 10,
        "title": "资料库查看",
        "img": "wode/icon_viptag_4",
      },
      {
        'id': 9,
        "title": "附近的人",
        "img": "wode/icon_viptag_5",
      },
      {
        'id': 209,
        "title": "快速问诊",
        "img": "wode/icon_viptag_6",
      },
      {
        "id": 210,
        "title": "专家出诊",
        "img": "wode/icon_viptag_7",
      },
    ];
    List<Container> _buildGuidTitleList(int count) {
      return List<Container>.generate(
          count,
          (int index) => Container(
                // padding: EdgeInsets.only(top: 15),
                child: _iconItem(
                  title: OrderTypeList[index]["title"],
                  icon: OrderTypeList[index]['img'],
                  ontap: () {
                    NavigatorUtils.push(context,
                        "${WodeRouter.privilege}?id=${vipList[currentIndex].id.toString()}&index=${OrderTypeList[index]["id"].toString()}");
                    // int nums = index + 1;
                    // String index = nums.toString();
                    // NavigatorUtils.push(
                    //     context, "${WodeRouter.orderPage}?checkType=$index");
                  },
                ),
              ));
    }

    return TitleCard(
        title: '会员尊享8大权益',
        height: 230,
        body: Container(
          child: GridView.count(
            physics: const NeverScrollableScrollPhysics(),
            padding: EdgeInsets.all(10), // 内边距
            scrollDirection: Axis.vertical, // 滚动方向
            crossAxisSpacing: 10, // 列间距
            crossAxisCount:
                4, // 每行的个数（Axis.vertic == 横向三个, Axis.horizontal == 竖方向三个）
            mainAxisSpacing: 10,
            //次轴元素间距
            children: _buildGuidTitleList(8), //添加
          ),
        ));

    // Stack(
    //   children: [
    //     // Positioned(
    //     //     top: -20,
    //     //     child: Container(
    //     //       height: 50,
    //     //       color: Colors.redAccent,
    //     //     )),
    //     Container(
    //       height: 200,
    //       color: Colors.blue,
    //     )
    //   ],
    // );
  }

  _iconItem({String title, double size = 45, String icon, Function ontap}) {
    return InkWell(
      onTap: ontap,
      child: Container(
        // padding: EdgeInsets.only(top: 15),
        child: Column(
          // crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Container(
              // height: 70,
              // color: Colors.red,
              child: LoadAssetImage(
                // image: AssetImage(i['img']),
                icon,
                width: ScreenUtil().setWidth(size),
                height: ScreenUtil().setWidth(size),
                // alignment: Alignment.centerLeft,
              ),
            ),
            // SizedBox(height: ScreenUtil().setWidth(10)),
            Container(
              child: Text(
                title,
                style: TextStyle(
                    color: Colours.text, fontSize: ScreenUtil().setSp(11)),
                textAlign: TextAlign.start,
              ),
            ),
          ],
        ),
      ),
    );
  }

  _setMeal() {
    const setMealList = [
      {"title": "月卡", "money": "40", "detalMoney": "50"},
      {"title": "季卡", "money": "100", "detalMoney": "150"},
      {"title": "半年卡", "money": "200", "detalMoney": "300"},
      {"title": "年卡", "money": "400", "detalMoney": "600"},
      {"title": "年卡", "money": "400", "detalMoney": "600"},
      {"title": "年卡", "money": "400", "detalMoney": "600"},
      {"title": "年卡", "money": "400", "detalMoney": "600"},
      {"title": "年卡", "money": "400", "detalMoney": "600"},
      {"title": "年卡", "money": "400", "detalMoney": "600"},
      {"title": "年卡", "money": "400", "detalMoney": "600"},
    ];

    _cell({title, money, detalMoney, bool isSelect, Function ontap, index}) {
      return InkWell(
          onTap: ontap,
          child: Stack(
            children: [
              Container(
                  alignment: Alignment.center,
                  height: 200,
                  width: 200,
                  decoration: BoxDecoration(
                    color: isSelect ? Color(0x21FA4F21) : Colors.white,
                    //设置四周圆角 角度
                    borderRadius: BorderRadius.all(Radius.circular(8.0)),
                    //设置四周边框
                    border: Border.all(
                        width: 1,
                        color: isSelect ? Colors.red : Colours.text_gray),
                  ),
                  child: Column(
                    // crossAxisAlignment: CrossAxisAlignment.center,
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Text(
                        '${moneyList[index].name}',
                        // '$title',
                        style: TextStyle(color: Colours.text, fontSize: 15),
                      ),
                      Text(
                        '${moneyList[index].price}',
                        // '¥$money',
                        style: TextStyle(
                            color: Color(0xffFA4F21),
                            fontSize: 18,
                            fontWeight: FontWeight.bold),
                      ),
                      Text(
                        '原价${moneyList[index].price}/月',
                        style: TextStyle(
                          color: Colours.text_gray,
                          fontSize: 11,
                          decoration: TextDecoration.lineThrough,
                          decorationColor: Colours.text_gray,
                        ),
                      ),
                    ],
                  )),
              (index == 0 || index == setMealList.length - 1)
                  ? RoundPathWidget(
                      pathShape: PathShapeEnum.PartRoundRect,
                      leftTopRadius: 8,
                      rightBottomRadius: 8,
                      child: Container(
                        height: 20,
                        width: 35,
                        alignment: Alignment.center,
                        decoration: BoxDecoration(
                            gradient: LinearGradient(
                          colors: index == 0
                              ? [Color(0xff840AF5), Color(0xff9D32FE)]
                              : [Color(0xffFF934C), Color(0xffFC686F)],
                        )),
                        // color: Color(0xff840AF5),
                        child: Text(
                          index == 0 ? '热销' : '超值',
                          style: TextStyle(color: Colors.white, fontSize: 11),
                        ),
                      ))
                  : Container(),
            ],
          ));
    }

    List<Container> _buildGuidTitleList() {
      return List<Container>.generate(
          moneyList.length,
          // setMealList.length,

          (int index) => Container(
                // padding: EdgeInsets.only(top: 15),
                child: _cell(
                  title: setMealList[index]["title"],
                  money: setMealList[index]["money"],
                  detalMoney: setMealList[index]["detalMoney"],
                  isSelect: moneyList[index] == selectedRecord,
                  index: index,
                  ontap: () {
                    setState(() {
                      selectedRecord = moneyList[index];
                    });
                    // int nums = index + 1;
                    // String index = nums.toString();
                    // NavigatorUtils.push(
                    //     context, "${WodeRouter.orderPage}?checkType=$index");
                  },
                ),
              ));
    }

    return TitleCard(
        height: 260,
        title: '推荐套餐',
        body: Container(
          margin: EdgeInsets.only(top: 10),
          child: moneyList.length > 0
              ? GridView(
                  // physics: const NeverScrollableScrollPhysics(),
                  gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                    // 一行几列
                    crossAxisCount: 2,
                    // 设置每子元素的大小（宽高比）
                    childAspectRatio: 2.0,
                    // 元素的左右的 距离
                    crossAxisSpacing: 20,
                    // 子元素上下的 距离
                    mainAxisSpacing: 10,
                  ),
                  //次轴元素间距
                  children: _buildGuidTitleList(), //添加
                )
              : loadCircle(),
        ));
  }

  _frindes() {
    return GestureDetector(
        onTap: () {
          NavigatorUtils.push(context, "${WodeRouter.qrshare}");
        },
        child: Container(
          height: 185,
          margin: EdgeInsets.only(left: 10, right: 10, bottom: 5),
          decoration: new BoxDecoration(
            color: Colors.white,
            //设置四周圆角 角度
            borderRadius: BorderRadius.all(Radius.circular(6.0)),
          ),
          child: Stack(
            children: [
              Positioned(
                top: 0,
                right: -10,
                left: -10,
                bottom: -10,
                child: ClipRRect(
                  borderRadius: BorderRadius.circular(6),
                  child: LoadAssetImage("img_Invite_friends_bg",
                      // width: double.infinity,
                      // height: ScreenUtil().setHeight(260),
                      fit: BoxFit.fill),
                ),
              ),
              Positioned(
                  top: 30,
                  left: 25,
                  child: Column(
                    // mainAxisAlignment: MainAxisAlignment.start,
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      RichText(
                        text: TextSpan(
                          text: '邀请好友',
                          style: TextStyle(
                            fontSize: 24,
                            color: Colors.black,
                            fontWeight: FontWeight.bold,
                          ),
                          children: [
                            TextSpan(
                              text: '返佣金',
                              style: TextStyle(
                                  fontSize: 24,
                                  color: Colors.red,
                                  fontWeight: FontWeight.bold),
                            ),
                          ],
                        ),
                      ),
                      SizedBox(
                        height: 10,
                      ),
                      Text('邀请好友开会员赚佣金')
                    ],
                  )),
              Positioned(
                  left: 15,
                  bottom: 15,
                  right: 15,
                  child: Row(
                    // mainAxisAlignment:MainAxisAlignment.spaceBetween ,
                    // crossAxisAlignment: CrossAxisAlignment.baseline,
                    children: [
                      Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(
                            '邀请好友',
                            style: TextStyle(color: Color(0xffEEA025)),
                          ),
                          Text('多邀多得，超多佣金等你来拿',
                              style: TextStyle(color: Colours.text_gray))
                        ],
                      ),
                      Expanded(child: Container()),
                      Container(
                        padding: EdgeInsets.all(3),
                        decoration: BoxDecoration(
//背景
                          color: Colors.white,
                          //设置四周圆角 角度
                          borderRadius: BorderRadius.all(Radius.circular(15.0)),
                          //设置四周边框
                          border: Border.all(
                            width: 1,
                            color: Colors.red,
                          ),
                        ),
                        child: InkWell(
                          onTap: () {
                            NavigatorUtils.push(
                                context, "${WodeRouter.qrshare}");
                          },
                          child: Text(' 立即邀请 ',
                              style:
                                  TextStyle(color: Colors.red, fontSize: 13)),
                        ),
                      )
                    ],
                  ))
            ],
          ),
        ));
  }

  _buybtn() {
    return InkWell(
      onTap: () {
        NavigatorUtils.push(context,
            "${WodeRouter.vipService}?id=&selectid=${selectedRecord.id.toString()}");
      },
      child: Container(
        height: 72,
        margin: EdgeInsets.only(left: 0, right: 0, bottom: 5),
        child: Stack(
          children: [
            Positioned(
              top: 0,
              right: 0,
              left: 0,
              bottom: 0,
              child: LoadAssetImage(
                "img_buyvip_btnbg",
                // width: double.infinity,
                // height: ScreenUtil().setHeight(260),
                fit: BoxFit.cover,
              ),
            ),
            Positioned(
                left: 40,
                child: Container(
                  alignment: Alignment.centerLeft,
                  height: 60,
                  child: RichText(
                    text: TextSpan(
                      text: '￥',
                      style: TextStyle(
                        fontSize: 15,
                        color: Color(0xff3E3835),
                        fontWeight: FontWeight.bold,
                      ),
                      children: [
                        TextSpan(
                          text: '${selectedRecord.price}',
                          style: TextStyle(
                              fontSize: 30,
                              color: Color(0xff3E3835),
                              fontWeight: FontWeight.bold),
                        ),
                        TextSpan(
                          text: '/月',
                          style: TextStyle(
                              fontSize: 15,
                              color: Color(0xff3E3835),
                              fontWeight: FontWeight.bold),
                        ),
                        TextSpan(
                          text: '￥${selectedRecord.price}',
                          style: TextStyle(
                            fontSize: 15,
                            color: Color(0xff3E3835),
                            fontWeight: FontWeight.bold,
                            decoration: TextDecoration.lineThrough,
                            decorationColor: Color(0xff3E3835),
                          ),
                        ),
                      ],
                    ),
                  ),
                )),
            Positioned(
                right: 40,
                child: Container(
                    alignment: Alignment.centerLeft,
                    height: 65,
                    child: Text(
                      '立即续费',
                      style: TextStyle(color: Colors.white, fontSize: 18),
                    )))
          ],
        ),
      ),
    );
  }

  Widget loadCircle() {
    return Container(
      padding: EdgeInsets.only(top: 10, bottom: 10),
      color: ThemeUtils.getTabsBg(context),
      child: Center(
        child: SpinKitFadingCircle(
          color: Colors.blueAccent,
          size: 30.0,
        ),
      ),
    );
  }

  @override
  bool get wantKeepAlive => true;
}

class TitleCard extends StatelessWidget {
  String title;
  String rightText;
  Function onTapRight;
  double height;
  Widget body;
  TitleCard(
      {this.title,
      this.rightText,
      this.onTapRight,
      this.body,
      this.height = 120});

  @override
  Widget build(BuildContext context) {
    return Container(
      // color: Colors.red,
      margin: EdgeInsets.only(left: 10, right: 10, bottom: 10),
      decoration: new BoxDecoration(
        color: Colors.white,
        //设置四周圆角 角度
        borderRadius: BorderRadius.all(Radius.circular(6.0)),
      ),
      padding: EdgeInsets.only(left: 10, right: 10, top: 15, bottom: 15),
      height: height,
      // width: ScreenUtil().setWidth(355),
      child: Column(
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Text(
                title,
                style: TextStyle(
                    color: Color(0xff222222),
                    fontSize: 15,
                    fontWeight: FontWeight.bold),
              ),
              rightText != null
                  ? InkWell(
                      onTap: onTapRight,
                      child: Row(
                        children: [
                          Text(rightText,
                              style: TextStyle(
                                  color: Colours.dark_text_gray, fontSize: 13)),
                          Icon(
                            Icons.arrow_forward_ios,
                            color: Colours.dark_text_gray,
                            size: 15,
                          )
                        ],
                      ),
                    )
                  : Container()
            ],
          ),
          // SizedBox(
          //   height: 15,
          // ),

          Expanded(child: body)

          // body
        ],
      ),
    );
  }
}

class SwipeWidget extends StatelessWidget {
  const SwipeWidget({Key key, this.banners, this.onClickItem, this.onChangItem})
      : super(key: key);
  final List<dynamic> banners;
  final Function onClickItem;
  final Function onChangItem;
  @override
  Widget build(BuildContext context) {
    double width = MediaQuery.of(context).size.width;
    double height = ScreenUtil().setWidth(180);
    return Container(
      width: width,
      height: height,
      child: Swiper(
        itemBuilder: (BuildContext context, index) {
          return Container(
            width: width,
            height: height,
            child: LoadNetworkImage(
              banners[index].image,
              width: width,
              height: height,
              // fit: BoxFit.none
            ),
          );
        },
        pagination: SwiperPagination(
          builder: DotSwiperPaginationBuilder(
            color: Colors.grey,
            activeColor: Colors.white,
            size: 6,
            activeSize: 6,
          ),
        ),
        itemCount: banners.length,
        scrollDirection: Axis.horizontal,
        autoplay: false,
        onTap: (index) {
          onClickItem(index, banners[index]);
        },
        onIndexChanged: (index) {
          onChangItem(index, banners[index]);
        },
      ),
    );
  }
}

class Privilege extends StatelessWidget {
  const Privilege({Key key, this.initList}) : super(key: key);
  final List<dynamic> initList;

  List<Widget> listWidget(context) => initList.asMap().keys.map((i) {
        double width = MediaQuery.of(context).size.width;
        return GestureDetector(
          child: Container(
            margin: EdgeInsets.only(right: 10),
            padding: EdgeInsets.only(top: 10, bottom: 10),
            child: Row(
              children: <Widget>[
                SizedBox(width: ScreenUtil().setWidth(i == 0 ? 10 : 10)),
                Container(
                  width: ScreenUtil().setWidth(120),
                  padding: EdgeInsets.only(top: 20, bottom: 20),
                  decoration: BoxDecoration(
                    color: ThemeUtils.getTabsBg(context),
                    borderRadius: BorderRadius.circular(5),
                    boxShadow: [
                      BoxShadow(
                        offset: Offset(0, 0), //x,y轴
                        color: Colors.grey[300], //投影颜色
                        blurRadius: 5, //投影距离
                      )
                    ],
                  ),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: <Widget>[
                      // Icon(
                      //   IconData(initList[i]['icon'], fontFamily: "Iconfont"),
                      //   size: 24.0,
                      //   color: Color.fromRGBO(51, 51, 51, 1),
                      // ),
                      Container(
                        margin: EdgeInsets.only(bottom: 8),
                        child: LoadNetworkImage(
                          initList[i].image,
                          width: 30,
                          height: 30,
                        ),
                      ),
                      Text(
                        initList[i].name ?? '',
                        textAlign: TextAlign.start,
                        style: TextStyle(
                          fontSize: ScreenUtil().setSp(14),
                        ),
                      ),
                      Text(
                        initList[i].descr ?? '',
                        textAlign: TextAlign.start,
                        style: TextStyle(
                          fontSize: ScreenUtil().setSp(14),
                          color: Color(0xff999999),
                        ),
                        overflow: TextOverflow.ellipsis,
                      ),
                    ],
                  ),
                ),
              ],
            ),
          ),
          onTap: () {
            // print(i);
          },
        );
      }).toList();

  @override
  Widget build(BuildContext context) {
    return ListView(
      scrollDirection: Axis.horizontal,
      padding: EdgeInsets.all(0),
      children: listWidget(context),
    );
  }
}
