fix slot syntax

This commit is contained in:
axolotle 2023-03-24 21:26:23 +01:00
parent 34af7e029f
commit c5bc384f34
8 changed files with 55 additions and 24 deletions

View file

@ -6,9 +6,15 @@
v-bind="{ panels, forms, v: $v, ...$attrs }" v-bind="{ panels, forms, v: $v, ...$attrs }"
v-on="$listeners" v-on="$listeners"
> >
<slot name="tab-top" slot="tab-top" /> <template #tab-top>
<slot name="tab-before" slot="tab-before" /> <slot name="tab-top" />
<slot name="tab-after" slot="tab-after" /> </template>
<template #tab-before>
<slot name="tab-before" />
</template>
<template #tab-after>
<slot name="tab-after" />
</template>
</routable-tabs> </routable-tabs>
<card v-else :title="routes_[0].text" :icon="routes_[0].icon"> <card v-else :title="routes_[0].text" :icon="routes_[0].icon">

View file

@ -14,9 +14,15 @@
<!-- Bind extra props to the child view and forward child events to parent --> <!-- Bind extra props to the child view and forward child events to parent -->
<router-view v-bind="$attrs" v-on="$listeners"> <router-view v-bind="$attrs" v-on="$listeners">
<slot name="tab-top" slot="tab-top"></slot> <template #tab-top>
<slot name="tab-before" slot="tab-before"></slot> <slot name="tab-top" />
<slot name="tab-after" slot="tab-after"></slot> </template>
<template #tab-before>
<slot name="tab-before" />
</template>
<template #tab-after>
<slot name="tab-after" />
</template>
</router-view> </router-view>
</b-card> </b-card>
</template> </template>

View file

@ -30,11 +30,13 @@
<slot name="default" /> <slot name="default" />
</b-card-body> </b-card-body>
</b-collapse> </b-collapse>
<slot v-else name="default" slot="default" /> <template v-else>
<slot name="default" />
</template>
<slot name="footer" slot="footer"> <template #footer v-if="'buttons' in $slots">
<slot name="buttons" /> <slot name="buttons" />
</slot> </template>
</b-card> </b-card>
</template> </template>

View file

@ -18,16 +18,17 @@
</b-form> </b-form>
</template> </template>
<slot v-if="!noFooter" name="buttons" slot="buttons"> <template v-if="!noFooter" #buttons>
<b-button type="submit" variant="success" :form="id"> <slot name="buttons">
{{ submitText ? submitText : $t('save') }} <b-button type="submit" variant="success" :form="id">
</b-button> {{ submitText ? submitText : $t('save') }}
</slot> </b-button>
</slot>
</template>
</card> </card>
</template> </template>
<script> <script>
export default { export default {
name: 'CardForm', name: 'CardForm',

View file

@ -1,8 +1,12 @@
<template> <template>
<div> <div>
<top-bar v-if="hasTopBar"> <top-bar v-if="hasTopBar">
<slot name="top-bar-group-left" slot="group-left" /> <template #group-left>
<slot name="top-bar-group-right" slot="group-right" /> <slot name="top-bar-group-left" />
</template>
<template #group-right>
<slot name="top-bar-group-right" />
</template>
</top-bar> </top-bar>
<slot v-else name="top-bar" /> <slot v-else name="top-bar" />

View file

@ -1,6 +1,8 @@
<template> <template>
<view-base v-bind="$attrs" v-on="$listeners" :skeleton="skeleton"> <view-base v-bind="$attrs" v-on="$listeners" :skeleton="skeleton">
<slot v-if="hasCustomTopBar" name="top-bar" slot="top-bar" /> <template v-if="hasCustomTopBar" #top-bar>
<slot name="top-bar" />
</template>
<template v-if="!hasCustomTopBar" #top-bar-group-left> <template v-if="!hasCustomTopBar" #top-bar-group-left>
<b-input-group class="w-100"> <b-input-group class="w-100">
<b-input-group-prepend is-text> <b-input-group-prepend is-text>
@ -15,9 +17,13 @@
/> />
</b-input-group> </b-input-group>
</template> </template>
<slot v-if="!hasCustomTopBar" name="top-bar-buttons" slot="top-bar-group-right" /> <template v-if="!hasCustomTopBar" #top-bar-group-right>
<slot name="top-bar-buttons" />
</template>
<slot name="top" slot="top" /> <template #top>
<slot name="top" />
</template>
<template #default> <template #default>
<b-alert v-if="items === null || filteredItems === null" variant="warning"> <b-alert v-if="items === null || filteredItems === null" variant="warning">
@ -30,9 +36,13 @@
<slot v-else name="default" /> <slot v-else name="default" />
</template> </template>
<slot name="bot" slot="bot" /> <template #bot>
<slot name="bot" />
</template>
<slot name="skeleton" slot="skeleton" /> <template #skeleton>
<slot name="skeleton" />
</template>
</view-base> </view-base>
</template> </template>

View file

@ -5,7 +5,7 @@
:value="value" :id="id" :value="value" :id="id"
size="lg" class="p-0 border-0" no-outer-focus size="lg" class="p-0 border-0" no-outer-focus
> >
<template v-slot="{ tags, disabled, addTag, removeTag }"> <template #default="{ tags, disabled, addTag, removeTag }">
<ul v-if="!noTags && tags.length > 0" class="list-inline d-inline-block mb-2"> <ul v-if="!noTags && tags.length > 0" class="list-inline d-inline-block mb-2">
<li v-for="tag in tags" :key="id + '-' + tag" class="list-inline-item"> <li v-for="tag in tags" :key="id + '-' + tag" class="list-inline-item">
<b-form-tag <b-form-tag

View file

@ -4,7 +4,9 @@
:validation="$v" :server-error="serverError" :validation="$v" :server-error="serverError"
@submit.prevent="onSubmit" @submit.prevent="onSubmit"
> >
<slot name="disclaimer" slot="disclaimer" /> <template #disclaimer>
<slot name="disclaimer" />
</template>
<b-form-radio <b-form-radio
v-model="selected" name="domain-type" value="domain" v-model="selected" name="domain-type" value="domain"