57 lines
1.1 KiB
Vue
57 lines
1.1 KiB
Vue
<script setup lang="ts">
|
|
import { ComposerMode } from '@/types/composer'
|
|
|
|
interface Props {
|
|
mode: ComposerMode
|
|
saveStatus: string
|
|
canSend: boolean
|
|
sending: boolean
|
|
}
|
|
|
|
defineProps<Props>()
|
|
|
|
defineEmits<{
|
|
close: []
|
|
send: []
|
|
}>()
|
|
</script>
|
|
|
|
<template>
|
|
<v-toolbar density="compact" elevation="0" class="composer-toolbar">
|
|
<v-btn
|
|
variant="text"
|
|
icon="mdi-close"
|
|
@click="$emit('close')"
|
|
>
|
|
<v-icon>mdi-close</v-icon>
|
|
<v-tooltip activator="parent" location="bottom">Close</v-tooltip>
|
|
</v-btn>
|
|
|
|
<v-toolbar-title>
|
|
{{ mode === ComposerMode.Reply ? 'Reply' : mode === ComposerMode.Forward ? 'Forward' : 'New Message' }}
|
|
</v-toolbar-title>
|
|
|
|
<v-spacer />
|
|
|
|
<span v-if="saveStatus" class="text-caption text-medium-emphasis mr-4">
|
|
{{ saveStatus }}
|
|
</span>
|
|
|
|
<v-btn
|
|
color="primary"
|
|
:disabled="!canSend"
|
|
:loading="sending"
|
|
prepend-icon="mdi-send"
|
|
@click="$emit('send')"
|
|
>
|
|
Send
|
|
</v-btn>
|
|
</v-toolbar>
|
|
</template>
|
|
|
|
<style scoped lang="scss">
|
|
.composer-toolbar {
|
|
flex-shrink: 0;
|
|
border-bottom: 1px solid rgb(var(--v-border-color));
|
|
}
|
|
</style> |