A1300399510/PC-vote
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: 更新点赞功能样式和交互效果

Browse Source 
- 替换点赞图标为红色版本
- 添加点赞动画效果
- 优化点赞交互体验
- 更新开发环境配置
- 修复缓存处理逻辑
This commit is contained in:
DESKTOP-RQ919RC\Pc
2025-08-22 11:25:14 +08:00
parent 01e8a789d8
commit 637aad70fc
71 changed files with 538 additions and 399 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
components/DetailsComments.vue
View File

@@ -123,7 +123,7 @@
<!-- <img class="comment-icon" title="回复" @click="openAnswerCommentsChild(index)" src="@/assets/img/comment-icon-gray.svg" /> -->
<img class="comment-icon" title="回复" @click="!item['childState'] ? openAnswerCommentsChild(index) : closeAnswerCommentsChild()" src="@/assets/img/comment-icon-gray.svg" />
<div class="flexacenter like-box" @click="commentLike(index)">
<img class="like-icon" v-if="item['islike'] == 1" src="@/assets/img/like-icon-colours.png" />
<img class="like-icon" v-if="item['islike'] == 1" src="@/assets/img/like-red-pitch.png" />
<img class="like-icon" v-else src="@/assets/img/like-icon-gray.png" />
<div class="like-quantity">{{ item["likenum"] || 0 }}</div>
</div>
@@ -209,7 +209,7 @@
</div>
<img class="comment-icon" title="回复" @click="!ite['childState'] ? openAnswerCommentsChild(index, i) : closeAnswerCommentsChild()" src="@/assets/img/comment-icon-gray.svg" />
<div class="flexacenter like-box" @click="commentLike(index, i)">
<img class="like-icon" v-if="ite['islike'] == 1" src="@/assets/img/like-icon-colours.png" />
<img class="like-icon" v-if="ite['islike'] == 1" src="@/assets/img/like-red-pitch.png" />
<img class="like-icon" v-else src="@/assets/img/like-icon-gray.png" />
<div class="like-quantity">{{ ite["likenum"] || 0 }}</div>
</div>
@@ -304,6 +304,8 @@
</div>
</template>
</el-dialog>
<Like v-if="isLikeGif"></Like>
</template>
<script setup>
@@ -380,6 +382,9 @@ const getCommentList = () => {
.finally(() => (commentLoading = false));
};
// 点赞
let isLikeGif = ref(false);
// 评论点赞
const commentLike = (index, i) => {
if (realname.value == 0 && userInfoWin.value.uin > 0) {
@@ -402,15 +407,25 @@ const commentLike = (index, i) => {
if (res.code != 200) return;
let data = res.data;
const status = data["status"];
if (i != null) {
targetCommentList[index]["child"][i].islike = data["status"];
targetCommentList[index]["child"][i].islike = status;
targetCommentList[index]["child"][i].likenum = data["likenum"];
} else {
targetCommentList[index].islike = data["status"];
targetCommentList[index].islike = status;
targetCommentList[index].likenum = data["likenum"];
}
ElMessage.success(res.message);
if (status) {
isLikeGif.value = false;
nextTick(() => {
isLikeGif.value = true;
setTimeout(() => (isLikeGif.value = false), 2000);
});
}
});
};