mirror of
https://github.com/YunoHost/yunohost-portal.git
synced 2024-09-03 20:06:23 +02:00
105 lines
2.7 KiB
Vue
105 lines
2.7 KiB
Vue
<script setup lang="ts">
|
|
const head = useLocaleHead({
|
|
addDirAttribute: true,
|
|
addSeoAttributes: true,
|
|
})
|
|
const { t } = useI18n()
|
|
const isLoggedIn = useIsLoggedIn()
|
|
const me = await useUserInfo()
|
|
|
|
const footerLinks = [
|
|
{ text: t('footerlink_edit'), to: '/edit' },
|
|
{
|
|
text: t('footerlink_documentation'),
|
|
to: '//yunohost.org/docs',
|
|
newWindow: true,
|
|
},
|
|
{ text: t('footerlink_support'), to: '//yunohost.org/help', newWindow: true },
|
|
{
|
|
text: t('footerlink_administration'),
|
|
to: '/yunohost/admin/',
|
|
newWindow: true,
|
|
},
|
|
]
|
|
|
|
async function logout() {
|
|
const { error } = await useApi('/logout')
|
|
|
|
if (!error.value) {
|
|
// FIXME : meh, turns out the cookie is still valid after successfully calling the route for some reason ... !?
|
|
isLoggedIn.value = false
|
|
await navigateTo('/login')
|
|
} else {
|
|
// FIXME : display an error or something
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="container mx-auto p-10 min-h-screen flex flex-col">
|
|
<Html :lang="head.htmlAttrs?.lang" :dir="head.htmlAttrs?.dir"></Html>
|
|
|
|
<header class="py-10">
|
|
<slot name="header">
|
|
<div class="flex flex-row flex-wrap items-center min-w-full">
|
|
<NuxtLink to="/">
|
|
<span class="sr-only">{{ t('back_to_apps') }}</span>
|
|
<Icon name="mdi:account-circle" size="5em" class="mr-3" />
|
|
</NuxtLink>
|
|
|
|
<div>
|
|
<h2 class="text-2xl font-extrabold leading-none tracking-tight">
|
|
{{ me.username }}
|
|
</h2>
|
|
<h3>{{ me.fullname }}</h3>
|
|
<h4 class="opacity-50">{{ me.mail }}</h4>
|
|
</div>
|
|
|
|
<YButton
|
|
variant="neutral"
|
|
icon="mdi:logout"
|
|
:text="t('logout')"
|
|
class="ml-auto"
|
|
@click.prevent="logout"
|
|
/>
|
|
</div>
|
|
</slot>
|
|
</header>
|
|
|
|
<main>
|
|
<slot />
|
|
</main>
|
|
|
|
<footer class="mt-auto">
|
|
<!-- class="container fixed bottom-10 mx-10 pr-10 text-gray-400" -->
|
|
<slot name="footer">
|
|
<div class="sm:flex flex-row flex-wrap items-end justify-center">
|
|
<nav
|
|
class="border-t border-gray-500 space-x-5 flex-wrap sm:mr-5 text-center sm:text-left"
|
|
>
|
|
<NuxtLink
|
|
v-for="link in footerLinks"
|
|
:key="link.to"
|
|
:to="link.to"
|
|
:target="link.newWindow ? '_blank' : undefined"
|
|
class="link link-hover text-base-content inline-block"
|
|
>
|
|
{{ link.text }}
|
|
</NuxtLink>
|
|
</nav>
|
|
|
|
<img
|
|
src="/assets/img/logo-white.svg"
|
|
class="mt-8 sm:mt-0 mx-auto sm:ml-auto sm:mr-0"
|
|
/>
|
|
</div>
|
|
</slot>
|
|
</footer>
|
|
</div>
|
|
</template>
|
|
|
|
<style>
|
|
body {
|
|
font-family: 'Source Sans 3';
|
|
}
|
|
</style>
|