huixiang_app/lib/mine/mine_vip/mine_attainment_page.dart

import 'package:dio/dio.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_easyloading/flutter_easyloading.dart';
import 'package:huixiang/generated/l10n.dart';
import 'package:huixiang/retrofit/data/achievement_detail_list.dart';
import 'package:huixiang/retrofit/data/base_data.dart';
import 'package:huixiang/retrofit/data/user_info.dart';
import 'package:huixiang/retrofit/data/vip_badges_list.dart';
import 'package:huixiang/retrofit/retrofit_api.dart';
import 'package:huixiang/utils/flutter_utils.dart';
import 'package:huixiang/utils/font_weight.dart';
import 'package:huixiang/view_widget/custom_image.dart';
import 'package:huixiang/view_widget/my_appbar.dart';
import 'package:pull_to_refresh/pull_to_refresh.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:shared_preferences/shared_preferences.dart';

class MineAttainmentPage extends StatefulWidget {
  final Map<String, dynamic> arguments;

  MineAttainmentPage({this.arguments});

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

class _MineAttainmentPage extends State<MineAttainmentPage> {
  ApiService apiService;
  final RefreshController _refreshController = RefreshController();
  UserInfo userInfo;
  List<VipBadgesList> vipBadgesList = [];
  List<AchievementDetailList> achievementDetail = [];
  int checkPosition = 0;
  int attainmentPoint = 0;

  @override
  void dispose() {
    super.dispose();
    if (_refreshController != null) _refreshController.dispose();
  }

  @override
  void initState() {
    super.initState();
    userInfo = widget.arguments["userInfo"];
    queryAttainmentBadges();
    queryAchievementDetail("1460164746211753984");
  }

  ///成就徽章分类
  queryAttainmentBadges() async {
    if (apiService == null) {
      SharedPreferences value = await SharedPreferences.getInstance();
      apiService = ApiService(
        Dio(),
        context: context,
        token: value.getString("token"),
      );
    }
    BaseData<List<VipBadgesList>> baseData =
        await apiService.findBadges({}).catchError((error) {
      _refreshController.refreshFailed();
    });
    if (baseData != null && baseData.isSuccess) {
      vipBadgesList.clear();
      vipBadgesList.addAll(baseData.data);
      setState(() {
        _refreshController.refreshCompleted();
      });
    } else {
      _refreshController.refreshFailed();
    }
  }

