Files

108 lines
2.0 KiB
Vue
Raw Normal View History

2023-10-11 11:27:47 +08:00
<template>
<view :class="{
reply: true,
noPic: !data?.pics
}">
<view class="reply-content">
<view class="reply-user">
<view class="reply-user-pic">
<image
class="img"
src="http://yshop.l1.ttut.cc/admin-api/infra/file/4/get/7599202df273d25f1ce3aeba21165a544849248fda23aad090098d7be0c063c9.jpeg"
/>
<!-- <image :src="data.avatar" /> -->
</view>
<view class="reply-user-name">
<view class="name">
<!-- {{ data.nickname }} -->
我的名字
</view>
<view class="productScore">
<uv-rate
count="5"
:value="data.productScore"
readonly
size="12"
gutter="1"
active-color="#ee6d46"
inactive-color="#999999"
></uv-rate>
</view>
</view>
</view>
<view class="reply-text">
{{ data.comment }}
</view>
</view>
<view
class="reply-pic"
v-if="data?.pics"
>
<uv-album
:urls="data?.pics"
space="8rpx"
></uv-album>
</view>
</view>
</template>
<script setup>
import { ref } from 'vue';
const props = defineProps(['data'])
const data = ref(props.data)
</script>
<style lang="less">
.reply {
margin-top: 20rpx;
&.noPic {
.reply-content {}
}
&-pic {
width: 180rpx;
height: 180rpx;
background: #FFFFFF;
border-radius: 15rpx;
}
&-user {
display: flex;
align-items: center;
margin-bottom: 16rpx;
&-pic {
width: 60rpx;
height: 60rpx;
border-radius: 50%;
margin-right: 10rpx;
.img {
width: 60rpx;
height: 60rpx;
display: block;
border-radius: 50%;
}
}
&-name {
margin-left: 6rpx;
line-height: 33rpx;
font-size: 24rpx;
color: #333333;
}
}
&-content {
border-right: 0;
flex: 1;
font-size: 30rpx;
color: #333333;
}
}
</style>