对接商品详情页的评价接口

api/shop.js

@@ -15,4 +15,6 @@ export const apiArr = {
   addAddress: '/api/v2/wechat/commodity/receiving_address/add', // 收货地址添加
   addAddressList: '/api/v2/wechat/commodity/receiving_address', // 收货地址列表
   queryOrder: '/api/v2/wechat/commodity/order/trade_query', // 查询订单
+  getComment: '/api/v2/wechat/commodity/review/list', // 获取评论
+
 }

packages/shop/goods/index.vue

@@ -95,22 +95,22 @@
 		<!-- 评价部分 -->
 		<view class="reviews-section">
 			<view class="reviews-header">
-				<h3>评价({{ comments.length }})</h3>
+				<h3>评价({{ comments.length ? comments.length : 0 }})</h3>
 				<view class="view-all" @click="showPopup">查看全部 ></view>
 			</view>
 			<view class="reviews-list" v-if="comments.length > 0">
 				<view class="review-item" v-for="(comment, index) in comments" :key="index">
 					<view class="review-user">
-						<image :src="comment.avatar" class="user-avatar"></image>
+						<image :src="comment.mpuser.avatar" class="user-avatar"></image>
 						<view class="user-info">
-							<view class="user-name">{{ comment.username }}</view>
+							<view class="user-name">{{ comment.mpuser.nick_name }}</view>
 						</view>
-						<view class="review-time">{{ comment.time }}</view>
+						<view class="review-time">{{ comment.create_time }}</view>
 					</view>
-					<view class="user-purchase">已购 {{ comment.product }}</view>
+					<view class="user-purchase">已购 {{ comment.goods_name.goods_name }}{{ comment.goods_name.goods_spec }}</view>
-					<view class="review-content">{{ comment.content }}</view>
+					<view class="review-content">{{ comment.user_review }}</view>
-					<view class="review-images" v-if="comment.images.length > 0">
+					<view class="review-images" v-if="comment.review_image.length > 0">
-						<image :src="img" class="review-img" v-for="(img, idx) in comment.images" :key="idx"></image>
+						<image :src="img" class="review-img" v-for="(img, idx) in comment.review_image" :key="idx"></image>
 					</view>
 				</view>
 			</view>
@@ -193,9 +193,9 @@
 					<!-- text slot="input" style="width: 200rpx; text-align: center" class="input">
 						{{info.commodity_goods_info_list[currentGGIndex]}}
 						</text> -->
-						<view slot="plus" class="plus">
+					<view slot="plus" class="plus">
-							<u-icon name="plus" color="#FFFFFF" size="36" bold></u-icon>
+						<u-icon name="plus" color="#FFFFFF" size="36" bold></u-icon>
-						</view>
+					</view>
 				</u-number-box>
 			</view>
 		</view>
@@ -261,16 +261,16 @@
 				<view class="reviews-list" v-if="comments.length > 0">
 					<view class="review-item" v-for="(comment, index) in comments" :key="index">
 						<view class="review-user">
-							<image :src="comment.avatar" class="user-avatar"></image>
+							<image :src="comment.mpuser.avatar" class="user-avatar"></image>
 							<view class="user-info">
-								<view class="user-name">{{ comment.username }}</view>
+								<view class="user-name">{{ comment.mpuser.nick_name }}</view>
 							</view>
-							<view class="review-time">{{ comment.time }}</view>
+							<view class="review-time">{{ comment.create_time }}</view>
 						</view>
-						<view class="user-purchase">已购 {{ comment.product }}</view>
+						<view class="user-purchase">已购 {{ comment.goods_name.goods_name }}{{ comment.goods_name.goods_spec }}</view>
-						<view class="review-content">{{ comment.content }}</view>
+						<view class="review-content">{{ comment.user_review }}</view>
-						<view class="review-images" v-if="comment.images.length > 0">
+						<view class="review-images" v-if="comment.review_image.length > 0">
-							<image :src="img" class="review-img" v-for="(img, idx) in comment.images" :key="idx">
+							<image :src="img" class="review-img" v-for="(img, idx) in comment.review_image" :key="idx">
 							</image>
 						</view>
 					</view>
@@ -337,27 +337,7 @@ export default {
 			carOrderList: [],
 			// 新增评论数据
 			showReviewPopup: false,
-			comments: [{
+			comments: [],
-				avatar: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
-				username: "TP",
-				product: "库尔勒香梨 10kg/箱",
-				content: "踏入这家位于街角的餐厅，木质门框与暖黄灯光交织出温馨氛围，墙面上手绘的食材插画画透着文艺气息，开放式厨房的设计让食客能看见厨师处理食材的全过程，第一印象便给人以干净与安心。",
-				images: ["https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png"],
-				time: "2025-03-01 11:24:20",
-			},
-			{
-				avatar: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
-				username: "TP",
-				product: "库尔勒香梨 10kg/箱",
-				content: "踏入这家位于街角的餐厅，木质门框与暖黄灯光交织出温馨氛围，墙面上手绘的食材插_draw着文艺气息，开放式厨房的设计让食客能看见厨师处理食材的全过程，第一印象便给人以干净与安心。",
-				images: [
-					"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
-					"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
-					"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/test.png",
-				],
-				time: "2025-03-01 11:24:20",
-			},
-			],
 			show: false,
 			showSize: false,
 
@@ -513,6 +493,7 @@ export default {
 			this.changeImg = item.commodity_pic[0]
 			this.changeName = item.goods_alias
 			this.changePrice = item.sales_price
+			this.getComment(item.goods_id)
 		},
 		car() {
 			NavgateTo("../shopCar/index");
@@ -606,6 +587,26 @@ export default {
 		closeSize() {
 			this.showSize = false;
 		},
+		// 获取评论
+		getComment(id) {
+			let params = {}
+			if (id) {
+				params = {
+					commodity_id: this.id,
+					goods_id: id
+				}
+			} else {
+				params = {
+					commodity_id: this.id,
+				}
+			}
+			request(apiArr.getComment, "POST", params).then((res) => {
+				this.comments = res.commodity_evaluate_list.map(item => ({
+					...item,
+					review_image: item.review_image ? item.review_image.split(',') : []
+				}));
+			});
+		}
 	},
 	onLoad(options) {
 		console.log(JSON.parse(decodeURIComponent(options.item)));
@@ -621,6 +622,7 @@ export default {
 		this.getShopCarList();
 		this.getGoodsInfo();
 		this.getShopCar();
+		this.getComment();
 	},
 
 	//离开页面的时候直接更新购物车数量(目前接口是 传入商品id 数量。如果有当前商品就更新数量。如果没有就增加商品。如果删除某个商品 count 为0 就删除)