<template>
	<view>
		<!-- <levitatedsphere :x="100" :y="80"></levitatedsphere> -->
		<web-view ref="myWv" class="webView" :src="work_url + pageUrl" :webview-styles="styles" :fullscreen="true"
			@onPostMessage="handlePostMessage" @message="handleMessage"></web-view>
		<!-- <footers class="footer" activeTab="workspace"></footers> -->
	</view>
</template>

<script>
	import footers from '@/components/footers/footers.vue'
	export default {
		components: {
			footers
		},
		data() {
			return {
				pageUrl: "/pages/submit/InitiateProcess",
				styles: {
					height: '0',
					screenHeight: ''
				},
				code: "",
			}
		},
		onLoad(options) {
			this.code = options.code;
			console.log("我是1111", this.pageUrl)
			uni.getSystemInfo({
				success: (res) => {
					let screenHeight = res.screenHeight;
					this.screenHeight = screenHeight;
				}
			})
		},
		mounted(){
			// #ifdef H5
			window.addEventListener("message", (e) => {
				console.log(e.data)
				const dataInfo = e.data.data;
				console.log("handleMessage", dataInfo);
				if(dataInfo.type == "路由"){
					uni.redirectTo({
						url: dataInfo.url
					})
				}
			}, false);
			// #endif
		},
		onReady() {
			console.log("进来了吗")
			// uni.hideTabBar()
			let userInfo = JSON.parse(uni.getStorageSync('userInfo'));
			// console.log(userInfo)
			const _funName = 'msgFromUniapp'
			const _data = {
				token: userInfo.token,
				loginUser: userInfo,
				page: "/pages/submit/InitiateProcess?code=" + this.code
			};
			// #ifdef H5
				setTimeout(() => {
					this.$nextTick(() => {
						if(this.$refs.myWv.iframe){
							// this.$refs.myWv.iframe.style.width = "100vw";
							// this.$refs.myWv.iframe.style.height = "100vh";
							this.$refs.myWv.iframe.scrolling = "no";
							this.$refs.myWv.iframe.contentWindow.postMessage(_data, "*")
							// this.$refs.myWv.evalJs(`${_funName}(${JSON.stringify(_data)})`);
						} else {
							const iframe = window.document.getElementsByTagName("iframe")[0];
							iframe.scrolling = "no";
							console.log("我是", _data, iframe)
							iframe.contentWindow.postMessage(_data, "*")
						}
						
					})
				}, 1000);
			// #endif
			// #ifdef APP-PLUS
				var currentWebview = this.$scope.$getAppWebview();
				setTimeout(function() {
					let wv = currentWebview.children()[0]
					console.log("我是wv", wv)
					wv.setStyle({
						top: 0,
						height: ((this.screenHeight - 300)),
						// bottom: uni.upx2px(110)
						bottom: 0
					})
					wv.evalJS(`${_funName}(${JSON.stringify(_data)})`);
				}, 1000);
			// #endif
			
		},
		methods: {
			handlePostMessage: function(data) {
				console.log("接收到消息：" + JSON.stringify(data.detail));
			},
			handleMessage (value){
				const dataInfo = value.detail.data.length > 0 ? value.detail.data[0] : {};
				console.log("handleMessage", dataInfo);
				if(dataInfo.type == "路由"){
					uni.redirectTo({
						url: dataInfo.url
					})
				}
				
			},
		}
	}
</script>

<style>
	page {
		background-color: #F4F5F7;
	}
</style>

<style lang="less" scoped>
	// :deep(.webView) {
	// 	width: 100vw;
	// 	height: 100vh;
	// 	z-index: 10;
	// }
	
	//  :deep(iframe){
	// 	width: 100% !important;
	// 	height: 100% !important;
	// 	border-width: 0;
	// }
</style>