<template>
	<u-overlay :show="show">
		<view class="modal-main">
			<view class="modal-content">
				<slot></slot>
			</view>
			
			<view @click="$emit('close')" class="close">
				<image src="@/static/close.png"></image>
			</view>
		</view>
	</u-overlay>
</template>

<script>
	export default {
		props: {
			show: {
				type: Boolean,
				default: false
			}
		},
		data() {
			return {

			}
		}
	}
</script>

<style scoped>
	.modal-main {
		width: 90%;
		margin: auto;
	}
	.modal-content {
		min-height: 500rpx;
		padding: 32rpx 32rpx 48rpx;
		background-color: #FFF;
		border-radius: 16rpx;
	}
	.close {
		margin-top: 48rpx;
		text-align: center;
	}
	.close > image {
		width: 64rpx;
		height: 64rpx;
	}
</style>