From c337b40f1052733c86696cf3dbeb44ad8bf2a73d Mon Sep 17 00:00:00 2001
From: 陶杰 <1378534974@qq.com>
Date: 星期三, 16 十月 2024 20:54:05 +0800
Subject: [PATCH] 1.商品评论优化
---
sub_pages/customer/shop/shop.vue | 110 ++++++++++++++++++++++++++++--------
pages/order/comment/order-comment.vue | 53 +++++++++++++----
2 files changed, 124 insertions(+), 39 deletions(-)
diff --git a/pages/order/comment/order-comment.vue b/pages/order/comment/order-comment.vue
index c595b6c..0364914 100644
--- a/pages/order/comment/order-comment.vue
+++ b/pages/order/comment/order-comment.vue
@@ -601,6 +601,11 @@
// }, 1200)
}
},
+
+ toggleAnonymity(item) {
+ // 切换 anonymityFalg 值，1 表示匿名，0 表示非匿名
+ item.anonymityFalg = 1
+ },
},
}
</script>
@@ -630,23 +635,39 @@
</view>
</u-col>
<u-col span="2">
- <u-rate count="5" v-model="item.commentGrade"></u-rate>
+
+ </u-col>
+ </u-row>
+ <u-row justify="space-between">
+ <u-col span="2">
+
+ </u-col>
+ <u-col >
+ <view><u-rate count="5" v-model="item.commentGrade" size="30"></u-rate></view>
</u-col>
</u-row>
<u-row v-if=" item.commentGrade>0 ">
- <u-col span="12">
- <u-radio-group v-model="item.anonymityFalg" :labelSize="10">
- <u-radio label="匿名" :name="1"></u-radio>
- </u-radio-group>
-
- <u--textarea v-model="item.comment" placeholder="请输入内容" count></u--textarea>
- <view class="component-button-upload" @click="uploadIcon(item,'image')"></view>
- <view class="flex p20" style="padding-top: 0rpx;padding-bottom: 10rpx"
- v-if="item.pictureList&&item.pictureList.length>0">
- <view class="m-t-12 m-r-10 " v-for="(tBanner,index2) of item.pictureList" :key="index2">
- <!-- <image :src="tBanner" @click.stop="previewImg(tBanner)" width="30px" height="30px" style= ></image> -->
- <u--image :showLoading="true" :src="tBanner" width="50px" height="50px"></u--image>
- <view class="t-red text-center" @click.stop="deleteImg(item,index2)">删除</view>
+ <u-col span="12" >
+ <view class="comment-content-div">
+
+ <view class="comment-content-div">
+ <u-radio-group v-model="item.anonymityFalg" :labelSize="10">
+ <u-radio label="匿名" :name="1"></u-radio>
+ </u-radio-group>
+ </view>
+ <view class="comment-content-div">
+ <u--textarea v-model="item.comment" placeholder="请输入内容" count></u--textarea>
+ </view>
+ <view class="comment-content-div">
+ <view class="component-button-upload" @click="uploadIcon(item,'image')"></view>
+ <view class="flex p20" style="padding-top: 0rpx;padding-bottom: 10rpx"
+ v-if="item.pictureList&&item.pictureList.length>0">
+ <view class="m-t-12 m-r-10 " v-for="(tBanner,index2) of item.pictureList" :key="index2">
+ <!-- <image :src="tBanner" @click.stop="previewImg(tBanner)" width="30px" height="30px" style= ></image> -->
+ <u--image :showLoading="true" :src="tBanner" width="50px" height="50px"></u--image>
+ <view class="t-red text-center" @click.stop="deleteImg(item,index2)">删除</view>
+ </view>
+ </view>
</view>
</view>
</u-col>
@@ -896,6 +917,10 @@
}
}
+
+ .comment-content-div{
+ margin: 10rpx;
+ }
}
</style>
\ No newline at end of file
diff --git a/sub_pages/customer/shop/shop.vue b/sub_pages/customer/shop/shop.vue
index d1f6f20..9a9bee1 100644
--- a/sub_pages/customer/shop/shop.vue
+++ b/sub_pages/customer/shop/shop.vue
@@ -172,34 +172,39 @@
<view v-for="(item,index) of commentList" >
<u-row justify="space-between" >
- <u-col span="1">
- <u--image v-if="item.anonymityFalg==1 " :showLoading="true"
- src="https://youzhen123.oss-cn-huhehaote.aliyuncs.com/WechatOwnerProperty/images/mrtx.png" width="30px" height="30px" shape="circle"></u--image>
- <u--image v-else :showLoading="true" :src="item.customerCover" width="30px" height="30px" shape="circle"></u--image>
-
+ <u-col>
+ <view style="display: flex; justify-content: flex-start; align-items: center;padding: 5rpx;">
+ <u--image v-if="item.anonymityFalg==1 " :showLoading="true"
+ src="https://youzhen123.oss-cn-huhehaote.aliyuncs.com/WechatOwnerProperty/images/mrtx.png" width="30px" height="30px" shape="circle"></u--image>
+ <u--image v-else :showLoading="true" :src="item.customerCover" width="30px" height="30px" shape="circle"></u--image>
+ <span v-if="item.anonymityFalg==1 " >匿名用户</span>
+ <span v-else>{{item.customerName}}</span>
+ </view>
</u-col>
- <u-col span="4">
- <view v-if="item.anonymityFalg==1 " >匿名用户</view>
- <view v-else>{{item.customerName}}</view>
- </u-col>
- <u-col span="2">
- <u-rate count="5" v-model="item.commentGrade" readonly></u-rate>
- </u-col>
- <u-col span="4">
- <view style="font-size: 12px;">{{item.updateTime}}</view>
- </u-col>
+
+ <!-- <u-col span="4">
+ <view style="font-size: 12px; margin-right: 10px; text-align: right;">{{item.updateTime}}</view>
+ </u-col> -->
</u-row>
- <u-row justify="space-between" >
+ <u-row justify="space-between" class="flower-comment">
<u-col span="2"></u-col>
<u-col span="10">
+ <view class="rate">
+ <u-rate count="5" v-model="item.commentGrade" readonly size="30"></u-rate>
+ <view style="font-size: 12px; margin-right: 10px; text-align: right;">{{item.updateTime}}</view>
+ </view>
<view>
- <span style="color:#3E9FFB;border: 1px solid #3E9FFB; padding:2px 2px ;font-size: 12px;">
- {{item.flowerName}}({{item.flowerColor}}){{item.flowerLevel}}
- </span>
- {{item.comment}}
- <view class="flex" >
- <u--image v-for="(commentImg,index2) of item.commentImagesList" :key="index2" style="margin:10px;"
- :showLoading="true" :src="commentImg"></u--image>
+ <view>
+ <span class="flower-unit" >{{item.flowerName}} {{item.flowerLevel}}</span>
+ <span class="comment">
+ {{item.comment}}
+ </span>
+ </view>
+ <view class="img-v" >
+ <!-- <u--image v-for="(commentImg,index2) of item.commentImagesList" :key="index2" class="comment-img"
+ :showLoading="true" :src="commentImg"></u--image> -->
+
+ <image v-for="(commentImg,index2) of item.commentImagesList" :key="index2" :src="commentImg" class="comment-img" @click="previewImg(commentImg)"></image>
</view>
</view>
@@ -516,15 +521,19 @@
this.commentList[existingCommentIndex] = {
...this.commentList[existingCommentIndex],
...item,
- commentImagesList
+ commentImagesList,
+ updateTime: item.updateTime ? this.formatUpdateTime(item.updateTime) : null
};
} else {
// 新增评论
this.commentList.push({
...item,
- commentImagesList
+ commentImagesList,
+ updateTime: item.updateTime ? this.formatUpdateTime(item.updateTime) : null
});
}
+ console.log("评论列表：")
+ console.log(this.commentList)
});
}
@@ -532,6 +541,20 @@
this.$message.hideLoading()
}
+ },
+ formatUpdateTime(time) {
+
+ if (!time) return ''; // 如果时间为空，直接返回空字符串
+ const date = new Date(time);
+
+ // 格式化为 "YYYY-MM-DD HH:mm" 形式
+ const year = date.getFullYear();
+ const month = (date.getMonth() + 1).toString().padStart(2, '0');
+ const day = date.getDate().toString().padStart(2, '0');
+ const hours = date.getHours().toString().padStart(2, '0');
+ const minutes = date.getMinutes().toString().padStart(2, '0');
+
+ return `${year}-${month}-${day} ${hours}:${minutes}`;
},
getList_after() {
@@ -938,6 +961,33 @@
}
}
+ .flower-comment{
+ padding:10px;
+ line-height: 1.5;
+
+ .comment{
+ margin: 10px;
+ font-size: 12rpx;
+ }
+
+ }
+
+ .rate{
+ display: flex;
+ justify-content: space-between;
+ margin:10px 10px 10px 0px;
+ }
+
+ .img-v{
+ margin:10px;
+ display: flex;
+ flex-wrap: wrap;
+ .comment-img{
+ margin:10px;
+ width:80px;;
+ height:80px;
+ }
+ }
.comment-replay{
background-color: #F6F6F6;
@@ -945,5 +995,15 @@
margin-top:10rpx;
padding: 10rpx;
}
+
+ .flower-unit{
+ color:#3E9FFB;
+ border: 1rpx solid #3E9FFB;
+ margin:10px;
+ margin-left:0px;
+ padding-left: 5rpx;
+ padding-right: 5rpx;
+ // font-size: 12px;
+ }
}
</style>
\ No newline at end of file
--
Gitblit v1.9.3