Add actions slot and fullwidth to popup
continuous-integration/drone/push Build is failing Details

This commit is contained in:
philipp lang 2023-12-25 19:36:13 +01:00
parent 6b0e0c37a5
commit 3469aeef93
2 changed files with 17 additions and 8 deletions

View File

@ -1,9 +1,12 @@
<template>
<div class="fixed z-40 top-0 left-0 w-full h-full flex items-center justify-center p-6">
<div class="relative rounded-lg p-8 bg-zinc-800 shadow-2xl shadow-black border border-zinc-700 border-solid w-full" :class="innerWidth">
<a href="#" class="absolute top-0 right-0 mt-6 mr-6" @click.prevent="$emit('close')">
<ui-sprite src="close" class="text-zinc-400 w-6 h-6"></ui-sprite>
</a>
<div class="relative rounded-lg p-8 bg-zinc-800 shadow-2xl shadow-black border border-zinc-700 border-solid w-full" :class="full ? 'h-full' : innerWidth">
<div class="absolute top-0 right-0 mt-6 mr-6 flex space-x-6">
<slot name="actions"></slot>
<a href="#" @click.prevent="$emit('close')">
<ui-sprite src="close" class="text-zinc-400 w-6 h-6"></ui-sprite>
</a>
</div>
<h3 v-if="heading" class="font-semibold text-primary-200 text-xl" v-html="heading"></h3>
<div class="text-primary-100 group is-popup">
<slot></slot>
@ -23,6 +26,10 @@ export default {
default: () => 'max-w-xl',
type: String,
},
full: {
type: Boolean,
default: () => false,
},
},
};
</script>

View File

@ -4,6 +4,11 @@
<f-save-button form="groupform"></f-save-button>
</template>
<ui-popup v-if="editing !== null" heading="Untergruppen bearbeiten" inner-width="max-w-5xl" @close="editing = null">
<template #actions>
<a href="#" @click.prevent="store">
<ui-sprite src="save" class="text-zinc-400 w-6 h-6"></ui-sprite>
</a>
</template>
<div class="flex space-x-3">
<f-text id="parent-inner_name" v-model="editing.parent.inner_name" label="Interner Name" name="parent-inner_name"></f-text>
<f-select id="parent-level" v-model="editing.parent.level" label="Ebene" name="parent-level" :options="meta.levels"></f-select>
@ -27,7 +32,6 @@
</td>
</tr>
</table>
<ui-button class="btn-primary" @click.prevent="store">Speichern</ui-button>
</div>
</ui-popup>
<form id="groupform" class="grow p-3" @submit.prevent="submit">
@ -53,9 +57,7 @@
<td v-text="child.inner_name"></td>
<td v-text="child.level"></td>
<td>
<a v-if="child.children_count" v-tooltip="`Bearbeiten`" href="#" class="inline-flex btn btn-warning btn-sm" @click.prevent="edit(child)"
><ui-sprite src="pencil"></ui-sprite
></a>
<a v-tooltip="`Bearbeiten`" href="#" class="inline-flex btn btn-warning btn-sm" @click.prevent="edit(child)"><ui-sprite src="pencil"></ui-sprite></a>
</td>
</tr>
<template v-for="subchild in childrenOf(child.id)" :key="subchild.id">