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

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

	export default {
		props: ['goods'],
		components: {
			style1,
			style5,
			style6,
		},
		data() {
			return {
				mainColor: '',
				currentList: [],
			};
		},
		created() {

			this.mainColor = this.$uiConfig.mainColor;
			if (this.goods.showCat) {
				this.currentList = this.goods.catList[0].goodsList;
			} else {
				this.currentList = this.goods.list;
			}
		},
		methods: {

		}
	};
</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>
