猫妈狗爸伴宠师小程序前端代码
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.
 
 
 
 

116 lines
1.9 KiB

<template>
<!-- <div>我的评价</div> -->
<view class="box">
<view class="level">
<view class="form-title">
我的评价
</view>
<view class="text1">
3
</view>
</view>
<view class="item box-size level">
<view class="img" :style="{borderRadius:'75rpx'}">
<image src="" mode="" style="width: 132rpx;height: 132rpx;" :style="{borderRadius:'75rpx'}"></image>
</view>
<view class="vertical">
<view class="level flex-2">
<view class="name">
猫小姐
</view>
<view class="">
<up-rate :count="count" v-model="value" active-color="#FFBF60" gutter="6"></up-rate>
</view>
</view>
<view class="time">
2023-12-10 12:41:12
</view>
<view class="">
服务贴心,态度热情,非常满意。
</view>
</view>
</view>
</view>
</template>
<script setup>
import {
ref,
reactive
} from 'vue';
const count = ref(5);
const value = ref(2);
</script>
<style lang="scss">
.box {
width: 100vw;
height: 100vh;
font-weight: 0 !important;
.text1 {
margin-top: 45rpx;
color: #C7C7C7;
font-size: 22rpx;
}
.item {
width: 750rpx;
height: 180rpx;
padding: 3% 4%;
// background-color: pink;
// border: 0.5rpx solid #707070;
margin-top: 25rpx;
font-size: 28rpx;
position: relative;
&::before {
position: absolute;
top: 10rpx;
left: 0;
content: "";
width: 750rpx;
height: 1rpx;
border-radius: 9rpx;
background-color: #707070;
}
.img {
width: 132rpx;
height: 132rpx;
background-color: red;
margin-right: 15rpx;
}
.flex-2 {
width: 550rpx;
justify-content: space-between;
}
.name {
font-size: 30rpx;
font-weight: bold;
}
.time {
color: grey;
}
}
}
.box-size {
box-sizing: border-box;
}
.level {
display: flex;
}
.vertical {
display: grid;
justify-content: space-between;
}
</style>