79 lines
2.4 KiB
Vue
79 lines
2.4 KiB
Vue
<template>
|
|
<view class="evaluation-container">
|
|
<!-- 评价内容区域 -->
|
|
<view class="evaluation-content">
|
|
<!-- 订单头部信息 -->
|
|
<view class="order-header">
|
|
<text class="order-name">{{ orderInfo.orderName }}</text>
|
|
<text class="order-number">{{ orderInfo.orderNumber }}</text>
|
|
</view>
|
|
|
|
<view class="evaluation-area">
|
|
<text class="evaluation-text">{{ evaluationInfo.content }}</text>
|
|
<!-- 评价图片区域 -->
|
|
<view class="image-list">
|
|
<view
|
|
class="image-item"
|
|
v-for="(img, index) in evaluationInfo.images"
|
|
:key="index"
|
|
>
|
|
<image :src="img.url" mode="aspectFill"></image>
|
|
<text class="image-text">{{ img.text }}</text>
|
|
</view>
|
|
</view>
|
|
<text class="order-date">{{ orderInfo.date }}</text>
|
|
</view>
|
|
|
|
<!-- 商品信息区域 -->
|
|
<view class="product-info">
|
|
<view class="product-img">
|
|
<image :src="productInfo.imageUrl" mode="aspectFit"></image>
|
|
<view
|
|
class="tag"
|
|
v-for="(tag, index) in productInfo.tags"
|
|
:key="index"
|
|
>{{ tag }}</view
|
|
>
|
|
</view>
|
|
<view class="product-details">
|
|
<text class="product-name">{{ productInfo.name }}</text>
|
|
<text class="product-spec">{{ productInfo.spec }}</text>
|
|
<text class="product-unit">{{ productInfo.unit }}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
orderInfo: {
|
|
orderName: "衡水商贸国际公司",
|
|
orderNumber: "4534534255",
|
|
date: "2025-07-21",
|
|
},
|
|
evaluationInfo: {
|
|
content: "评价文字内容",
|
|
images: [
|
|
{ url: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/eval1.png", text: "评价图片" },
|
|
{ url: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/eval2.png", text: "评价图片" },
|
|
{ url: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/eval3.png", text: "评价图片" },
|
|
],
|
|
},
|
|
productInfo: {
|
|
imageUrl: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/product.png",
|
|
tags: ["当日达", "当日达"],
|
|
name: "货品名称",
|
|
spec: "货品规格",
|
|
unit: "货品单位",
|
|
},
|
|
};
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style>
|
|
@import url("./rated.css");
|
|
</style> |