48 lines
1.1 KiB
Vue
48 lines
1.1 KiB
Vue
<template>
|
|
<Panel :show="show" :title="title || t('settings.settings')" id="setting" @close="close">
|
|
<div class="flex-1 max-h-full p-4 overflow-hidden hover:overflow-y-auto">
|
|
<keep-alive>
|
|
<component :is="currentComponent" />
|
|
</keep-alive>
|
|
<slot />
|
|
<!-- Settings Panel Content ... -->
|
|
</div>
|
|
</Panel>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { computed, onMounted } from 'vue'
|
|
import { useI18n } from 'vue-i18n'
|
|
import Panel from './Panel.vue'
|
|
import useComponent, { DynComponent } from '~/hooks/useComponent'
|
|
|
|
defineProps({
|
|
show: {
|
|
type: Boolean,
|
|
required: true,
|
|
},
|
|
title: {
|
|
type: String,
|
|
required: false,
|
|
default: () => '',
|
|
},
|
|
})
|
|
const emit = defineEmits(['close'])
|
|
const cmpnt = useComponent()
|
|
const close = () => {
|
|
emit('close')
|
|
}
|
|
const { t, locale } = useI18n()
|
|
const currentComponent = computed(() => cmpnt.settingsComponent.value)
|
|
onMounted(() => {
|
|
document.addEventListener('keydown', (event) => {
|
|
switch (event.key) {
|
|
case 'Escape':
|
|
emit('close')
|
|
break
|
|
}
|
|
})
|
|
})
|
|
|
|
</script>
|