huixiang_app/lib/web/web_view/comment_list.dart

import 'package:dio/dio.dart';
import 'package:flutter/material.dart';
import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
import 'package:huixiang/generated/l10n.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:huixiang/retrofit/data/activity.dart';
import 'package:huixiang/retrofit/data/article.dart';
import 'package:huixiang/retrofit/data/base_data.dart';
import 'package:huixiang/retrofit/data/member_comment_list.dart';
import 'package:huixiang/retrofit/data/page.dart';
import 'package:huixiang/retrofit/retrofit_api.dart';
import 'package:huixiang/view_widget/comment_menu.dart';
import 'package:huixiang/view_widget/custom_image.dart';
import 'package:huixiang/view_widget/login_tips_dialog.dart';
import 'package:like_button/like_button.dart';
import 'package:shared_preferences/shared_preferences.dart';

class CommentList extends StatefulWidget {
  final Map arguments;
  final Activity activity;
  final Article article;
  final bool isKeyBoardShow;
  final Function reply;
  final Function delCommentTips;

  CommentList(
    Key key,
    this.arguments,
    this.activity,
    this.article,
    this.isKeyBoardShow,
    this.reply,
    this.delCommentTips,
  ) : super(key: key);

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

class _CommentList extends State<CommentList> {
  int commentTotal = 0;
  List<MemberCommentList> memberList = [];
  ApiService apiService;

