<style lang='scss' scoped>
	.runingRecord{
		width: 100%;
		height: 100%;
		background-color: #F9F9F9;
		&-list{
			padding-right: $paddingLR;
			background-color: #F9F9F9;
		}
		&-box{
			display: flex;
			justify-content: space-between;
			align-items: center;
			
			&-time{
				width: 200rpx;
				height: 200rpx;
				border-right: 1px solid #ddd;
				display: flex;
				justify-content: center;
				align-items: center;
				text-align: center;
				font-size: $uni-font-size-sm;
				position: relative;
				&-circle{
					position: absolute;
					right: 0;
					bottom: 50%;
					width: 20rpx;
					height: 20rpx;
					transform: translate(10rpx,10rpx);
					border-radius: 50%;
					background-color: #FF5D3F;
					z-index: 1;
				}
			}
			&-info{
				width: 480rpx;
				height: 120rpx;
				background-color: #fff;
				box-shadow: $box-shadow;
				padding: 20rpx;
				margin-left: 20rpx;
				border-radius: 8rpx;
				display: flex;
				justify-content: space-between;
				flex-wrap: wrap;
				font-size: $uni-font-size-sm;
			}
		}
	}
</style>
<template>
	<view class="runingRecord">
		<view class="runingRecord-list">
			<view class="runingRecord-box" v-for="(item,index) in 5" :key="index">
				<view class="runingRecord-box-time">
					<text>2021-1-25 09:40:11</text>
					<view class="runingRecord-box-time-circle"></view>
				</view>
				<view class="runingRecord-box-info">
					<view class="runingRecord-box-info-status">
						<text>状态：</text>
						<text>火警</text>
					</view>
					<view class="runingRecord-box-info-intensity">
						<text>信号强度：</text>
						<text>30mp</text>
					</view>
					<view class="runingRecord-box-info-status">
						<text>当前电池电压：</text>
						<text>3V</text>
					</view>
					<view class="runingRecord-box-info-intensity">
						<text>CPU温度：</text>
						<text>20°C</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>
<script>
	export default {
		data() {
			return {}
		},
		onLoad() {},
		methods: {}
	}
</script>
