引入日历前

pages/peanut/myComments.vue

@@ -10,7 +10,19 @@
 						<text class="username nowrap ">{{item.name}}</text>
 					</view> -->
 					<view class="contentBox">
-						<view class="content">{{ item.content }}<br/></view>
+						<view class="mb30">
+							<span :class="['star',item.starlevel >= 1 ? 'starLight':'starGray']"></span>
+							<span :class="['star',item.starlevel >= 2 ? 'starLight':'starGray']"></span>
+							<span :class="['star',item.starlevel >= 3 ? 'starLight':'starGray']"></span>								
+							<span :class="['star',item.starlevel >= 4 ? 'starLight':'starGray']"></span>								
+							<span :class="['star',item.starlevel >= 5 ? 'starLight':'starGray']"></span>
+						</view>
+						<div class="pjimgs flexbox">
+							<view class="item" v-for="(item1,index) in item.images">
+								<image v-if="item1.length > 10" @click="previewImage(item1)"  :src="item1" mode="aspectFill" style="width:100%; height: 50px;"></image>
+							</view>								
+						</div>
+						<view class="content" v-html="item.phtml"></view>
 						<text class="time">订单编号：{{ item.orderSn }}</text>
 						<text class="time">发布时间：{{ item.createDate }}</text>
 					</view>
@@ -22,10 +34,13 @@
 			</view>
 		</view>
 		<z-navigation></z-navigation>
+		<music-play :playData="playData"></music-play>
 	</view>
 </template>
 
 <script>
+	import musicPlay from '@/components/music.vue'
+	import emojiList1 from '../../bkhumor-emojiplus/emoji/biaoqin.js'
 	import $http from '@/config/requestConfig.js';
 	import {
 		mapState
@@ -33,6 +48,7 @@
 	export default {
 		data() {
 			return {
+				playData:{},
 				commentsList:[]
 			}
 		},
@@ -42,7 +58,33 @@
 		computed:{
 			...mapState(['userInfo']),
 		},
+		components:{
+			musicPlay	
+		},
 		methods: {
+			// 获取html格式的评论1
+			getHtmlComment(comment){				
+				 // 格式化html
+					// console.log(comment,'comment')
+				         // 这里处理 链接   换行符
+				         let replacedStr = comment.replace(/\[([^(\]|\[)]*)\]/g, (item, index) => {
+							// console.log(item, index)
+							 var indexss = emojiList1.findIndex(item1 => item1.alt === item)
+							 // console.log(indexss, 'indexss')
+				           return '<img src="https://www.nuttyreading.com/emojis/emojis/qq/' + emojiList1[indexss].url + '" width="18rpx">';
+				         });
+						// console.log(replacedStr,'replacedStr')
+				         return replacedStr.replace(/(\r\n)|(\n)/g, '<br>');
+				       
+						
+			},
+			// 放大图片
+			previewImage(url){
+				console.log(url)
+				uni.previewImage({
+					urls: [url]
+				});
+			},
 			// 获取评价列表
 			getComments(){				
 					$http.request({
@@ -58,7 +100,29 @@
 					.then(res => {
 						console.log(res,'评价')
 						if(res.code == 0){
-							this.commentsList = res.Allevaluations
+							this.commentsList = res.Allevaluations.map(item => {
+								var imgList = []
+								if(item.images !== null){
+									imgList = item.images.split(',')
+									item.images = imgList
+									return item
+								}else {
+									return item
+								}								
+							})
+							
+							var newarr = []
+							this.commentsList.forEach((item1)=>{	
+								   var pjstr = ''
+									pjstr = this.getHtmlComment(item1.content)
+									//console.log(pjstr,'99999999999----------')
+									 item1.phtml = pjstr
+									// console.log(item1.phtml,'item1.phtml')
+									 newarr.push(item1)
+							
+							})
+							this.commentsList = newarr
+							// this.commentsList = res.Allevaluations
 						}
 					})
 			},
@@ -67,6 +131,15 @@
 </script>
 
 <style lang="scss" scoped>
+	.pjimgs{ margin: 10px 0;flex-wrap: wrap; display: flex; justify-content: space-between;
+		.item{width: 23%;  margin-right: 10px; 
+		image{ }
+		}
+		
+	}
+	.star{display: inline-block; width: 20px; height: 20px;  margin-right: 10rpx;}
+	.starGray{ background : url(../../static/icon/star_greey.png) no-repeat; background-size: contain; }
+	.starLight{ background : url(../../static/icon/star_light.png) no-repeat;  background-size: contain;}
 	.quesheng{text-align: center; margin-top: 100rpx; color: #8b8a91;}
 	.container{margin-top: 10rpx; background-color: #fff; padding:20rpx; border-top:#f1f1f1 1px solid ;}