<template>
	<view>
		<view class="search-list" v-for="data in dishList" :key="data._id">

			<view class="dish-item" @click="goToDetail(data)">
				<image class="dish-image" :src="data.dish_src"></image>
			</view>
			<view class="dish-intro">
				<text>{{'菜名：' +  data.dish_name + '\n'}}</text>
				<text>{{'地点：' +  data.location + '\n'}}</text>
				<text>{{'窗口：' +  data.window_name + '\n'}}</text>
				<text>{{'评分：' +  data.avg_score + '\n'}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				dishList: []
			};
		},
		onLoad(e) {
			let that = this
			uni.$on('item', (res) => {
				that.dishList = res
				console.log(res)
			})
			//this.dishList = JSON.parse(decodeURIComponent(e.searchlist))

		},
		methods:{
			goToDetail(item) {
				console.log(item._id)
				uni.navigateTo({
					url: '/subpkg/dishDetail/dishDetail?_id=' +encodeURIComponent(JSON.stringify(item._id)) 
				})
			}
		}
	}
</script>

<style lang="scss">
	.search-list {
		padding-left: 5rpx;
		padding-right: 5rpx;
		border-style: solid;
		border-radius: 5px;
		border-color: #65654b;
		border-width: 3rpx;
		display: flex;
		justify-content: space-around;

	}

	.dish-intro {
		padding-left: 5rpx;
		padding-right: 5rpx;
		border-style: solid;
		border-radius: 5px;
		border-color: #65654b;
		border-width: 3rpx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		height: 256rpx;
		font-size: 18rpx;
	}

	.dish-image {
		padding-left: 5rpx;
		padding-right: 5rpx;
		border-style: solid;
		border-radius: 5px;
		border-color: #65654b;
		border-width: 3rpx;
		width: 475rpx;
		height: 256rpx;
		display: flex;
	}
</style>