  //评论点赞
  queryCommentLike(String id) async {
    SharedPreferences sharedPreferences = await SharedPreferences.getInstance();
    String token = sharedPreferences.getString("token");
    if (token == null || token == "") {
      LoginTipsDialog().show(context);
      return;
    }
    BaseData baseData =
        await apiService.commentLike(id).catchError((onError) {});
    if (baseData != null && baseData.isSuccess) {
      memberList.forEach((element) {
        if (element.id == id) {
          if (element.liked) {
            element.likes -= 1;
            element.liked = false;
          } else {
            element.likes += 1;
            element.liked = true;
          }
        }
      });
    }
  }

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

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Container(
          decoration: BoxDecoration(
            color: Colors.white,
            boxShadow: [
              BoxShadow(
                color: Colors.black.withAlpha(12),
                offset: Offset(0, 2),
                blurRadius: 14,
                spreadRadius: 0,
              ),
            ],
          ),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Container(
                padding: EdgeInsets.all(16),
                child: Row(
                  children: [
                    Text(
                      S.of(context).pinglun_(commentTotal.toString()),
                      style: TextStyle(
                        fontSize: 16.sp,
                        fontWeight: FontWeight.bold,
                        color: Color(0xff1A1A1A),
                      ),
                    ),
                    SizedBox(
                      width: 16.w,
                    ),
                    Text(
                      S.of(context).xihuan_(
                          "${widget.article?.likes ?? widget.activity?.likes ?? "0"}"),
                      style: TextStyle(
                        fontSize: 16.sp,
                        fontWeight: FontWeight.bold,
                        color: Color(0xff1A1A1A),
                      ),
                    ),
                  ],
                ),
              ),
              if (memberList != null && memberList.length > 0)
                ListView.builder(
                  shrinkWrap: true,
                  physics: NeverScrollableScrollPhysics(),
                  itemCount: memberList != null ? memberList.length : 0,
                  scrollDirection: Axis.vertical,
                  itemBuilder: (context, position) {
                    return Material(
                      color: Colors.white,
                      child: InkWell(
                        onTap: () {
                          showPressMenu(memberList[position].createUser,
                              memberList[position]);
                        },
                        child: commentItem(
                            memberList[position], position, memberList.length),
                      ),
                    );
                  },
                ),
              if (memberList != null && memberList.length > 0)
                Container(
                  height: 63.h,
                  decoration: BoxDecoration(
                    color: Color(0xFFF2F2F2),
                    boxShadow: [
                      BoxShadow(
                        color: Colors.black.withAlpha(12),
                        offset: Offset(0, 2),
                        blurRadius: 14,
                        spreadRadius: 0,
                      ),
                    ],
                  ),
                  alignment: Alignment.center,
                  child: Text(
                    S.of(context).yixiansquanbupinglun,
                    style: TextStyle(
                      fontSize: 14.sp,
                      color: Color(0xff353535),
                    ),
                  ),
                ),
              if (memberList == null || memberList.length == 0)
                Container(
                  width: double.infinity,
                  height: 80.h,
                  alignment: Alignment.center,
                  child: Text(
                    S.of(context).zanwupinglun,
                    style: TextStyle(
                      fontSize: 14.sp,
                      fontWeight: FontWeight.bold,
                      color: Color(0xFFA0A0A0),
                    ),
                  ),
                ),
            ],
          ),
        ),
        SizedBox(
          height: 12.h,
        ),
      ],
    );
  }

  //评论列表
  queryMemberCommentList() async {
    SharedPreferences sharedPreferences = await SharedPreferences.getInstance();
    if (apiService == null)
      apiService = ApiService(Dio(),
          context: context, token: sharedPreferences.getString("token"));
    BaseData<PageInfo<MemberCommentList>> baseData =
        await apiService.memberCommentList({
      "pageNum": 1,
      "pageSize": 100,
      "relationalId":
          widget.arguments["activityId"] ?? widget.arguments["articleId"],
      "relationalType": 1,
    }).catchError((error) {});
    if (baseData != null && baseData.isSuccess) {
      commentTotal = baseData.data.size;
      memberList = baseData.data.list;
      setState(() {});
    }
  }

  showPressMenu(String userId, memberComment) {
    if (widget.isKeyBoardShow) {
      FocusScope.of(context).requestFocus(FocusNode());
      return;
    }
    SharedPreferences.getInstance().then((value) {
      // showModalBottomSheet(
      //   context: context,
      //   backgroundColor: Colors.transparent,
      //   builder: (context) {
      //     return CommentMenu(
      //       (type) {
      //         print("click: $type");
      //         if (type == "huifu") {
      //           widget.reply(memberComment);
      //         } else if (type == "shanchu") {
      //           widget.delCommentTips();
      //         }
      //       },
      //       isSelf: userId == value.getString("userId"),
      //     );
      //   },
      // );

      SmartDialog.show(
        widget: CommentMenu((type) {
            SmartDialog.dismiss();
            if (type == "huifu") {
              widget.reply(memberComment);
            } else if (type == "shanchu") {
              widget.delCommentTips();
            }
          },
          isSelf: userId == value.getString("userId"),
        ),
        alignmentTemp: Alignment.bottomCenter,
        isUseAnimationTemp: true,
        animationDurationTemp: Duration(milliseconds: 300),
      );
    });
  }

  Widget commentItem(MemberCommentList memberList, int index, int max) {
    return Container(
      padding: EdgeInsets.symmetric(vertical: 8.w),
      child: Column(
        children: [
          Container(
            padding: EdgeInsets.symmetric(horizontal: 16.w),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                MImage(
                  memberList.userAvatarUrl ?? "",
                  fit: BoxFit.cover,
                  isCircle: true,
                  width: 40,
                  height: 40,
                  fadeSrc: "assets/image/default_user.png",
                  errorSrc: "assets/image/default_user.png",
                ),
                SizedBox(
                  width: 12.w,
                ),
                Expanded(
                  child: Container(
                    height: 60.h,
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text.rich(
                          TextSpan(
                            children: [
                              TextSpan(
                                text: memberList.username,
                                style: TextStyle(
                                  fontWeight: FontWeight.bold,
                                  fontSize: 14.sp,
                                  color: Colors.black,
                                ),
                              ),
                            ],
                          ),
                          textDirection: TextDirection.ltr,
                        ),
                        Text(
                          memberList.createTime,
                          overflow: TextOverflow.ellipsis,
                          maxLines: 2,
                          style: TextStyle(
                            fontSize: 12.sp,
                            color: Color(0xff808080),
                          ),
                        ),
                      ],
                    ),
                  ),
                  flex: 1,
                ),
                Container(
                  alignment: Alignment.topRight,
                  child: LikeButton(
                    padding: EdgeInsets.all(10),
                    circleSize: 16,
                    circleColor: CircleColor(
                      start: Color(0xff00ddff),
                      end: Color(0xff0099cc),
                    ),
                    bubblesColor: BubblesColor(
                      dotPrimaryColor: Color(0xff33b5e5),
                      dotSecondaryColor: Color(0xff0099cc),
                    ),
                    bubblesSize: 15,
                    likeBuilder: (bool isLiked) {
                      return isLiked
                          ? Image.asset(
                              "assets/image/icon_like.png",
                              width: 16,
                              height: 16,
                            )
                          : Image.asset(
                              "assets/image/icon_like_h.png",
                              width: 16,
                              height: 16,
                            );
                    },
                    isLiked: memberList.liked ?? false,
                    onTap: (isLiked) async {
                      await queryCommentLike(memberList.id);
                      return (memberList == null || memberList.liked == null)
                          ? false
                          : memberList.liked;
                    },
                    likeCount: memberList.likes,
                    countBuilder: (int count, bool isLiked, String text) {
                      return Text(
                        text,
                        style: TextStyle(
                          color: Color(0xFF1A1A1A),
                          fontSize: 12.sp,
                        ),
                      );
                    },
                  ),
                ),
              ],
            ),
          ),
          Container(
            padding: EdgeInsets.only(
              left: 68,
              right: 16,
              top: 16.h,
              bottom: 16.h,
            ),
            child: Align(
              alignment: Alignment.centerLeft,
              child: Text(
                memberList.content,
                style: TextStyle(
                  fontSize: 14.sp,
                  color: Color(0xff1A1A1A),
                ),
              ),
            ),
          ),
          SizedBox(
            height: 12.h,
          ),
          if (memberList.parentContent != null)
            Container(
              margin: EdgeInsets.only(left: 68.w, right: 16.w),
              decoration: BoxDecoration(
                color: Color(0xffF2F2F2),
                borderRadius: BorderRadius.circular(2.0),
              ),
              child: Padding(
                padding: EdgeInsets.only(left: 4.w, top: 4.h, bottom: 4.h),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      "${memberList.parentUserName}:" ?? "",
                      style: TextStyle(
                        fontSize: 12.sp,
                        color: Color(0xff808080),
                      ),
                    ),
                    Expanded(
                      flex: 1,
                      child: Text(
                        memberList.parentContent ?? "",
                        style: TextStyle(
                          fontSize: 12.sp,
                          color: Color(0xff808080),
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            ),
        ],
      ),
    );
  }
}