59 lines
1.1 KiB
Vue
59 lines
1.1 KiB
Vue
<script setup>
|
|
import {computed} from "vue";
|
|
|
|
const props = defineProps({
|
|
routeAdd: {
|
|
type: Object,
|
|
required: false
|
|
},
|
|
labelAdd: {
|
|
type: String,
|
|
required: false,
|
|
default: "Přidat"
|
|
},
|
|
color: {
|
|
type: String,
|
|
required: false,
|
|
default: 'info'
|
|
}
|
|
});
|
|
|
|
const bannerClass = computed(() => {
|
|
const defaultClasses = 'bg-light-blue text-white';
|
|
const classMap = {
|
|
info: defaultClasses,
|
|
warning: 'bg-orange text-white',
|
|
error: 'bg-red text-white',
|
|
}
|
|
|
|
return classMap[props.color] || defaultClasses;
|
|
});
|
|
|
|
const icon = computed(() => {
|
|
const iconsMap = {
|
|
info: "info",
|
|
warning: "warning",
|
|
error: "error",
|
|
}
|
|
|
|
return iconsMap[props.color];
|
|
});
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<div class="q-pa-md q-gutter-sm">
|
|
<q-banner :class=bannerClass>
|
|
<template v-slot:avatar v-if="icon">
|
|
<q-icon :name="icon"/>
|
|
</template>
|
|
|
|
<slot/>
|
|
|
|
<template v-slot:action v-if="routeAdd">
|
|
<q-btn flat color="white" :to="routeAdd" :label="labelAdd"/>
|
|
</template>
|
|
</q-banner>
|
|
</div>
|
|
</template>
|