|
|
|
@ -2,7 +2,7 @@
|
|
|
|
* @Author: ch
|
|
|
|
* @Author: ch
|
|
|
|
* @Date: 2022-06-21 18:19:13
|
|
|
|
* @Date: 2022-06-21 18:19:13
|
|
|
|
* @LastEditors: ch
|
|
|
|
* @LastEditors: ch
|
|
|
|
* @LastEditTime: 2022-06-23 16:10:21
|
|
|
|
* @LastEditTime: 2022-06-28 16:21:32
|
|
|
|
* @Description: file content
|
|
|
|
* @Description: file content
|
|
|
|
-->
|
|
|
|
-->
|
|
|
|
<template>
|
|
|
|
<template>
|
|
|
|
@ -12,6 +12,8 @@
|
|
|
|
<BsCommentInfo :commentDetail="detail"/>
|
|
|
|
<BsCommentInfo :commentDetail="detail"/>
|
|
|
|
<BsCommentFollowInfo v-if="detail.followComment" :followComment="detail.followComment" :commentTime="detail.createTime"/>
|
|
|
|
<BsCommentFollowInfo v-if="detail.followComment" :followComment="detail.followComment" :commentTime="detail.createTime"/>
|
|
|
|
<BsCommentGoodsInfo class="goods-info" :goods="detail" />
|
|
|
|
<BsCommentGoodsInfo class="goods-info" :goods="detail" />
|
|
|
|
|
|
|
|
<!-- <u-icon slot="btns" name="shopping-cart" size="30" color="#FF875B"></u-icon> -->
|
|
|
|
|
|
|
|
<!-- </BsCommentGoodsInfo> -->
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view class="reply-title">全部评论( {{answerCount}}条)</view>
|
|
|
|
<view class="reply-title">全部评论( {{answerCount}}条)</view>
|
|
|
|
<view class="reply">
|
|
|
|
<view class="reply">
|
|
|
|
@ -29,17 +31,26 @@
|
|
|
|
<BsEmpty v-else tips="还没有人评论哦，快来抢沙发~"/>
|
|
|
|
<BsEmpty v-else tips="还没有人评论哦，快来抢沙发~"/>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view class="footer">
|
|
|
|
<view class="footer">
|
|
|
|
<view v-if="!detail.followComment && detail.userId === $store.state.userInfo.id"
|
|
|
|
<view class="footer--item" v-if="!detail.followComment && detail.userId === $store.state.userInfo.id"
|
|
|
|
@click="$Router.push(`/commentSubmitFollow?id=${commentId}`)">追评</view>
|
|
|
|
@click="$Router.push(`/comment?commentId=${commentId}`)">
|
|
|
|
<view @click="isShowAnswer = true">评论</view>
|
|
|
|
<u-icon name="chat" size="28rpx"></u-icon>
|
|
|
|
<view>有用</view>
|
|
|
|
追评
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
<view class="footer--item" @click="isShowAnswer = true">
|
|
|
|
|
|
|
|
<u-icon name="chat" size="28rpx"></u-icon>
|
|
|
|
|
|
|
|
评论
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
<view class="footer--item" :class="{'footer--item__active' : isLike}" @click="handleUseful">
|
|
|
|
|
|
|
|
<u-icon name="thumb-up" size="28rpx" :color="isLike ? '#FF875B' : ''"></u-icon>
|
|
|
|
|
|
|
|
有用<template v-if="detail.usefulCount">({{detail.usefulCount}})</template>
|
|
|
|
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<template v-if="isShowAnswer" >
|
|
|
|
<template v-if="isShowAnswer" >
|
|
|
|
<view class="reply-comment--bg" @click="handleHideAnswer"></view>
|
|
|
|
<view class="reply-comment--bg" @click="handleHideAnswer"></view>
|
|
|
|
<view class="reply-comment">
|
|
|
|
<view class="reply-comment">
|
|
|
|
<view class="reply-comment--box">
|
|
|
|
<view class="reply-comment--box">
|
|
|
|
<input class="reply-comment--input" maxlength="500" v-model="commentContent" :placeholder="placeholder" />
|
|
|
|
<input class="reply-comment--input" maxlength="500" v-model="commentContent" :placeholder="placeholder" />
|
|
|
|
<UiButton type="gradual" @click="handleSubmit">发表</UiButton>
|
|
|
|
<UiButton type="gradual" :disable="!commentContent" @click="handleSubmit">发表</UiButton>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</template>
|
|
|
|
</template>
|
|
|
|
@ -50,8 +61,8 @@ import BsCommentGoodsInfo from '../../../components/BsCommentGoodsInfo.vue'
|
|
|
|
import BsCommentInfo from '../../../components/BsCommentInfo.vue'
|
|
|
|
import BsCommentInfo from '../../../components/BsCommentInfo.vue'
|
|
|
|
import BsCommentUserInfo from '../../../components/BsCommentUserInfo.vue'
|
|
|
|
import BsCommentUserInfo from '../../../components/BsCommentUserInfo.vue'
|
|
|
|
import UiButton from '../../../components/UiButton.vue'
|
|
|
|
import UiButton from '../../../components/UiButton.vue'
|
|
|
|
import {ApiGetCommentDetail, ApiPostComment} from '@/common/api/comment'
|
|
|
|
import {ApiGetCommentDetail, ApiPostComment, ApiPutCommentUseful} from '@/common/api/comment'
|
|
|
|
import {HandleApiError} from '@/common/utils'
|
|
|
|
import {HandleApiError, Debounce} from '@/common/utils'
|
|
|
|
import COMMENT from '@/common/dicts/comment'
|
|
|
|
import COMMENT from '@/common/dicts/comment'
|
|
|
|
import BsEmpty from '../../../components/BsEmpty.vue'
|
|
|
|
import BsEmpty from '../../../components/BsEmpty.vue'
|
|
|
|
import BsCommentFollowInfo from '../../../components/BsCommentFollowInfo.vue'
|
|
|
|
import BsCommentFollowInfo from '../../../components/BsCommentFollowInfo.vue'
|
|
|
|
@ -63,7 +74,8 @@ export default {
|
|
|
|
answer : null,
|
|
|
|
answer : null,
|
|
|
|
commentId : this.$Route.query.id,
|
|
|
|
commentId : this.$Route.query.id,
|
|
|
|
detail : {},
|
|
|
|
detail : {},
|
|
|
|
commentContent : ''
|
|
|
|
commentContent : '',
|
|
|
|
|
|
|
|
isLike : false
|
|
|
|
}
|
|
|
|
}
|
|
|
|
},
|
|
|
|
},
|
|
|
|
computed:{
|
|
|
|
computed:{
|
|
|
|
@ -85,25 +97,26 @@ export default {
|
|
|
|
});
|
|
|
|
});
|
|
|
|
if(!HandleApiError(error,'getDetail')){
|
|
|
|
if(!HandleApiError(error,'getDetail')){
|
|
|
|
this.detail = result;
|
|
|
|
this.detail = result;
|
|
|
|
|
|
|
|
this.isLike = result.isLike || false;
|
|
|
|
|
|
|
|
this.detail.usefulCount = this.detail.usefulCount || 0
|
|
|
|
}
|
|
|
|
}
|
|
|
|
},
|
|
|
|
},
|
|
|
|
async handleSubmit(){
|
|
|
|
async handleSubmit(){
|
|
|
|
let data = {
|
|
|
|
let data = {
|
|
|
|
commentContent : this.commentContent,
|
|
|
|
commentContent : this.commentContent,
|
|
|
|
commentType : COMMENT.TYPE.ANSWER,
|
|
|
|
commentType : COMMENT.TYPE.ANSWER,
|
|
|
|
// orderProductId : this.detail.orderProductId,
|
|
|
|
|
|
|
|
originId : this.detail.id,
|
|
|
|
originId : this.detail.id,
|
|
|
|
parentId : this.answer ? this.answer.id : this.detail.id
|
|
|
|
parentId : this.answer ? this.answer.id : this.detail.id
|
|
|
|
}
|
|
|
|
}
|
|
|
|
const {error, result} = await ApiPostComment(data);
|
|
|
|
const {error, result} = await ApiPostComment(data);
|
|
|
|
if(!HandleApiError(error,'getDetail')){
|
|
|
|
if(!HandleApiError(error)){
|
|
|
|
this.detail.answerCommentList.push({
|
|
|
|
this.detail.answerCommentList.push({
|
|
|
|
...result,
|
|
|
|
...result,
|
|
|
|
userName : this.$store.state.userInfo.nickname,
|
|
|
|
userName : this.$store.state.userInfo.nickname,
|
|
|
|
parentName: this.answer ? this.answer.userName : ''
|
|
|
|
parentName: this.answer ? this.answer.userName : ''
|
|
|
|
});
|
|
|
|
});
|
|
|
|
this.commentContent = '';
|
|
|
|
this.commentContent = '';
|
|
|
|
uni.$u.toast('评论成功！')
|
|
|
|
uni.$u.toast('评论成功！');
|
|
|
|
}
|
|
|
|
}
|
|
|
|
},
|
|
|
|
},
|
|
|
|
handleAnswer(item){
|
|
|
|
handleAnswer(item){
|
|
|
|
@ -113,6 +126,29 @@ export default {
|
|
|
|
handleHideAnswer(...e){
|
|
|
|
handleHideAnswer(...e){
|
|
|
|
this.isShowAnswer = false;
|
|
|
|
this.isShowAnswer = false;
|
|
|
|
this.answer = null;
|
|
|
|
this.answer = null;
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
handleUseful(){
|
|
|
|
|
|
|
|
this.isLike = !this.isLike
|
|
|
|
|
|
|
|
if(this.isLike){
|
|
|
|
|
|
|
|
this.detail.usefulCount++;
|
|
|
|
|
|
|
|
}else{
|
|
|
|
|
|
|
|
this.detail.usefulCount--;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
if(!this.debounce){
|
|
|
|
|
|
|
|
this.debounce = Debounce(this.updateUseFul, 500);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
this.debounce();
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
async updateUseFul(){
|
|
|
|
|
|
|
|
if(this.isLike === this.detail.isLike){
|
|
|
|
|
|
|
|
return false
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
const {error, result} = await ApiPutCommentUseful({
|
|
|
|
|
|
|
|
commentId : this.detail.id,
|
|
|
|
|
|
|
|
isLike : this.isLike
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
@ -171,7 +207,13 @@ page{
|
|
|
|
align-items: center;
|
|
|
|
align-items: center;
|
|
|
|
background: #fff;
|
|
|
|
background: #fff;
|
|
|
|
border-top: 1px solid #f8f8f8;
|
|
|
|
border-top: 1px solid #f8f8f8;
|
|
|
|
|
|
|
|
&--item{
|
|
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
|
|
&__active{
|
|
|
|
|
|
|
|
color: $color-yellow3;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.reply-comment--bg{
|
|
|
|
.reply-comment--bg{
|
|
|
|
position: fixed;
|
|
|
|
position: fixed;
|
|
|
|
|
ch
2 years ago