46 lines
1.3 KiB
Vue
46 lines
1.3 KiB
Vue
<script setup lang="ts">
|
|
import { nextTick, ref, watch } from 'vue'
|
|
import BuilderMoreMenu from '@/components/BuilderMoreMenu.vue'
|
|
import DeleteTypeDialog from '@/components/DeleteTypeDialog.vue'
|
|
import type { useSchemaDelete } from '@/composables/useSchemaDelete'
|
|
import { TOPBAR_ACTION_ID } from '@/lib/uiSlots'
|
|
|
|
const props = defineProps<{
|
|
remove: ReturnType<typeof useSchemaDelete>
|
|
disabled: boolean
|
|
mobile: boolean
|
|
}>()
|
|
|
|
const moreMenu = ref<InstanceType<typeof BuilderMoreMenu> | null>(null)
|
|
|
|
watch(
|
|
() => props.remove.stage.value,
|
|
async (stage) => {
|
|
if (stage === 'closed') {
|
|
await nextTick()
|
|
moreMenu.value?.focus()
|
|
}
|
|
},
|
|
)
|
|
</script>
|
|
|
|
<template>
|
|
<Teleport v-if="mobile" :to="`#${TOPBAR_ACTION_ID}`" defer>
|
|
<BuilderMoreMenu ref="moreMenu" :disabled="disabled" @delete="remove.open" />
|
|
</Teleport>
|
|
<BuilderMoreMenu v-else ref="moreMenu" :disabled="disabled" @delete="remove.open" />
|
|
<DeleteTypeDialog
|
|
v-if="remove.stage.value !== 'closed'"
|
|
:stage="remove.stage.value"
|
|
:name="remove.type.value.name"
|
|
:key-value="remove.type.value.key"
|
|
:total="remove.total.value"
|
|
:referrer="remove.referrer.value"
|
|
:pending="remove.pending.value"
|
|
:offline="remove.offline.value"
|
|
@confirm="remove.confirm"
|
|
@close="remove.close"
|
|
@view-entries="remove.viewEntries"
|
|
/>
|
|
</template>
|