import 'package:dio/dio.dart';
import 'package:flutter/material.dart';
import 'package:huixiang/generated/l10n.dart';
import 'package:huixiang/retrofit/data/base_data.dart';
import 'package:huixiang/retrofit/data/message.dart';
import 'package:huixiang/retrofit/data/page.dart';
import 'package:huixiang/retrofit/retrofit_api.dart';
import 'package:huixiang/utils/font_weight.dart';
import 'package:huixiang/view_widget/classic_header.dart';
import 'package:huixiang/view_widget/custom_image.dart';
import 'package:huixiang/view_widget/my_appbar.dart';
import 'package:huixiang/view_widget/my_footer.dart';
import 'package:huixiang/view_widget/no_data_view.dart';
import 'package:huixiang/view_widget/round_button.dart';
import 'package:pull_to_refresh/pull_to_refresh.dart';
import 'package:shared_preferences/shared_preferences.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

class SystemDetails extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _SystemDetails();
  }
}

class _SystemDetails extends State<SystemDetails> {
  ApiService apiService;

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

    SharedPreferences.getInstance().then((value) {
      apiService =
          ApiService(Dio(), token: value.getString("token"), context: context);
      queryMessage();
    });
  }

  int pageNum = 1;
  List<Message> messages = [];

  _refresh() {
    pageNum = 1;
    queryMessage();
  }

  queryMessage() async {
    BaseData<PageInfo<Message>> baseData = await apiService.msgList({
      "pageNum": pageNum,
      "pageSize": 10,
      "searchKey": "",
      "state": "",
      "typed": ""
    }).catchError((onError) {
      _refreshController.loadFailed();
      _refreshController.refreshFailed();
    });
    if (baseData != null && baseData.isSuccess) {
      if (pageNum == 1) {
        messages.clear();
      }
      messages.addAll(baseData.data.list);
      _refreshController.loadComplete();
      _refreshController.refreshCompleted();
      if (mounted) setState(() {});
      if (pageNum * 10 > int.tryParse(baseData.data.total)) {
        _refreshController.loadNoData();
      } else {
        pageNum += 1;
      }
    } else {
      _refreshController.loadFailed();
      _refreshController.refreshFailed();
    }
  }

  RefreshController _refreshController = RefreshController();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: MyAppBar(
        background: Colors.white,
        leadingColor: Colors.black,
        // title: "订单通知",
        // title: "充值消息",
        title: "点赞",
        titleSize: 18.sp,
        titleColor: Colors.black,
      ),
      body: SmartRefresher(
        enablePullDown: true,
        enablePullUp: true,
        header: MyHeader(),
        physics: BouncingScrollPhysics(),
        footer: CustomFooter(
          loadStyle: LoadStyle.ShowWhenLoading,
          builder: (BuildContext context, LoadStatus mode) {
            return MyFooter(mode);
          },
        ),
        controller: _refreshController,
        onRefresh: _refresh,
        onLoading: () {
          queryMessage();
        },
        child: Container(
          child: SingleChildScrollView(
            physics: BouncingScrollPhysics(),
            child: Container(
              child: Column(
                children: [
                  orderMessage(),
                  // rechargeMessage(),
                  // fabulousMessage(),
                  // commentMessage(),
                  // followMessage(),
                ],
              ),
            ),
          ),
        ),

      ),
    );
  }

  ///订单通知
  Widget orderMessage(){
    return Container(
      color: Colors.white,
      width: double.infinity,
        padding: EdgeInsets.only(top:10.h,bottom:20.h,left: 20.w,right: 20.w),
      child:Column(
        mainAxisAlignment: MainAxisAlignment.spaceAround,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          (messages == null || messages.length == 0)
              ? NoDataView(
            isShowBtn: false,
            text: S.of(context).haimeiyouxiaoxi,
            fontSize: 16.sp,
            margin: EdgeInsets.only(top: 120.h),
          )
              : ListView.builder(
              padding: EdgeInsets.only(top: 16),
              itemCount: messages.length,
              shrinkWrap: true,
              physics: NeverScrollableScrollPhysics(),
              itemBuilder: (context, position) {
                return GestureDetector(
                  onTap: () {
                    // if (messages[position].typed == 2) {
                    //   Navigator.of(context)
                    //       .pushNamed('/router/exchange_order_details');
                    // }
                  },
                  child: orderMessageItem(messages[position]),
                );
              }),
        ],
      )
    );
  }
  Widget orderMessageItem(Message message) {
    return Container(
      margin: EdgeInsets.only(top: 8.h, bottom: 8.h),
      child:
      Column(
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              Row(
                children: [
                  Image.asset(
                    (message.typed == 1)
                        ? "assets/image/icon_system_message.png"
                        : (message.typed == 2)
                        ? "assets/image/icon_system_message.png"
                        : "assets/image/c_z.png",
                    width: 24.w,
                    height: 24.h,
                  ),
                  SizedBox(
                    width:8.w,
                  ),
                  Text(
                    (message.typed == 1)
                        ? S.of(context).xitongtongzhi
                        : (message.typed == 2)
                            ? S.of(context).dingdanxiaoxi
                            : S.of(context).chongzhixiaoxi,
                    style: TextStyle(
                      fontSize: 14.sp,
                      fontWeight: FontWeight.bold,
                      color: Color(0xFF060606),
                    ),
                  )
                ],
              ),
              Text(
                message.updateTime,
                style: TextStyle(
                  fontSize: 10.sp,
                  color: Color(0xFFA29E9E),
                ),
              ),
            ],
          ),
            Container(
              width: double.infinity,
              margin: EdgeInsets.only(left:30.w, top:20.h),
              child: Column(
                children: [
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: [
                      Expanded(child: Text(
                        message.content,
                        maxLines: 2,
                        overflow:TextOverflow.ellipsis,
                        style: TextStyle(
                          fontSize: 12.sp,
                          color: Color(0xFF353535),
                        ),
                      ),),
                      Icon(
                        Icons.keyboard_arrow_right,
                        color: Colors.black,
                      )
                    ],
                  ),
                  Container(
                    margin: EdgeInsets.only(top: 14.h),
                    height: 1,
                    width: double.infinity,
                    color: Color(0XFFF7F7F7),
                  )
                ],
              ),
            )
        ],
      ),
    );
  }

  ///充值消息通知
  Widget rechargeMessage(){
    return Container(
        color: Colors.white,
        width: double.infinity,
        padding: EdgeInsets.only(top:10.h,bottom:20.h,left: 20.w,right: 20.w),
        child:Column(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            (messages == null || messages.length == 0)
                ? NoDataView(
              isShowBtn: false,
              text: S.of(context).haimeiyouxiaoxi,
              fontSize: 16.sp,
              margin: EdgeInsets.only(top: 120.h),
            )
                : ListView.builder(
                padding: EdgeInsets.only(top: 16),
                itemCount: messages.length,
                shrinkWrap: true,
                physics: NeverScrollableScrollPhysics(),
                itemBuilder: (context, position) {
                  return GestureDetector(
                    onTap: () {
                      // if (messages[position].typed == 2) {
                      //   Navigator.of(context)
                      //       .pushNamed('/router/exchange_order_details');
                      // }
                    },
                    child: rechargeMessageItem(messages[position]),
                  );
                }),
          ],
        )
    );
  }
  Widget rechargeMessageItem(Message message) {
    return Container(
      margin: EdgeInsets.only(top: 8.h, bottom: 8.h),
      child:
      Column(
        mainAxisAlignment: MainAxisAlignment.start,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              Row(
                children: [
                  Image.asset(
                    (message.typed == 1)
                        ? "assets/image/icon_system_message.png"
                        : (message.typed == 2)
                        ? "assets/image/icon_system_message.png"
                        : "assets/image/c_z.png",
                    width: 24.w,
                    height: 24.h,
                  ),
                  SizedBox(
                    width:8.w,
                  ),
                  Text(
                    (message.typed == 1)
                        ? S.of(context).xitongtongzhi
                        : (message.typed == 2)
                        ? S.of(context).dingdanxiaoxi
                        : "充值通知",
                    style: TextStyle(
                      fontSize: 14.sp,
                      fontWeight: FontWeight.bold,
                      color: Color(0xFF060606),
                    ),
                  )
                ],
              ),
              Text(
                message.updateTime,
                style: TextStyle(
                  fontSize: 10.sp,
                  color: Color(0xFFA29E9E),
                ),
              ),
            ],
          ),
          Container(
            width: double.infinity,
            margin: EdgeInsets.only(left:30.w, top:20.h),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  "充值成功",
                  style: TextStyle(
                    fontSize: 20.sp,
                    fontWeight: MyFontWeight.semi_bold,
                    color: Color(0xFF353535),
                  ),
                ),
                SizedBox(height:8.h,),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    Expanded(child: Text(
                      message.content,
                      maxLines: 2,
                      overflow:TextOverflow.ellipsis,
                      style: TextStyle(
                        fontSize: 12.sp,
                        color: Color(0xFF353535),
                      ),
                    ),),
                    Icon(
                      Icons.keyboard_arrow_right,
                      color: Colors.black,
                    )
                  ],
                ),
                Container(
                  margin: EdgeInsets.only(top: 14.h),
                  height: 1,
                  width: double.infinity,
                  color: Color(0XFFF7F7F7),
                )
              ],
            ),
          )
        ],
      ),
    );
  }

  ///点赞通知
  Widget fabulousMessage(){
    return Container(
        color: Colors.white,
        width: double.infinity,
        padding: EdgeInsets.only(bottom:20.h,left: 20.w,right: 20.w),
        child:Column(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            (messages == null || messages.length == 0)
                ? NoDataView(
              isShowBtn: false,
              text: S.of(context).haimeiyouxiaoxi,
              fontSize: 16.sp,
              margin: EdgeInsets.only(top: 120.h),
            )
                : ListView.builder(
                padding: EdgeInsets.only(top: 16),
                itemCount: messages.length,
                shrinkWrap: true,
                physics: NeverScrollableScrollPhysics(),
                itemBuilder: (context, position) {
                  return GestureDetector(
                    onTap: () {
                      // if (messages[position].typed == 2) {
                      //   Navigator.of(context)
                      //       .pushNamed('/router/exchange_order_details');
                      // }
                    },
                    child: fabulousMessageItem(messages[position]),
                  );
                }),
          ],
        )
    );
  }
  Widget fabulousMessageItem(Message message) {
    return Container(
      child:
          Row(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Image.asset(
                "assets/image/c_z.png",
                width: 44.w,
                height: 44.h,
              ),
              // MImage(
              //  "",
              //   width: 44,
              //   height: 44,
              //   isCircle: true,
              //   fit: BoxFit.cover,
              //   errorSrc: "assets/image/default_1.png",
              //   fadeSrc: "assets/image/default_1.png",
              // ),
              SizedBox(width: 8,),
              Expanded(child:Column(
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Row(
                    children: [
                      Text(
                          "张五",
                          style: TextStyle(
                              fontWeight: MyFontWeight.semi_bold,
                              fontSize: 14.sp,
                              color: Color(0xFF1A1A1A))
                      ),
                      SizedBox(width:8.w,),
                      Text(
                        "点赞了",
                        style:TextStyle(
                          fontWeight: MyFontWeight.medium,
                          fontSize: 14.sp,
                          color: Color(0xFF32A060),
                        ),
                      ),
                    ],
                  ),
                  SizedBox(height: 8,),
                  Text(
                    message.updateTime,
                    style: TextStyle(
                      fontSize: 12.sp,
                      color: Color(0xFFA29E9E),
                    ),
                  ),
                  SizedBox(height:12.h,),
                  Container(
                    width: double.infinity,
                    color:Color(0xFFF2F2F2),
                    padding:EdgeInsets.all(5),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.start,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          "我的评论:",
                          style: TextStyle(
                            fontSize: 12.sp,
                            height: 1.3,
                            fontWeight: MyFontWeight.regular,
                            color: Color(0xFF1A1A1A),
                          ),
                        ),
                        // MImage(
                        //  "",
                        //   width: 38,
                        //   height: 38,
                        //   isCircle: true,
                        //   fit: BoxFit.cover,
                        //   radius: BorderRadius.circular(2),
                        //   errorSrc: "assets/image/default_1.png",
                        //   fadeSrc: "assets/image/default_1.png",
                        // ),
                        SizedBox(width:2.w),
                        Expanded(child:Text(
                          "文本，是指书面语言的表现形式文本，文本，是指书面语言的表现形式文本。",
                          maxLines: 2,
                          overflow:TextOverflow.ellipsis,
                          style: TextStyle(
                            fontSize: 12.sp,
                            height: 1.3,
                            fontWeight: MyFontWeight.regular,
                            color: Color(0xFF808080),
                          ),
                        ),)
                      ],
                    ),
                  ),
                  Container(
                    margin: EdgeInsets.only(top: 16.h,bottom:16.h),
                    height: 1.h,
                    width: double.infinity,
                    color: Color(0xFFF7F7F7),
                  ),
                ],
              )),
            ],
          ),
    );
  }

  ///评论通知
  Widget commentMessage(){
    return Container(
        color: Colors.white,
        width: double.infinity,
        padding: EdgeInsets.only(bottom:20.h,left: 20.w,right: 20.w),
        child:Column(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            (messages == null || messages.length == 0)
                ? NoDataView(
              isShowBtn: false,
              text: S.of(context).haimeiyouxiaoxi,
              fontSize: 16.sp,
              margin: EdgeInsets.only(top: 120.h),
            )
                : ListView.builder(
                padding: EdgeInsets.only(top: 16),
                itemCount: messages.length,
                shrinkWrap: true,
                physics: NeverScrollableScrollPhysics(),
                itemBuilder: (context, position) {
                  return GestureDetector(
                    onTap: () {
                      // if (messages[position].typed == 2) {
                      //   Navigator.of(context)
                      //       .pushNamed('/router/exchange_order_details');
                      // }
                    },
                    child: commentMessageItem(messages[position]),
                  );
                }),
          ],
        )
    );
  }
  Widget commentMessageItem(Message message) {
    return Container(
      child:
      Row(
        mainAxisAlignment: MainAxisAlignment.start,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Image.asset(
            "assets/image/c_z.png",
            width: 44.w,
            height: 44.h,
          ),
          // MImage(
          //  "",
          //   width: 44,
          //   height: 44,
          //   isCircle: true,
          //   fit: BoxFit.cover,
          //   errorSrc: "assets/image/default_1.png",
          //   fadeSrc: "assets/image/default_1.png",
          // ),
          SizedBox(width: 8,),
          Expanded(child:Column(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Expanded(child: Column(
                    mainAxisAlignment: MainAxisAlignment.start,
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Row(
                        children: [
                          Text(
                              "张五",
                              style: TextStyle(
                                  fontWeight: MyFontWeight.semi_bold,
                                  fontSize: 14.sp,
                                  color: Color(0xFF1A1A1A))
                          ),
                          SizedBox(width:8.w,),
                          Text(
                            "评论了",
                            style:TextStyle(
                              fontWeight: MyFontWeight.medium,
                              fontSize: 14.sp,
                              color: Color(0xFF32A060),
                            ),
                          ),
                        ],
                      ),
                      SizedBox(height: 8,),
                      Text(
                        message.updateTime,
                        style: TextStyle(
                          fontSize: 12.sp,
                          color: Color(0xFFA29E9E),
                        ),
                      ),
                    ],
                  ),),
                  Container(
                    height: 21.h,
                    width: 40.w,
                    padding:EdgeInsets.only(left:2,right:2),
                    alignment: Alignment.center,
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(11),
                      border: Border.all(
                        width: 1,
                        color: Color(0xFF00A359),
                        style: BorderStyle.solid,
                      ),
                    ),
                    child: Text(
                     "回复",
                      style: TextStyle(
                        fontSize: 12.sp,
                        fontWeight: MyFontWeight.medium,
                        color: Color(0xFF00A359),
                      ),
                    ),
                  ),
                ],
              ),
              SizedBox(height:8.h,),
              Text(
                "文本，是指书面语言的表现形式，从文学角度说，通常是具有完整、系统含义（Mess…",
                maxLines: 2,
                overflow: TextOverflow.ellipsis,
                style: TextStyle(
                  fontSize: 12.sp,
                  height: 1.3,
                  fontWeight: MyFontWeight.regular,
                  color: Color(0xFF1A1A1A),
                ),
              ),
              SizedBox(height:12.h,),
              Container(
                width: double.infinity,
                color:Color(0xFFF2F2F2),
                padding:EdgeInsets.all(5),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.start,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      "我的评论:",
                      style: TextStyle(
                        fontSize: 12.sp,
                        height: 1.3,
                        fontWeight: MyFontWeight.regular,
                        color: Color(0xFF1A1A1A),
                      ),
                    ),
                    // MImage(
                    //  "",
                    //   width: 38,
                    //   height: 38,
                    //   isCircle: true,
                    //   fit: BoxFit.cover,
                    //   radius: BorderRadius.circular(2),
                    //   errorSrc: "assets/image/default_1.png",
                    //   fadeSrc: "assets/image/default_1.png",
                    // ),
                    SizedBox(width:2.w),
                    Expanded(child:Text(
                      "文本，是指书面语言的表现形式文本，文本，是指书面语言的表现形式文本。",
                      maxLines: 2,
                      overflow:TextOverflow.ellipsis,
                      style: TextStyle(
                        fontSize: 12.sp,
                        height: 1.3,
                        fontWeight: MyFontWeight.regular,
                        color: Color(0xFF808080),
                      ),
                    ),)
                  ],
                ),
              ),
              Container(
                margin: EdgeInsets.only(top: 16.h,bottom:16.h),
                height: 1.h,
                width: double.infinity,
                color: Color(0xFFF7F7F7),
              ),
            ],
          )),
        ],
      ),
    );
  }

  ///关注通知
  Widget followMessage(){
    return Container(
        color: Colors.white,
        width: double.infinity,
        padding: EdgeInsets.only(bottom:20.h,left: 20.w,right: 20.w),
        child:Column(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            (messages == null || messages.length == 0)
                ? NoDataView(
              isShowBtn: false,
              text: S.of(context).haimeiyouxiaoxi,
              fontSize: 16.sp,
              margin: EdgeInsets.only(top: 120.h),
            )
                : ListView.builder(
                padding: EdgeInsets.only(top: 16),
                itemCount: messages.length,
                shrinkWrap: true,
                physics: NeverScrollableScrollPhysics(),
                itemBuilder: (context, position) {
                  return GestureDetector(
                    onTap: () {
                      // if (messages[position].typed == 2) {
                      //   Navigator.of(context)
                      //       .pushNamed('/router/exchange_order_details');
                      // }
                    },
                    child: followMessageItem(messages[position]),
                  );
                }),
          ],
        )
    );
  }
  Widget followMessageItem(Message message) {
    return Container(
      child:
      Row(
        mainAxisAlignment: MainAxisAlignment.start,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Image.asset(
            "assets/image/c_z.png",
            width: 44.w,
            height: 44.h,
          ),
          // MImage(
          //  "",
          //   width: 44,
          //   height: 44,
          //   isCircle: true,
          //   fit: BoxFit.cover,
          //   errorSrc: "assets/image/default_1.png",
          //   fadeSrc: "assets/image/default_1.png",
          // ),
          SizedBox(width: 8,),
          Expanded(child:Column(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Expanded(child: Column(
                    mainAxisAlignment: MainAxisAlignment.start,
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Row(
                        children: [
                          Text(
                              "张五",
                              style: TextStyle(
                                  fontWeight: MyFontWeight.semi_bold,
                                  fontSize: 14.sp,
                                  color: Color(0xFF1A1A1A))
                          ),
                          SizedBox(width:8.w,),
                          Text(
                            "关注了你",
                            style:TextStyle(
                              fontWeight: MyFontWeight.medium,
                              fontSize: 14.sp,
                              color: Color(0xFF32A060),
                            ),
                          ),
                        ],
                      ),
                      SizedBox(height: 8,),
                      Text(
                        message.updateTime,
                        style: TextStyle(
                          fontSize: 12.sp,
                          color: Color(0xFFA29E9E),
                        ),
                      ),
                    ],
                  ),),
                  Container(
                    height: 21.h,
                    width:56.w,
                    padding:EdgeInsets.only(left:5,right:5),
                    alignment: Alignment.center,
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(11),
                      border: Border.all(
                        width: 1,
                        color: Color(0xFF00A359),
                        style: BorderStyle.solid,
                      ),
                      color: Color(0xFF00A359),
                    ),
                    child: Row(
                      children: [
                        Icon(Icons.add,
                          color:Colors.white,
                          size: 16,
                        ),
                        Text(
                          "回关",
                          style: TextStyle(
                            fontSize: 12.sp,
                            fontWeight: MyFontWeight.medium,
                            color: Colors.white,
                          ),
                        ),
                      ],
                    ),
                  ),
                ],
              ),
              SizedBox(height:8.h,),
              Container(
                margin: EdgeInsets.only(top: 16.h,bottom:16.h),
                height: 1.h,
                width: double.infinity,
                color: Color(0xFFF7F7F7),
              ),
            ],
          )),
        ],
      ),
    );
  }
}