66 lines
1.1 KiB
Vue
66 lines
1.1 KiB
Vue
<script setup>
|
|
const emit = defineEmits(['confirmed'])
|
|
|
|
const props = defineProps({
|
|
color: {
|
|
type: String,
|
|
required:false
|
|
},
|
|
variant: {
|
|
type: String,
|
|
required:false
|
|
}
|
|
|
|
})
|
|
|
|
const {color,variant} = props
|
|
|
|
const showModal = ref(false)
|
|
|
|
const emitConfirm = () => {
|
|
showModal.value = false
|
|
emit('confirmed')
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<UButton
|
|
:color="color"
|
|
:variant="variant"
|
|
@click="showModal = true"
|
|
>
|
|
<slot name="button"></slot>
|
|
</UButton>
|
|
<UModal v-model="showModal">
|
|
<UCard>
|
|
<template #header>
|
|
<slot name="header"></slot>
|
|
</template>
|
|
<slot/>
|
|
<template #footer>
|
|
<div class="text-right">
|
|
<UButtonGroup>
|
|
<UButton
|
|
variant="outline"
|
|
@click="showModal = false"
|
|
>
|
|
Abbrechen
|
|
</UButton>
|
|
<UButton
|
|
@click="emitConfirm"
|
|
class="ml-2"
|
|
color="rose"
|
|
>
|
|
Archivieren
|
|
</UButton>
|
|
</UButtonGroup>
|
|
|
|
</div>
|
|
</template>
|
|
</UCard>
|
|
</UModal>
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
</style> |