<template>
	<fullscreen-dialog v-model="dialogVisible" hide-destroy>
		<div class="canvas-box">
			<depth-canvas :config="config" @close="close" />
		</div>
	</fullscreen-dialog>
</template>

<script setup lang="ts">
	import FullscreenDialog from '../components/fullscreen-dialog.vue'
	import depthCanvas from './depth-canvas.vue'
	import { ref } from 'vue'
	const dialogVisible = ref(false)
	const config = ref({})
	const open = (options) => {
		dialogVisible.value = true
		config.value = options || {}
	}
	const close = () => {
		dialogVisible.value = false
	}
	defineExpose({
		open,
		close
	})
</script>
<style lang="less" scoped>
	.canvas-box {
		padding-top: 10rem;
		width: 100%;
		height: 100%;
	}
</style>
