feat: update to new slot syntax

Prepare for vue 3
This commit is contained in:
Dominik Pschenitschni 2021-08-19 19:55:13 +02:00 committed by kolaente
parent 77f8b27dc6
commit 4454e6cf22
Signed by: konrad
GPG Key ID: F40E70337AB24C9B
18 changed files with 104 additions and 106 deletions

View File

@ -49,7 +49,7 @@
<div class="user"> <div class="user">
<img :src="userAvatar" alt="" class="avatar" width="40" height="40"/> <img :src="userAvatar" alt="" class="avatar" width="40" height="40"/>
<dropdown class="is-right" ref="usernameDropdown"> <dropdown class="is-right" ref="usernameDropdown">
<template v-slot:trigger> <template #trigger>
<x-button <x-button
type="secondary" type="secondary"
:shadow="false"> :shadow="false">

View File

@ -1,33 +1,24 @@
<template> <template>
<notifications position="bottom left" :max="2" class="global-notification"> <notifications position="bottom left" :max="2" class="global-notification">
<template slot="body" slot-scope="props"> <template #body="{ item, close }">
<div <div
:class="[ :class="[
'vue-notification-template', 'vue-notification-template',
'vue-notification', 'vue-notification',
props.item.type, item.type,
]" ]"
@click="close(props)" @click="close()"
> >
<div <div v-if="item.title" class="notification-title">{{ item.title }}</div>
class="notification-title" <div class="notification-content">
v-if="props.item.title" <template v-for="(t, k) in item.text">{{ t }}<br :key="k"/></template>
>
{{ props.item.title }}
</div>
<div
class="notification-content"
>
<template v-for="(t, k) in props.item.text">
{{ t }}<br :key="k"/>
</template>
</div> </div>
<div <div
class="buttons is-right" class="buttons is-right"
v-if=" v-if="
props.item.data && item.data &&
props.item.data.actions && item.data.actions &&
props.item.data.actions.length > 0 item.data.actions.length > 0
" "
> >
<x-button <x-button
@ -36,7 +27,7 @@
:shadow="false" :shadow="false"
class="is-small" class="is-small"
type="secondary" type="secondary"
v-for="(action, i) in props.item.data.actions" v-for="(action, i) in item.data.actions"
> >
{{ action.title }} {{ action.title }}
</x-button> </x-button>
@ -49,11 +40,6 @@
<script> <script>
export default { export default {
name: 'notification', name: 'notification',
methods: {
close(props) {
props.close()
},
},
} }
</script> </script>

View File

@ -163,10 +163,13 @@
@submit="remove()" @submit="remove()"
v-if="showDeleteModal" v-if="showDeleteModal"
> >
<span slot="header">{{ $t('list.share.links.remove') }}</span> <template #header>
<p slot="text"> <span>{{ $t('list.share.links.remove') }}</span>
{{ $t('list.share.links.removeText') }} </template>
</p>
<template #text>
<p>{{ $t('list.share.links.removeText') }}</p>
</template>
</modal> </modal>
</transition> </transition>
</div> </div>

View File

@ -119,12 +119,12 @@
@submit="deleteSharable()" @submit="deleteSharable()"
v-if="showDeleteModal" v-if="showDeleteModal"
> >
<span slot="header"> <template #header>
{{ $t('list.share.userTeam.removeHeader', {type: shareTypeName, sharable: sharableName}) }} <span>{{ $t('list.share.userTeam.removeHeader', {type: shareTypeName, sharable: sharableName}) }}</span>
</span> </template>
<p slot="text"> <template #text>
{{ $t('list.share.userTeam.removeText', {type: shareTypeName, sharable: sharableName}) }} <p>{{ $t('list.share.userTeam.removeText', {type: shareTypeName, sharable: sharableName}) }}</p>
</p> </template>
</modal> </modal>
</transition> </transition>
</div> </div>

View File

@ -110,11 +110,12 @@
v-if="showDeleteModal" v-if="showDeleteModal"
@submit="deleteAttachment()" @submit="deleteAttachment()"
> >
<span slot="header">{{ $t('task.attachment.delete') }}</span> <template #header><span>{{ $t('task.attachment.delete') }}</span></template>
<p slot="text">
{{ $t('task.attachment.deleteText1', {filename: attachmentToDelete.file.name}) }}<br/> <template #text>
<strong>{{ $t('task.attachment.deleteText2') }}</strong> <p>{{ $t('task.attachment.deleteText1', {filename: attachmentToDelete.file.name}) }}<br/>
</p> <strong>{{ $t('task.attachment.deleteText2') }}</strong></p>
</template>
</modal> </modal>
</transition> </transition>

View File

