<template>
<modal @close="$router.back()" :overflow="true" :wide="wide">
<card
:title="title"
:shadow="false"
:padding="false"
class="has-text-left has-overflow"
:has-close="true"
@close="$router.back()"
:loading="loading"
>
<div class="p-4">
<slot></slot>
</div>
<footer class="modal-card-foot is-flex is-justify-content-flex-end">
<x-button
v-if="tertiary !== ''"
variant="tertiary"
@click.prevent.stop="$emit('tertiary')"
{{ tertiary }}
</x-button>
variant="secondary"
@click.prevent.stop="$router.back()"
{{ $t('misc.cancel') }}
v-if="primaryLabel !== ''"
variant="primary"
@click.prevent.stop="primary"
:icon="primaryIcon"
:disabled="primaryDisabled"
{{ primaryLabel }}
</footer>
</card>
</modal>
</template>
<script>
import { i18n } from '@/i18n'
export default {
name: 'create-edit',
props: {
title: {
type: String,
default: '',
},
primaryLabel: {
default() {
return i18n.global.t('misc.create')
primaryIcon: {
default: 'plus',
primaryDisabled: {
type: Boolean,
default: false,
tertiary: {
wide: {
loading: {
emits: ['create', 'primary', 'tertiary'],
methods: {
primary() {
this.$emit('create')
this.$emit('primary')
}
</script>