<template>
	<view class="page">
		<u-navbar title="我的订单" :border-bottom="false" :background="bgc" title-color='#000' title-size='36'
			height='36'></u-navbar>
			<view class="card">
				<view class="top_li">
					<view class="left">
						<image src="https://api.ccttiot.com/smartmeter/img/static/upPr9QBpmeFzYN2kXEJj" mode=""></image>  车辆故障
					</view>
					<view class="right">
						处理完成 <view class="iconfont icon-xiangyou1"></view>
					</view>
				</view>
				<view class="info">
					时间：2023-12-31 21:22
				</view>
				<view class="info">
					时长：14分钟4秒
				</view>
				<view class="info">
				距离：2.1公里
				</view>
				<view class="price">
					3元
				</view>
				<!-- <view class="info">
					反馈时间：2023-12-31  21:22
				</view> -->
			</view>
			<!-- <view class="tip">
				仅支持查看最近一年的记录
			</view> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				bgc: {
					backgroundColor: "#fff",
				},
				
				 
			}
		},
		methods: {
			
		}
	}
</script>

<style lang="scss" >
page{
	background-color: #fff;
}
.page{
	width: 750rpx;
	.card{
		position: relative;
		width: 680rpx;
		// height: 272rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 10rpx 64rpx 0rpx rgba(0,0,0,0.08);
		border-radius: 20rpx 20rpx 20rpx 20rpx;
		padding: 22rpx 28rpx;
		margin: 30rpx auto;
		.price{
			position: absolute;
			right: 32rpx ;
			top: 110rpx;
			font-weight: 500;
			font-size: 28rpx;
			color: #3D3D3D;
		}
		.top_li{
			margin-bottom: 16rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			.left{
				display: flex;
				flex-wrap: nowrap;
				align-items: center;
				image{
					margin-right: 18rpx;
					width: 42rpx;
					height: 42rpx;
				}
				font-weight: 700;
				font-size: 32rpx;
				color: #3D3D3D;
			}
			.right{
				display: flex;
				flex-wrap: nowrap;
				align-items: center;
				font-weight: 400;
				font-size: 24rpx;
				color: #808080;
				.iconfont{
					font-size: 20rpx;
				}
			}
		}
		.info{
			margin-bottom: 12rpx;
			font-weight: 400;
			font-size: 24rpx;
			color: #808080;
		}
		
	}
	.tip{
		margin-top: 52rpx;
		width: 100%;
		text-align: center;
		font-weight: 400;
		font-size: 28rpx;
		color: #808080;
		line-height: 38rpx;
	}
}
</style>