From 33311ae19cb2e855d058a2e5fb2e814db15f35f8 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Sat, 10 Jun 2023 00:17:07 +0800
Subject: [PATCH] =?UTF-8?q?=E3=80=90=E5=95=86=E5=93=81=E8=AF=A6=E6=83=85?=
 =?UTF-8?q?=E3=80=91=201.=20=E6=8E=A5=E5=85=A5=E8=AF=84=E8=AE=BA=E9=80=BB?=
 =?UTF-8?q?=E8=BE=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 api/product/comment.js              | 15 +++++++
 components/userEvaluation/index.vue | 61 +++++++++++++++--------------
 pages/goods_details/index.vue       | 54 +++++++++++--------------
 3 files changed, 69 insertions(+), 61 deletions(-)
 create mode 100644 api/product/comment.js

diff --git a/api/product/comment.js b/api/product/comment.js
new file mode 100644
index 00000000..ce88089f
--- /dev/null
+++ b/api/product/comment.js
@@ -0,0 +1,15 @@
+import request from "@/utils/request.js";
+
+// 获得商品的评价统计
+export function getCommentStatistics(spuId) {
+  return request.get('app-api/product/comment/statistics', {
+    spuId
+  });
+}
+
+// 获得最近的 n 条商品评价
+export function getCommentList(spuId) {
+  return request.get('app-api/product/comment/list', {
+    spuId
+  });
+}
diff --git a/components/userEvaluation/index.vue b/components/userEvaluation/index.vue
index dabc11ce..6d36f879 100644
--- a/components/userEvaluation/index.vue
+++ b/components/userEvaluation/index.vue
@@ -1,39 +1,37 @@
 <template>
 	<view class="evaluateWtapper" v-if="reply.length > 0">
-		<view class="evaluateItem" v-for="(item, indexw) in reply" :key="indexw">
+		<view class="evaluateItem" v-for="(item, index) in reply" :key="index">
 			<view class="pic-text acea-row">
 				<view class="pictrue">
-					<image :src="item.avatar"></image>
+					<image :src="item.userAvatar"></image>
 				</view>
 				<view class="content">
 					<view>
 						<view class="acea-row row-between">
 							<view class="acea-row">
-								<view class="name line1">{{ item.nickname }}</view>
-								<view class="start" :class="'star' + item.score"></view>
+								<view class="name line1">{{ item.userNickname }}</view>
+								<view class="start" :class="'star' + item.scores"></view>
 							</view>
-							<view class="time">{{ item.createTime }}</view>
+							<view class="time">{{ formatDate(item.createTime) }}</view>
 						</view>
 						<view class="sku">规格：{{ item.sku?item.sku:'无' }}</view>
 					</view>
-					
-					<view class="evaluate-infor">{{ item.comment }}</view>
-					<view class="imgList acea-row" v-if="item.pics && item.pics.length && item.pics[0]">
-						<view class="pictrue" v-for="(itemn, indexn) in item.pics" :key="indexn">
-							<image :src="itemn" class="image" @click='getpreviewImage(indexw, indexn)'></image>
+					<view class="evaluate-infor">{{ item.content }}</view>
+					<view class="imgList acea-row" v-if="item.picUrls && item.picUrls.length > 0">
+						<view class="pictrue" v-for="(picUrl, indexn) in item.picUrls" :key="indexn">
+							<image :src="picUrl" class="image" @click='getpreviewImage(index, indexn)'></image>
 						</view>
 					</view>
-					<view class="reply" v-if="item.merchantReplyContent">
-						<text class="font-color">店小二</text>：{{ item.merchantReplyContent }}
+					<view class="reply" v-if="item.replyContent">
+						<text class="font-color">店小二</text>：{{ item.replyContent }}
 					</view>
 				</view>
-				
 			</view>
-			
 		</view>
 	</view>
 </template>
 <script>
+  import dayjs from "@/plugin/dayjs/dayjs.min.js";
 	export default {
 		props: {
 			reply: {
@@ -47,10 +45,13 @@
 		methods: {
 			getpreviewImage: function(indexw, indexn) {
 				uni.previewImage({
-					urls: this.reply[indexw].pics,
-					current: this.reply[indexw].pics[indexn]
+					urls: this.reply[indexw].picUrls,
+					current: this.reply[indexw].picUrls[indexn]
 				});
-			}
+			},
+      formatDate: function(date) {
+        return dayjs(date).format("YYYY-MM-DD HH:mm:ss");
+      }
 		}
 	}
 </script>
@@ -61,11 +62,11 @@
 		border-bottom-left-radius: 14rpx;
 		border-bottom-right-radius: 14rpx;
 	}
