<template>
	<div class="goods-box" :class="{ flex: goods.catPosition == 'left' }">
		<div :class="{ 'right-slider': goods.catPosition == 'top' }">
			<!-- 只是商品 -->
			<template>
				<!--一行一个-->
				<style1 v-if="goods.listStyle == 1" :goods-info="goods"></style1>
				<!--一行两个-->
				<style2 v-if="goods.listStyle == 2" :goods-info="goods"></style2>
				<!--左右滚动-->
				<style5 v-if="goods.listStyle == 0" :goods-info="goods"></style5>
				<!--列表模式-->
				<style6 v-if="goods.listStyle == -1" :goods-info="goods"></style6>
			</template>
		</div>
	</div>
</template>

<script>
import style1 from './style1';
import style2 from './style2';
import style5 from './style5';
import style6 from './style6';

export default {
	props: ['goods'],
	components: {
		style1,
		style2,
		style5,
		style6,
		
	},
	data() {
		return {
			mainColor: '',
			activeKey: 0,
			currentList: [],
			// goods:{
			// 	catPosition:'top',
			// 	listStyle:2,
			// 	showCat:false,
			// 	backgroundColor:'',
			// 	backgroundPicUrl:'',
			// 	goodsStyle:2,//边框模式
			// 	showGoodsName:true,
			// 	showsubtitle:true,
			// 	goodsCoverProportion:'1-1',
			// 	backgroundColor:'#FFF',
			// 	PaddingTop:10,
			// 	PaddingRight:10,
			// 	PaddingBottom:10,
			// 	PaddingLeft:10,
			// 	list:[
			// 		{id: 367454,
			// 			name: "高考必考语文作文快速提升作文快速提升",
			// 			picUrl: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1593499381000_752.jpg",
			// 			subtitle: '本教程共分3个章节',
			// 		},
			// 		{id: 367454,
			// 			name: "高考必考语文作文快速提升作文快速提升",
			// 			picUrl: "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1601282872605&di=686b8ba4f0e837522a97d77267a2da18&imgtype=0&src=http%3A%2F%2Ft8.baidu.com%2Fit%2Fu%3D2247852322%2C986532796%26fm%3D79%26app%3D86%26f%3DJPEG%3Fw%3D1280%26h%3D853",
			// 			subtitle: '本教程共分3个章节',
			// 		},
			// 		{id: 367454,
			// 			name: "高考必考语文作文快速提升作文快速提升",
			// 			picUrl: "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1601282872605&di=686b8ba4f0e837522a97d77267a2da18&imgtype=0&src=http%3A%2F%2Ft8.baidu.com%2Fit%2Fu%3D2247852322%2C986532796%26fm%3D79%26app%3D86%26f%3DJPEG%3Fw%3D1280%26h%3D853",
			// 			subtitle: '本教程共分3个章节',
			// 		}
			// 	]
			// }
		};
	},
	created() {
		
		this.mainColor = this.$uiConfig.mainColor;
		if (this.goods.showCat) {
			this.currentList = this.goods.catList[0].goodsList;
		} else {
			this.currentList = this.goods.list;
		}
	},
	methods: {
		tabChangeHandler(i) {
			this.currentList = this.goods.catList[i].goodsList;
			this.activeKey = i;
		}
	}
};
</script>

<style>
.style4View {
	display: inline-block;
	width: 100%;
	padding-left: 80px;
	box-sizing: border-box;
}
.goods-box {
	/* margin: 20rpx 0; */
}
.goods-box .tips {
	z-index: 50 !important;
}
.goods-box.flex {
	display: flex;
}
.goods-box.flex .left-slider {
	width: 80px;
	position: absolute;
}
.goods-box.flex .right-slider {
	flex: 1;
	width: 1rpx;
}
.defaultz .van-sticky {
	z-index: 1 !important;
}
.goods-box .van-tabs__scroll {
	background: none;
}
.goods-box ._div {
	width: 100%;
}
</style>
