You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
shop-app/src/pages/goods/comment/preview.vue

76 lines
1.5 KiB

<!--
* @Author: ch
* @Date: 2022-06-22 15:15:22
* @LastEditors: ch
* @LastEditTime: 2022-06-23 14:23:27
* @Description: file content
-->
<template>
<view class="preview">
<view class="preview--top">
{{current + 1}}/{{imgs.length}}
</view>
<u-swiper :list="imgs" :current="current" @change="handleChange" :autoplay="false" />
<view class="preview--footer">
<BsCommentUserInfo :userData="data"/>
<view>
<view class="top">
<u-rate count="5" size="30rpx" :value="data.commentScore" activeColor="#FFA35B" readonly inactiveColor="#DDD"></u-rate>
<text class="top--time">{{ data.createTime }}</text>
</view>
<view class="ctx">{{ data.commentContent }}</view>
</view>
</view>
</view>
</template>
<script>
import BsCommentUserInfo from '@/components/BsCommentUserInfo.vue';
export default {
components: { BsCommentUserInfo },
data (){
return {
data : this.$store.state.comment_preview,
current : Number(this.$Route.query.idx)
}
},
computed : {
imgs(){
const arr = this.data.pictureUrl || [];
return arr.split(',')
}
},
onShow(){
if(!this.data.id){
this.$Router.back();
}
},
methods:{
handleChange(idx){
this.current = idx.current
}
}
}
</script>
<style lang="scss">
page{
background: #000;
}
</style>
<style lang="scss" scoped>
.preview{
&--top{
color: #fff;
height: 44px;
padding: 0 20px;
display: flex;
justify-content: space-between;
align-items: center;
position: -webkit-sticky;
position: sticky;
top: var(--window-top);
z-index: 999;
}
}
</style>