<template>
<view class="miaosha">
	<view class="title">
		<view class="left">
			<image src="../../static/images/img/miaosha.png" mode="heightFix"></image>
			<text>13点场</text>
			<view class="time">
				<view class="timeItem">
					13
				</view>
				<text>:</text>
				<view class="timeItem">
					00
				</view>	
				<text>:</text>
				<view class="timeItem">
					00
				</view>	
			</view>
		</view>
		<view class="right">
			<text>更多</text>
			<image src="../../static/images/img/jiantou.png" mode="widthFix"></image>
		</view>
	</view>
	<view class="list">
		<view class="listItem" v-for="item in 5" :key="item">
			<view class="pic">
				<image src="../../static/images/img/example.png" mode="aspectFill"></image>
			</view>
			<view class="price">
				￥199+2红包
			</view>
			<view class="oldPrice">
				￥299
			</view>
		</view>
	</view>
</view>
</template>

<script>
</script>

<style lang="scss" scoped>
.miaosha{
	margin: 20rpx 24rpx;
	background: linear-gradient(0deg, #FFFFFF, #FAE4D5);
	border-radius: 20rpx;
	padding:22rpx;
	.title{
		display: flex;
		align-items: center;
		justify-content: space-between;
		.left{
			display: flex;
			align-items: center;
			&>image{
				height: 29rpx;
				width: auto;
			}
			&>text{
				font-family: Source Han Sans SC;
				font-weight: 400;
				font-size: 28rpx;
				color: #222222;
				margin: 0 20rpx;
			}
			.time{
				display: flex;
				align-items: center;
				.timeItem{
					width: 34rpx;
					height: 34rpx;
					background: #EB6100;
					border-radius: 5px;
					text-align: center;
					line-height: 34rpx;
					font-family: Microsoft YaHei;
					font-weight: 400;
					font-size: 24rpx;
					color: #FFFFFF;
				}
				&>text{
					font-family: Source Han Sans SC;
					font-weight: 400;
					font-size: 28rpx;
					color: #222222;
					margin:0 12rpx;
				}
			}
		}
		.right{
			display: flex;
			align-items: center;
			text{
				
				font-family: Source Han Sans SC;
				font-weight: 400;
				font-size: 24rpx;
				color: #999999;
			}
			image{
				width: 44rpx;
				height: 44rpx;
			}
		}
	}
	.list{
		display: flex;
		margin-top:18rpx;
		.listItem{
			flex-shrink: 0;
			width: 20%;
			display: flex;
			flex-direction: column;
			align-items: center;
			.pic{
				width: 90rpx;
				height: 90rpx;
				background: #FFFFFF;
				border-radius: 10px;
				padding:10rpx;
				text-align: center;
				&>image{
					width: 100%;
					height:100%;
				}
			}
			.price{
				margin:12rpx 0;
				font-family: Source Han Sans SC;
				font-weight: 400;
				font-size: 20rpx;
				color: #EB6100;
			}
			.oldPrice{
				font-family: Source Han Sans SC;
				font-weight: 400;
				font-size: 20rpx;
				color: #999999;
				text-decoration-line: line-through;
			}
		}
	}
}
</style>