yudao
/
mall-uniapp
mirror of https://gitee.com/yudaocode/yudao-mall-uniapp.git
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

【商品评论列表】 

1. 功能实现
pull/1/MERGE
YunaiV 2023-06-28 00:25:26 +08:00
parent afad547b14
commit 39873a9e3c
5 changed files with 71 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
api/product/comment.js
View File

@ -18,3 +18,10 @@ export function getCommentList(spuId, count) {
noAuth: true // TODO 芋艿：后续要做调整
});
}
// 获得商品评价分页
export function getCommentPage(data) {
return request.get('app-api/product/comment/page', data, {
noAuth: true // TODO 芋艿：后续要做调整
});
}

9
pages/activity/goods_combination_details/index.vue
View File

@ -700,7 +700,7 @@
* 获得商品评价列表
*/
getProductReplyList: function() {
ProductCommentApi.getCommentList(this.id, 3).then(res => {
ProductCommentApi.getCommentList(this.activity.spuId, 3).then(res => {
this.reply = res.data;
})
},
@ -708,9 +708,10 @@
* 获得商品评价统计
*/
getProductReplyCount: function() {
ProductCommentApi.getCommentStatistics(this.id).then(res => {
this.$set(this, 'replyChance', res.data.goodPercent);
this.$set(this, 'replyCount', res.data.allCount);
ProductCommentApi.getCommentStatistics(this.activity.spuId).then(res => {
const count = res.data.goodCount + res.data.mediocreCount + res.data.negativeCount;
this.$set(this, 'replyChance', 100.0 * res.data.goodCount / count);
this.$set(this, 'replyCount', count);
});
},

9
pages/activity/goods_seckill_details/index.vue
View File

@ -630,7 +630,7 @@
* 获得商品评价列表
*/
getProductReplyList: function() {
ProductCommentApi.getCommentList(this.id, 3).then(res => {
ProductCommentApi.getCommentList(this.activity.spuId, 3).then(res => {
this.reply = res.data;
})
},
@ -638,9 +638,10 @@
* 获得商品评价统计
*/
getProductReplyCount: function() {
ProductCommentApi.getCommentStatistics(this.id).then(res => {
this.$set(this, 'replyChance', res.data.goodPercent);
this.$set(this, 'replyCount', res.data.allCount);
ProductCommentApi.getCommentStatistics(this.activity.spuId).then(res => {
const count = res.data.goodCount + res.data.mediocreCount + res.data.negativeCount;
this.$set(this, 'replyChance', 100.0 * res.data.goodCount / count);
this.$set(this, 'replyCount', count);
});
},

5
pages/goods_details/index.vue
View File

@ -779,8 +779,9 @@
*/
getProductReplyCount: function() {
ProductCommentApi.getCommentStatistics(this.id).then(res => {
this.$set(this, 'replyChance', res.data.goodPercent);
this.$set(this, 'replyCount', res.data.allCount);
const count = res.data.goodCount + res.data.mediocreCount + res.data.negativeCount;
this.$set(this, 'replyChance', 100.0 * res.data.goodCount / count);
this.$set(this, 'replyCount', count);
});
},

108
pages/users/goods_comment_list/index.vue
View File

@ -4,50 +4,44 @@
<view class='generalComment acea-row row-between-wrapper'>
<view class='acea-row row-middle font-color'>
<view class='evaluate'>评分</view>
<view class='start'
:class="'star'+ (replyData.sumCount===0?'3':Math.round(replyData.replyStar/replyData.sumCount))">
</view>
<view class='start' :class="'star'+ Math.round(replyData.scores)" />
</view>
<view><text class='font-color'>{{(replyData.replyChance)*100}}%</text>好评率</view>
<view><text class='font-color'>{{ 100.0 * replyData.goodCount / replyData.count }}%</text>好评率</view>
</view>
<view class='nav acea-row row-middle'>
<view class='item' :class='type==0 ? "bg-color":""' @click='changeType(0)'>全部({{replyData.sumCount}})
<view class='item' :class='type === 0 ? "bg-color":""' @click='changeType(0)'>全部({{replyData.count}})
</view>
<view class='item' :class='type==1 ? "bg-color":""' @click='changeType(1)'>好评({{replyData.goodCount}})
<view class='item' :class='type === 1 ? "bg-color":""' @click='changeType(1)'>好评({{replyData.goodCount}})
</view>
<view class='item' :class='type==2 ? "bg-color":""' @click='changeType(2)'>中评({{replyData.inCount}})
<view class='item' :class='type === 2 ? "bg-color":""' @click='changeType(2)'>中评({{replyData.mediocreCount}})
</view>
<view class='item' :class='type==3 ? "bg-color":""' @click='changeType(3)'>差评({{replyData.poorCount}})
<view class='item' :class='type === 3 ? "bg-color":""' @click='changeType(3)'>差评({{replyData.negativeCount}})
</view>
</view>
<userEvaluation :reply="reply"></userEvaluation>
</view>
<view class='loadingicon acea-row row-center-wrapper'>
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
<text class='loading iconfont icon-jiazai' :hidden='!loading'></text>{{loadTitle}}
</view>
<view class='noCommodity' v-if="!replyData.sumCount && page > 1">
<view class='noCommodity' v-if="replyData.count === 0 && page > 1">
<view class='pictrue'>
<image src='../static/noEvaluate.png'></image>
<image src='../static/noEvaluate.png' />
</view>
</view>
</view>
</template>
<script>
import {
getReplyList,
getReplyConfig
} from '@/api/store.js';
import userEvaluation from '@/components/userEvaluation';
export default {
import * as ProductCommentApi from '@/api/product/comment.js';
export default {
components: {
userEvaluation
},
data() {
return {
replyData: {},
product_id: 0,
reply: [],
replyData: {}, // 评论统计
product_id: 0, // 商品编号
reply: [], // 评论列表
type: 0,
loading: false,
loadend: false,
@ -60,14 +54,15 @@
* 生命周期函数--监听页面加载
*/
onLoad: function(options) {
let that = this;
if (!options.productId) return that.$util.Tips({
title: '缺少参数'
}, {
tab: 3,
url: 1
});
that.productId = options.productId;
if (!options.productId) {
return this.$util.Tips({
title: '缺少参数'
}, {
tab: 3,
url: 1
});
}
this.productId = options.productId;
},
onShow: function() {
this.getProductReplyCount();
@ -76,49 +71,49 @@
methods: {
/**
* 获取评论统计数据
*
*/
getProductReplyCount: function() {
let that = this;
getReplyConfig(that.productId).then(res => {
that.$set(that, 'replyData', res.data);
ProductCommentApi.getCommentStatistics(this.productId).then(res => {
res.data.count = res.data.goodCount + res.data.mediocreCount + res.data.negativeCount;
this.$set(this, 'replyData', res.data);
});
},
/**
* 分页获取评论
*/
getProductReplyList: function() {
let that = this;
if (that.loadend) return;
if (that.loading) return;
that.loading = true;
that.loadTitle = '';
getReplyList(that.productId, {
page: that.page,
limit: that.limit,
type: that.type,
if (this.loadend || this.loading) {
return;
}
this.loading = true;
this.loadTitle = '';
ProductCommentApi.getCommentPage({
spuId: this.productId,
type: this.type,
pageNo: this.page,
pageSize: this.limit,
}).then(res => {
let list = res.data.list,
loadend = list.length < that.limit;
that.reply = that.$util.SplitArray(list, that.reply);
that.$set(that, 'reply', that.reply);
that.loading = false;
that.loadend = loadend;
if (that.reply.length) {
that.loadTitle = loadend ? "😕人家是有底线的~~" : "加载更多";
}
that.page = that.page + 1;
const list = res.data.list;
const loadend = list.length < this.limit;
this.reply = this.$util.SplitArray(list, this.reply);
this.$set(this, 'reply', this.reply);
this.loading = false;
this.loadend = loadend;
this.loadTitle = loadend ? "😕人家是有底线的~~" : "加载更多";
this.page = this.page + 1;
}).catch(err => {
that.loading = false,
that.loadTitle = '加载更多'
this.loading = false;
this.loadTitle = '加载更多'
});
},
/*
/**
* 点击事件切换
* */
*/
changeType: function(e) {
let type = parseInt(e);
if (type == this.type) return;
if (type === this.type) {
return;
}
this.type = type;
this.page = 1;
this.loadend = false;
@ -134,7 +129,6 @@
},
}
</script>
<style lang="scss">
page {
background-color: #fff;