frontend/src/views/Home.vue

84 lines
1.9 KiB
Vue

<template>
<div class="content has-text-centered">
<h2>
{{ $t('home.welcome', {username: userInfo.name !== '' ? userInfo.name : userInfo.username}) }}!
</h2>
<add-task
:listId="defaultListId"
@taskAdded="updateTaskList"
class="is-max-width-desktop"
/>
<template v-if="!hasTasks">
<p>{{ $t('home.list.newText') }}</p>
<x-button
:to="{ name: 'list.create', params: { id: defaultNamespaceId } }"
:shadow="false"
class="ml-2"
v-if="defaultNamespaceId > 0"
>
{{ $t('home.list.new') }}
</x-button>
<p class="mt-4" v-if="migratorsEnabled">
{{ $t('home.list.importText') }}
</p>
<x-button
v-if="migratorsEnabled"
:to="{ name: 'migrate.start' }"
:shadow="false">
{{ $t('home.list.import') }}
</x-button>
</template>
<ShowTasks :show-all="true" v-if="hasLists" :key="showTasksKey" />
</div>
</template>
<script>
import {mapState} from 'vuex'
import ShowTasks from './tasks/ShowTasks'
import AddTask from '../components/tasks/add-task'
export default {
name: 'Home',
components: {
ShowTasks,
AddTask,
},
data() {
return {
loading: false,
currentDate: new Date(),
tasks: [],
showTasksKey: 0,
}
},
computed: mapState({
migratorsEnabled: state =>
state.config.availableMigrators !== null &&
state.config.availableMigrators.length > 0,
authenticated: state => state.auth.authenticated,
userInfo: state => state.auth.info,
hasTasks: state => state.hasTasks,
defaultListId: state => state.auth.defaultListId,
defaultNamespaceId: state => {
if (state.namespaces.namespaces.length === 0) {
return 0
}
return state.namespaces.namespaces[0].id
},
hasLists: state => {
if (state.namespaces.namespaces.length === 0) {
return false
}
return state.namespaces.namespaces[0].lists.length > 0
},
}),
methods: {
updateTaskList() {
this.showTasksKey += 1
},
},
}
</script>