Move link share authenticated stuff to separate component

This commit is contained in:
kolaente 2020-11-01 17:08:51 +01:00
parent c7c8390d1f
commit 4fa2f08975
Signed by: konrad
GPG Key ID: F40E70337AB24C9B
2 changed files with 49 additions and 28 deletions

View File

@ -5,34 +5,7 @@
<div class="offline" style="height: 0;width: 0;"></div>
<top-navigation v-if="userAuthenticated && (userInfo && userInfo.type === authTypes.USER)"/>
<content-auth v-if="userAuthenticated && (userInfo && userInfo.type === authTypes.USER)"/>
<div
:class="{'has-background': background}"
:style="{'background-image': `url(${background})`}"
class="link-share-container"
v-else-if="userAuthenticated && (userInfo && userInfo.type === authTypes.LINK_SHARE)"
>
<div class="container has-text-centered link-share-view">
<div class="column is-10 is-offset-1">
<img alt="Vikunja" class="logo" src="/images/logo-full.svg"/>
<h1
:style="{ 'opacity': currentList.title === '' ? '0': '1' }"
class="title">
{{ currentList.title === '' ? 'Loading...' : currentList.title }}
</h1>
<div class="box has-text-left view">
<div class="logout">
<a @click="logout()" class="button">
<span>Logout</span>
<span class="icon is-small">
<icon icon="sign-out-alt"/>
</span>
</a>
</div>
<router-view/>
</div>
</div>
</div>
</div>
<content-link-share v-else-if="userAuthenticated && (userInfo && userInfo.type === authTypes.LINK_SHARE)"/>
<div v-else>
<div class="noauth-container">
<img alt="Vikunja" src="/images/logo-full.svg"/>
@ -74,10 +47,12 @@ import {CURRENT_LIST, IS_FULLPAGE, KEYBOARD_SHORTCUTS_ACTIVE, MENU_ACTIVE, ONLIN
import KeyboardShortcuts from './components/misc/keyboard-shortcuts'
import TopNavigation from '@/components/home/topNavigation'
import ContentAuth from '@/components/home/contentAuth'
import ContentLinkShare from '@/components/home/contentLinkShare'
export default {
name: 'app',
components: {
ContentLinkShare,
ContentAuth,
TopNavigation,
KeyboardShortcuts,

View File

@ -0,0 +1,46 @@
<template>
<div
:class="{'has-background': background}"
:style="{'background-image': `url(${background})`}"
class="link-share-container"
>
<div class="container has-text-centered link-share-view">
<div class="column is-10 is-offset-1">
<img alt="Vikunja" class="logo" src="/images/logo-full.svg"/>
<h1
:style="{ 'opacity': currentList.title === '' ? '0': '1' }"
class="title">
{{ currentList.title === '' ? 'Loading...' : currentList.title }}
</h1>
<div class="box has-text-left view">
<div class="logout">
<a @click="logout()" class="button">
<span>Logout</span>
<span class="icon is-small">
<icon icon="sign-out-alt"/>
</span>
</a>
</div>
<router-view/>
</div>
</div>
</div>
</div>
</template>
<script>
import {mapState} from 'vuex'
import {CURRENT_LIST} from '@/store/mutation-types'
export default {
name: 'contentLinkShare',
computed: mapState({
currentList: CURRENT_LIST,
background: 'background',
}),
}
</script>
<style scoped>
</style>