-	
+
 	.evaluateWtapper .evaluateItem~.evaluateItem {
 		border-top: 1rpx solid #f5f5f5;
 	}
-	
+
 	.evaluateWtapper .evaluateItem .pic-text {
 		font-size: 26rpx;
 		color: #282828;
@@ -74,26 +75,26 @@
 			margin-left: 20rpx;
 		}
 	}
-	
+
 	.evaluateWtapper .evaluateItem .pic-text .pictrue {
 		width: 62rpx;
 		height: 62rpx;
 	}
-	
+
 	.evaluateWtapper .evaluateItem .pic-text .pictrue image {
 		width: 100%;
 		height: 100%;
 		border-radius: 50%;
 	}
-	
+
 	.evaluateWtapper .evaluateItem .pic-text .name {
 		max-width: 450rpx;
 	}
-	
+
 	.evaluateWtapper .evaluateItem .time {
 		font-size: 24rpx;
 		color: #999999;
-		
+
 	}
 	.sku{
 		font-size: 24rpx;
@@ -105,12 +106,12 @@
 		color: #333;
 		margin-bottom: 14rpx;
 	}
-	
-	.evaluateWtapper .evaluateItem .imgList {/* 
+
+	.evaluateWtapper .evaluateItem .imgList {/*
 		padding: 0 24rpx;
 		margin-top: 16rpx; */
 	}
-	
+
 	.evaluateWtapper .evaluateItem .imgList .pictrue {
 		width: 102rpx;
 		height: 102rpx;
@@ -119,14 +120,14 @@
 		margin-bottom: 16rpx;
 		/* margin: 0 0 15rpx 15rpx; */
 	}
-	
+
 	.evaluateWtapper .evaluateItem .imgList .pictrue image {
 		width: 100%;
 		height: 100%;
 		background-color: #f7f7f7;
 		border-radius: 14rpx;
 	}
-	
+
 	.evaluateWtapper .evaluateItem .reply {
 		font-size: 26rpx;
 		color: #454545;
@@ -136,7 +137,7 @@
 		padding: 20rpx;
 		position: relative;
 	}
