<template>
	<view class="_bg" v-if="bshow">
		<view class="_dialog" :style="{top:top}">
			<view class="_title">{{title}}</view>
			<view class="_close" @tap="Close(true)"></view>
			<view class="_content" :style="{maxHeight:maxheight,height:height}">
				<slot></slot>
			</view>
		</view>
	</view>
</template>

<style scoped>
	._bg {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: rgba(0, 0, 0, 0.2);
		z-index: 100;
	}

	._dialog {
		position: fixed;
		border-radius: 0.5em;
		left: 1em;
		right: 1em;
		background: #ffffff;
	}

	._dialog ._title {
		line-height: 1.5em;
		background: #fafafa;
		padding: 0.5em 1em;
		border-radius: 0.5em 0.5em 0 0;
	}

	._dialog ._content {
		overflow: scroll;
		margin-bottom: 0.5em;
	}

	._dialog ._close {
		position: absolute;
		right: 0.5em;
		top: 0.5em;
		width: 1.5em;
		height: 1.5em;
		background-image: url("data:image/svg+xml;charset=utf-8;base64,PHN2ZyB2aWV3Qm94PScwIDAgMTAyNCAxMDI0JyB2ZXJzaW9uPScxLjEnIHhtbG5zPSdodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Zyc+PHBhdGggZD0nTTUxLjI4NTk0ODA3IDUyMC4wMTYwMTM1NGMwIDI1Ni40ODg5MDI4MyAyMDcuNTg2OTEzMzUgNDY0LjA3NTgxNjIgNDY0LjA3NTgxNjE3IDQ2NC4wNzU4MTYxN3M0NjQuMDc1ODE2Mi0yMDcuNTg2OTEzMzUgNDY0LjA3NTgxNjItNDY0LjA3NTgxNjE3Uzc3MS44NTA2NjcwOCA1NS45NDAxOTczMyA1MTUuMzYxNzY0MjQgNTUuOTQwMTk3MzNzLTQ2NC4wNzU4MTYyIDIwNy41ODY5MTMzNS00NjQuMDc1ODE2MTcgNDY0LjA3NTgxNjIxeicgZmlsbD0nI2Q4MWUwNic+PC9wYXRoPjxwYXRoIGQ9J001NjAuMjYxMDk5MDIgNTE5LjU1MTkzNzU5bDE3OC4zNzkxNDI5MSAxNzguMzc5MTQxNDZjMTEuODkxOTQyNTcgMTEuODkxOTQyNTcgMTEuODkxOTQyNTcgMzIuODkxMzczNTkgMCA0NC44MTIzMjE5LTExLjg5MTk0MjU3IDExLjg5MTk0MjU3LTMyLjg5MTM3MzU5IDExLjg5MTk0MjU3LTQ0LjgxMjMyMTkxIDBsLTE3OC4zNzkxNDE0NS0xNzguMzc5MTQyOS0xNzguMzc5MTQxNDMgMTc4LjM3OTE0MjljLTExLjg5MTk0MjU3IDExLjg5MTk0MjU3LTMyLjg5MTM3MzU5IDExLjg5MTk0MjU3LTQ0LjgxMjMyMTkxIDAtMTEuODkxOTQyNTctMTEuOTIwOTQ2ODYtMTEuODkxOTQyNTctMzIuOTIwMzc3ODkgMC00NC44MTIzMjE5bDE3OC4zNzkxNDI5LTE3OC4zNzkxNDE0Ni0xNzcuNzk5MDQ2OS0xNzcuODI4MDUyNjRjLTExLjkyMDk0Njg2LTExLjg5MTk0MjU3LTExLjkyMDk0Njg2LTMyLjg5MTM3MzU5IDAtNDQuODEyMzIwNDUgMTEuODkxOTQyNTctMTEuODkxOTQyNTcgMzIuODkxMzczNTktMTEuODkxOTQyNTcgNDQuNzgzMzE2MTYgMGwxNzcuODI4MDUxMTggMTc3Ljc5OTA0Njg5IDE3Ny43OTkwNDY5MS0xNzcuNzk5MDQ2ODljMTIuNTAxMDQyODctMTEuODkxOTQyNTcgMzIuOTIwMzc3ODktMTEuODkxOTQyNTcgNDQuODQxMzI2MjEgMCAxMS44OTE5NDI1NyAxMS44OTE5NDI1NyAxMS44OTE5NDI1NyAzMi44OTEzNzM1OSAwIDQ0LjgxMjMyMDQ1bC0xNzcuODI4MDUyNjcgMTc3Ljc5OTA0ODM2eicgZmlsbD0nI2ZmZmZmZic+PC9wYXRoPjwvc3ZnPg==");
	}
</style>

<script>
	export default {
		props: {},
		data() {
			return {
				bshow: false,
				maxheight: 'auto',
				top: 0,
				height: 'auto',
				title: '',
			};
		},
		methods: {
			async Open(res) {
				var app = getApp();
				res = res || {};
				if (typeof(res) == 'string')
					res = {
						title: res
					};
				this.title = res.title || '操作';
				this.cb = res.cb;
				const {
					headerheight,
					footerheight
				} = await this.com_gethdft();
				this.top = (headerheight + 60) + 'px';
				if (res.height) {
					this.height = res.height;
				} else {
					var height = app.globalData._sysinfo.windowHeight - 100 - this.header_statusbar_height - this.header_title_height;
					this.maxheight = height + 'px';
				}
				this.bshow = true;
			},
			Close(mustcb) {
				this.bshow = false;
				if (mustcb && typeof(this.cb) == 'function')
					this.cb('close');
			}
		}
	}
</script>