mnsx/pages/index/groupBooking.vue

<template>
		<view class="scroll_box"> 	
		    <scroll-view class="scroll-view_x" scroll-x show-scrollbar="false" style="width: auto;overflow:hidden;">
		      <view class="item_list ss" v-for="l in bastList" @click="listTo(l.id)">
				  <image :src="l.image"></image>
			    <view class="price">
					<b id="store_name">{{l.store_name}}</b>
					<view class="price-d">
						<b id="price">￥{{l.price}}</b>
						<text id="ot-price">￥{{l.ot_price}}</text>
					</view>
				</view>
		      </view>
		    </scroll-view>
		  </view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		props: ["bastList"],
		methods: {
			listTo(id) {
				console.log(id)
				uni.navigateTo({
					url: '/pages/product/product?id=' + id 
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	.scroll_box{
		width: 100%;
	}
	.item_list{
		margin: 27rpx;
		image {
			width: 256rpx;
			height: 256rpx;
			border-radius: 10rpx 10rpx 0 0;
		}
	}
	
	.price {
		border-radius: 0  0 10rpx 10rpx ;
		padding: 5rpx;
		background-color: #FFFFFF;
		margin-top: -10rpx;
		height: 102rpx;
		#store_name {
			margin-left: 10rpx;
			color: #333333;
			font-family: PingFang-SC-Bold;
			font-size: 28rpx;
		}
		
		.price-d {
			margin: 5rpx;
			#price {
				color: #970100;
				font-size: 28rpx;
			}
			
			#ot-price {
				color: #989B9F;
				font-size: 15rpx;
				text-decoration: line-through;
			}
		}
	}
</style>