Move the copy button to a standalone component

This commit is contained in:
Bubka 2024-01-19 17:06:16 +01:00
parent 342448b352
commit 5249b2ab97
2 changed files with 25 additions and 17 deletions

View File

@ -0,0 +1,21 @@
<script setup>
import { useNotifyStore } from '@/stores/notify'
const notify = useNotifyStore()
const { copy } = useClipboard({ legacy: true })
const props = defineProps({
token: String,
})
function copyToClipboard() {
copy(props.token)
notify.success({ text: trans('commons.copied_to_clipboard') })
}
</script>
<template>
<button :aria-label="$t('commons.copy_to_clipboard')" class="button is-like-text is-pulled-right is-small is-text" @click.stop="copyToClipboard()">
<FontAwesomeIcon :icon="['fas', 'copy']" />
</button>
</template>

View File

@ -1,12 +1,10 @@
<script setup>
import systemService from '@/services/systemService'
import { useNotifyStore } from '@/stores/notify'
import { UseColorMode } from '@vueuse/components'
import CopyButton from '@/components/CopyButton.vue'
const $2fauth = inject('2fauth')
const router = useRouter()
const notify = useNotifyStore()
const { copy } = useClipboard({ legacy: true })
const returnTo = router.options.history.state.back
const infos = ref()
@ -32,11 +30,6 @@
infos.value = null
})
})
function copyToClipboard(data) {
copy(data)
notify.success({ text: trans('commons.copied_to_clipboard') })
}
</script>
<template>
@ -98,9 +91,7 @@
{{ $t('commons.environment') }}
</h2>
<div v-if="infos" class="about-debug box is-family-monospace is-size-7">
<button id="btnCopyEnvVars" :aria-label="$t('commons.copy_to_clipboard')" class="button is-like-text is-pulled-right is-small is-text" @click.stop="copyToClipboard(listInfos.innerText)">
<FontAwesomeIcon :icon="['fas', 'copy']" />
</button>
<CopyButton id="btnCopyEnvVars" :token="listInfos?.innerText" />
<ul ref="listInfos" id="listInfos">
<li v-for="(value, key) in infos" :value="value" :key="key"><b>{{key}}</b>: {{value}}</li>
</ul>
@ -112,9 +103,7 @@
{{ $t('settings.admin_settings') }}
</h2>
<div v-if="adminSettings" class="about-debug box is-family-monospace is-size-7">
<button id="btnCopyAdminSettings" :aria-label="$t('commons.copy_to_clipboard')" class="button is-like-text is-pulled-right is-small is-text" @click.stop="copyToClipboard(listAdminSettings.innerText)">
<FontAwesomeIcon :icon="['fas', 'copy']" />
</button>
<CopyButton id="btnCopyAdminSettings" :token="listAdminSettings?.innerText" />
<ul ref="listAdminSettings" id="listAdminSettings">
<li v-for="(value, setting) in adminSettings" :value="value" :key="setting"><b>{{setting}}</b>: {{value}}</li>
</ul>
@ -123,9 +112,7 @@
{{ $t('settings.user_preferences') }}
</h2>
<div v-if="userPreferences" class="about-debug box is-family-monospace is-size-7">
<button id="btnCopyUserPreferences" :aria-label="$t('commons.copy_to_clipboard')" class="button is-like-text is-pulled-right is-small is-text" @click.stop="copyToClipboard(listUserPreferences.innerText)">
<FontAwesomeIcon :icon="['fas', 'copy']" />
</button>
<CopyButton id="btnCopyUserPreferences" :token="listUserPreferences?.innerText" />
<ul ref="listUserPreferences" id="listUserPreferences">
<li v-for="(value, preference) in userPreferences" :value="value" :key="preference"><b>{{preference}}</b>: {{value}}</li>
</ul>