<template> <view class="container"> <v-navigation-bar background-color="#fff" title-color="#333" title="我的评价"></v-navigation-bar> <view class="body"> <view v-for="(item, index) in evaluateList" :key="index" class="item"> <view class="date">07-06</view> <view class="message"> <!-- 这家修理厂的喷漆工艺非常不错,特别均匀,师傅也很细心。如果您需要做喷漆或者维修服务,不要错过这里!--> {{item.commentDesc}} </view> <view class="rate"> <!-- 设置尺寸大小 --> <uni-rate allow-half :value="item.commentStar"/> </view> <view class="shopInfo"> <image class="shopImg" :src="item.image" mode="aspectFill"></image> <view class="shopInfo_content"> <!-- <view class="shopName">顺捷汽车维修搭电救援补胎中心</view>--> <view class="shopName">{{ item.tenantName }}</view> <!-- <view class="shopAddress">济南市历下区福瑞达历下护理院东南门旁</view>--> </view> </view> </view> </view> </view> </template> <script> import VNavigationBar from '@/components/VNavigationBar.vue' import request from "@/utils/request"; export default { components: { VNavigationBar, }, data() { return { // evaluateList: [{}, {}, {}], queryParams:{ pageNum: 1, pageSize: 10 }, evaluateList: [], }; }, onShow(){ this.getAppraisePage() }, methods:{ async getAppraisePage(){ const res = await request({ url: "/userClient/repair/order/getAppraise", method: "get", params:{ ...this.queryParams, pageNo: this.queryParams.pageNum } }) this.evaluateList = res.data.records this.evaluateList.forEach(item => { item.image = require("../static/inImage.jpg") }) } } } </script> <style lang="less" scoped> .container { height: 100%; background-color: #F3F5F7; display: flex; flex-direction: column; .body { padding: 20rpx 0; flex: 1; height: 0; overflow: auto; display: flex; flex-direction: column; row-gap: 10rpx; } .item { background-color: #fff; padding: 30rpx; display: flex; flex-direction: column; row-gap: 20rpx; } .date { font-weight: bold; font-size: 36rpx; color: #333333; } .shopInfo { display: flex; align-items: stretch; column-gap: 20rpx; .shopImg { width: 160rpx; height: 100rpx; border-radius: 8rpx 8rpx 8rpx 8rpx; background-color: #efefef; } .shopInfo_content { flex: 1; width: 0; display: flex; flex-direction: column; justify-content: space-between; padding: 6rpx 0; } .shopName { font-size: 28rpx; color: #333333; } .shopAddress { font-size: 24rpx; color: #666666; } } } </style>