@ -138,11 +138,12 @@
@submit="deleteComment()" @submit="deleteComment()"
v-if="showDeleteModal" v-if="showDeleteModal"
> >
<span slot="header">{{ $t('task.comment.delete') }}</span> <template #header><span>{{ $t('task.comment.delete') }}</span></template>
<p slot="text">
{{ $t('task.comment.deleteText1') }}<br/> <template #text>
<strong>{{ $t('task.comment.deleteText2') }}</strong> <p>{{ $t('task.comment.deleteText1') }}<br/>
</p> <strong>{{ $t('task.comment.deleteText2') }}</strong></p>
</template>
</modal> </modal>
</transition> </transition>
</div> </div>

View File

@ -16,7 +16,7 @@
v-model="assignees" v-model="assignees"
ref="multiselect" ref="multiselect"
> >
<template v-slot:tag="props"> <template #tag="props">
<span class="assignee"> <span class="assignee">
<user :avatar-size="32" :show-username="false" :user="props.item"/> <user :avatar-size="32" :show-username="false" :user="props.item"/>
<a @click="removeAssignee(props.item)" class="remove-assignee" v-if="!disabled"> <a @click="removeAssignee(props.item)" class="remove-assignee" v-if="!disabled">

View File

@ -13,7 +13,7 @@
v-model="labels" v-model="labels"
:search-delay="10" :search-delay="10"
> >
<template v-slot:tag="props"> <template #tag="props">
<span <span
:style="{'background': props.item.hexColor, 'color': props.item.textColor}" :style="{'background': props.item.hexColor, 'color': props.item.textColor}"
class="tag"> class="tag">
@ -21,7 +21,7 @@
<a @click="removeLabel(props.item)" class="delete is-small"></a> <a @click="removeLabel(props.item)" class="delete is-small"></a>
</span> </span>
</template> </template>
<template v-slot:searchResult="props"> <template #searchResult="props">
<span <span
v-if="typeof props.option === 'string'" v-if="typeof props.option === 'string'"
class="tag"> class="tag">

View File

@ -10,7 +10,7 @@
v-model="list" v-model="list"
:select-placeholder="$t('list.searchSelect')" :select-placeholder="$t('list.searchSelect')"
> >
<template v-slot:searchResult="props"> <template #searchResult="props">
<span class="list-namespace-title search-result">{{ namespace(props.option.namespaceId) }} ></span> <span class="list-namespace-title search-result">{{ namespace(props.option.namespaceId) }} ></span>
{{ props.option.title }} {{ props.option.title }}
</template> </template>

View File

@ -36,7 +36,7 @@
:create-placeholder="$t('task.relation.createPlaceholder')" :create-placeholder="$t('task.relation.createPlaceholder')"
@create="createAndRelateTask" @create="createAndRelateTask"
> >
<template v-slot:searchResult="props"> <template #searchResult="props">
<span v-if="typeof props.option !== 'string'" class="search-result"> <span v-if="typeof props.option !== 'string'" class="search-result">
<span <span
class="different-list" class="different-list"
@ -107,12 +107,14 @@
<modal <modal
@close="showDeleteModal = false" @close="showDeleteModal = false"
@submit="removeTaskRelation()" @submit="removeTaskRelation()"
v-if="showDeleteModal"> v-if="showDeleteModal"
<span slot="header">{{ $t('task.relation.delete') }}</span> >
<p slot="text"> <template #header><span>{{ $t('task.relation.delete') }}</span></template>
{{ $t('task.relation.deleteText1') }}<br/>
<strong>{{ $t('task.relation.deleteText2') }}</strong> <template #text>
</p> <p>{{ $t('task.relation.deleteText1') }}<br/>
<strong>{{ $t('task.relation.deleteText2') }}</strong></p>
</template>
</modal> </modal>
</transition> </transition>
</div> </div>

View File

@ -3,10 +3,11 @@
@close="$router.back()" @close="$router.back()"
@submit="deleteSavedFilter()" @submit="deleteSavedFilter()"
> >
<span slot="header">{{ $t('filters.delete.header') }}</span> <template #header><span>{{ $t('filters.delete.header') }}</span></template>
<p slot="text">
{{ $t('filters.delete.text') }} <template #text>
</p> <p>{{ $t('filters.delete.text') }}</p>
</template>
</modal> </modal>
</template> </template>

View File

@ -3,13 +3,11 @@
@close="$router.back()" @close="$router.back()"
@submit="archiveList()" @submit="archiveList()"
> >
<span slot="header">{{ list.isArchived ? $t('list.archive.unarchive') : $t('list.archive.archive') }}</span> <template #header><span>{{ list.isArchived ? $t('list.archive.unarchive') : $t('list.archive.archive') }}</span></template>
<p slot="text" v-if="list.isArchived">
{{ $t('list.archive.unarchiveText') }} <template #text>
</p> <p>{{ list.isArchived ? $t('list.archive.unarchiveText') : $t('list.archive.archiveText') }}</p>
<p slot="text" v-else> </template>
{{ $t('list.archive.archiveText') }}
</p>
</modal> </modal>
</template> </template>

