有评价时提示

components/BsCommentInfo.vue

@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2022-06-24 11:43:04
  * @LastEditors: ch
- * @LastEditTime: 2022-06-29 18:41:01
+ * @LastEditTime: 2022-06-29 19:22:24
  * @Description: file content
 -->
 <template>
@@ -17,7 +17,8 @@
 			<span>{{commentDetail.skuName}}</span>
 		</div>
 		<main>
-			<BsCommentSubmit v-if="!commentDetail.id" :commentDetail="commentDetail" @submit="handleSubmit"/>
+			<BsCommentSubmit v-if="!commentDetail.id" :commentDetail="commentDetail" @submit="handleSubmit" 
+				@editStatusChange="editStatusChange"/>
 			<template v-else>
 				<div class="top">
 					<el-rate :value="commentDetail.commentScore" disabled/>
@@ -31,8 +32,9 @@
 				<!-- 追评 -->
 				<UiButton class="follow-btn" type="yellow_line" radius="4px"
 					v-if="isCanFollowComment && !showFollowForm" @click="showFollowForm = true">发起追评</UiButton>
+				
 				<BsCommentSubmit v-if="showFollowForm && !followComment" :type="COMMENT.TYPE.FOLLOW_COMMENT" 
-					:commentDetail="commentDetail" @submit="handleSubmitFollow"/>
+					:commentDetail="commentDetail" @submit="handleSubmitFollow" @editStatusChange="editStatusChange"/>
 					
 				<BsCommentFollowInfo v-if="followComment" 
 					:followComment="followComment" :commentTime="commentDetail.commentTime"/>
@@ -41,7 +43,7 @@
 				<div class="operation">
 					<div>
 						<span class="operation--chat" @click="answerVisible = !answerVisible">
-							<template v-if="commentDetail.replyCount">{{commentDetail.replyCount}}条</template>评论
+							<template v-if="replyCount">{{replyCount}}条</template>评论
 						</span>
 						<span class="operation--show" v-if="answerCommentList.length" @click="answerVisible = !answerVisible">
 							{{answerVisible ? '收起' : '展开'}}
@@ -52,7 +54,7 @@
 
 				<!-- 评论内容 -->
 				<div class="answer" v-if="showAnswerBox">
-					<b class="answer--title">全部评论({{commentDetail.replyCount}})</b>
+					<b class="answer--title">全部评论({{replyCount}})</b>
 					<ul>
 						<li class="answer--item" v-if="commentDetail.merchantComment">
 							<div class="answer--name"><b>{{commentDetail.merchantComment.userName}}：</b><span>{{commentDetail.merchantComment.createTime}}</span></div>
@@ -118,6 +120,7 @@ export default {
 			answer : null,
 			isLike : false,
 			usefulCount : 0,
+			replyCount : this.commentDetail.replyCount,
 			showFollowForm : this.isFollowForm,
 			followComment : this.commentDetail.followComment || null
 
@@ -146,6 +149,7 @@ export default {
 	watch:{
 		commentDetail(){
 			this.followComment = this.commentDetail.followComment;
+			this.replyCount = this.commentDetail.replyCount || 0;
 			this.answerCommentList = this.commentDetail.answerCommentList || [];
 			this.isLike = this.commentDetail.isLike;
 			this.usefulCount = this.commentDetail.usefulCount;
@@ -201,6 +205,7 @@ export default {
 				parentName: this.answer ? this.answer.userName : ''
 			});
 			this.answerContent = '';
+			this.replyCount++;
 			this.$message.success('评论成功!');
 		},
 		/**
@@ -231,6 +236,12 @@ export default {
 			});
 			this.commentDetail.isLike = this.isLike;
 			
+		},
+		/**
+		 * 动态监听是否有输入内容的评价或追评
+		 */
+		editStatusChange(val){
+			this.$emit('editStatusChange', val)
 		}
 	}
 }

components/BsCommentSubmit.vue

@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2022-06-25 15:29:43
  * @LastEditors: ch
- * @LastEditTime: 2022-06-29 18:06:08
+ * @LastEditTime: 2022-06-29 19:23:57
  * @Description: file content
 -->
 <template>
@@ -56,6 +56,9 @@ export default {
 		}
 	},
 	computed:{
+		isEdit(){
+			return (this.commentContent || this.fileList.length > 0) ? true : false
+		},
 		reteDesc(){
 			return COMMENT.RATE_LEVEL[this.rate];
 		},
@@ -70,6 +73,11 @@ export default {
 			return status;
 		}
 	},
+	watch : {
+		isEdit(val){
+			this.$emit('editStatusChange', val)
+		}
+	},
 	methods : {
 		async handleSubmit(){
 			let data = {
@@ -89,6 +97,8 @@ export default {
 				this.$message.error(error.message);
 				return false;
 			}
+			this.commentContent = '';
+			this.fileList = [];
 			this.$emit('submit',result);
 		},
 

pages/account/comment/index.vue

@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2022-06-27 11:46:34
  * @LastEditors: ch
- * @LastEditTime: 2022-06-29 11:53:25
+ * @LastEditTime: 2022-06-29 19:27:26
  * @Description: file content
 -->
 <template>
@@ -17,7 +17,7 @@
 			<UiLoading v-if="loading"></UiLoading>
 			<BsCommentInfo v-else source="comment" :isFollowForm="isFollow" v-for="(item, idx) in list" :key="idx"
 				:commentDetail="item" @submit="handleSubmitComment($event, idx)" 
-				@submitFollow="handleSubmitFollow($event, idx)"/>
+				@submitFollow="handleSubmitFollow($event, idx)" @editStatusChange="editChange($event, idx)"/>
 		</div>
 	</div>
 </template>
@@ -47,9 +47,36 @@ export default {
 		if(this.orderId){
 			this.getOrderCommentDetail();
 		}else if(this.commentId){
-			this.getCommentDetail()
+			this.getCommentDetail();
 		}
 	},
+
+	beforeRouteLeave(to, from, next) {
+		if(this.list.findIndex(i => i.isEdit) > -1){
+			this.$confirm('你正在进行商品评价，退出后评价的内容将不保存！','提示').then(()=>{
+				next()
+			}).catch(()=>{
+
+			})
+		}
+		
+		// if (to.params.status) {
+		// 	next();
+		// } else {
+		// this.$confirm("离开页面 , bom将不做保存, 请确认已经保存", "提示", {
+		// 	confirmButtonText: "确定",
+		// 	cancelButtonText: "取消",
+		// 	type: "warning",
+		// })
+		// 	.then(() => {
+		// 	this.deleteFile();//业务功能请忽略
+		// 	next();
+		// 	})
+		// 	.catch(() => {
+		// 	// alert("router")
+		// 	});
+		// }
+	},
 	methods:{
 		/**
 		 * 按订单查询评价详情
@@ -94,6 +121,10 @@ export default {
 				// this.$router.replace('/account/comment/success');
 			}
 		},
+		
+		editChange(isEdit, idx){
+			this.$set(this.list[idx], 'isEdit', isEdit);
+		},
 	}
 }
 </script>