remove bulma Drawer slot "heading"

This commit is contained in:
Jörn-Michael Miehe 2023-09-10 00:54:29 +00:00
parent cfeb87401e
commit d4bd41fc67
2 changed files with 53 additions and 47 deletions

View file

@ -1,51 +1,47 @@
<template> <template>
<BulmaDrawer> <BulmaDrawer header="Türchen bearbeiten">
<template v-slot:heading>Türchen bearbeiten</template> <div class="panel-tabs is-justify-content-space-between">
<BulmaButton
:disabled="current_step === 0"
class="is-link"
@click="current_step--"
icon="fa-solid fa-backward"
/>
<BulmaBreadcrumbs :steps="steps" v-model="current_step" class="mb-0" />
<BulmaButton
:disabled="current_step === 2"
class="is-link"
@click="current_step++"
icon="fa-solid fa-forward"
/>
</div>
<template v-slot:default> <DoorPlacer v-if="current_step === 0" v-model:doors="doors" />
<div class="panel-tabs is-justify-content-space-between"> <DoorChooser v-if="current_step === 1" v-model:doors="doors" />
<BulmaButton <div v-if="current_step === 2" class="panel-block">
:disabled="current_step === 0" <Calendar :doors="doors" />
class="is-link" </div>
@click="current_step--"
icon="fa-solid fa-backward"
/>
<BulmaBreadcrumbs :steps="steps" v-model="current_step" class="mb-0" />
<BulmaButton
:disabled="current_step === 2"
class="is-link"
@click="current_step++"
icon="fa-solid fa-forward"
/>
</div>
<DoorPlacer v-if="current_step === 0" v-model:doors="doors" /> <div class="panel-block is-flex is-justify-content-space-around">
<DoorChooser v-if="current_step === 1" v-model:doors="doors" /> <BulmaButton
<div v-if="current_step === 2" class="panel-block"> class="is-danger"
<Calendar :doors="doors" /> @click="on_download"
</div> icon="fa-solid fa-cloud-arrow-down"
text="Laden"
<div class="panel-block is-flex is-justify-content-space-around"> />
<BulmaButton <BulmaButton
class="is-danger" class="is-warning"
@click="on_download" @click="on_discard"
icon="fa-solid fa-cloud-arrow-down" icon="fa-solid fa-trash"
text="Laden" text="Löschen"
/> />
<BulmaButton <BulmaButton
class="is-warning" class="is-success"
@click="on_discard" @click="on_upload"
icon="fa-solid fa-trash" icon="fa-solid fa-cloud-arrow-up"
text="Löschen" text="Speichern"
/> />
<BulmaButton </div>
class="is-success"
@click="on_upload"
icon="fa-solid fa-cloud-arrow-up"
text="Speichern"
/>
</div>
</template>
</BulmaDrawer> </BulmaDrawer>
</template> </template>

View file

@ -7,7 +7,7 @@
:icon="'fa-solid fa-angle-' + (is_open ? 'down' : 'right')" :icon="'fa-solid fa-angle-' + (is_open ? 'down' : 'right')"
/> />
</span> </span>
<span><slot name="heading" /></span> <span v-if="header !== ''">{{ header }}</span>
</span> </span>
</p> </p>
<slot v-if="is_open" name="default" /> <slot v-if="is_open" name="default" />
@ -15,10 +15,20 @@
</template> </template>
<script lang="ts"> <script lang="ts">
import { Vue } from "vue-class-component"; import { Options, Vue } from "vue-class-component";
@Options({
props: {
header: {
type: String,
required: false,
default: "",
},
},
})
export default class extends Vue { export default class extends Vue {
public is_open = false; public is_open = false;
public header!: string;
} }
</script> </script>