From 85b6ac8c6f0bbb16d6fbdf830489ef64ef8d7201 Mon Sep 17 00:00:00 2001
From: tianyi <13521030702@163.com>
Date: Thu, 30 Jul 2026 11:48:46 +0800
Subject: [PATCH] 1
---
pages/shop/shopEvaluate.vue | 644 +++++++++++++++++++++++++-----------
1 file changed, 458 insertions(+), 186 deletions(-)
diff --git a/pages/shop/shopEvaluate.vue b/pages/shop/shopEvaluate.vue
index 77a7d92..63e52ae 100644
--- a/pages/shop/shopEvaluate.vue
+++ b/pages/shop/shopEvaluate.vue
@@ -1,42 +1,47 @@
-
-
-
-
-
-
- 商家评价
+
+
+
+
+
+
+
+ {{isMerchant == 2 ? '配送评价' : '商家评价'}}
+
-
-
{{shopItem.shopScore}}
-
-
+
+ 综合评分
+
+
+
-
+
@@ -127,7 +146,6 @@
replyText:'',
isMerchant:0,
replyPicture:"",
- isExpanded: false,
isPintuan: true,
bigImg: '',
shopItem:{},
@@ -146,7 +164,7 @@
num: "",
checked: true
}, {
- name: '有图/视频',
+ name: '有图',
num: '',
checked: false
}, {
@@ -161,7 +179,13 @@
},
filters:{
formatTime(value) {
+ if (!value) return '';
+ const timeText = String(value).replace('T', ' ');
+ if (/^\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}/.test(timeText)) {
+ return timeText.slice(0, 19);
+ }
const date = new Date(value);
+ if (isNaN(date.getTime())) return '';
// 获取年份
const year = date.getFullYear();
@@ -187,7 +211,17 @@
},
onLoad(option) {
this.isMerchant = option.isMerchant
- this.shopItem = JSON.parse(option.item)
+ if (option.item) {
+ try {
+ this.shopItem = JSON.parse(decodeURIComponent(option.item))
+ } catch (e) {
+ try {
+ this.shopItem = JSON.parse(option.item)
+ } catch (e2) {
+ this.shopItem = {}
+ }
+ }
+ }
if(option.isCha == 1){ //待回复差评进来的
this.searchForm.score = 1
this.searchForm.hasAnswer= 0
@@ -203,7 +237,7 @@
getshopComments(id){
let that = this
this.searchForm.shopId = id
- that.NB.sendRequest("/app/comment/getCommentList", this.searchForm, false, 'post', 'application/json').then((res) => {
+ this.NB.sendRequest("/app/comment/getCommentList", this.searchForm, false, 'post', 'application/json').then((res) => {
if (res.code == 200) {
if (that.searchForm.pageNum == 1) {
that.shopComments = res.result.records
@@ -212,10 +246,12 @@
}
for(let i=0;i 0){
- for(let m=0;m {})
+ })
},
onReachPage(){
if (this.searchForm.pageNum >= this.total) return;
@@ -246,13 +282,13 @@
remark:this.replyText,
picture:this.replyPicture,
createBy:this.shopComments[v].shopId,
- createByName:'商家',
+ createByName:this.isMerchant == 1?'商家':'配送员',
createByIcon:'https://ooo.0o0.ooo/2019/04/28/5cc5a71a6e3b6.png',
orderId:this.shopComments[v].orderId,
shopId:this.shopComments[v].shopId,
}]
- that.NB.sendRequest("/app/comment/save", data, false, 'post', 'application/json').then((res) => {
+ this.NB.sendRequest("/app/comment/save", data, false, 'post', 'application/json').then((res) => {
if (res.code == 200) {
uni.showToast({
title: "评论成功",
@@ -264,20 +300,20 @@
} else {
uni.showToast({
title: res.message,
- icon:'none'
- });
+ icon: 'none'
+ })
}
- uni.hideLoading()
- }).catch((res) => {})
- },
- toggleReply(i,m) {
- this.shopComments[i].comments[m].isOpen = !this.shopComments[i].comments[m].isOpen;
- this.$forceUpdate()
+ uni.hideLoading();
+ })
},
changeStatus(v){
this.shopComments[v].isReply = !this.shopComments[v].isReply
this.$forceUpdate()
},
+ toggleCommentFold(v){
+ this.shopComments[v].isCommentFold = !this.shopComments[v].isCommentFold
+ this.$forceUpdate()
+ },
checkTab(index) {
for (let i = 0; i < this.menuList.length; i++) {
if (i == index) {
@@ -287,6 +323,7 @@
}
}
if(index == 0){
+ this.searchAll = true
this.searchForm.picture = 0
this.searchForm.score = 0
}else if(index ==1){
@@ -324,7 +361,7 @@
let that = this;
let hiver_token = uni.getStorageSync("hiver_token")
await uni.uploadFile({
- url: getApp().globalData.mainurl + '/upload/file',
+ url: that.tui.interfaceUrl() + '/upload/file',
filePath: path,
name: 'file',
header: {
@@ -352,9 +389,18 @@
}, 1000)
},
//查看大图
- largeImg(img) {
- this.bigImg = 'https://jewel-shop.oss-cn-beijing.aliyuncs.com/00b1f011787c4549bbea650d95a4eb39.png'
- this.$refs.imgPopup.open()
+ getPictureList(picture) {
+ if (!picture) return []
+ if (Array.isArray(picture)) return picture.filter(Boolean)
+ return String(picture).split(',').map(item => item.trim()).filter(Boolean)
+ },
+ largeImg(picture, currentIndex = 0) {
+ const urls = this.getPictureList(picture)
+ if (!urls.length) return
+ uni.previewImage({
+ urls,
+ current: urls[currentIndex] || urls[0]
+ })
},
back() {
uni.navigateBack()
@@ -368,245 +414,471 @@
width: 100%;
height: 100%;
font-size: 24rpx;
- background: #F5F8F5;
+ background: #F7F8FA;
color: #00231C;
}
.page1 {
width: 100%;
- height: 100%;
+ min-height: 100vh;
font-size: 24rpx;
position: relative;
+ background: linear-gradient(180deg, #F2FFF8 0%, #F7F8FA 360rpx, #F7F8FA 100%);
+ }
+
+ .evaluate-fixed {
+ position: fixed;
+ top: 0;
+ left: 0;
+ right: 0;
+ z-index: 1000;
+ background: linear-gradient(180deg, #EEFFF6 0%, #F7F8FA 100%);
+ box-shadow: 0 12rpx 28rpx rgba(0, 35, 28, 0.05);
+ }
+
+ .evaluate-fixed-holder {
+ height: 470rpx;
}
.title {
- background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/8bc15960c2dc40268e295d6dd23aecce.png') no-repeat;
width: 100%;
- height: 54%;
+ height: 210rpx;
+ background:
+ radial-gradient(circle at 16% 20%, rgba(115, 255, 199, 0.35) 0, rgba(115, 255, 199, 0) 210rpx),
+ linear-gradient(135deg, #F3FFF7 0%, #EAFFF4 48%, #FFF8EC 100%);
}
.title-sreach {
width: 100%;
display: flex;
- height: 200rpx;
+ height: 210rpx;
position: relative;
}
.back-btn {
- padding-top: 110rpx;
+ margin: 110rpx 0 0 30rpx;
+ width: 64rpx;
+ height: 64rpx;
+ border-radius: 50%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ background: rgba(255, 255, 255, 0.78);
+ box-shadow: 0 10rpx 24rpx rgba(0, 35, 28, 0.08);
}
.title-name {
padding-top: 110rpx;
- font-size: 36rpx;
+ font-size: 34rpx;
font-weight: 700;
flex: 1;
text-align: center;
+ line-height: 64rpx;
+ letter-spacing: 2rpx;
}
.content {
- position: absolute;
- top: 200rpx;
- width: 95%;
- margin-left: 2.5%;
+ width: 100%;
+ height: calc(100vh - 470rpx);
+ box-sizing: border-box;
+ padding: 0 24rpx;
+ }
+
+ .comment-scroll {
+ width: 100%;
+ height: 100%;
+ box-sizing: border-box;
+ padding-bottom: 36rpx;
+ margin-top:20rpx;
+ }
+
+ .comment-item {
+ padding: 28rpx;
+ margin-bottom: 22rpx;
+ border-radius: 28rpx;
+ background: #FFFFFF;
+ box-shadow: 0 16rpx 40rpx rgba(0, 35, 28, 0.06);
+ }
+
+ .evaluate-fixed .shop-rate,
+ .evaluate-fixed .menu-list {
+ width: calc(100% - 48rpx);
+ margin-left: 24rpx;
}
.shop-rate {
display: flex;
- padding-bottom: 30rpx;
+ margin-top: 4rpx;
+ padding: 28rpx 30rpx;
+ box-sizing: border-box;
+ border-radius: 30rpx;
+ background: #FFFFFF;
+ box-shadow: 0 16rpx 40rpx rgba(255, 132, 34, 0.12);
}
.rate-left {
display: flex;
+ align-items: center;
flex: 1;
}
.rate-num {
- font-size: 86rpx;
+ font-size: 88rpx;
+ line-height: 94rpx;
font-weight: 700;
background: linear-gradient(90deg, rgba(255, 77, 0, 1), rgba(255, 184, 84, 1));
+ -webkit-background-clip: text;
background-clip: text;
color: transparent;
}
- .rate-right {
- display: flex;
- width: 160rpx;
- height: 100rpx;
- line-height: 40rpx;
- font-size: 36rpx;
- text-align: center;
- font-weight: 700;
- border-left: 1px solid #eee;
+ .rate-info {
+ margin-left: 24rpx;
}
- .rate-star {
- height: 100rpx;
- padding: 32rpx 20rpx;
+ .rate-label {
+ margin-bottom: 12rpx;
+ font-size: 24rpx;
+ color: #7A8782;
+ font-weight: 700;
}
- .right1 {
- margin: 20rpx 0 0 5%;
- width: 45%;
+ .rate-star {
+ line-height: 36rpx;
}
.menu-list {
- height: 100rpx;
- width: 100%;
+ height: 110rpx;
display: flex;
+ align-items: center;
+ overflow-x: auto;
overflow-y: hidden;
- padding-top: 30rpx;
- border-top: 1px solid #eee;
}
- .checked-img {
- width: 100%;
- height: 20rpx;
- position: absolute;
- bottom: 0;
- left: 0;
+ .menu1 {
+ min-width: 176rpx;
+ height: 64rpx;
+ margin-right: 18rpx;
+ line-height: 64rpx;
+ border-radius: 999rpx;
+ text-align: center;
+ font-size: 28rpx;
+ color: #6D7874;
+ background: rgba(255, 255, 255, 0.78);
+ box-shadow: inset 0 0 0 1rpx rgba(0, 35, 28, 0.06);
+ flex-shrink: 0;
}
- .menu1 {
- width: 180rpx;
- height: 70rpx;
- position: relative;
- margin-right: 20rpx;
- line-height: 70rpx;
- flex: 1;
+ .menu1-active {
+ color: #00231C;
+ font-weight: 700;
+ background: linear-gradient(135deg, #B5FFDD 0%, #FDF4B9 100%);
+ box-shadow: 0 10rpx 24rpx rgba(0, 180, 126, 0.14);
+ }
+
+ .menu-text {
+ padding: 0 24rpx;
}
.eval-title {
width: 100%;
- height: 80rpx;
display: flex;
+ align-items: center;
}
.eval-icon {
- height: 80rpx;
- width: 80rpx;
+ height: 82rpx;
+ width: 82rpx;
+ border-radius: 50%;
+ overflow: hidden;
+ flex-shrink: 0;
+ background: #EAF5EF;
+ box-shadow: 0 8rpx 18rpx rgba(0, 35, 28, 0.08);
image {
width: 100%;
height: 100%;
- background-size: 100%;
+ display: block;
}
}
.eval-name {
+ min-width: 0;
margin-left: 20rpx;
}
.name1 {
font-size: 28rpx;
- line-height: 50rpx;
+ line-height: 42rpx;
font-weight: 700;
+ color: #142D26;
}
- .eval-rate {
+ .eval-time {
+ margin-top: 4rpx;
+ font-size: 22rpx;
+ line-height: 32rpx;
+ color: #87918E;
+ }
+
+ .eval-rate-row {
display: flex;
- margin: 20rpx 0 0 100rpx;
- height: 48rpx;
- line-height: 40rpx;
+ align-items: center;
+ margin-top: 22rpx;
}
.eval-content {
- margin-left: 100rpx;
+ margin-left: 102rpx;
font-size: 28rpx;
+ color: #5C6662;
+ line-height: 46rpx;
+ }
+
+ .eval-text {
+ margin-top: 12rpx;
+ color: #4E5A56;
+ word-break: break-all;
+ }
+
+ .goods-list {
+ margin: 4rpx 0 16rpx;
+ }
+
+ .goods-card {
+ display: flex;
+ padding: 16rpx;
+ margin-bottom: 12rpx;
+ background: #F7F8FA;
+ border-radius: 16rpx;
+ }
+
+ .goods-img {
+ width: 104rpx;
+ height: 104rpx;
+ border-radius: 12rpx;
+ background: #eef1ee;
+ flex-shrink: 0;
+ }
+
+ .goods-info {
+ flex: 1;
+ min-width: 0;
+ margin-left: 16rpx;
+ line-height: 36rpx;
+ }
+
+ .goods-name {
+ font-size: 26rpx;
+ font-weight: 700;
+ color: #00231C;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+
+ .goods-spec {
+ margin-top: 6rpx;
+ font-size: 22rpx;
+ color: #999;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+
+ .goods-bottom {
+ display: flex;
+ justify-content: space-between;
+ margin-top: 8rpx;
+ font-size: 24rpx;
color: #777;
- line-height: 48rpx;
}
.eval-img {
display: flex;
width: 100%;
- overflow-x: scroll;
- margin-top: 20rpx;
+ flex-wrap: wrap;
+ margin-top: 22rpx;
+ gap: 16rpx;
image {
- width: 100rpx;
- height: 100rpx;
- background-size: 100%;
- margin-right: 20rpx;
+ width: 150rpx;
+ height: 150rpx;
+ border-radius: 18rpx;
+ background: #EEF1EE;
}
}
- /* 卡片整体样式（可根据需要调整外间距） */
.reply-card {
- border-radius: 12rpx;
- background-color: #eee;
+ border-radius: 20rpx;
+ background-color: #F8FAF9;
width: 100%;
box-sizing: border-box;
- margin-top:20rpx;
+ margin-top: 20rpx;
+ padding: 18rpx 20rpx;
+ border: 1rpx solid rgba(0, 35, 28, 0.06);
}
- /* 标题行：左标签 + 右按钮 */
- .reply-header {
- display: flex;
- justify-content: space-between;
- align-items: center;
- margin-bottom: 16rpx;
+ .reply-title {
+ position: relative;
+ padding-left: 18rpx;
+ margin-bottom: 10rpx;
+ font-size: 24rpx;
+ line-height: 34rpx;
+ color: #17352D;
+ font-weight: 700;
}
- .reply-label {
- font-size: 28rpx;
- font-weight: 500;
- color: #333;
+ .reply-title::before {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 8rpx;
+ width: 6rpx;
+ height: 18rpx;
+ border-radius: 999rpx;
+ background: #20D38B;
}
- .reply-expand-btn {
- font-size: 24rpx;
- padding: 4rpx 12rpx;
+ .reply-list {
+ display: flex;
+ flex-direction: column;
}
- /* 回复内容基础样式 */
.reply-content {
+ position: relative;
font-size: 26rpx;
- color: #555;
- padding: 12rpx;
- transition: all 1s;
- height: 70rpx;
+ color: #5A6460;
+ padding: 14rpx 0;
flex: 1;
+ display: block;
+ height: auto;
+ overflow: visible;
+ line-height: 42rpx;
}
- /* 折叠状态：单行省略 */
- .reply-content.collapsed {
- display: -webkit-box;
- -webkit-line-clamp: 1;
- -webkit-box-orient: vertical;
- overflow: hidden;
- text-overflow: ellipsis;
+ .reply-content + .reply-content {
+ border-top: 1rpx solid rgba(0, 35, 28, 0.06);
}
- /* 展开状态：固定高度100px，可滚动 */
- .reply-content.expanded {
- display: block;
- height: auto;
- /* 固定高度100px */
- overflow-y: auto;
- /* 内容超长时滚动 */
- /* 重置折叠相关属性 */
- -webkit-line-clamp: unset;
- -webkit-box-orient: unset;
- text-overflow: clip;
- padding-bottom: 10px;
+ .reply-name {
+ color: #17352D;
+ font-weight: 700;
}
- /* 滚动条美化（可选） */
- .reply-content.expanded::-webkit-scrollbar {
- width: 12rpx;
+ .reply-time {
+ margin-top: 4rpx;
+ font-size: 22rpx;
+ line-height: 32rpx;
+ color: #99A19E;
}
- .reply-content.expanded::-webkit-scrollbar-thumb {
- background-color: #ccc;
- border-radius: 20rpx;
+ .reply-operate {
+ margin-top: 18rpx;
+ }
+
+ .reply-action {
+ text-align: right;
+ color: #00AEEF;
+ font-size: 26rpx;
+ font-weight: 700;
+ padding: 10rpx 0;
}
- .eval-num{
- padding-bottom: 30rpx;
- border-bottom: 1px solid #eee;
+
+ .reply-editor-box {
+ margin-top: 12rpx;
+ border-radius: 22rpx;
+ border: 1rpx solid rgba(0, 35, 28, 0.08);
+ background: #FAFBFA;
+ overflow: hidden;
+ }
+
+ .eval-num {
+ border-bottom: 1rpx solid rgba(0, 35, 28, 0.06);
+ }
+
+ .reply-textarea {
+ width: 100%;
+ height: 200rpx;
+ box-sizing: border-box;
+ padding: 26rpx;
+ font-size: 28rpx;
+ line-height: 42rpx;
+ color: #243832;
+ }
+
+ .reply-upload-row {
+ display: flex;
+ padding: 22rpx 26rpx;
}
+
.upload-img {
width: 160rpx;
height: 160rpx;
+ border-radius: 18rpx;
+ display: block;
+ }
+
+ .upload-add {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ background: #F0F3F2;
+ border: 1rpx dashed #C8D2CE;
+ }
+
+ .reply-preview-list {
+ flex: 1;
+ display: flex;
+ }
+
+ .reply-preview {
+ width: 160rpx;
+ height: 160rpx;
+ margin-left: 20rpx;
+ }
+
+ .reply-img {
+ margin-top: 16rpx;
+ }
+
+ .reply-fold {
+ margin-top: 8rpx;
+ padding-top: 12rpx;
+ border-top: 1rpx solid rgba(0, 35, 28, 0.06);
+ font-size: 24rpx;
+ line-height: 34rpx;
+ color: #00AEEF;
+ font-weight: 700;
+ text-align: right;
+ }
+
+ .reply-buttons {
+ display: flex;
+ flex-direction: row-reverse;
+ align-items: center;
+ margin-top: 18rpx;
+ }
+
+ .reply-confirm,
+ .reply-cancel {
+ min-width: 108rpx;
+ height: 58rpx;
+ line-height: 58rpx;
+ border-radius: 999rpx;
+ text-align: center;
+ font-size: 26rpx;
+ }
+
+ .reply-confirm {
+ margin-left: 18rpx;
+ color: #FFFFFF;
+ font-weight: 700;
+ background: linear-gradient(135deg, #20D38B 0%, #00BFFF 100%);
+ box-shadow: 0 10rpx 22rpx rgba(0, 191, 255, 0.18);
+ }
+
+ .reply-cancel {
+ color: #7A8782;
+ background: #F1F3F2;
}
-
\ No newline at end of file
+