jiazhipeng
12 months ago
6 changed files with 376 additions and 4 deletions
@ -0,0 +1,181 @@ |
|||
<template> |
|||
<!-- 更多好物 --> |
|||
<view class="comment-box" id="comment"> |
|||
<view class="comment-title flex-between"> |
|||
<view>更多好物</view> |
|||
<view class="comment-num" ></view> |
|||
</view> |
|||
<view class="comment-container" v-if="list.length>0"> |
|||
<view class="item" v-for="item in list" :key="item.goods.id" @click="gotoDetail(item)"> |
|||
<image class="item-img" :src="showImg(item.goods.image)" mode=""></image> |
|||
<view class="content"> |
|||
<view class="title text-overflowRows">{{item.goods.title}}</view> |
|||
<view class="bottom"> |
|||
<view class="price"> |
|||
{{item.goods.money/100}} |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="empty-box" v-else> |
|||
<view>暂无更多推荐</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
props:['goodsId'], |
|||
data() { |
|||
return { |
|||
list: [], |
|||
|
|||
} |
|||
}, |
|||
mounted () { |
|||
console.log(1,this.goodsId) |
|||
this.getList() |
|||
}, |
|||
methods: { |
|||
getList(){ |
|||
this.list = [] |
|||
if (!this.goodsId) return |
|||
this.Post({ |
|||
tag_id: 59, |
|||
offset: this.list.length, |
|||
limit: 4, |
|||
goodsId: this.goodsId, |
|||
},'/api/tag/getGoodsByTagId').then(res => { |
|||
this.list = res.data |
|||
}) |
|||
}, |
|||
|
|||
gotoDetail(item) { |
|||
if (item.type!=='goods') { |
|||
item.search_data.genre = item.type |
|||
} |
|||
this.goDetailByType(item.search_data) |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.comment-box{ |
|||
width: 697rpx; |
|||
height: auto; |
|||
margin: 24rpx auto 0; |
|||
|
|||
.comment-title{ |
|||
height: 95rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
font-weight: bold; |
|||
font-size: 37rpx; |
|||
color: #000000; |
|||
|
|||
|
|||
.comment-num{ |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
font-size: 28rpx; |
|||
color: #515150; |
|||
} |
|||
} |
|||
|
|||
.comment-container{ |
|||
width: 100%; |
|||
display: flex; |
|||
flex-wrap: wrap; |
|||
justify-content: space-between; |
|||
|
|||
|
|||
.item { |
|||
margin-bottom: 22rpx; |
|||
width: 335rpx; |
|||
height: 497rpx; |
|||
background: #FFFFFF; |
|||
box-shadow: 0rpx 0rpx 20rpx 0rpx rgba(153,153,153,0.38); |
|||
border-radius: 13rpx; |
|||
} |
|||
|
|||
.item-img { |
|||
width: 100%; |
|||
height: 342rpx; |
|||
background: #87CD93; |
|||
border-radius: 13rpx 13rpx 0rpx 0rpx; |
|||
} |
|||
|
|||
.content { |
|||
height: 145rpx; |
|||
padding: 0 13rpx 13.33rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
justify-content: space-between; |
|||
} |
|||
|
|||
.title { |
|||
font-family: PingFang SC; |
|||
font-weight: bold; |
|||
font-size: 29rpx; |
|||
color: #000000; |
|||
width: 291rpx; |
|||
} |
|||
|
|||
.bottom { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
|
|||
.price { |
|||
font-size: 34.67rpx; |
|||
font-family: PingFangSC; |
|||
// font-weight: bold; |
|||
color: #C3282E; |
|||
} |
|||
.price::before { |
|||
content: '￥'; |
|||
font-size: 24rpx; |
|||
} |
|||
.price::after { |
|||
content: '起'; |
|||
font-size: 24rpx; |
|||
color: #999999; |
|||
font-weight: 500; |
|||
} |
|||
} |
|||
|
|||
|
|||
|
|||
.empty-box { |
|||
text-align: center; |
|||
width: 100%; |
|||
height: 200rpx; |
|||
background: #FFFFFF; |
|||
border-radius: 20rpx; |
|||
font-weight: 500; |
|||
font-size: 28rpx; |
|||
color: #000000; |
|||
line-height: 200rpx; |
|||
} |
|||
|
|||
.content-more{ |
|||
height: 98rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: flex-end; |
|||
font-size: 27rpx; |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
color: #999999; |
|||
} |
|||
} |
|||
|
|||
|
|||
|
|||
</style> |
|||
@ -0,0 +1,162 @@ |
|||
<template> |
|||
<!-- 游客点评 --> |
|||
<view class="comment-box" id="comment"> |
|||
<view class="comment-title flex-between"> |
|||
<view>用户评价</view> |
|||
<view class="comment-num" @click="viewAll()"> |
|||
共{{commentNum}}条 > |
|||
</view> |
|||
</view> |
|||
<view class="comment-container" v-if="commentList.length > 0"> |
|||
<view class="comment-item" v-for="(item,index) in commentList" :key="index"> |
|||
|
|||
<view class="flex flex-items-center"> |
|||
<img :src="item.user.avatar" class="comment-avatar"> |
|||
<view class="comment-name text-overflow">{{item.user.nickname}}</view> |
|||
</view> |
|||
|
|||
<view class="comment-content text-overflowRows"> |
|||
{{ item.content }} |
|||
</view> |
|||
|
|||
</view> |
|||
</view> |
|||
<view class="empty-box" v-else> |
|||
<view>这里空空如也，快去点评吧!</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
props:['goodsId'], |
|||
data() { |
|||
return { |
|||
commentList: [], |
|||
commentNum: 0 |
|||
} |
|||
}, |
|||
mounted () { |
|||
this.getComment() |
|||
}, |
|||
methods: { |
|||
getComment() { |
|||
this.commentList = [] |
|||
this.commentNum = 0 |
|||
if (!this.goodsId) return |
|||
this.Post({ |
|||
goods_id: this.goodsId, |
|||
offset: 0, |
|||
limit: 2 |
|||
}, '/api/scenic/getGoodsCommentByScenicId').then(res => { |
|||
this.commentList = res.data |
|||
this.commentNum = res.msg |
|||
}) |
|||
}, |
|||
viewAll () { |
|||
uni.navigateTo({ |
|||
url:'/subPackages/eventCalendar/detail?id='+this.id |
|||
}) |
|||
}, |
|||
|
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.comment-box{ |
|||
width: 697rpx; |
|||
height: auto; |
|||
margin: 24rpx auto 0; |
|||
|
|||
.comment-title{ |
|||
height: 95rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
font-weight: bold; |
|||
font-size: 37rpx; |
|||
color: #000000; |
|||
|
|||
|
|||
.comment-num{ |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
font-size: 28rpx; |
|||
color: #515150; |
|||
} |
|||
} |
|||
|
|||
.comment-container{ |
|||
width: 100%; |
|||
background: #FFFFFF; |
|||
border-radius: 20rpx; |
|||
padding: 0 29rpx; |
|||
} |
|||
|
|||
.comment-item{ |
|||
padding: 27rpx 0; |
|||
border-bottom: 1rpx solid #D8D8D8; |
|||
|
|||
.comment-avatar{ |
|||
width: 53rpx; |
|||
height: 53rpx; |
|||
background: #999999; |
|||
border-radius: 50%; |
|||
margin-right: 20rpx; |
|||
flex-shrink: 0; |
|||
} |
|||
|
|||
.comment-name{ |
|||
font-weight: bold; |
|||
font-size: 28rpx; |
|||
color: #000000; |
|||
} |
|||
|
|||
.comment-time { |
|||
font-family: PingFangSC; |
|||
font-weight: 400; |
|||
font-size: 24rpx; |
|||
color: #999999; |
|||
} |
|||
|
|||
.comment-content{ |
|||
margin-top: 24rpx; |
|||
font-size: 28rpx; |
|||
font-weight: 500; |
|||
color: #000000; |
|||
} |
|||
} |
|||
.comment-item:last-of-type{ |
|||
border: none; |
|||
} |
|||
|
|||
.empty-box { |
|||
text-align: center; |
|||
width: 100%; |
|||
height: 200rpx; |
|||
background: #FFFFFF; |
|||
border-radius: 20rpx; |
|||
font-weight: 500; |
|||
font-size: 28rpx; |
|||
color: #000000; |
|||
line-height: 200rpx; |
|||
} |
|||
|
|||
.content-more{ |
|||
height: 98rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: flex-end; |
|||
font-size: 27rpx; |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
color: #999999; |
|||
} |
|||
} |
|||
|
|||
|
|||
|
|||
</style> |
|||
Loading…
Reference in new issue