View File

@ -3,11 +3,12 @@
@close="$router.back()" @close="$router.back()"
@submit="deleteList()" @submit="deleteList()"
> >
<span slot="header">{{ $t('list.delete.header') }}</span> <template #header><span>{{ $t('list.delete.header') }}</span></template>
<p slot="text">
{{ $t('list.delete.text1') }}<br/> <template #text>
{{ $t('list.delete.text2') }} <p>{{ $t('list.delete.text1') }}<br/>
</p> {{ $t('list.delete.text2') }}</p>
</template>
</modal> </modal>
</template> </template>

View File

@ -220,12 +220,14 @@
<modal <modal
@close="showBucketDeleteModal = false" @close="showBucketDeleteModal = false"
@submit="deleteBucket()" @submit="deleteBucket()"
v-if="showBucketDeleteModal"> v-if="showBucketDeleteModal"
<span slot="header">{{ $t('list.kanban.deleteHeaderBucket') }}</span> >
<p slot="text"> <template #header><span>{{ $t('list.kanban.deleteHeaderBucket') }}</span></template>
{{ $t('list.kanban.deleteBucketText1') }}<br/>
{{ $t('list.kanban.deleteBucketText2') }} <template #text>
</p> <p>{{ $t('list.kanban.deleteBucketText1') }}<br/>
{{ $t('list.kanban.deleteBucketText2') }}</p>
</template>
</modal> </modal>
</transition> </transition>
</div> </div>

View File

@ -3,13 +3,11 @@
@close="$router.back()" @close="$router.back()"
@submit="archiveNamespace()" @submit="archiveNamespace()"
> >
<span slot="header">{{ title }}</span> <template #header><span>{{ title }}</span></template>
<p slot="text" v-if="namespace.isArchived">
{{ $t('namespace.archive.unarchiveText') }} <template #text>
</p> <p>{{ list.isArchived ? $t('namespace.archive.unarchiveText') : $t('namespace.archive.archiveText') }}</p>
<p slot="text" v-else> </template>
{{ $t('namespace.archive.archiveText') }}
</p>
</modal> </modal>
</template> </template>

View File

@ -3,11 +3,12 @@
@close="$router.back()" @close="$router.back()"
@submit="deleteNamespace()" @submit="deleteNamespace()"
> >
<span slot="header">{{ title }}</span> <template #header><span>{{ title }}</span></template>
<p slot="text">
{{ $t('namespace.delete.text1') }}<br/> <template #text>
{{ $t('namespace.delete.text2') }} <p>{{ $t('namespace.delete.text1') }}<br/>
</p> {{ $t('namespace.delete.text2') }}</p>
</template>
</modal> </modal>
</template> </template>

View File

@ -405,12 +405,14 @@
<modal <modal
@close="showDeleteModal = false" @close="showDeleteModal = false"
@submit="deleteTask()" @submit="deleteTask()"
v-if="showDeleteModal"> v-if="showDeleteModal"
<span slot="header">{{ $t('task.detail.delete.header') }}</span> >
<p slot="text"> <template #header><span>{{ $t('task.detail.delete.header') }}</span></template>
{{ $t('task.detail.delete.text1') }}<br/>
{{ $t('task.detail.delete.text2') }} <template #text>
</p> <p>{{ $t('task.detail.delete.text1') }}<br/>
{{ $t('task.detail.delete.text2') }}</p>
</template>
</modal> </modal>
</transition> </transition>
</div> </div>

View File

@ -134,11 +134,12 @@
@submit="deleteTeam()" @submit="deleteTeam()"
v-if="showDeleteModal" v-if="showDeleteModal"
> >
<span slot="header">{{ $t('team.edit.delete.header') }}</span> <template #header><span>{{ $t('team.edit.delete.header') }}</span></template>
<p slot="text">
{{ $t('team.edit.delete.text1') }}<br/> <template #text>
{{ $t('team.edit.delete.text2') }} <p>{{ $t('team.edit.delete.text1') }}<br/>
</p> {{ $t('team.edit.delete.text2') }}</p>
</template>
</modal> </modal>
</transition> </transition>
<!-- User delete modal --> <!-- User delete modal -->
@ -148,11 +149,12 @@
@submit="deleteUser()" @submit="deleteUser()"
v-if="showUserDeleteModal" v-if="showUserDeleteModal"
> >
<span slot="header">{{ $t('team.edit.deleteUser.header') }}</span> <template #header><span>{{ $t('team.edit.deleteUser.header') }}</span></template>
<p slot="text">
{{ $t('team.edit.deleteUser.text1') }} <template #text>
{{ $t('team.edit.deleteUser.text2') }} <p>{{ $t('team.edit.deleteUser.text1') }}<br/>
</p> {{ $t('team.edit.deleteUser.text2') }}</p>
</template>
</modal> </modal>
</transition> </transition>
</div> </div>