maishidaSJ/components/myorderItem/myorderItem.vue

<template>
	<view >
		<view class="itemContent" v-for="(item,index) in orderObj">
			<view style="width: 100%;height: 4rpx;background-color:lightgray;"></view>
			<view class="contentInRowL" style="padding-top: 30rpx;align-items: center;">
				<text class="dateText">{{item.date}}</text>
				<text class="datedsText">{{item.dateds}}</text>
			</view>
			<view class="contentInRowS">
				<view class="contentColumn" style="justify-content: center;padding-top: 10rpx;align-items: center;">
					<text class="stateText">{{$t('order.wanchengdingd')}}</text>
					<view class="contentInRowL" style="align-items: baseline;">
						<text class="shuliangText">25</text>
						<text class="danweiText">{{$t('order.danweidan')}}</text>
					</view>
				</view>
				<view class="contentColumn" style="justify-content: center;padding-top: 10rpx;align-items: center;">
					<text class="stateText">{{$t('order.quxiaodingdan')}}</text>
					<view class="contentInRowL" style="align-items: baseline;">
						<text class="shuliangText">1</text>
						<text class="danweiText">{{$t('order.danweidan')}}</text>
					</view>
				</view>
				<view class="contentColumn" style="justify-content: center;padding-top: 10rpx;align-items: center;">
					<text class="stateText">{{$t('order.peisonglc')}}</text>
					<view class="contentInRowL" style="align-items: baseline;">
						<text class="shuliangText">304.5</text>
						<text class="danweiText">Km</text>
					</view>
				</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	export default {
		name:"myorderItem",
		props:{
			orderObj:''
		},
		data() {
			return {
				
			};
		}
	}
</script>

<style lang="scss">
	.itemContent{
		width: 94%;
		margin-left: 3%;
		padding-bottom: 30rpx;
	}
	
	.dateText{
		font-size: 28rpx;
		font-weight: bold;
	}
	.datedsText{
		font-size: 24rpx;
		color: darkgray;
		padding-left: 30rpx;
	}
	.stateText{
		font-size: 26rpx;
		color: darkgray;
	}
	.shuliangText{
		font-size: 40rpx;
		font-weight: bold;
	}
	.danweiText{
		font-size: 24rpx;
	}

</style>