159 lines
2.7 KiB
Vue
159 lines
2.7 KiB
Vue
<template>
|
||
<view class="report">
|
||
<view class="reportList">
|
||
<view class="reportItem" @click="desc" v-for="(item, index) in orderList">
|
||
<view class="reportItem_left">
|
||
<view class="reportItem_img">
|
||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/port.png" mode="widthFix" />
|
||
</view>
|
||
<view class="reportItem_text">
|
||
<view class="reportItem_text_tit">{{item.title}}检查报告</view>
|
||
<view class="reportItem_text_type">检测方式：
|
||
<view>自测</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="reportItem_right">
|
||
查看
|
||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/water_filter/filter_more.png"
|
||
mode="widthFix" />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
t: uni.getMenuButtonBoundingClientRect().top,
|
||
h: uni.getMenuButtonBoundingClientRect().height,
|
||
orderList: [{
|
||
title: "123"
|
||
}]
|
||
}
|
||
},
|
||
methods: {
|
||
handleNavigateBack() {
|
||
uni.navigateBack();
|
||
},
|
||
desc(id) {
|
||
// 处理查看详情逻辑
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
.nav-box {
|
||
box-sizing: border-box;
|
||
width: 100%;
|
||
z-index: 2;
|
||
background: #F9F9F9;
|
||
padding-bottom: 25rpx;
|
||
}
|
||
|
||
.nav-box .nav-bar {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.nav-box .nav-bar .nav-bar-left,
|
||
.nav-box .nav-bar .nav-bar-right {
|
||
padding: 0 20rpx;
|
||
width: 132rpx;
|
||
/* min-width: 36rpx; */
|
||
}
|
||
|
||
.nav-box .nav-bar .nav-bar-left van-icon {
|
||
vertical-align: sub;
|
||
color: #333333;
|
||
}
|
||
|
||
.nav-box .nav-bar .nav-bar-title {
|
||
flex: 1;
|
||
text-align: center;
|
||
font-weight: 400;
|
||
font-size: 36rpx;
|
||
color: #000000;
|
||
}
|
||
|
||
.nav-box .nav-bar-right {
|
||
font-weight: 400;
|
||
font-size: 26rpx;
|
||
color: #FF512A;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.nav-box .nav-bar-right image {
|
||
width: 30rpx;
|
||
height: 30rpx;
|
||
margin-right: 10rpx;
|
||
}
|
||
|
||
.reportList {
|
||
margin: 0 20rpx;
|
||
margin-top: 15rpx;
|
||
}
|
||
|
||
|
||
|
||
.reportItem {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding: 30rpx 0;
|
||
border-bottom: 1rpx solid #E6E6E6;
|
||
}
|
||
|
||
.reportItem_left {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.reportItem_img {
|
||
width: 60rpx;
|
||
height: 60rpx;
|
||
margin-right: 20rpx;
|
||
}
|
||
|
||
.reportItem_right {
|
||
display: flex;
|
||
font-weight: 400;
|
||
font-size: 26rpx;
|
||
color: #222222;
|
||
align-items: center;
|
||
}
|
||
|
||
.reportItem_right image {
|
||
width: 12rpx;
|
||
height: 26rpx;
|
||
margin-left: 13rpx;
|
||
}
|
||
|
||
.reportItem_text_tit {
|
||
font-weight: 400;
|
||
font-size: 26rpx;
|
||
color: #222222;
|
||
}
|
||
|
||
.reportItem_text_type {
|
||
font-weight: 400;
|
||
font-size: 22rpx;
|
||
color: #999999;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.reportItem_text_type view {
|
||
color: #222;
|
||
}
|
||
</style> |