diff options
| author | Richard Steinmetz <richard@steinmetz.cloud> | 2024-11-05 09:47:15 +0100 |
|---|---|---|
| committer | Richard Steinmetz <richard@steinmetz.cloud> | 2025-01-09 14:41:41 +0100 |
| commit | f91446023d3b93b9c5b7f6f998a047d16b461458 (patch) | |
| tree | 00d9c09f28bef2de05f02db1dd6d4c90ff48ac38 /core/src | |
| parent | 33b564dfa9de9de06a4e5dfebcc7e204e31c9e5a (diff) | |
| download | nextcloud-server-f91446023d3b93b9c5b7f6f998a047d16b461458.tar.gz nextcloud-server-f91446023d3b93b9c5b7f6f998a047d16b461458.zip | |
feat(contacts-menu): implement custom javascript hook actionfeat/contacts-menu/js-hook-action
Signed-off-by: Richard Steinmetz <richard@steinmetz.cloud>
Diffstat (limited to 'core/src')
| -rw-r--r-- | core/src/components/ContactsMenu/Contact.vue | 27 |
1 files changed, 25 insertions, 2 deletions
diff --git a/core/src/components/ContactsMenu/Contact.vue b/core/src/components/ContactsMenu/Contact.vue index d7de04efe17..ec74697341c 100644 --- a/core/src/components/ContactsMenu/Contact.vue +++ b/core/src/components/ContactsMenu/Contact.vue @@ -23,7 +23,7 @@ :inline="contact.topAction ? 1 : 0"> <template v-for="(action, idx) in actions"> <NcActionLink v-if="action.hyperlink !== '#'" - :key="idx" + :key="`${idx}-link`" :href="action.hyperlink" class="other-actions"> <template #icon> @@ -31,13 +31,24 @@ </template> {{ action.title }} </NcActionLink> - <NcActionText v-else :key="idx" class="other-actions"> + <NcActionText v-else :key="`${idx}-text`" class="other-actions"> <template #icon> <img aria-hidden="true" class="contact__action__icon" :src="action.icon"> </template> {{ action.title }} </NcActionText> </template> + <NcActionButton v-for="action in jsActions" + :key="action.id" + :close-after-click="true" + class="other-actions" + @click="action.callback(contact)"> + <template #icon> + <NcIconSvgWrapper class="contact__action__icon-svg" + :svg="action.iconSvg(contact)" /> + </template> + {{ action.displayName(contact) }} + </NcActionButton> </NcActions> </li> </template> @@ -45,16 +56,21 @@ <script> import NcActionLink from '@nextcloud/vue/dist/Components/NcActionLink.js' import NcActionText from '@nextcloud/vue/dist/Components/NcActionText.js' +import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js' import NcActions from '@nextcloud/vue/dist/Components/NcActions.js' import NcAvatar from '@nextcloud/vue/dist/Components/NcAvatar.js' +import NcIconSvgWrapper from '@nextcloud/vue/dist/Components/NcIconSvgWrapper.js' +import { getEnabledContactsMenuActions } from '@nextcloud/vue/dist/Functions/contactsMenu.js' export default { name: 'Contact', components: { NcActionLink, NcActionText, + NcActionButton, NcActions, NcAvatar, + NcIconSvgWrapper, }, props: { contact: { @@ -69,6 +85,9 @@ export default { } return this.contact.actions }, + jsActions() { + return getEnabledContactsMenuActions(this.contact) + }, preloadedUserStatus() { if (this.contact.status) { return { @@ -98,6 +117,10 @@ export default { padding: 12px; filter: var(--background-invert-if-dark); } + + &__icon-svg { + padding: 5px; + } } &__avatar { |