<!-- 自适应高度：裁剪状态栏高度的组件 -->
<template>
	<view class="cropStatusbarHeight"  :style="{ height: heightCom }"> 
		<slot></slot>
	</view>
</template>

<script>
	const statusBarHeight = uni.getSystemInfoSync().statusBarHeight
	
	export default {
		name: 'CropStatusbarHeight',
		props: {
			// 高度的单位为：px
			// tabBar的高度
			tabBarH: {
				type: Number,
				default: 44
			},
			// 其他需要裁剪的高度
			otherHeight: {
				type: Number,
				default: 0,
			}
		},
		data() {
			return {
				statusBarHeight,
				winH: 0,
				pH: 0
			};
		},
		computed: {
			heightCom () {
				const _h = (this.winH - this.tabBarH - this.otherHeight - this.statusBarHeight - uni.upx2px(this.pH)) + 'px'
				this.$emit('cropHeight', _h)
				return _h
			}
		},
		created() {
			const platform = getApp().globalData.platform
			const runningOnOtherPlatforms = getApp().globalData.runningOnOtherPlatforms
			if (runningOnOtherPlatforms && platform === 'android') {
				this.pH = 50
			}
			try {
			    this.winH = uni.getSystemInfoSync().windowHeight
			} catch (e) {
			    // 给个默认的
				this.winH = 580
			}
		}
	}
</script>
