<template>
	<view id="module" class="xcx-module-container">
		<div class="header-title" v-for="(item,index) in obj.controlList"  v-if="item.title.s" :key="index">
		    <conTitle v-if="item.type==1 && item.check " :title="item" :name="obj.name"  :prev="true"/>
		</div>
		<div :style="'height:'+height+'px'" v-if="obj.controlList[0].title.s"></div>
		<view class="section-module" v-for="(element, index) in obj.moduleList" :key="index">
			<view class="xcx-module-item" :class="selectIndex === index ? 'on' : ''">
			
				<template v-if="!prev">
					<span class="xline"></span>
					<span class="xline"></span>
					<span class="xline"></span>
					<span class="xline"></span>
				</template>
				
				<moduleNav :module="element" v-if="element.type == 1" />
				<moduleDuo :module="element" v-if="element.type == 2" />
				<modlueTuwen :module="element" v-if="element.type == 3" />
				<modlueGoods :module="element" v-if="element.type == 4"/>
				<modlueTuijian :module="element" v-if="element.type == 5" />
				<modlueMsGoods :module="element" v-if="element.type == 6"/>
				<modluePtGoods :module="element" v-if="element.type == 7"/>
				<modlueYyGoods :module="element" v-if="element.type == 8"/>
		
				<!-- #ifdef MP-WEIXIN -->
				<modlueAd :module="element" v-if="element.type == 9"/>
				<!-- #endif -->
				
				<template v-if="element.type == 10">
					<modlueStore v-if="element.base.s==0" :module="element" />
					<!-- #ifdef MP-ALIPAY -->
					<template v-if="element.base.s==1">
					   <slot name='getCoupon'></slot>
					 </template>
					<template v-if="element.base.s==2">
					   <mkt v-if="canIUse" mode="AUTOMATIC" boothCode="MERCHANT_SELF_TINYAPP" :cityCode="cityCode" version="2"  class='mkt'/>
					</template>			
					 <!-- #endif -->
				</template>
				
			</view>
		</view>
		<view style="height: 100rpx;"></view>
	</view>
</template>
<script>
	import moduleNav from './module/nav.vue';
	import moduleDuo from './module/duo.vue';
	import modlueTuwen from './module/tuwen.vue';
	import modlueGoods from './module/goods.vue';
	import modlueTuijian from './module/tuijian.vue';
	import conTitle from './module/contitle.vue';
	import modlueMsGoods from './module/ms_goods.vue';
	import modluePtGoods from './module/pt_goods.vue';
	import modlueYyGoods from './module/yy_goods.vue';
	import modlueAd from './module/ad.vue';
	import modlueStore from './module/store.vue';
	import {
		mapState,
		mapGetters,
		mapMutations
	} from 'vuex'
	
	export default {
		name: 'module',
		props: {
			obj:{
			  type: Object,
			  default: () => []	
			},
			'prev': {
				default: false
			},
			cityCode:{
				type:[Number,String],
				default:0
			}
		},
		created() {
			var _this = this;
			uni.getSystemInfo({
				success: function(e) {
					// #ifdef MP-WEIXIN
					var custom = uni.getMenuButtonBoundingClientRect();
					_this.height = custom.bottom + custom.top - e.statusBarHeight;
					// #endif
					// #ifdef MP-ALIPAY
					var custom = e.titleBarHeight;
					_this.height = custom+e.statusBarHeight;
					// #endif
				}
			})
		},
		
		components: {
			moduleNav,
			moduleDuo,
			modlueTuwen,
			modlueGoods,
			modlueTuijian,
			conTitle,modlueMsGoods,modluePtGoods,modlueYyGoods,
			modlueAd
			,modlueStore
			
		},
		data() {
			return {
				// #ifdef MP-ALIPAY
				canIUse: my.canIUse('mkt'),
				// #endif
				placeholder: false,
				selectIndex: '', //选中
				activeIndex: '', //当前活动active
				height: 60,
			};
		},
		activated() {
			// console.log(this.moduleList)
		},
		computed: {
			...mapState(['systemInfo', 'setColor', 'store_id', 'userInfo', 'teen_index', 'address'])
		},
		onLoad() {

		},
	};
</script>
<style>
.header-title{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 999;
}
</style>
