fix: rating
This commit is contained in:
@@ -18,6 +18,16 @@ export const topicItemComment = async (data) => {
|
||||
});
|
||||
};
|
||||
|
||||
// 评论点赞
|
||||
// data = { commentId: 'xxx' }
|
||||
export const topicItemCommentLike = async (data) => {
|
||||
return request({
|
||||
url: "/api/rating/topic/comment/item/like",
|
||||
method: "POST",
|
||||
data,
|
||||
});
|
||||
};
|
||||
|
||||
// 获取评论列表
|
||||
export const topicItemCommentList = async (topicId, itemId, page = 1) => {
|
||||
return request({
|
||||
|
||||
@@ -26,6 +26,7 @@
|
||||
<script setup>
|
||||
import { ref, watch } from 'vue';
|
||||
import ActionBadge from "@/components/ActionBadge/ActionBadge.vue";
|
||||
import { topicItemCommentLike } from "@/api/topicItem";
|
||||
|
||||
const props = defineProps({
|
||||
comment: {
|
||||
@@ -35,23 +36,46 @@ const props = defineProps({
|
||||
}
|
||||
});
|
||||
|
||||
const isLiked = ref(false);
|
||||
const isLiked = ref(props.comment.isLiked || false);
|
||||
const currentLikes = ref(props.comment.likes || 0);
|
||||
let isLiking = false; // 防抖标志
|
||||
|
||||
watch(() => props.comment.likes, (newVal) => {
|
||||
currentLikes.value = newVal;
|
||||
});
|
||||
|
||||
const handleLike = () => {
|
||||
watch(() => props.comment.isLiked, (newVal) => {
|
||||
isLiked.value = newVal || false;
|
||||
});
|
||||
|
||||
const handleLike = async () => {
|
||||
if (isLiking) return;
|
||||
isLiking = true;
|
||||
|
||||
// 乐观更新 UI
|
||||
isLiked.value = !isLiked.value;
|
||||
if (isLiked.value) {
|
||||
currentLikes.value += 1;
|
||||
// 震动反馈增加交互感
|
||||
uni.vibrateShort({ type: 'light' });
|
||||
} else {
|
||||
currentLikes.value -= 1;
|
||||
}
|
||||
// TODO: 如果需要,可以抛出事件给父组件去调用点赞接口
|
||||
|
||||
try {
|
||||
// 调用点赞接口 (点赞和取消点赞为同一个接口)
|
||||
await topicItemCommentLike({ commentId: props.comment.id });
|
||||
} catch (error) {
|
||||
// 接口调用失败,回滚 UI 状态
|
||||
isLiked.value = !isLiked.value;
|
||||
if (isLiked.value) {
|
||||
currentLikes.value += 1;
|
||||
} else {
|
||||
currentLikes.value -= 1;
|
||||
}
|
||||
uni.showToast({ title: '操作失败', icon: 'none' });
|
||||
} finally {
|
||||
isLiking = false;
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
@@ -220,6 +220,7 @@ const getCommentsData = async () => {
|
||||
time: formatDate(item.createdAt) || '刚刚', // 如果后端返回了时间字段可以替换
|
||||
content: item.content,
|
||||
likes: item.likeCount || 0,
|
||||
isLiked: item.isLiked || false,
|
||||
badge: '', // 预留徽章字段
|
||||
badgeIcon: '',
|
||||
userAction: item.userAction || "" // 夯/顶级/人上人/NPC/拉
|
||||
|
||||
Reference in New Issue
Block a user