  ///成就分类弹窗详情
  queryAchievementDetail(achievementCategoryId) async {
    if (apiService == null) {
      SharedPreferences value = await SharedPreferences.getInstance();
      apiService = ApiService(
        Dio(),
        context: context,
        token: value.getString("token"),
      );
    }
    BaseData<List<AchievementDetailList>> baseData = await apiService
        .getAchievementDetail(achievementCategoryId)
        .catchError((onError) {});
    if (baseData != null && baseData.isSuccess) {
      setState(() {
        achievementDetail.clear();
        attainmentPoint = 0;
        achievementDetail.addAll(baseData.data);
        achievementDetail.forEach((element) {
          if(element.actived)
            attainmentPoint += 1;
        });
      });
    }
    EasyLoading.dismiss();
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        image: DecorationImage(
          fit: BoxFit.fill,
          image: AssetImage("assets/image/attainment_bj.png"),
        ),
      ),
      child: Scaffold(
          backgroundColor: Colors.transparent,
          appBar: MyAppBar(
            title: "我的成就",
            titleColor: Colors.black,
            titleSize: 18.sp,
            background: Colors.transparent,
            leadingColor: Colors.black,
          ),
          body: SingleChildScrollView(
            physics: BouncingScrollPhysics(),
            child: Column(
              children: [
                SizedBox(height: 24),
                MImage(
                  userInfo?.headimg ?? "",
                  isCircle: true,
                  width: 58,
                  height: 58,
                  fit: BoxFit.cover,
                  errorSrc: "assets/image/default_user.png",
                  fadeSrc: "assets/image/default_user.png",
                ),
                SizedBox(height: 8),
                Text(
                  userInfo?.nickname ?? S.of(context).denglu,
                  style: TextStyle(
                    fontSize: 16.sp,
                    fontWeight: FontWeight.bold,
                    color: Color(0xFF353535),
                  ),
                ),
                SizedBox(height: 28),
                Container(
                  margin:
                      EdgeInsets.only(left: 16, right: 16, top: 26, bottom: 8),
                  padding: EdgeInsets.all(20),
                  decoration: BoxDecoration(
                    color: Colors.white,
                    boxShadow: [
                      BoxShadow(
                        color: Colors.black.withAlpha(12),
                        offset: Offset(0, 3),
                        blurRadius: 14,
                        spreadRadius: 0,
                      )
                    ],
                    borderRadius: BorderRadius.all(Radius.circular(8)),
                  ),
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.spaceAround,
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Row(
                        children: [
                          Text(
                            "成就徽章",
                            style: TextStyle(
                                fontWeight: MyFontWeight.medium,
                                fontSize: 14.sp,
                                color: Color(0xFF353535)),
                          ),
                          SizedBox(width: 4),
                          Text(
                            "(",
                            style: TextStyle(
                                fontWeight: MyFontWeight.medium,
                                fontSize: 14,
                                color: Color(0xFF353535)),
                          ),
                          Text(
                            attainmentPoint.toString(),
                            style: TextStyle(
                                fontWeight: MyFontWeight.medium,
                                fontSize: 14,
                                color: Color(0xFF32A060)),
                          ),
                          Text(
                            "/${vipBadgesList.length})",
                            style: TextStyle(
                                fontWeight: MyFontWeight.medium,
                                fontSize: 14,
                                color: Color(0xFF353535)),
                          ),
                        ],
                      ),
                      SizedBox(height: 12),
                      attainmentBadge(),
                    ],
                  ),
                ),
              ],
            ),
          )),
    );
  }

  ///成就徽章列表
  Widget attainmentBadge() {
    return GridView.builder(
      itemCount: vipBadgesList == null ? 0 : vipBadgesList.length,
      shrinkWrap: true,
      physics: NeverScrollableScrollPhysics(),
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
        //一行的Widget数量
        crossAxisCount: 3,
        //水平子Widget之间间距
        crossAxisSpacing: 13,
        //垂直子Widget之间间距
        mainAxisSpacing: 12,
        //子Widget宽高比例
        childAspectRatio: AppUtils.textScale(context) > 1
            ? (1 - ((AppUtils.textScale(context) - 1)))
            : 0.85,
      ),
      itemBuilder: (context, index) {
        return GestureDetector(
          onTap: () {
            setState(() {
              showDeleteDialog(index);
            });
          },
          child: badgeItem(vipBadgesList[index]),
        );
      },
    );
  }

  Widget badgeItem(VipBadgesList vipBadgesList) {
    return Container(
      alignment: Alignment.center,
      child: Column(
        children: [
          MImage(
            vipBadgesList?.icon ?? "",
            width: 80,
            height: 80,
            fit: BoxFit.cover,
            errorSrc: "assets/image/default_1.png",
            fadeSrc: "assets/image/default_1.png",
          ),
          SizedBox(
            height: 4.h,
          ),
          Text(
            vipBadgesList?.name ?? "",
            overflow: TextOverflow.ellipsis,
            style: TextStyle(
              color: Color(0xFF181818),
              fontWeight: MyFontWeight.medium,
              fontSize: 12.sp,
            ),
          ),
        ],
      ),
    );
  }

  ///徽章成就弹窗
  showDeleteDialog(index) {
    showDialog(
      context: context,
      builder: (context) {
        return StatefulBuilder(builder: (
          context,
          state,
        ) {
          return AlertDialog(
            content: Container(
              width: MediaQuery.of(context).size.width - 84,
              height: 410.h,
              child: Column(
                children: [
                  GestureDetector(
                    onTap: () {
                      Navigator.of(context).pop();
                    },
                    child: Row(
                      children: [
                        Spacer(),
                        Image.asset(
                          "assets/image/icon_order_cancel.png",
                          width: 24,
                          height: 24,
                        ),
                      ],
                    ),
                  ),
                  MImage(
                    this.vipBadgesList[index].icon,
                    width: 150,
                    height: 150,
                    fit: BoxFit.cover,
                    errorSrc: "assets/image/default_1.png",
                    fadeSrc: "assets/image/default_1.png",
                  ),
                  SizedBox(height: 10),
                  Text(
                    "${vipBadgesList.length >index ?vipBadgesList[index].name :""}${achievementDetail.length > checkPosition ?achievementDetail[checkPosition].name:""}徽章",
                    style: TextStyle(
                      fontSize: 16.sp,
                      fontWeight: MyFontWeight.semi_bold,
                      color: Color(0xFF181818),
                    ),
                  ),
                  SizedBox(
                    height: 6.h,
                  ),
                  Text(
                    "再${vipBadgesList.length >index ? vipBadgesList[index].name :""} ${achievementDetail.length > checkPosition ?achievementDetail[checkPosition].lessScore :""} 即可升级",
                    style: TextStyle(
                      fontSize: 12.sp,
                      fontWeight: MyFontWeight.regular,
                      color: Color(0xFFA3A3A3),
                    ),
                  ),
                  SizedBox(
                    height: 4.h,
                  ),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: [
                      Text(
                        "奖励:",
                        style: TextStyle(
                            fontWeight: MyFontWeight.regular,
                            fontSize: 12.sp,
                            color: Color(0xFF515151)),
                      ),
                      SizedBox(width: 8),
                      Image.asset(
                        "assets/image/icon_gold_coin.png",
                        width: 14,
                        height: 14,
                        fit: BoxFit.cover,
                      ),
                      SizedBox(width: 4),
                      Text(
                        vipBadgesList[index].eachReward.toString(),
                        style: TextStyle(
                            fontWeight: MyFontWeight.regular,
                            fontSize: 12.sp,
                            color: Color(0xFF515151)),
                      ),
                    ],
                  ),
                  SizedBox(height: 5),
                  Expanded(
                    child: Container(
                      height: double.maxFinite,
                      margin: EdgeInsets.only(top: 24),
                      child: ListView.builder(
                        shrinkWrap: true,
                        scrollDirection: Axis.horizontal,
                        physics: BouncingScrollPhysics(),
                        itemCount: achievementDetail == null
                            ? 0
                            : achievementDetail.length,
                        itemBuilder: (context, position) {
                          return GestureDetector(
                            onTap: () {
                              state(() {
                                checkPosition = position;
                              });
                            },
                            child: badgeGradeItem(achievementDetail[position],
                                position, achievementDetail.length),
                          );
                        },
                      ),
                    ),
                  )
                ],
              ),
            ),
          );
        });
      },
    );
  }

  ///徽章级别列表
  Widget badgeGradeItem(
      AchievementDetailList achievementDetail, var position, var size) {
    return Row(
      crossAxisAlignment: CrossAxisAlignment.center,
      mainAxisAlignment: MainAxisAlignment.start,
      children: [
        Column(
          crossAxisAlignment: CrossAxisAlignment.center,
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            MImage(
              achievementDetail?.icon ?? "",
              width: checkPosition == position ? 50 : 30,
              height: checkPosition == position ? 50 : 30,
              fit: BoxFit.cover,
              errorSrc: "assets/image/default_1.png",
              fadeSrc: "assets/image/default_1.png",
            ),
            SizedBox(height: 10),
            Text(
              achievementDetail?.name ?? "",
              style: TextStyle(
                fontSize: 10.sp,
                fontWeight: MyFontWeight.regular,
                color: Color(0xFFA3A3A3),
              ),
            ),
          ],
        ),
        Column(
            crossAxisAlignment: CrossAxisAlignment.center,
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              if (position != size - 1)
                Container(
                  width: 35.w,
                  height: 2.h,
                  // margin: EdgeInsets.only(top: 25),
                  decoration: new BoxDecoration(
                    color: Color(0xFFE1F2F7),
                  ),
                ),
              SizedBox(height: 20),
            ])
      ],
    );
  }
}