Bump to @nextcloud/vue@6.0.0-beta.3

Signed-off-by: Julius Härtl <jus@bitgrid.net>
This commit is contained in:
Julius Härtl
2022-08-20 11:50:27 +02:00
parent e761c9aec9
commit 4be99a93c8
33 changed files with 680 additions and 596 deletions

View File

@@ -70,12 +70,12 @@
</div>
</a>
</div>
<Actions v-if="selectable">
<ActionButton icon="icon-confirm" @click="$emit('select-attachment', attachment)">
<NcActions v-if="selectable">
<NcActionButton icon="icon-confirm" @click="$emit('select-attachment', attachment)">
{{ t('deck', 'Add this attachment') }}
</ActionButton>
</Actions>
<Actions v-if="removable && !isReadOnly" :force-menu="true">
</NcActionButton>
</NcActions>
<NcActions v-if="removable && !isReadOnly" :force-menu="true">
<ActionLink v-if="attachment.extendedData.fileid" icon="icon-folder" :href="internalLink(attachment)">
{{ t('deck', 'Show in Files') }}
</ActionLink>
@@ -85,17 +85,17 @@
download>
{{ t('deck', 'Download') }}
</ActionLink>
<ActionButton v-if="attachment.extendedData.fileid && !isReadOnly" icon="icon-delete" @click="unshareAttachment(attachment)">
<NcActionButton v-if="attachment.extendedData.fileid && !isReadOnly" icon="icon-delete" @click="unshareAttachment(attachment)">
{{ t('deck', 'Remove attachment') }}
</ActionButton>
</NcActionButton>
<ActionButton v-if="!attachment.extendedData.fileid && attachment.deletedAt === 0" icon="icon-delete" @click="$emit('delete-attachment', attachment)">
<NcActionButton v-if="!attachment.extendedData.fileid && attachment.deletedAt === 0" icon="icon-delete" @click="$emit('delete-attachment', attachment)">
{{ t('deck', 'Delete Attachment') }}
</ActionButton>
<ActionButton v-else-if="!attachment.extendedData.fileid" icon="icon-history" @click="$emit('restore-attachment', attachment)">
</NcActionButton>
<NcActionButton v-else-if="!attachment.extendedData.fileid" icon="icon-history" @click="$emit('restore-attachment', attachment)">
{{ t('deck', 'Restore Attachment') }}
</ActionButton>
</Actions>
</NcActionButton>
</NcActions>
</li>
</ul>
</AttachmentDragAndDrop>
@@ -103,7 +103,7 @@
<script>
import axios from '@nextcloud/axios'
import { Actions, ActionButton, ActionLink } from '@nextcloud/vue'
import { NcActions, NcActionButton, ActionLink } from '@nextcloud/vue'
import AttachmentDragAndDrop from '../AttachmentDragAndDrop'
import relativeDate from '../../mixins/relativeDate'
import { formatFileSize } from '@nextcloud/files'
@@ -125,8 +125,8 @@ const picker = getFilePickerBuilder(t('deck', 'File to share'))
export default {
name: 'AttachmentList',
components: {
Actions,
ActionButton,
NcActions,
NcActionButton,
ActionLink,
AttachmentDragAndDrop,
},

View File

@@ -21,7 +21,7 @@
-->
<template>
<AppSidebar v-if="currentBoard && currentCard"
<NcAppSidebar v-if="currentBoard && currentCard"
:active="tabId"
:title="title"
:subtitle="subtitle"
@@ -32,57 +32,57 @@
@submit-title="handleSubmitTitle"
@close="closeSidebar">
<template #secondary-actions>
<ActionButton v-if="cardDetailsInModal" icon="icon-menu-sidebar" @click.stop="closeModal()">
<NcActionButton v-if="cardDetailsInModal" icon="icon-menu-sidebar" @click.stop="closeModal()">
{{ t('deck', 'Open in sidebar view') }}
</ActionButton>
<ActionButton v-else icon="icon-external" @click.stop="showModal()">
</NcActionButton>
<NcActionButton v-else icon="icon-external" @click.stop="showModal()">
{{ t('deck', 'Open in bigger view') }}
</ActionButton>
</NcActionButton>
<ActionButton v-for="action in cardActions"
<NcActionButton v-for="action in cardActions"
:key="action.label"
:close-after-click="true"
:icon="action.icon"
@click="action.callback(cardRichObject)">
{{ action.label }}
</ActionButton>
</NcActionButton>
</template>
<AppSidebarTab id="details"
<NcAppSidebarTab id="details"
:order="0"
:name="t('deck', 'Details')"
icon="icon-home">
<CardSidebarTabDetails :card="currentCard" />
</AppSidebarTab>
</NcAppSidebarTab>
<AppSidebarTab id="attachments"
<NcAppSidebarTab id="attachments"
:order="1"
:name="t('deck', 'Attachments')">
<template #icon>
<AttachmentIcon size="20" decorative />
</template>
<CardSidebarTabAttachments :card="currentCard" />
</AppSidebarTab>
</NcAppSidebarTab>
<AppSidebarTab id="comments"
<NcAppSidebarTab id="comments"
:order="2"
:name="t('deck', 'Comments')"
icon="icon-comment">
<CardSidebarTabComments :card="currentCard" :tab-query="tabQuery" />
</AppSidebarTab>
</NcAppSidebarTab>
<AppSidebarTab v-if="hasActivity"
<NcAppSidebarTab v-if="hasActivity"
id="timeline"
:order="3"
:name="t('deck', 'Timeline')"
icon="icon-activity">
<CardSidebarTabActivity :card="currentCard" />
</AppSidebarTab>
</AppSidebar>
</NcAppSidebarTab>
</NcAppSidebar>
</template>
<script>
import { ActionButton, AppSidebar, AppSidebarTab } from '@nextcloud/vue'
import { NcActionButton, NcAppSidebar, NcAppSidebarTab } from '@nextcloud/vue'
import { generateUrl } from '@nextcloud/router'
import { mapState, mapGetters } from 'vuex'
import CardSidebarTabDetails from './CardSidebarTabDetails'
@@ -101,9 +101,9 @@ const capabilities = window.OC.getCapabilities()
export default {
name: 'CardSidebar',
components: {
AppSidebar,
AppSidebarTab,
ActionButton,
NcAppSidebar,
NcAppSidebarTab,
NcActionButton,
CardSidebarTabAttachments,
CardSidebarTabComments,
CardSidebarTabActivity,

View File

@@ -1,7 +1,7 @@
<template>
<div>
<div class="comment--header">
<Avatar :user="currentUser.uid" />
<NcAvatar :user="currentUser.uid" />
<span class="has-tooltip username">
{{ currentUser.displayName }}
</span>
@@ -35,7 +35,7 @@
<script>
import { mapState, mapGetters } from 'vuex'
import { Avatar } from '@nextcloud/vue'
import { NcAvatar } from '@nextcloud/vue'
import CommentItem from './CommentItem'
import CommentForm from './CommentForm'
import InfiniteLoading from 'vue-infinite-loading'
@@ -44,7 +44,7 @@ import { getCurrentUser } from '@nextcloud/auth'
export default {
name: 'CardSidebarTabComments',
components: {
Avatar,
NcAvatar,
CommentItem,
CommentForm,
InfiniteLoading,

View File

@@ -27,7 +27,7 @@
<span class="hidden-visually">{{ t('deck', 'Tags') }}</span>
</div>
<div class="section-details">
<Multiselect v-model="assignedLabels"
<NcMultiselect v-model="assignedLabels"
:multiple="true"
:disabled="!canEdit"
:options="labelsSorted"
@@ -47,7 +47,7 @@
{{ scope.option.title }}
</div>
</template>
</Multiselect>
</NcMultiselect>
</div>
</div>
@@ -56,7 +56,7 @@
<span class="hidden-visually">{{ t('deck', 'Assign to users/groups/circles') }}</span>
</div>
<div class="section-details">
<Multiselect v-if="canEdit"
<NcMultiselect v-if="canEdit"
v-model="assignedUsers"
:multiple="true"
:options="formatedAssignables"
@@ -69,16 +69,16 @@
@remove="removeUserFromCard">
<template #tag="scope">
<div class="avatarlist--inline">
<Avatar :user="scope.option.uid"
<NcAvatar :user="scope.option.uid"
:display-name="scope.option.displayname"
:size="24"
:is-no-user="scope.option.isNoUser"
:disable-menu="true" />
</div>
</template>
</Multiselect>
</NcMultiselect>
<div v-else class="avatar-list--readonly">
<Avatar v-for="option in assignedUsers"
<NcAvatar v-for="option in assignedUsers"
:key="option.primaryKey"
:user="option.uid"
:display-name="option.displayname"
@@ -93,7 +93,7 @@
<span class="hidden-visually">{{ t('deck', 'Due date') }}</span>
</div>
<div class="section-details">
<DatetimePicker v-model="duedate"
<NcDatetimePicker v-model="duedate"
:placeholder="t('deck', 'Set a due date')"
type="datetime"
:minute-step="5"
@@ -103,11 +103,11 @@
:disabled="saving || !canEdit"
:shortcuts="shortcuts"
confirm />
<Actions v-if="canEdit">
<ActionButton v-if="copiedCard.duedate" icon="icon-delete" @click="removeDue()">
<NcActions v-if="canEdit">
<NcActionButton v-if="copiedCard.duedate" icon="icon-delete" @click="removeDue()">
{{ t('deck', 'Remove due date') }}
</ActionButton>
</Actions>
</NcActionButton>
</NcActions>
</div>
</div>
@@ -125,7 +125,7 @@
<script>
import { mapState, mapGetters } from 'vuex'
import moment from '@nextcloud/moment'
import { Avatar, Actions, ActionButton, Multiselect, DatetimePicker } from '@nextcloud/vue'
import { NcAvatar, NcActions, NcActionButton, NcMultiselect, NcDatetimePicker } from '@nextcloud/vue'
import { loadState } from '@nextcloud/initial-state'
import { CollectionList } from 'nextcloud-vue-collections'
@@ -142,11 +142,11 @@ export default {
name: 'CardSidebarTabDetails',
components: {
Description,
Multiselect,
DatetimePicker,
Actions,
ActionButton,
Avatar,
NcMultiselect,
NcDatetimePicker,
NcActions,
NcActionButton,
NcAvatar,
CollectionList,
},
mixins: [Color],

View File

@@ -29,12 +29,12 @@
name-key="displayname"
:tab-select="true">
<template #item="s">
<Avatar class="atwho-li--avatar" :user="s.item.uid" :size="24" />
<NcAvatar class="atwho-li--avatar" :user="s.item.uid" :size="24" />
<span class="atwho-li--name" v-text="s.item.displayname" />
</template>
<template #embeddedItem="scope">
<span>
<UserBubble v-if="scope.current.uid"
<NcUserBubble v-if="scope.current.uid"
:data-mention-id="scope.current.uid"
:user="scope.current.uid"
:display-name="scope.current.displayname" />
@@ -63,7 +63,7 @@
<script>
import { mapState } from 'vuex'
import { UserBubble, Avatar } from '@nextcloud/vue'
import { NcUserBubble, NcAvatar } from '@nextcloud/vue'
import At from 'vue-at'
import { rawToParsed } from '../../helpers/mentions'
@@ -71,8 +71,8 @@ export default {
name: 'CommentForm',
components: {
At,
Avatar,
UserBubble,
NcAvatar,
NcUserBubble,
},
props: {
value: {

View File

@@ -4,13 +4,13 @@
<div class="reply--header">
<div class="reply--hint">
{{ t('deck', 'In reply to') }}
<UserBubble :user="comment.actorId" :display-name="comment.actorDisplayName" />
<NcUserBubble :user="comment.actorId" :display-name="comment.actorDisplayName" />
</div>
<Actions v-if="preview" class="reply--cancel">
<ActionButton icon="icon-close" @click="$emit('cancel')">
<NcActions v-if="preview" class="reply--cancel">
<NcActionButton icon="icon-close" @click="$emit('cancel')">
{{ t('deck', 'Cancel reply') }}
</ActionButton>
</Actions>
</NcActionButton>
</NcActions>
</div>
<RichText class="comment--content"
:text="richText(comment)"
@@ -20,33 +20,33 @@
</div>
<li v-else class="comment">
<div class="comment--header">
<Avatar :user="comment.actorId" />
<NcAvatar :user="comment.actorId" />
<span class="has-tooltip username">
{{ comment.actorDisplayName }}
</span>
<Actions v-show="!edit" :force-menu="true">
<ActionButton :close-after-click="true" @click="replyTo()">
<NcActions v-show="!edit" :force-menu="true">
<NcActionButton :close-after-click="true" @click="replyTo()">
<template #icon>
<ReplyIcon decorative />
</template>
{{ t('deck', 'Reply') }}
</ActionButton>
<ActionButton v-if="canEdit"
</NcActionButton>
<NcActionButton v-if="canEdit"
icon="icon-rename"
:close-after-click="true"
@click="showUpdateForm()">
{{ t('deck', 'Update') }}
</ActionButton>
<ActionButton v-if="canEdit"
</NcActionButton>
<NcActionButton v-if="canEdit"
icon="icon-delete"
:close-after-click="true"
@click="deleteComment()">
{{ t('deck', 'Delete') }}
</ActionButton>
</Actions>
<Actions v-if="edit">
<ActionButton icon="icon-close" @click="hideUpdateForm" />
</Actions>
</NcActionButton>
</NcActions>
<NcActions v-if="edit">
<NcActionButton icon="icon-close" @click="hideUpdateForm" />
</NcActions>
<div class="spacer" />
<div class="timestamp">
{{ relativeDate(comment.creationDateTime) }}
@@ -64,7 +64,7 @@
</template>
<script>
import { Avatar, Actions, ActionButton, UserBubble } from '@nextcloud/vue'
import { NcAvatar, NcActions, NcActionButton, NcUserBubble } from '@nextcloud/vue'
import RichText from '@juliushaertl/vue-richtext'
import CommentForm from './CommentForm'
import { getCurrentUser } from '@nextcloud/auth'
@@ -80,7 +80,7 @@ const AtMention = {
return createElement(
'span',
{ attrs: { 'data-at-embedded': true, contenteditable: false } },
[createElement(UserBubble, { props: { user, displayName }, attrs: { 'data-mention-id': user } })]
[createElement(NcUserBubble, { props: { user, displayName }, attrs: { 'data-mention-id': user } })]
)
},
}
@@ -88,10 +88,10 @@ const AtMention = {
export default {
name: 'CommentItem',
components: {
Avatar,
UserBubble,
Actions,
ActionButton,
NcAvatar,
NcUserBubble,
NcActions,
NcActionButton,
CommentForm,
RichText,
ReplyIcon,

View File

@@ -30,22 +30,22 @@
href="https://deck.readthedocs.io/en/latest/Markdown/"
target="_blank"
class="icon icon-info" />
<Actions v-if="canEdit">
<ActionButton v-if="!descriptionEditing" icon="icon-rename" @click="showEditor()">
<NcActions v-if="canEdit">
<NcActionButton v-if="!descriptionEditing" icon="icon-rename" @click="showEditor()">
{{ t('deck', 'Edit description') }}
</ActionButton>
<ActionButton v-else icon="icon-toggle" @click="hideEditor()">
</NcActionButton>
<NcActionButton v-else icon="icon-toggle" @click="hideEditor()">
{{ t('deck', 'View description') }}
</ActionButton>
</Actions>
<Actions v-if="canEdit">
<ActionButton v-if="descriptionEditing" @click="showAttachmentModal()">
</NcActionButton>
</NcActions>
<NcActions v-if="canEdit">
<NcActionButton v-if="descriptionEditing" @click="showAttachmentModal()">
<template #icon>
<PaperclipIcon :size="24" decorative />
</template>
{{ t('deck', 'Add Attachment') }}
</ActionButton>
</Actions>
</NcActionButton>
</NcActions>
</h5>
<div v-if="!descriptionEditing && hasDescription"
@@ -63,14 +63,14 @@
@update:modelValue="updateDescription"
@blur="saveDescription" />
<Modal v-if="modalShow" :title="t('deck', 'Choose attachment')" @close="modalShow=false">
<NcModal v-if="modalShow" :title="t('deck', 'Choose attachment')" @close="modalShow=false">
<div class="modal__content">
<h3>{{ t('deck', 'Choose attachment') }}</h3>
<AttachmentList :card-id="card.id"
:selectable="true"
@select-attachment="addAttachment" />
</div>
</Modal>
</NcModal>
</div>
</template>
@@ -79,7 +79,7 @@ import MarkdownIt from 'markdown-it'
import MarkdownItTaskCheckbox from 'markdown-it-task-checkbox'
import MarkdownItLinkAttributes from 'markdown-it-link-attributes'
import AttachmentList from './AttachmentList'
import { Actions, ActionButton, Modal } from '@nextcloud/vue'
import { NcActions, NcActionButton, NcModal } from '@nextcloud/vue'
import { formatFileSize } from '@nextcloud/files'
import { generateUrl } from '@nextcloud/router'
import { mapState, mapGetters } from 'vuex'
@@ -101,9 +101,9 @@ export default {
name: 'Description',
components: {
VueEasymde: () => import('vue-easymde/dist/VueEasyMDE.common'),
Actions,
ActionButton,
Modal,
NcActions,
NcActionButton,
NcModal,
AttachmentList,
PaperclipIcon,
},