Files
contexted-v3/src/components/Note/NoteToolbar.vue
2023-05-19 19:12:55 +02:00

47 lines
1.6 KiB
Vue

<script setup lang="ts">
const props = defineProps<{
note: Note
}>()
const emit = defineEmits<{
delete: [close: () => void]
setRoot: [close: () => void]
}>()
</script>
<template>
<div class="mb-2 flex items-center">
<h1
class="mr-2 flex flex-grow items-center rounded-md pr-2 text-3xl font-semibold hover:bg-gray-200"
>
<slot name="title"></slot>
</h1>
<div class="btn-group flex items-center" v-if="!props.note.isRoot">
<Modal>
<template #activator="{ open }">
<button class="btn-toolbar btn-sm btn" @click="open">
<i class="fas fa-fw fa-trash" />
</button>
</template>
<template #default>Are you sure you want to delete this note?</template>
<template #actions="{ close }">
<button class="btn-primary btn-sm btn" @click="emit('delete', close)">Delete note</button>
<button class="btn-sm btn" @click="close">Close</button>
</template>
</Modal>
<Modal>
<template #activator="{ open }">
<button class="btn-toolbar btn-sm btn" @click="open">
<i class="fas fa-fw fa-sitemap" />
</button>
</template>
<template #default>Are you sure you want to set this note as root note?</template>
<template #actions="{ close }">
<button class="btn-sm btn" @click="close">Close</button>
<button class="btn-primary btn-sm btn" @click="emit('setRoot', close)">
Set current note as root
</button>
</template>
</Modal>
</div>
</div>
</template>