-	
+
 	.evaluateWtapper .evaluateItem .reply::before {
 		content: "";
 		width: 0;
diff --git a/pages/goods_details/index.vue b/pages/goods_details/index.vue
index 615502d4..e69e67be 100644
--- a/pages/goods_details/index.vue
+++ b/pages/goods_details/index.vue
@@ -43,12 +43,6 @@
 									销量:{{ spu.salesCount}} {{ spu.unitName }}
 								</view>
 							</view>
-							<!-- <view class='coupon acea-row row-between-wrapper' v-if="productInfo.give_integral > 0">
-								<view class='hide line1 acea-row'>
-									赠积分：
-									<view class='activity'>赠送 {{productInfo.give_integral}} 积分</view>
-								</view>
-							</view> -->
               <!-- 优惠劵 TODO 芋艿：待接入 -->
 							<view v-if="coupon.list.length > 0 && type==='normal'"
 								class='coupon acea-row row-between-wrapper' @click='couponTap'>
@@ -94,14 +88,13 @@
 							</view>
 							<view class='iconfont icon-jiantou'></view>
 						</view>
-            <!-- 评论 TODO 芋艿：待完成 -->
+            <!-- 评论 -->
 						<view class='userEvaluation' id="past1">
 							<view class='title acea-row row-between-wrapper'
 								:style="replyCount==0?'border-bottom-left-radius:14rpx;border-bottom-right-radius:14rpx;':''">
 								<view>用户评价<i>({{replyCount}})</i></view>
-								<navigator class='praise' hover-class='none'
-									:url='"/pages/users/goods_comment_list/index?productId="+id'>
-									<i>好评</i>&nbsp;<text class='font-color'>{{replyChance || 0}}%</text>
+								<navigator class='praise' hover-class='none' :url='"/pages/users/goods_comment_list/index?productId="+id'>
+									<i>好评</i>&nbsp;<text class='font-color'> {{ replyChance || 0 }}%</text>
 									<text class='iconfont icon-jiantou'></text>
 								</navigator>
 							</view>
@@ -173,7 +166,7 @@
 			<!-- #endif -->
       <!-- 场景：普通订单 -->
       <block v-if="type === 'normal'">
-        <!-- 收藏 TODO 芋艿：收藏逻辑 -->
+        <!-- 收藏 -->
         <view @click="setCollect" class='item'>
 					<view class='iconfont icon-shoucang1' v-if="userCollect"></view>
 					<view class='iconfont icon-shoucang' v-else></view>
@@ -285,11 +278,7 @@
 <script>
 	import uQRCode from '@/js_sdk/Sansnn-uQRCode/uqrcode.js'
 	import {
-		collectAdd,
-		collectDel,
-		getReplyConfig,
-		getProductGood,
-		getReplyProduct
+		getProductGood
 	} from '@/api/store.js';
 	import { spread } from "@/api/user";
 	import {
@@ -307,13 +296,14 @@
 	import parser from "@/components/jyf-parser/jyf-parser";
   import * as ProductSpuApi from '@/api/product/spu.js';
   import * as ProductFavoriteApi from '@/api/product/favorite.js';
+  import * as ProductCommentApi from '@/api/product/comment.js';
   import * as TradeCartApi from '@/api/trade/cart.js';
   import * as Util from '@/utils/util.js';
   import * as ProductUtil from '@/utils/product.js';
   // #ifdef MP
 	import { base64src } from '@/utils/base64src.js'
 	import { getQrcode } from '@/api/api.js';
-  import {createFavorite, deleteFavorite} from "../../api/product/favorite";
+  import {getCommentList} from "../../api/product/comment";
 	// #endif
 	const app = getApp();
 	export default {
@@ -331,7 +321,6 @@
         // ========== 商品详情相关的变量 ==========
         id: 0, // 商品 id
         type: "", // 商品展示类型；normal - 普通；video - 视频
-        productInfo: {}, // 商品详情 TODO 芋艿：准备移除
         spu: {}, // 商品 SPU 详情
         skuMap: [], // 商品 SKU Map
         attrValue: '', // 已选属性名的拼接，例如说 红色,大 这样的格式
@@ -349,10 +338,10 @@
           video: 'width:100%'
         },
 
-        // ========== 评价相关的变量 TODO ==========
-        replyCount: 0, // 总评论数量 TODO 芋艿：回复，待实现
-				reply: [], // 评论列表
-        replyChance: 0, // TODO 芋艿：评论相关，待接入
+        // ========== 评价相关的变量 ==========
+        replyCount: 0, // 总评论数量
+        replyChance: 0, // 好评率
+        reply: [], // 评论列表
 
         // ========== 收藏相关的变量 ==========
         userCollect: false,
@@ -526,7 +515,6 @@
           let productInfo = res.data;
           let spu = res.data;
           let skus = res.data.skus;
-          this.$set(this, 'productInfo', productInfo);
           this.$set(this, 'spu', spu);
           this.$set(this.attr, 'properties', ProductUtil.convertProductPropertyList(skus));
           this.$set(this, 'skuMap', ProductUtil.convertProductSkuMap(skus));
@@ -771,18 +759,22 @@
         });
       },
 
-      // ========== 评价相关的方法 TODO ==========
-
+      // ========== 评价相关的方法 ==========
+      /**
+       * 获得商品评价列表
+       */
       getProductReplyList: function() {
-        getReplyProduct(this.id).then(res => {
-          this.reply = res.data.productReply ? [res.data.productReply] : [];
+        ProductCommentApi.getCommentList(this.id).then(res => {
+          this.reply = res.data;
         })
       },
+      /**
+       * 获得商品评价统计
+       */
       getProductReplyCount: function() {
-        let that = this;
-        getReplyConfig(that.id).then(res => {
-          that.$set(that, 'replyChance', res.data.replyChance * 100);
-          that.$set(that, 'replyCount', res.data.sumCount);
+        ProductCommentApi.getCommentStatistics(this.id).then(res => {
+          this.$set(this, 'replyChance', res.data.goodPercent);
+          this.$set(this, 'replyCount', res.data.allCount);
         });
       },