diff options
author | Christopher Ng <chrng8@gmail.com> | 2022-11-18 03:27:16 +0000 |
---|---|---|
committer | Christopher Ng <chrng8@gmail.com> | 2022-11-24 23:50:54 +0000 |
commit | 4ffc022c8b5d2a4df3b1b1452de769c4ad27fe4f (patch) | |
tree | 393ecabc260dbe942dfe62a366bbecdf27fc5c90 /apps | |
parent | 28f41059051afaf665e80e69ea2e90251aa1662e (diff) | |
download | nextcloud-server-4ffc022c8b5d2a4df3b1b1452de769c4ad27fe4f.tar.gz nextcloud-server-4ffc022c8b5d2a4df3b1b1452de769c4ad27fe4f.zip |
Copy to clipboard with button instead of link
Signed-off-by: Christopher Ng <chrng8@gmail.com>
Diffstat (limited to 'apps')
-rw-r--r-- | apps/files_sharing/src/components/SharingEntryInternal.vue | 20 | ||||
-rw-r--r-- | apps/files_sharing/src/components/SharingEntryLink.vue | 44 |
2 files changed, 39 insertions, 25 deletions
diff --git a/apps/files_sharing/src/components/SharingEntryInternal.vue b/apps/files_sharing/src/components/SharingEntryInternal.vue index 03a1ba87b71..9912648357c 100644 --- a/apps/files_sharing/src/components/SharingEntryInternal.vue +++ b/apps/files_sharing/src/components/SharingEntryInternal.vue @@ -9,27 +9,33 @@ <div class="avatar-external icon-external-white" /> </template> - <NcActionLink :href="internalLink" - :aria-label="t('files_sharing', 'Copy internal link to clipboard')" - target="_blank" - :icon="copied && copySuccess ? 'icon-checkmark-color' : 'icon-clippy'" + <NcActionButton :aria-label="t('files_sharing', 'Copy internal link to clipboard')" @click.prevent="copyLink"> + <template #icon> + <Check v-if="copied && copySuccess" :size="20" /> + <ClipboardTextMultipleOutline v-else :size="20" /> + </template> {{ clipboardTooltip }} - </NcActionLink> + </NcActionButton> </SharingEntrySimple> </ul> </template> <script> import { generateUrl } from '@nextcloud/router' -import NcActionLink from '@nextcloud/vue/dist/Components/NcActionLink' +import { NcActionButton } from '@nextcloud/vue' import SharingEntrySimple from './SharingEntrySimple' +import Check from 'vue-material-design-icons/Check.vue' +import ClipboardTextMultipleOutline from 'vue-material-design-icons/ClipboardTextMultipleOutline.vue' + export default { name: 'SharingEntryInternal', components: { - NcActionLink, + Check, + ClipboardTextMultipleOutline, + NcActionButton, SharingEntrySimple, }, diff --git a/apps/files_sharing/src/components/SharingEntryLink.vue b/apps/files_sharing/src/components/SharingEntryLink.vue index 207db7d8514..a736299b9d4 100644 --- a/apps/files_sharing/src/components/SharingEntryLink.vue +++ b/apps/files_sharing/src/components/SharingEntryLink.vue @@ -38,13 +38,14 @@ <NcActions v-if="share && !isEmailShareType && share.token" ref="copyButton" class="sharing-entry__copy"> - <NcActionLink :href="shareLink" - target="_blank" - :aria-label="t('files_sharing', 'Copy public link to clipboard')" - :icon="copied && copySuccess ? 'icon-checkmark-color' : 'icon-clippy'" + <NcActionButton :aria-label="t('files_sharing', 'Copy public link to clipboard')" @click.stop.prevent="copyLink"> + <template #icon> + <Check v-if="copied && copySuccess" :size="20" /> + <ClipboardTextMultipleOutline v-else :size="20" /> + </template> {{ clipboardTooltip }} - </NcActionLink> + </NcActionButton> </NcActions> <!-- pending actions --> @@ -303,16 +304,18 @@ import { showError } from '@nextcloud/dialogs' import { Type as ShareTypes } from '@nextcloud/sharing' import Vue from 'vue' -import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton' -import NcActionCheckbox from '@nextcloud/vue/dist/Components/NcActionCheckbox' -import NcActionInput from '@nextcloud/vue/dist/Components/NcActionInput' -import NcActionLink from '@nextcloud/vue/dist/Components/NcActionLink' -import NcActionText from '@nextcloud/vue/dist/Components/NcActionText' -import NcActionSeparator from '@nextcloud/vue/dist/Components/NcActionSeparator' -import NcActionTextEditable from '@nextcloud/vue/dist/Components/NcActionTextEditable' -import NcActions from '@nextcloud/vue/dist/Components/NcActions' -import NcAvatar from '@nextcloud/vue/dist/Components/NcAvatar' -import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip' +import { + NcActionButton, + NcActionCheckbox, + NcActionInput, + NcActionLink, + NcActions, + NcActionSeparator, + NcActionText, + NcActionTextEditable, + NcAvatar, + Tooltip, +} from '@nextcloud/vue' import ExternalShareAction from './ExternalShareAction.vue' import SharePermissionsEditor from './SharePermissionsEditor.vue' @@ -320,20 +323,25 @@ import GeneratePassword from '../utils/GeneratePassword.js' import Share from '../models/Share.js' import SharesMixin from '../mixins/SharesMixin.js' +import Check from 'vue-material-design-icons/Check.vue' +import ClipboardTextMultipleOutline from 'vue-material-design-icons/ClipboardTextMultipleOutline.vue' + export default { name: 'SharingEntryLink', components: { - NcActions, + Check, + ClipboardTextMultipleOutline, + ExternalShareAction, NcActionButton, NcActionCheckbox, NcActionInput, NcActionLink, + NcActions, + NcActionSeparator, NcActionText, NcActionTextEditable, - NcActionSeparator, NcAvatar, - ExternalShareAction, SharePermissionsEditor, }, |