refactor(class): 优化接口请求与页面细节

1. 统一处理后端统一包结构,自动解析data字段
2. 新增点赞评论栏显示控制参数,详情页隐藏该栏
3. 简化详情页数据更新逻辑,对齐Vue版本实现
4. 重构确认弹窗组件,优化样式与弹窗尺寸
5. 为评论项添加水平边距,优化列表排版
This commit is contained in:
崔宝新
2026-09-07 16:02:14 +08:00
parent 7175bf3054
commit d5f73cfbb5
4 changed files with 72 additions and 64 deletions
+18 -34
View File
@@ -4,6 +4,7 @@ import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:go_router/go_router.dart';
import 'package:new_learn/core/api/class/api.dart';
import 'package:new_learn/core/api/class/model.dart';
import 'package:new_learn/core/components/confirm_box.dart';
import 'package:new_learn/core/components/user_circle_avatar.dart';
import 'package:new_learn/core/providers/user_provider.dart';
import 'package:new_learn/core/utils/img_url.dart';
@@ -41,30 +42,19 @@ class _MyUpdateDetailPageState extends ConsumerState<MyUpdateDetailPage> {
/// 用详情接口增量更新评论相关字段(对标 Vue fetchDetail)
///
/// 关键:只有当 detail 确实带增量内容时才更新,且单个字段非空才覆盖。
/// 否则后端未返回评论/计数(空壳)时,会把列表带入的正确数据"清空"
/// —— 表现为初次闪现对的数据后瞬间空白。
/// 简化逻辑:接口成功返回就直接用详情数据覆盖评论相关字段,
/// 和 Vue 版一致(Vue 里 res.commons !== undefined 就直接覆盖)。
Future<void> _fetchDetail() async {
try {
final res = await ClassApi.instance.getUserPostDetail(_post.id);
if (!mounted) return;
// 空壳判定:detail 未携带任何有效增量 → 完全信任列表带入的数据,不更新
final hasDetail =
res.commons.isNotEmpty ||
res.userLikeAvatars.isNotEmpty ||
res.replyCount > 0 ||
res.likeCount > 0 ||
res.userLikeStatus;
if (!hasDetail) return;
setState(() {
_post = _post.copyWith(
commons: res.commons.isNotEmpty ? res.commons : _post.commons,
userLikeAvatars: res.userLikeAvatars.isNotEmpty
? res.userLikeAvatars
: _post.userLikeAvatars,
commons: res.commons,
userLikeAvatars: res.userLikeAvatars,
userLikeStatus: res.userLikeStatus,
replyCount: res.replyCount > 0 ? res.replyCount : _post.replyCount,
likeCount: res.likeCount > 0 ? res.likeCount : _post.likeCount,
replyCount: res.replyCount,
likeCount: res.likeCount,
);
});
} catch (_) {
@@ -158,6 +148,7 @@ class _MyUpdateDetailPageState extends ConsumerState<MyUpdateDetailPage> {
onLike: _toggleLike,
onComment: (_) {},
hasCardBackground: false,
showLikeCommentBar: false,
),
_DetailComments(post: _post, onDelete: _deleteComment),
],
@@ -199,22 +190,10 @@ class _DetailCommentsState extends ConsumerState<_DetailComments> {
_active = null;
_pending = index;
});
final ok = await showDialog<bool>(
context: context,
builder: (ctx) => AlertDialog(
title: const Text('是否删除评论'),
content: const Text('删除评论后将不可恢复,请慎重选择!'),
actions: [
TextButton(
onPressed: () => Navigator.pop(ctx, false),
child: const Text('取消'),
),
TextButton(
onPressed: () => Navigator.pop(ctx, true),
child: const Text('确定'),
),
],
),
final ok = await showConfirmBox(
context,
title: '是否删除评论',
content: '删除评论后将不可恢复,请慎重选择!',
);
if (!mounted) return;
setState(() => _pending = null);
@@ -287,7 +266,12 @@ class _DetailCommentsState extends ConsumerState<_DetailComments> {
);
} else {
for (int i = 0; i < _post.commons.length; i++) {
items.add(_commentItem(_post.commons[i], i, myId));
items.add(
Padding(
padding: EdgeInsets.symmetric(horizontal: 16.w),
child: _commentItem(_post.commons[i], i, myId),
),
);
}
}
items.add(SizedBox(height: 16.h));
@@ -28,6 +28,7 @@ class PostCard extends StatelessWidget {
required this.onComment,
this.showCommentComposer = true,
this.hasCardBackground = true,
this.showLikeCommentBar = true,
});
final UserPostDto post;
@@ -40,6 +41,9 @@ class PostCard extends StatelessWidget {
/// 是否显示白色卡片背景(列表页 true;详情页与留言区共用一张大卡片 → false)
final bool hasCardBackground;
/// 是否显示点赞/评论标记栏(列表页 true;详情页不需要 → false)
final bool showLikeCommentBar;
String get _avatar {
final url = ImgUrl.build(post.avatar);
return url.isEmpty
@@ -96,12 +100,13 @@ class PostCard extends StatelessWidget {
AlbumGrid(urls: post.urls.map(ImgUrl.build).toList()),
],
SizedBox(height: 10.h),
LikeCommentBar(
post: post,
onLike: onLike,
onComment: onComment,
showComposer: showCommentComposer,
),
if (showLikeCommentBar)
LikeCommentBar(
post: post,
onLike: onLike,
onComment: onComment,
showComposer: showCommentComposer,
),
],
),
),