extern/2FAuth
1
0
Fork 0
mirror of https://github.com/Bubka/2FAuth.git synced 2025-08-09 21:57:47 +02:00
Code Issues Packages Projects Releases Wiki Activity

Replace the local VueFooter with 2fauth/ui VueFooter component

Browse Source
This commit is contained in:
Bubka
2025-06-24 14:18:51 +02:00
parent 4a8f251d92
commit 026515aa26
22 changed files with 128 additions and 181 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
resources/js/app.js vendored
View File

@ -18,6 +18,7 @@ const $2fauth = {
isTestingApp: window.isTestingApp, isTestingApp: window.isTestingApp,
langs: window.appLocales, langs: window.appLocales,
urls: window.urls, urls: window.urls,
context: 'webapp',
} }
app.provide('2fauth', readonly($2fauth)) app.provide('2fauth', readonly($2fauth))
@ -41,7 +42,6 @@ app.use(Notifications)
// Global components registration // Global components registration
import ResponsiveWidthWrapper from '@/layouts/ResponsiveWidthWrapper.vue' import ResponsiveWidthWrapper from '@/layouts/ResponsiveWidthWrapper.vue'
import FormWrapper from '@/layouts/FormWrapper.vue' import FormWrapper from '@/layouts/FormWrapper.vue'
import Footer from '@/layouts/Footer.vue'
import Kicker from '@/components/Kicker.vue' import Kicker from '@/components/Kicker.vue'
import { import {
@ -57,6 +57,7 @@ import {
} from '@2fauth/formcontrols' } from '@2fauth/formcontrols'
import { import {
VueFooter,
Modal Modal
} from '@2fauth/ui' } from '@2fauth/ui'
@ -64,7 +65,7 @@ app
.component('FontAwesomeIcon', FontAwesomeIcon) .component('FontAwesomeIcon', FontAwesomeIcon)
.component('ResponsiveWidthWrapper', ResponsiveWidthWrapper) .component('ResponsiveWidthWrapper', ResponsiveWidthWrapper)
.component('FormWrapper', FormWrapper) .component('FormWrapper', FormWrapper)
.component('VueFooter', Footer) .component('VueFooter', VueFooter)
.component('Modal', Modal) .component('Modal', Modal)
.component('VueButton', VueButton) .component('VueButton', VueButton)
.component('NavigationButton', NavigationButton) .component('NavigationButton', NavigationButton)
@ -92,6 +93,15 @@ app
// App mounting // App mounting
app.mount('#app') app.mount('#app')
// Theme // App inject for footer
// TODO : Try to avoid those global injection
import { useUserStore } from '@/stores/user' import { useUserStore } from '@/stores/user'
useUserStore().applyUserPrefs() import { useAppSettingsStore } from '@/stores/appSettings'
const user = useUserStore()
const appSettings = useAppSettingsStore()
user.applyUserPrefs()
app.provide('userStore', user)
app.provide('appSettingsStore', appSettings)

14
resources/js/components/DestinationGroupSelector.vue
View File

@ -57,12 +57,14 @@
</div> </div>
</div> </div>
</div> </div>
<VueFooter :showButtons="true"> <VueFooter>
<!-- Move to selected group button --> <template #default>
<p class="control"> <!-- Move to selected group button -->
<button type="button" class="button is-link is-rounded" @click="moveAccounts">{{ $t('message.move') }}</button> <p class="control">
</p> <button type="button" class="button is-link is-rounded" @click="moveAccounts">{{ $t('message.move') }}</button>
<NavigationButton action="cancel" :useLinkTag="false" @canceled="$emit('update:showDestinationGroupSelector', false)" /> </p>
<NavigationButton action="cancel" :useLinkTag="false" @canceled="$emit('update:showDestinationGroupSelector', false)" />
</template>
</VueFooter> </VueFooter>
</div> </div>
</template> </template>

6
resources/js/components/GroupSwitch.vue
View File

@ -44,8 +44,10 @@
</div> </div>
</div> </div>
</div> </div>
<VueFooter :showButtons="true"> <VueFooter>
<NavigationButton action="close" :useLinkTag="false" @closed="$emit('update:showGroupSwitch', false)" /> <template #default>
<NavigationButton action="close" :useLinkTag="false" @closed="$emit('update:showGroupSwitch', false)" />
</template>
</VueFooter> </VueFooter>
</div> </div>
</template> </template>

110
resources/js/layouts/Footer.vue
View File

@ -1,110 +0,0 @@
<script setup>
import { useAppSettingsStore } from '@/stores/appSettings'
import { useUserStore } from '@/stores/user'
import { UseColorMode } from '@vueuse/components'
import { useI18n } from 'vue-i18n'
const { t } = useI18n()
const appSettings = useAppSettingsStore()
const user = useUserStore()
const $2fauth = inject('2fauth')
const showMenu = ref(false)
const props = defineProps({
showButtons: true,
internalFooterType: {
type: String,
default: 'navLinks'
}
})
function logout() {
if(confirm(t('message.auth.confirm.logout'))) {
user.logout()
}
}
</script>
<template>
<footer class="main" :class="{ 'menu' : showMenu }">
<!-- action buttons -->
<div class="columns is-gapless" v-if="showButtons && ! showMenu">
<div class="column has-text-centered">
<div class="field is-grouped">
<slot></slot>
</div>
</div>
</div>
<!-- sub-links -->
<div v-if="internalFooterType == 'doneButton'" class="content has-text-centered">
<!-- done link -->
<button type="button" id="lnkExitEdit" class="button is-ghost is-like-text" @click.stop="$emit('doneButtonClicked', true)">{{ $t('message.done') }}</button>
</div>
<div v-else-if="internalFooterType == 'modal'" class="content has-text-centered">
<!-- back to home link -->
<router-link v-if="$route.name != 'accounts'" id="lnkBackToHome" :to="{ name: 'accounts' }" class="has-text-grey">{{ $t('message.back_to_home') }}</router-link>
<span v-else>&nbsp;</span>
</div>
<div v-else class="content has-text-centered">
<div v-if="$route.meta.showAbout === true">
<!-- about link -->
<router-link v-if="$route.name != 'about'" id="lnkAbout" :to="{ name: 'about' }" class="has-text-grey">
<span v-if="user.isAuthenticated && $route.meta.watchedByKicker" class="has-text-weight-bold">2FAuth – v{{ $2fauth.version }}</span>
<span v-else class="">{{ $t('message.about') }}</span>
</router-link>
<span v-else>&nbsp;</span>
</div>
<!-- email + menu links -->
<div v-else-if="user.preferences.showEmailInFooter">
<ul v-if="showMenu == true" class="ml-0 mt-1">
<!-- settings link -->
<li class="column">
<router-link id="lnkSettings" :to="{ name: 'settings.options' }">
{{ $t('message.settings.settings') }}
</router-link>
</li>
<!-- admin link -->
<li v-if="user.isAdmin" class="column">
<router-link id="lnkAdmin" :to="{ name: 'admin.appSetup' }" >
<span v-if="appSettings.latestRelease && appSettings.checkForUpdate" class="release-flag"></span>
{{ $t('message.admin.admin_panel') }}
</router-link>
</li>
<!-- sign-out button -->
<li v-if="!$2fauth.config.proxyAuth || ($2fauth.config.proxyAuth && $2fauth.config.proxyLogoutUrl)" class="column">
<UseColorMode v-slot="{ mode }">
<button type="button" id="lnkSignOut" class="button is-text is-like-text" :class="mode == 'dark' ? 'has-text-grey-lighter' : 'has-text-grey-darker'" @click="logout">
{{ $t('message.auth.sign_out') }}
</button>
</UseColorMode>
</li>
</ul>
<!-- email link -->
<button type="button" id="btnEmailMenu" @click="showMenu = !showMenu" class="button is-text is-like-text has-text-grey" style="width: 100%;">
<span v-if="user.isAdmin && appSettings.latestRelease && appSettings.checkForUpdate" class="release-flag"></span>
<span class="mx-2 has-ellipsis">{{ user.email }}</span>
<FontAwesomeIcon v-if="!showMenu" :icon="['fas', 'bars']" class="mr-2" />
<!-- <button v-else class="delete ml-3"></button> -->
<FontAwesomeIcon v-else :icon="['fas', 'times']" class="mr-2" />
</button>
</div>
<!-- legacy links -->
<div v-else>
<!-- settings link -->
<router-link id="lnkSettings" :to="{ name: 'settings.options' }" class="has-text-grey">
{{ $t('message.settings.settings') }}
</router-link>
<!-- admin link -->
<span v-if="user.isAdmin"> -
<router-link id="lnkAdmin" :to="{ name: 'admin.appSetup' }" class="has-text-grey">
{{ $t('message.admin.admin') }}<span v-if="appSettings.latestRelease && appSettings.checkForUpdate" class="release-flag"></span>
</router-link>
</span>
<!-- sign-out button -->
<span v-if="!$2fauth.config.proxyAuth || ($2fauth.config.proxyAuth && $2fauth.config.proxyLogoutUrl)">
- <button type="button" id="lnkSignOut" class="button is-text is-like-text has-text-grey" @click="logout">{{ $t('message.auth.sign_out') }}</button>
</span>
</div>
</div>
</footer>
</template>

6
resources/js/views/About.vue
View File

@ -64,8 +64,10 @@
<li>{{ $t('message.logos_by') }}&nbsp;<a href="https://2fa.directory/">2FA Directory</a>&nbsp;<a class="is-size-7" href="https://github.com/2factorauth/twofactorauth/blob/master/LICENSE.md">(MIT License)</a></li> <li>{{ $t('message.logos_by') }}&nbsp;<a href="https://2fa.directory/">2FA Directory</a>&nbsp;<a class="is-size-7" href="https://github.com/2factorauth/twofactorauth/blob/master/LICENSE.md">(MIT License)</a></li>
</ul> </ul>
<!-- footer --> <!-- footer -->
<VueFooter :showButtons="true"> <VueFooter>
<NavigationButton action="back" @goback="router.push({ name: returnTo })" :previous-page-title="$t('title.' + returnTo)" /> <template #default>
<NavigationButton action="back" @goback="router.push({ name: returnTo })" :previous-page-title="$t('title.' + returnTo)" />
</template>
</VueFooter> </VueFooter>
</UseColorMode> </UseColorMode>
</ResponsiveWidthWrapper> </ResponsiveWidthWrapper>

6
resources/js/views/Start.vue
View File

@ -107,8 +107,10 @@
</div> </div>
</div> </div>
<!-- Footer --> <!-- Footer -->
<VueFooter :showButtons="true" > <VueFooter >
<NavigationButton v-if="!twofaccounts.isEmpty" action="back" @goback="router.push({ name: 'accounts' })" :previous-page-title="$t('title.accounts')" /> <template #default>
<NavigationButton v-if="!twofaccounts.isEmpty" action="back" @goback="router.push({ name: 'accounts' })" :previous-page-title="$t('title.accounts')" />
</template>
</VueFooter> </VueFooter>
</div> </div>
</template> </template>

6
resources/js/views/admin/AppSetup.vue
View File

@ -147,8 +147,10 @@
</div> </div>
</FormWrapper> </FormWrapper>
</div> </div>
<VueFooter :showButtons="true"> <VueFooter>
<NavigationButton action="close" @closed="router.push({ name: returnTo })" :current-page-title="$t('title.admin.appSetup')" /> <template #default>
<NavigationButton action="close" @closed="router.push({ name: returnTo })" :current-page-title="$t('title.admin.appSetup')" />
</template>
</VueFooter> </VueFooter>
</div> </div>
</template> </template>

6
resources/js/views/admin/Auth.vue
View File

@ -101,8 +101,10 @@
</form> </form>
</FormWrapper> </FormWrapper>
</div> </div>
<VueFooter :showButtons="true"> <VueFooter>
<NavigationButton action="close" @closed="router.push({ name: returnTo })" :current-page-title="$t('title.admin.auth')" /> <template #default>
<NavigationButton action="close" @closed="router.push({ name: returnTo })" :current-page-title="$t('title.admin.auth')" />
</template>
</VueFooter> </VueFooter>
</div> </div>
</template> </template>

6
resources/js/views/admin/Users.vue
View File

@ -173,8 +173,10 @@
</div> </div>
<Spinner :isVisible="isFetching && users.length === 0" /> <Spinner :isVisible="isFetching && users.length === 0" />
<!-- footer --> <!-- footer -->
<VueFooter :showButtons="true"> <VueFooter>
<NavigationButton action="close" @closed="router.push({ name: returnTo })" :current-page-title="$t('title.admin.users')" /> <template #default>
<NavigationButton action="close" @closed="router.push({ name: returnTo })" :current-page-title="$t('title.admin.users')" />
</template>
</VueFooter> </VueFooter>
</FormWrapper> </FormWrapper>
</div> </div>

8
resources/js/views/admin/logs/Access.vue
View File

@ -39,9 +39,11 @@
</div> </div>
<AccessLogViewer :userId="props.userId" :lastOnly="false" :showSearch="true" :period="1" /> <AccessLogViewer :userId="props.userId" :lastOnly="false" :showSearch="true" :period="1" />
<!-- footer --> <!-- footer -->
<VueFooter :showButtons="true"> <VueFooter>
<NavigationButton action="back" @goback="router.push({ name: 'admin.manageUser', params: { userId: props.userId }})" :previous-page-title="$t('title.admin.manageUser')" /> <template #default>
<NavigationButton action="close" @closed="router.push({ name: 'accounts' })" :current-page-title="$t('title.admin.logs.access')" /> <NavigationButton action="back" @goback="router.push({ name: 'admin.manageUser', params: { userId: props.userId }})" :previous-page-title="$t('title.admin.manageUser')" />
<NavigationButton action="close" @closed="router.push({ name: 'accounts' })" :current-page-title="$t('title.admin.logs.access')" />
</template>
</VueFooter> </VueFooter>
</ResponsiveWidthWrapper> </ResponsiveWidthWrapper>
</template> </template>

8
resources/js/views/admin/users/Manage.vue
View File

@ -327,9 +327,11 @@
</div> </div>
</div> </div>
<!-- footer --> <!-- footer -->
<VueFooter :showButtons="true"> <VueFooter>
<NavigationButton action="back" @goback="router.push({ name: 'admin.users' })" :previous-page-title="$t('title.admin.users')" /> <template #default>
<NavigationButton action="close" @closed="router.push({ name: 'accounts' })" :current-page-title="$t('title.admin.manageUser')" /> <NavigationButton action="back" @goback="router.push({ name: 'admin.users' })" :previous-page-title="$t('title.admin.users')" />
<NavigationButton action="close" @closed="router.push({ name: 'accounts' })" :current-page-title="$t('title.admin.manageUser')" />
</template>
</VueFooter> </VueFooter>
</ResponsiveWidthWrapper> </ResponsiveWidthWrapper>
</UseColorMode> </UseColorMode>

3
resources/js/views/auth/Login.vue
View File

@ -277,6 +277,5 @@
</div> </div>
</div> </div>
</FormWrapper> </FormWrapper>
<!-- footer --> <VueFooter />
<VueFooter/>
</template> </template>

1
resources/js/views/auth/Register.vue
View File

@ -116,7 +116,6 @@
<p>{{ $t('message.auth.forms.already_register') }}&nbsp;<RouterLink id="lnkSignIn" :to="{ name: 'login' }" class="is-link">{{ $t('message.auth.sign_in') }}</RouterLink></p> <p>{{ $t('message.auth.forms.already_register') }}&nbsp;<RouterLink id="lnkSignIn" :to="{ name: 'login' }" class="is-link">{{ $t('message.auth.sign_in') }}</RouterLink></p>
</div> </div>
</FormWrapper> </FormWrapper>
<!-- footer -->
<VueFooter /> <VueFooter />
</div> </div>
</template> </template>

6
resources/js/views/groups/Groups.vue
View File

@ -69,8 +69,10 @@
</span> </span>
</div> </div>
<!-- footer --> <!-- footer -->
<VueFooter :showButtons="true"> <VueFooter>
<NavigationButton action="close" @closed="router.push({ name: 'accounts' })" :current-page-title="$t('title.groups')" /> <template #default>
<NavigationButton action="close" @closed="router.push({ name: 'accounts' })" :current-page-title="$t('title.groups')" />
</template>
</VueFooter> </VueFooter>
</ResponsiveWidthWrapper> </ResponsiveWidthWrapper>
</template> </template>

6
resources/js/views/settings/Account.vue
View File

@ -159,8 +159,10 @@
</form> </form>
</FormWrapper> </FormWrapper>
</div> </div>
<VueFooter :showButtons="true"> <VueFooter>
<NavigationButton action="close" @closed="router.push({ name: returnTo })" :current-page-title="$t('title.settings.account')" /> <template #default>
<NavigationButton action="close" @closed="router.push({ name: returnTo })" :current-page-title="$t('title.settings.account')" />
</template>
</VueFooter> </VueFooter>
</div> </div>
</template> </template>

6
resources/js/views/settings/OAuth.vue
View File

@ -197,8 +197,10 @@
</div> </div>
<Spinner :isVisible="isFetching && tokens.length === 0" /> <Spinner :isVisible="isFetching && tokens.length === 0" />
<!-- footer --> <!-- footer -->
<VueFooter :showButtons="true"> <VueFooter>
<NavigationButton action="close" @closed="router.push({ name: returnTo })" :current-page-title="$t('title.settings.oauth.tokens')" /> <template #default>
<NavigationButton action="close" @closed="router.push({ name: returnTo })" :current-page-title="$t('title.settings.oauth.tokens')" />
</template>
</VueFooter> </VueFooter>
</FormWrapper> </FormWrapper>
</div> </div>

6
resources/js/views/settings/Options.vue
View File

@ -262,8 +262,10 @@
</form> </form>
</FormWrapper> </FormWrapper>
</div> </div>
<VueFooter :showButtons="true"> <VueFooter>
<NavigationButton action="close" @closed="router.push({ name: returnTo })" :current-page-title="$t('title.settings.options')" /> <template #default>
<NavigationButton action="close" @closed="router.push({ name: returnTo })" :current-page-title="$t('title.settings.options')" />
</template>
</VueFooter> </VueFooter>
</div> </div>
</template> </template>

6
resources/js/views/settings/WebAuthn.vue
View File

@ -180,8 +180,10 @@
/> />
</form> </form>
<!-- footer --> <!-- footer -->
<VueFooter :showButtons="true"> <VueFooter>
<NavigationButton action="close" @closed="router.push({ name: returnTo })" :current-page-title="$t('title.settings.webauthn.devices')" /> <template #default>
<NavigationButton action="close" @closed="router.push({ name: returnTo })" :current-page-title="$t('title.settings.webauthn.devices')" />
</template>
</VueFooter> </VueFooter>
</FormWrapper> </FormWrapper>
</div> </div>

26
resources/js/views/twofaccounts/Accounts.vue
View File

@ -486,14 +486,24 @@
</div> </div>
</span> </span>
</div> </div>
<VueFooter :showButtons="true" :internalFooterType="bus.inManagementMode && !showDestinationGroupSelector ? 'doneButton' : 'navLinks'" @done-button-clicked="exitManagementMode"> <VueFooter v-if="bus.inManagementMode && !showDestinationGroupSelector">
<ActionButtons <template #default>
v-model:inManagementMode="bus.inManagementMode" <ActionButtons
:areDisabled="twofaccounts.hasNoneSelected" v-model:inManagementMode="bus.inManagementMode"
@move-button-clicked="showDestinationGroupSelector = true" :areDisabled="twofaccounts.hasNoneSelected"
@delete-button-clicked="deleteAccounts" @move-button-clicked="showDestinationGroupSelector = true"
@export-button-clicked="showExportFormatSelector = true"> @delete-button-clicked="deleteAccounts"
</ActionButtons> @export-button-clicked="showExportFormatSelector = true">
</ActionButtons>
</template>
<template #subpart>
<button type="button" id="lnkExitEdit" class="button is-ghost is-like-text" @click.stop="exitManagementMode">{{ $t('message.done') }}</button>
</template>
</VueFooter>
<VueFooter v-else>
<template #default>
<ActionButtons v-model:inManagementMode="bus.inManagementMode" />
</template>
</VueFooter> </VueFooter>
</div> </div>
</div> </div>

18
resources/js/views/twofaccounts/CreateUpdate.vue
View File

@ -596,14 +596,16 @@
<FormProtectedField v-if="form.otp_type === 'hotp'" pattern="[0-9]{1,4}" :enableProtection="isEditMode" :isExpanded="false" v-model="form.counter" fieldName="counter" :errorMessage="form.errors.get('counter')" label="message.twofaccounts.forms.counter.label" :placeholder="$t('message.twofaccounts.forms.counter.placeholder')" :help="isEditMode ? 'message.twofaccounts.forms.counter.help_lock' : 'message.twofaccounts.forms.counter.help'" /> <FormProtectedField v-if="form.otp_type === 'hotp'" pattern="[0-9]{1,4}" :enableProtection="isEditMode" :isExpanded="false" v-model="form.counter" fieldName="counter" :errorMessage="form.errors.get('counter')" label="message.twofaccounts.forms.counter.label" :placeholder="$t('message.twofaccounts.forms.counter.placeholder')" :help="isEditMode ? 'message.twofaccounts.forms.counter.help_lock' : 'message.twofaccounts.forms.counter.help'" />
</div> </div>
</div> </div>
<VueFooter :showButtons="true"> <VueFooter>
<p class="control"> <template #default>
<VueButton nativeType="submit" :id="isEditMode ? 'btnUpdate' : 'btnCreate'" :isLoading="form.isBusy" class="is-rounded" >{{ isEditMode ? $t('message.save') : $t('message.create') }}</VueButton> <p class="control">
</p> <VueButton nativeType="submit" :id="isEditMode ? 'btnUpdate' : 'btnCreate'" :isLoading="form.isBusy" class="is-rounded" >{{ isEditMode ? $t('message.save') : $t('message.create') }}</VueButton>
<p class="control" v-if="form.otp_type && form.secret"> </p>
<button id="btnPreview" type="button" class="button is-success is-rounded" @click="previewOTP">{{ $t('message.twofaccounts.forms.test') }}</button> <p class="control" v-if="form.otp_type && form.secret">
</p> <button id="btnPreview" type="button" class="button is-success is-rounded" @click="previewOTP">{{ $t('message.twofaccounts.forms.test') }}</button>
<NavigationButton action="cancel" :useLinkTag="false" @canceled="cancelCreation" /> </p>
<NavigationButton action="cancel" :useLinkTag="false" @canceled="cancelCreation" />
</template>
</VueFooter> </VueFooter>
</form> </form>
<!-- modal --> <!-- modal -->

26
resources/js/views/twofaccounts/Import.vue
View File

@ -450,18 +450,20 @@
</div> </div>
</div> </div>
<!-- footer --> <!-- footer -->
<VueFooter :showButtons="true"> <VueFooter>
<!-- Import all button --> <template #default>
<p class="control" v-if="importableCount > 0"> <!-- Import all button -->
<button type="button" class="button is-link is-rounded is-focus" @click="createAccounts"> <p class="control" v-if="importableCount > 0">
<span>{{ $t('message.twofaccounts.import.import_all') }} ({{ importableCount }})</span> <button type="button" class="button is-link is-rounded is-focus" @click="createAccounts">
<!-- <span class="icon is-small"> <span>{{ $t('message.twofaccounts.import.import_all') }} ({{ importableCount }})</span>
<FontAwesomeIcon :icon="['fas', 'qrcode']" /> <!-- <span class="icon is-small">
</span> --> <FontAwesomeIcon :icon="['fas', 'qrcode']" />
</button> </span> -->
</p> </button>
<NavigationButton v-if="importableCount > 0" action="cancel" @canceled="router.push({ name: 'accounts' })" /> </p>
<NavigationButton v-else action="close" @closed="router.push({ name: 'accounts' })" :current-page-title="$t('title.importAccounts')" /> <NavigationButton v-if="importableCount > 0" action="cancel" @canceled="router.push({ name: 'accounts' })" />
<NavigationButton v-else action="close" @closed="router.push({ name: 'accounts' })" :current-page-title="$t('title.importAccounts')" />
</template>
</VueFooter> </VueFooter>
</ResponsiveWidthWrapper> </ResponsiveWidthWrapper>
<!-- modal --> <!-- modal -->

11
resources/js/views/twofaccounts/QRcode.vue
View File

@ -28,8 +28,15 @@
<Spinner :isVisible="!qrcode" :type="'raw'" class="is-size-1" /> <Spinner :isVisible="!qrcode" :type="'raw'" class="is-size-1" />
</p> </p>
</div> </div>
<VueFooter :showButtons="true" :internalFooterType="'modal'"> <VueFooter>
<NavigationButton action="close" @closed="router.push({ name: 'accounts' })" :current-page-title="$t('title.showQRcode')" /> <template #default>
<NavigationButton action="close" @closed="router.push({ name: 'accounts' })" :current-page-title="$t('title.showQRcode')" />
</template>
<template #subpart>
<!-- we add a subpart to hide the default slot value -->
<router-link v-if="$route.name != 'accounts'" id="lnkBackToHome" :to="{ name: 'accounts' }" class="has-text-grey">{{ $t('message.back_to_home') }}</router-link>
<span v-else>&nbsp;</span>
</template>
</VueFooter> </VueFooter>
</div> </div>
</template> </template>