<template>
	<view class="container">
		<view class="hotsale-box" v-for="(menitem,menindex) in menusList" :key="menindex" @click="navToDetailPage(menitem,'libao')">
			<view class="img">
				<image :src="menitem.image"></image>
			</view>
			<view class="hostsale-info">
				<view class="name">{{menitem.store_name}}</view>
				<view class="price-box ">
					<text class="price">￥{{menitem.price}}</text>
					<!-- <text class="ot_price">￥{{menitem.ot_price}}</text> -->
					<!-- <text class="seckill">秒杀</text> -->
				</view>
				<text class="number">库存：{{menitem.stock}}</text>
			</view>
		</view>
	</view>
</template>

<script>
import { groomList,productDetail,getProducts } from '@/api/product.js'
import { getList } from '@/api/category.js';
export default {
	onShow: function() {
		this.loadData();
	},
	data() {
		return{
			//热销产品
			hotlist:[],
			goodstype:1,
			menusList:'',
			tabTitle: [],
			giftbag: 12 //礼包id
		}
	},
	methods: {
		// 获取首页数据
		async loadData() {
			let obj = this;
			
			getList({})
				.then(({ data }) => {
					// obj.tabTitle = data.map(function(s) {
					// 	return s;
					// });
					obj.tabTitle = data;
					let poped = obj.tabTitle.pop();
			
					obj.giftbag = poped.children[0].id;
					//console.log(obj.giftbag,'this.giftbag')
					let newDate = {
						id: 0,
						cate_name: '首页'
					};
					obj.tabTitle.unshift(newDate);
			
					let datas = {
						sid: obj.giftbag, //分类id
						isPink: 1
					};
					getProducts(datas).then(function(e) {
						console.log(e.data, 'e.data');
						obj.menusList = e.data;
					});
					// obj.currentId = obj.flist[0].id;
				})
				.catch(err => {
					console.log(err);
				});
		},
		//商品推荐详情页
		navToDetailPage(item,types) {
			let id = item.id;
			//let type = 2;
			uni.navigateTo({
				url: '/pages/product/product?id=' + id + '&types=' + types
			});
		},
	}
}
</script>

<style lang="scss">
	.container{
		line-height: 1;
		padding: 10rpx 25rpx;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		.hotsale-box{
			width: 48.5%;
			background-color: #fff;
			border-radius: 10rpx;
			margin-top: 20rpx;
			.img{
				height: 340rpx;
				display: flex;
				justify-content: center;
				align-items: center;
				image{
					width: 270rpx;
					height: 270rpx;
				}
			}
			.hostsale-info{
				padding:20rpx 20rpx 30rpx 20rpx;
				.name{
					font-size: 28rpx;
					font-weight: bold;
					overflow: hidden;
					text-overflow: ellipsis;
					display: -webkit-box;
					-webkit-line-clamp: 2;
					-webkit-box-orient: vertical;
				}
				.price-box{
					line-height: 1;
					.price{
						color: #FC4141;
						font-size: 24rpx;
						font-weight: bold;
						margin-right: 15rpx;
					}
					.ot_price{
						font-size:22rpx;
						font-weight:500;
						text-decoration:line-through;
						color:#aaaaaa;
					}
					.seckill{
						border: 2rpx solid #FC5B62;
						color: #FC5B62;
						text-align: center;
						font-size: 20rpx;
						margin-left: 6rpx;
					}
				}
				.number{
					font-size:26rpx;
					font-weight:500;
					color:#333333;
				}
			}
		}
	}
</style>
